tqApp-webView/pages/user/user - 副本.vue

<template>
	<view class="page-container">
		<image :src="$getImages('/assetsMobile/images/setting/bg.png')" class="background-image"></image>
		
		<view class="munes">
			<Sidebar 
				label="设置" 
				:sidebarList="munesList"
				:hasTitle="false" 
				:span="4" 
				@handleLogout="handleLogout" 
				@handleGetH5SkuUrl="handleGetH5SkuUrl" 
				direction='user'
			>
			</Sidebar>
		</view>
		
		
	</view>
</template>

<script>
	import * as dd from 'dingtalk-jsapi'; // 此方式为整体加载，也可按需进行加载
	import Sidebar from '@/components/sidebar'
	import Vue from 'vue'
	import {getH5SkuUrl} from '@/api/common/system.js'
	import { openAuth } from 'dingtalk-design-libs/biz/openAuth';
	
	export default {
		components: {
			Sidebar,
		},
		data() {
			let that = this;
			return {
				munesList: [ // 监控中心
				    {
				        permission: '*', // 权限
				        label: '个人资料', // 标题
				        icon: `https://www.yihaocg.com/mobile/image/setting/profile_icon.png`, // 图片
				        url: '/pagesBase/userData/userData', // 路径
				    },
					{
					    permission: '*', // 权限
					    label: '密码设置', // 标题
					    icon: `https://www.yihaocg.com/mobile/image/setting/pwd_icon.png`, // 图片
					    url: '/pagesBase/changePassword/changePassword', // 路径
					},
					{
					    permission: 'mobile:setting:ziliao', // 权限
					    label: '培训资料', // 标题
					    icon: this.$getImages('/assetsMobile/images/setting/tranin.png'), // 图片
					    url: '/peixun/ziliao/ziliao', // 路径
					},
					{
					    permission: '*', // 权限
					    label: '钉钉内购', // 标题
					    icon: 'https://www.yihaocg.com/mobile/image/setting/peixun_icon.png', // 图片
						event: 'handleGetH5SkuUrl', // 事件
					    url: '/peixun/ziliao/ziliao', // 路径
						isShow: Vue.prototype.hasHostPlat(["dingH5"])
					},
					{
					    permission: '*', // 权限
					    label: '退出登录', // 标题
					    icon: `https://www.yihaocg.com/mobile/image/setting/logout_icon.png`, // 图片
					    event: 'handleLogout', // 事件
						isShow: !Vue.prototype.hasHostPlat(["dingH5"])
					},	
				]
			};
		},
		mounted() {
		},
		methods: {
			handleLogout() {
				let that = this;
				uni.showModal({
					title: '提示',
					content: '确定退出登录？',
					cancelText: '取消',
					confirmText: '确定',
					success: function(res) {
						if (res.confirm) {
							that.$store.dispatch('LogOut').then(() => {
								uni.reLaunch({
									url: '/pages/login/login'
								})
							})
						}
					}
				})
				
			},
			//钉钉内购
			handleGetH5SkuUrl() {
				
				openAuth({
				  clientId: 'suitemikul1sbf3gohcnt', // 应用ID(唯一标识)
				  corpId: uni.getStorageSync('corpId'), // 当前组织的corpId
				  rpcScope:'qyapi_appstore_internal', 
				  // fieldScope:'Contact.User.mobile',
				  type: 1  // 0 标识授权个人信息；1 标识授权组织信息
				}).then((res)=>{
						const {status,result} = res
						// console.log(res,'resresres')
						if(status == 'ok') {
							getH5SkuUrl({
								corpId: uni.getStorageSync('corpId')
							}).then((res) => {
								dd.openLink({
									  url:res.data,//要打开链接的地址
									  onSuccess : function(result) {
										  /**/
									  },
									  onFail : function(err) {}
								})
							})
						}
						
				})
				
			}
		}
	}
</script>

<style lang="scss" scoped>
.page-container {
	    font-family: PingFangSC, PingFang SC;
	   .background-image {
		   position: absolute;
		   top: 0;
		   right: 0;
		   width: 100%;
		   height: 240rpx;
	   }
	   
	   .munes {
		   border-radius: 20rpx;
		   background: #fff;
		   position: absolute;
		   top: 80px;
		   left: 20rpx;
		   width: calc(100% - 42rpx);
		   min-height: 220rpx;
       padding-bottom: 30rpx;
		   z-index: 100;
	   }
}
</style>