| 1 |
- {"remainingRequest":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\pages\\kefu\\pc\\components\\baseHeader.vue?vue&type=script&lang=js","dependencies":[{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\pages\\kefu\\pc\\components\\baseHeader.vue","mtime":1761185180102},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\babel-loader\\lib\\index.js","mtime":456789000000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQppbXBvcnQgeyBtYXBTdGF0ZSwgbWFwQWN0aW9ucyB9IGZyb20gJ3Z1ZXgnOw0KaW1wb3J0IGJ1cyBmcm9tICdAL3V0aWxzL2J1cyc7DQpleHBvcnQgZGVmYXVsdCB7DQogIG5hbWU6ICdiYXNlSGVhZGVyJywNCiAgcHJvcHM6IHsNCiAgICBrZWZ1SW5mbzogew0KICAgICAgdHlwZTogT2JqZWN0LA0KICAgICAgZGVmYXVsdDogZnVuY3Rpb24gKCkgew0KICAgICAgICByZXR1cm4ge307DQogICAgICB9LA0KICAgIH0sDQogICAgb25saW5lOiB7DQogICAgICB0eXBlOiBCb29sZWFuIHwgTnVtYmVyLA0KICAgICAgZGVmYXVsdDogdHJ1ZSwNCiAgICB9LA0KICB9LA0KICBjb21wdXRlZDoge30sDQogIGRhdGEoKSB7DQogICAgcmV0dXJuIHsNCiAgICAgIG1lbnVMaXN0OiBbDQogICAgICAgIHsNCiAgICAgICAgICBrZXk6IDAsDQogICAgICAgICAgdGl0bGU6ICflrqLmiLfkv6Hmga8nLA0KICAgICAgICB9LA0KICAgICAgICB7DQogICAgICAgICAga2V5OiAxLA0KICAgICAgICAgIHRpdGxlOiAn5Lqk5piT6K6i5Y2VJywNCiAgICAgICAgfSwNCiAgICAgICAgew0KICAgICAgICAgIGtleTogMiwNCiAgICAgICAgICB0aXRsZTogJ+WVhuWTgeS/oeaBrycsDQogICAgICAgIH0sDQogICAgICBdLA0KICAgICAgY3VySW5kZXg6IDAsDQogICAgICBpc09ubGluZTogZmFsc2UsDQogICAgICB2YWx1ZTogJycsDQogICAgfTsNCiAgfSwNCiAgbW91bnRlZCgpIHsNCiAgICBkb2N1bWVudC5hZGRFdmVudExpc3RlbmVyKCdjbGljaycsICgpID0+IHsNCiAgICAgIHRoaXMuaXNPbmxpbmUgPSBmYWxzZTsNCiAgICB9KTsNCiAgfSwNCiAgbWV0aG9kczogew0KICAgIC4uLm1hcEFjdGlvbnMoJ2tlZnUvJywgWydsb2dvdXQnLCAnbG9nb3V0S2VmdSddKSwNCiAgICBzZWxlY3RUYWIoaXRlbSkgew0KICAgICAgdGhpcy5jdXJJbmRleCA9IGl0ZW0ua2V5Ow0KICAgICAgdGhpcy5idXMuJGVtaXQoJ3NlbGVjdFJpZ2h0TWVudScsIHRoaXMuY3VySW5kZXgpOw0KICAgIH0sDQogICAgc2V0T25saW5lKCkgew0KICAgICAgdGhpcy5pc09ubGluZSA9ICF0aGlzLmlzT25saW5lOw0KICAgIH0sDQogICAgY2hhbmdlT25saW5lKHR5cGUpIHsNCiAgICAgIHRoaXMuJGVtaXQoJ3NldE9ubGluZScsIHR5cGUpOw0KICAgICAgdGhpcy5pc09ubGluZSA9IGZhbHNlOw0KICAgIH0sDQogICAgLy8g6YCA5Ye655m75b2VDQogICAgb3V0TG9naW4oKSB7DQogICAgICBsZXQgc2VsZiA9IHRoaXM7DQogICAgICB0aGlzLiRtc2dib3goew0KICAgICAgICB0aXRsZTogJ+mAgOWHuueZu+W9leehruiupCcsDQogICAgICAgIG1lc3NhZ2U6ICfmgqjnoa7lrprpgIDlh7rnmbvlvZXlvZPliY3otKbmiLflkJfvvJ/miZPlvIDnmoTmoIfnrb7pobXlkozkuKrkurrorr7nva7lsIbkvJrkv53lrZjjgIInLA0KICAgICAgICBzaG93Q2FuY2VsQnV0dG9uOiB0cnVlLA0KICAgICAgICBjYW5jZWxCdXR0b25UZXh0OiAn5Y+W5raIJywNCiAgICAgICAgY29uZmlybUJ1dHRvblRleHQ6ICfnoa7orqQnLA0KICAgICAgICBpY29uQ2xhc3M6ICdlbC1pY29uLXdhcm5pbmcnLA0KICAgICAgICBjb25maXJtQnV0dG9uQ2xhc3M6ICdidG4tY3VzdG9tLWNhbmNlbCcsDQogICAgICB9KQ0KICAgICAgICAudGhlbigoKSA9PiB7DQogICAgICAgICAgc2VsZi5sb2dvdXRLZWZ1KHsNCiAgICAgICAgICAgIGNvbmZpcm06IGZhbHNlLA0KICAgICAgICAgICAgdm06IHNlbGYsDQogICAgICAgICAgfSk7DQogICAgICAgIH0pDQogICAgICAgIC5jYXRjaCgoKSA9PiB7fSk7DQogICAgfSwNCiAgICAvLyDmkJzntKINCiAgICBiaW5kU2VhcmNoKGUpIHsNCiAgICAgIHRoaXMuJGVtaXQoJ3NlYXJjaCcsIGUpOw0KICAgIH0sDQogICAgLy8gaW5wdXRDaGFuZ2UNCiAgICBpbnB1dENoYW5nZShlKSB7DQogICAgICB0aGlzLmJ1cy4kZW1pdCgnY2hhbmdlJywgZSk7DQogICAgfSwNCiAgfSwNCn07DQo="},{"version":3,"sources":["baseHeader.vue"],"names":[],"mappings":";AA+CA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"baseHeader.vue","sourceRoot":"src/pages/kefu/pc/components","sourcesContent":["<template>\r\n <div class=\"base-header\">\r\n <div class=\"left-header-wrapper\">\r\n <el-input\r\n v-model=\"value\"\r\n class=\"search_box\"\r\n prefix=\"ios-search\"\r\n placeholder=\"搜索用户名称\"\r\n @change=\"bindSearch\"\r\n />\r\n <div class=\"user_info\">\r\n <img v-lazy=\"kefuInfo.avatar\" alt=\"\" />\r\n <span>{{ kefuInfo.nickname }}</span>\r\n <div class=\"status-box\">\r\n <div class=\"status\" :class=\"online ? 'on' : 'off'\" v-db-click @click.stop=\"setOnline\">\r\n <span class=\"dot\"></span>\r\n {{ online ? '在线' : '下线' }}\r\n </div>\r\n\r\n <div class=\"online-down\" v-show=\"isOnline\">\r\n <div class=\"item\" v-db-click @click.stop=\"changeOnline(1)\">\r\n <span class=\"iconfont iconduihao\" v-if=\"online\"></span><i class=\"green\"></i>在线\r\n </div>\r\n <div class=\"item\" v-db-click @click.stop=\"changeOnline(0)\">\r\n <span class=\"iconfont iconduihao\" v-if=\"!online\"></span><i></i>下线\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"out-btn\" v-db-click @click.stop=\"outLogin\">退出登录</div>\r\n </div>\r\n <div class=\"right-menu\">\r\n <div\r\n class=\"menu-item\"\r\n :class=\"{ on: index == curIndex }\"\r\n v-for=\"(item, index) in menuList\"\r\n :key=\"index\"\r\n v-db-click\r\n @click.stop=\"selectTab(item)\"\r\n >\r\n {{ item.title }}\r\n </div>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState, mapActions } from 'vuex';\r\nimport bus from '@/utils/bus';\r\nexport default {\r\n name: 'baseHeader',\r\n props: {\r\n kefuInfo: {\r\n type: Object,\r\n default: function () {\r\n return {};\r\n },\r\n },\r\n online: {\r\n type: Boolean | Number,\r\n default: true,\r\n },\r\n },\r\n computed: {},\r\n data() {\r\n return {\r\n menuList: [\r\n {\r\n key: 0,\r\n title: '客户信息',\r\n },\r\n {\r\n key: 1,\r\n title: '交易订单',\r\n },\r\n {\r\n key: 2,\r\n title: '商品信息',\r\n },\r\n ],\r\n curIndex: 0,\r\n isOnline: false,\r\n value: '',\r\n };\r\n },\r\n mounted() {\r\n document.addEventListener('click', () => {\r\n this.isOnline = false;\r\n });\r\n },\r\n methods: {\r\n ...mapActions('kefu/', ['logout', 'logoutKefu']),\r\n selectTab(item) {\r\n this.curIndex = item.key;\r\n this.bus.$emit('selectRightMenu', this.curIndex);\r\n },\r\n setOnline() {\r\n this.isOnline = !this.isOnline;\r\n },\r\n changeOnline(type) {\r\n this.$emit('setOnline', type);\r\n this.isOnline = false;\r\n },\r\n // 退出登录\r\n outLogin() {\r\n let self = this;\r\n this.$msgbox({\r\n title: '退出登录确认',\r\n message: '您确定退出登录当前账户吗？打开的标签页和个人设置将会保存。',\r\n showCancelButton: true,\r\n cancelButtonText: '取消',\r\n confirmButtonText: '确认',\r\n iconClass: 'el-icon-warning',\r\n confirmButtonClass: 'btn-custom-cancel',\r\n })\r\n .then(() => {\r\n self.logoutKefu({\r\n confirm: false,\r\n vm: self,\r\n });\r\n })\r\n .catch(() => {});\r\n },\r\n // 搜索\r\n bindSearch(e) {\r\n this.$emit('search', e);\r\n },\r\n // inputChange\r\n inputChange(e) {\r\n this.bus.$emit('change', e);\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.base-header {\r\n z-index: 99;\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n height: 66px;\r\n padding: 0 0 0 15px;\r\n background: linear-gradient(270deg, #1890ff 0%, #3875ea 100%);\r\n color: #fff;\r\n flex-shrink: 0;\r\n .left-header-wrapper {\r\n position: relative;\r\n display: flex;\r\n flex: 1;\r\n align-items: center;\r\n .search_box {\r\n width: 295px;\r\n border-radius: 17px;\r\n overflow: hidden;\r\n }\r\n .user_info {\r\n display: flex;\r\n align-items: center;\r\n margin-left: 30px;\r\n\r\n img {\r\n width: 40px;\r\n height: 40px;\r\n margin-right: 10px;\r\n border-radius: 50%;\r\n }\r\n\r\n span {\r\n font-size: 16px;\r\n }\r\n .status-box {\r\n position: relative;\r\n cursor: pointer;\r\n }\r\n .status {\r\n display: flex;\r\n align-items: center;\r\n padding: 0 10px;\r\n margin-left: 5px;\r\n background: #eaffeb;\r\n color: rgba(0, 0, 0, 0.65);\r\n border-radius: 9px;\r\n .dot {\r\n width: 6px;\r\n height: 6px;\r\n margin-right: 3px;\r\n border-radius: 50%;\r\n background: #48d452;\r\n }\r\n &.off {\r\n background: #f3f3f3;\r\n .dot {\r\n background: #999999;\r\n }\r\n }\r\n }\r\n .online-down {\r\n z-index: 50;\r\n position: absolute;\r\n left: 0;\r\n bottom: -70px;\r\n width: 86px;\r\n background: #fff;\r\n color: #333;\r\n box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08);\r\n border-radius: 5px;\r\n .item {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n padding: 7px 10px 7px 30px;\r\n cursor: pointer;\r\n i {\r\n width: 10px;\r\n height: 10px;\r\n margin-right: 8px;\r\n border-radius: 50%;\r\n background: #999999;\r\n &.green {\r\n background: #48d452;\r\n }\r\n }\r\n .iconfont {\r\n position: absolute;\r\n left: 10px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n font-size: 12px;\r\n }\r\n }\r\n }\r\n }\r\n .out-btn {\r\n position: absolute;\r\n right: 30px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n width: 86px;\r\n height: 26px;\r\n line-height: 28px;\r\n text-align: center;\r\n background: #ffffff;\r\n border-radius: 16px;\r\n color: #3875ea;\r\n font-size: 13px;\r\n cursor: pointer;\r\n }\r\n }\r\n .right-menu {\r\n display: flex;\r\n align-items: center;\r\n .menu-item {\r\n position: relative;\r\n margin-right: 30px;\r\n font-size: 14px;\r\n font-weight: 400;\r\n cursor: pointer;\r\n &.on {\r\n font-weight: 600;\r\n &::after {\r\n position: absolute;\r\n left: 0;\r\n bottom: -22px;\r\n content: '';\r\n width: 100%;\r\n height: 2px;\r\n background: #fff;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n</style>\r\n"]}]}
|
