123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290 |
- <template>
- <div>
- <common ref="common" @asynCallBack="asynCallBack"></common>
- <top-header :pageTitle="pageTitle" headerClass="vongi-bar" :leftShow="false"></top-header>
- <div class="mui-content margin49">
- <div class="vongi-index">
- <div class="vongi-index-top">
- <div class="mui-media-object mui-pull-left">
- <img :src="person_data?person_data.faceImageUrl:''">
- </div>
- <div class="mui-media-body">
- <h3 v-text="person_data?person_data.name:''"></h3>
- <p class='mui-ellipsis' v-text="person_popedom?(person_popedom.job?person_popedom.job:person_popedom.personRoleName):''"></p>
- </div>
- <a class="mui-pull-right" @click="selectRole">切换身份<span class="mui-icon iconfont icon-jiaohuan"></span></a>
- </div>
- </div>
- <div class="vongi-icons">
- <div class="vongi-index">
- <ul class="mui-table-view mui-grid-view mui-grid-9 vongi-grid-head">
- <li v-for="(item,index) in common_menu_list" :class="'mui-table-view-cell mui-media mui-col-xs-3 '+(item.iconRoute?'':'kfz')">
- <router-link :to="{name:item.iconRoute,query:item.iconParam}">
- <img :src="requirePic(item.iconCommonPic)" />
- <div class="mui-media-body" v-text="item.iconName"></div>
- </router-link>
- </li>
- </ul>
- </div>
- <ul class="mui-table-view mui-grid-view mui-grid-9">
- <li v-for="(item,index) in menu_list" :class="'mui-table-view-cell mui-media mui-col-xs-3 '+(item.iconRoute?'':'kfz')">
- <router-link :to="{name:item.iconRoute,query:item.iconParam}">
- <img :src="requirePic(item.iconPic)" />
- <div class="mui-media-body" v-text="item.iconName"></div>
- </router-link>
- </li>
- <li class="mui-table-view-cell mui-media mui-col-xs-3">
- <router-link :to="{name:'MasterAllFun'}">
- <img src="~$project/assets/img/cicon30.png" />
- <div class="mui-media-body">全部</div>
- </router-link>
- </li>
- </ul>
- </div>
- <div class="vongi-index-floor">
- <h4 class="vongi-floor-title">功能推荐区</h4>
- <div class="vongi-index-inter flew-sp">
- <div class="mui-col-xs-6">
- <router-link :to="{name:'MasterMineEditInfo'}" class="vongi-floor-padded">
- <div class="mui-media-body">
- <h4 class="mui-ellipsis">关联健康码</h4>
- <p class="mui-ellipsis">出行更便捷</p>
- </div>
- <img class="mui-media-object mui-pull-right" src="~$project/assets/img/cicon15.png" width="54" />
- </router-link>
- </div>
- <div class="mui-col-xs-6">
- <router-link :to="{name:'MasterMineEditInfo'}" class="vongi-floor-padded">
- <div class="mui-media-body">
- <h4 class="mui-ellipsis">问题反馈</h4>
- <p class="mui-ellipsis">感谢您的发声</p>
- </div>
- <img class="mui-media-object mui-pull-right" src="~$project/assets/img/cicon18.png" width="54" />
- </router-link>
- </div>
- <div v-if="noticeList.length" class="mui-col-xs-12">
- <div class="vongi-floor-padded">
- <router-link :to="{name:'CommonNotice',query:{type:1}}" v-for="(item,index) in noticeList" :key="index" :class="'text-list '+(item.readStatus?'':'red-after')">
- <h5 class="mui-ellipsis" v-text="item.title"></h5><span v-text="item.date"></span>
- </router-link>
- </div>
- <router-link :to="{name:'CommonNotice',query:{type:1}}" class="vongi-link"><span class="mui-icon mui-icon-forward"></span></router-link>
- </div>
- <div class="mui-col-xs-12">
- <div id="slider" class="mui-slider">
- <div class="mui-slider-group">
- <!-- 第一张 -->
- <div class="mui-slider-item">
- <a href="javascript:void(0)">
- <img src="~$project/assets/img/02.jpg">
- </a>
- </div>
- <!-- 第二张 -->
- <div class="mui-slider-item">
- <a href="javascript:void(0)">
- <img src="~$project/assets/img/02.jpg">
- </a>
- </div>
- </div>
- <div class="mui-slider-indicator">
- <div class="mui-indicator mui-active"></div>
- <div class="mui-indicator"></div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="vongi-index-floor kfz">
- <h4 class="vongi-floor-title">优品推荐</h4>
- <div class="vongi-index-inter flew-sp">
- <div class="mui-col-xs-12">
- <ul class="mui-table-view mui-grid-view mui-grid-9 vongi-floor-padded">
- <li class="mui-table-view-cell mui-media mui-col-xs-4">
- <a href="javascript:void(0)">
- <div class="vongi-shop-img"><img src="~$project/assets/img/01.png" width="100%" /></div>
- <div class="mui-media-body">老人防丢手环</div>
- <div class="mui-media-body color-yellow">¥299.0</div>
- </a>
- </li>
- <li class="mui-table-view-cell mui-media mui-col-xs-4">
- <a href="javascript:void(0)">
- <div class="vongi-shop-img"><img src="~$project/assets/img/01.png" width="100%" /></div>
- <div class="mui-media-body">老人防丢手环</div>
- <div class="mui-media-body color-yellow">¥299.0</div>
- </a>
- </li>
- <li class="mui-table-view-cell mui-media mui-col-xs-4">
- <a href="javascript:void(0)">
- <div class="vongi-shop-img"><img src="~$project/assets/img/01.png" width="100%" /></div>
- <div class="mui-media-body">老人防丢手环</div>
- <div class="mui-media-body color-yellow">¥299.0</div>
- </a>
- </li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- <nav-menu :router="[{name:'Master'},{name:'MasterMineMessage'},{name:'MasterMineCenter'}]"></nav-menu>
- <loading :visible="isLoading"></loading>
- </div>
- </template>
- <script>
- require('$project/assets/js/mui.picker.min.js');
- import * as API_Notice from '@/apis/Common/notice'
- import * as API_User from '$project/apis/user'
- import Common from '$project/components/Common.vue'
- import Loading from '$project/components/Loading.vue'
- import TopHeader from '$project/components/TopHeader.vue'
- import NavMenu from '@/components/NavMenu.vue'
- import {
- mapGetters,
- mapMutations
- } from 'vuex'
- export default {
- name: 'Master',
- components: {
- Common,
- Loading,
- TopHeader,
- NavMenu
- },
- data() {
- return {
- isLoading: false,
- roleList: [],
- noticeList: [],
- }
- },
- created() {},
- methods: {
- //获取用户角色列表
- getRoleList() {
- this.isLoading = true;
- API_User.getRoleList().then(response => {
- this.isLoading = false;
- this.roleList = response.list;
- }).catch(error => {
- this.isLoading = false;
- mui.toast(error);
- })
- },
- //选择角色
- selectRole() {
- var roleList = [];
- for (var i = 0; i < this.roleList.length; i++) {
- var preName = this.person_popedom.personRoleName == this.roleList[i]['personRoleName'] ? '(当前)' : '';
- roleList.push({
- value: this.roleList[i]['id'],
- text: preName + this.roleList[i]['companyName'] + ' ' + this.roleList[i]['personRoleName'],
- })
- }
- var _this = this;
- var picker = new mui.PopPicker();
- picker.setData(roleList);
- picker.show(function(selectItems) {
- _this.switchRole(selectItems[0].value);
- })
- },
- //切换角色
- switchRole(id) {
- this.isLoading = true;
- API_User.exchangePopedom({
- id: id
- }).then(response => {
- this.isLoading = false;
- this.$refs.common.getDataByOpenId();
- }).catch(error => {
- this.isLoading = false;
- mui.toast(error);
- })
- },
- //预读取通知消息
- prefetchNotice() {
- this.isLoading = true;
- API_Notice.prefetch().then(response => {
- this.isLoading = false;
- this.getLastNotice();
- }).catch(error => {
- this.isLoading = false;
- mui.toast(error);
- })
- },
- //获取最新二条通知消息
- getLastNotice() {
- this.isLoading = true;
- API_Notice.getTopList({
- type: 1,
- limit: 2,
- excludeMessageId: ''
- }).then(response => {
- this.noticeList = response;
- this.isLoading = false;
- }).catch(error => {
- this.isLoading = false;
- mui.toast(error);
- })
- },
- //引入图片
- requirePic(file) {
- if (file) {
- return require('$project/assets/img/' + file);
- }
- },
- asynCallBack() {
- //获取用户角色列表
- this.getRoleList();
- //获取最新二条通知消息
- this.prefetchNotice();
- },
- },
- mounted() {
- var gallery = mui('.mui-slider');
- var slider = gallery.slider({
- interval: 2000, //自动轮播周期,若为0则不自动播放,默认为0;
- bounce: true //是否启用回弹
- });
- },
- destroyed() {
- },
- computed: {
- pageTitle: {
- // getter
- get: function() {
- return this.person_data ? this.person_data.companyName : '小鹏管家';
- },
- // setter
- set: function(newValue) {
- console.log(newValue)
- }
- },
- ...mapGetters({
- openId: 'wx_openid',
- token: 'token',
- person_data: 'person_data',
- person_popedom: 'person_popedom',
- menu_list: 'menu_list',
- common_menu_list: 'common_menu_list',
- })
- }
- }
- </script>
- <style scoped src="$project/assets/css/xpgj.css"></style>
- <style src="$project/assets/css/iconfont.css"></style>
- <style src="$project/assets/css/mui.picker.min.css"></style>
- <style scoped>
- .red-after:after {
- background: red;
- }
- </style>
|