478 lines
16 KiB
Vue
478 lines
16 KiB
Vue
<template>
|
||
<div class="admin">
|
||
<div class="admin-top">
|
||
<div class="logo">
|
||
<img src="../assets/images/logo.png" />
|
||
<span>v{{ version }}</span>
|
||
</div>
|
||
<div class="admin-right">
|
||
<el-tooltip class="item" effect="dark" content="金币信息" placement="top">
|
||
<div class="left" @click="toActive">
|
||
<div :style="{marginLeft: '0px'}">{{ $store.state.userInfo.coin }}</div>
|
||
<span style="margin-right: 10px;"><img src="../assets/coin.png" width="30"/></span>
|
||
</div>
|
||
</el-tooltip>
|
||
<el-button type="button" :class="'el-button el-button--primary'" @click="sign">签到</el-button>
|
||
<el-tooltip class="item" effect="dark" content="用户激活" placement="top">
|
||
<div class="left" @click="toActive">
|
||
<span>会员信息:</span>
|
||
<div :style="{marginLeft: '10px', color: $store.state.userInfo.flag == 1? 'green': 'red'}">{{ getStateInfo }}</div>
|
||
</div>
|
||
</el-tooltip>
|
||
<el-dropdown @command="handleClick">
|
||
<div class="userinfo">
|
||
<span>{{ $store.state.userInfo.name + "(" + $store.state.userInfo.phone + ")" }}</span>
|
||
<img src="../assets/images/bottom.png" />
|
||
</div>
|
||
<el-dropdown-menu slot="dropdown">
|
||
<!-- <el-dropdown-item command="phone">修改手机</el-dropdown-item> -->
|
||
<el-dropdown-item command="pwd">修改密码</el-dropdown-item>
|
||
<el-dropdown-item command="message">消息推送</el-dropdown-item>
|
||
<el-dropdown-item command="coin">金币流水</el-dropdown-item>
|
||
<el-dropdown-item command="logout">退出登录</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
</div>
|
||
</div>
|
||
<div class="admin-main">
|
||
<el-scrollbar class="left">
|
||
<el-menu
|
||
:default-active="activePath"
|
||
:collapse-transition="true"
|
||
unique-opened
|
||
background-color="#545c64"
|
||
router
|
||
text-color="#fff"
|
||
:collapse="isCollapse">
|
||
<el-menu-item index="/welcome">
|
||
<i class="el-icon-monitor"></i>
|
||
<span slot="title">工作台</span>
|
||
</el-menu-item>
|
||
<el-submenu index="/normalSendGoods">
|
||
<template slot="title">
|
||
<i class="el-icon-shopping-cart-2"></i>
|
||
<span slot="title">备货单管理</span>
|
||
</template>
|
||
<el-menu-item index="/normalSendGoods">抢仓发货</el-menu-item>
|
||
<el-menu-item index="/shippingDesk">发货台管理</el-menu-item>
|
||
<el-menu-item index="/waitPackageList">待装箱发货单</el-menu-item>
|
||
<el-menu-item index="/waitShippingList">待收货发货单</el-menu-item>
|
||
<el-menu-item index="/shippingList">已收货发货单</el-menu-item>
|
||
</el-submenu>
|
||
|
||
<el-submenu index="/copyProduct">
|
||
<template slot="title">
|
||
<i class="el-icon-goods"></i>
|
||
<span slot="title">商品管理</span>
|
||
</template>
|
||
<el-menu-item index="/copyProduct">商品复制</el-menu-item>
|
||
</el-submenu>
|
||
<el-submenu index="/stock">
|
||
<template slot="title">
|
||
<i class="el-icon-house"></i>
|
||
<span slot="title">库存管理</span>
|
||
</template>
|
||
<el-menu-item index="/returnPackage">退货包裹管理</el-menu-item>
|
||
<el-menu-item index="/returnDetail">退货明细</el-menu-item>
|
||
</el-submenu>
|
||
<el-submenu index="/niubiCopy">
|
||
<template slot="title">
|
||
<i class="el-icon-magic-stick"></i>
|
||
<span slot="title">选品采集</span>
|
||
</template>
|
||
<el-menu-item index="/niubiCopy">商品采集</el-menu-item>
|
||
<el-submenu index="/track" style="padding-left: 15px;">
|
||
<template slot="title">
|
||
<span slot="title">选品跟踪</span>
|
||
</template>
|
||
<el-menu-item index="/storeTrack">店铺跟踪</el-menu-item>
|
||
<el-menu-item index="/keywordTrack">关键字跟踪</el-menu-item>
|
||
<el-menu-item index="/favoriteTrack">我的收藏</el-menu-item>
|
||
</el-submenu>
|
||
<el-submenu index="/newproductTrack" style="padding-left: 15px;">
|
||
<template slot="title">
|
||
<span slot="title">新品跟踪（免费）</span>
|
||
</template>
|
||
<el-menu-item index="/newProduct">上架新品</el-menu-item>
|
||
<el-menu-item index="/newProductGroup">我的分组</el-menu-item>
|
||
</el-submenu>
|
||
<el-menu-item index="/indexTrack">首页商品跟踪</el-menu-item>
|
||
</el-submenu>
|
||
<el-submenu index="/qualification">
|
||
<template slot="title">
|
||
<i class="el-icon-s-check"></i>
|
||
<span slot="title">资质合规</span>
|
||
</template>
|
||
<el-menu-item>
|
||
<template #title>
|
||
<a style="color: white" :href="'https://www.evatmaster.com/ost/registered?channelNo=SCBFWYSHZTEMUXZSQDHZ'" target="_blank">
|
||
<span>欧税通</span>
|
||
</a>
|
||
</template>
|
||
</el-menu-item>
|
||
</el-submenu>
|
||
<el-menu-item index="/saleData">
|
||
<i class="el-icon-s-data"></i>
|
||
<span slot="title">销售数据</span>
|
||
</el-menu-item>
|
||
<el-menu-item index="/learning">
|
||
<i class="el-icon-eleme"></i>
|
||
<span slot="title">新手园地</span>
|
||
</el-menu-item>
|
||
<!-- <el-menu-item index="/statistics">
|
||
<i class="el-icon-s-data"></i>
|
||
<span slot="title">数据统计</span>
|
||
</el-menu-item> -->
|
||
</el-menu>
|
||
</el-scrollbar>
|
||
<div class="container">
|
||
<transition name="fade-transform" mode="out-in">
|
||
<keep-alive include="NormalSendGoods">
|
||
<router-view class="container-app"></router-view>
|
||
</keep-alive>
|
||
</transition>
|
||
</div>
|
||
</div>
|
||
<el-dialog
|
||
title="激活充值"
|
||
:visible="$store.state.activeDlgShow"
|
||
:close-on-click-modal="false"
|
||
width="1200"
|
||
:before-close="handleClose">
|
||
<ai-payment/>
|
||
</el-dialog>
|
||
|
||
<div id="kefu" @click="gotoKefu">
|
||
<label slot="reference" class="topBtn" title="联系客服"></label>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {mapMutations, mapState} from 'vuex'
|
||
import AiPayment from "@/components/AiPayment.vue";
|
||
|
||
export default {
|
||
components: {AiPayment},
|
||
data () {
|
||
return {
|
||
isCollapse: false,
|
||
activePath: '/home',
|
||
form: {
|
||
mallId: this.$store.state.mallId,
|
||
mallName: this.$store.state.mallName,
|
||
code: ''
|
||
},
|
||
version: '',
|
||
vipType: ["体验会员","月会员","半年会员","年会员","多店通用年会员"]
|
||
}
|
||
},
|
||
computed: {
|
||
freeLogo: () => require("../assets/free.png"),
|
||
getStateInfo() {
|
||
if (this.$store.state.userInfo.flag == 0) {
|
||
return '未激活';
|
||
} else if (this.$store.state.userInfo.flag == 1) {
|
||
if (this.$store.state.userInfo.type != 4) {
|
||
return `(${this.$store.state.userInfo.mallName})` + this.vipType[this.$store.state.userInfo.type];
|
||
} else {
|
||
return this.vipType[this.$store.state.userInfo.type]
|
||
}
|
||
|
||
} else {
|
||
return '已过期';
|
||
}
|
||
},
|
||
|
||
...mapState(['mallName', 'mallList'])
|
||
},
|
||
|
||
watch: {
|
||
$route (v) {
|
||
this.activePath = v.fullPath
|
||
}
|
||
},
|
||
|
||
created () {
|
||
const devVersion = require('../manifest.development.json').version
|
||
const prodVersion = require('../manifest.production.json').version
|
||
this.version = process.env.NODE_ENV === 'production' ? prodVersion : devVersion
|
||
this.activePath = this.$route.fullPath
|
||
},
|
||
|
||
methods: {
|
||
...mapMutations(['setActiveDlgShow']),
|
||
handleClick (e) {
|
||
if (e === 'logout') {
|
||
this.$store.dispatch('SignOut', false)
|
||
} else if (e === 'pwd') {
|
||
this.$router.push('changePwd')
|
||
} else if (e === 'message') {
|
||
this.$router.push('message')
|
||
} else if (e === 'coin') {
|
||
this.$router.push('coinFlow')
|
||
}
|
||
},
|
||
handleClose() {
|
||
this.form.mallId = "";
|
||
this.form.mallName = "";
|
||
this.form.code = "";
|
||
this.setActiveDlgShow(false)
|
||
},
|
||
toActive() {
|
||
this.setActiveDlgShow(true)
|
||
},
|
||
getMessage(type) {
|
||
return `你使用的是“${this.vipType[type]}”兑换券，确定兑换？`;
|
||
},
|
||
active() {
|
||
this.$refs.form.validate((valid) => {
|
||
if (valid) {
|
||
this.$http.post(`/api/coupon/getDetail`, null, {
|
||
params: {
|
||
code: this.form.code
|
||
}
|
||
}).then(res => {
|
||
if (res.code == 0) {
|
||
let msg = this.getMessage(res.data.type);
|
||
this.$confirm(msg, '温馨提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'info'
|
||
}).then(() => {
|
||
this.$http.post(`/api/order/upgradeByCode`, null, {
|
||
params: {
|
||
...this.form
|
||
}
|
||
}).then(res => {
|
||
if (res.code == 0) {
|
||
this.$message.success('激活成功')
|
||
this.$store.dispatch('getUserInfo')
|
||
this.setActiveDlgShow(false)
|
||
}
|
||
})
|
||
})
|
||
}
|
||
});
|
||
|
||
}
|
||
})
|
||
},
|
||
sign () {
|
||
this.$http.post(`/api/malluser/sign`).then(res => {
|
||
if (res.code == 0) {
|
||
this.$message.success('签到成功')
|
||
this.$store.dispatch('getUserInfo')
|
||
}
|
||
})
|
||
},
|
||
gotoKefu() {
|
||
window.open('https://work.weixin.qq.com/kfid/kfcaa4208f661131eba', '_blank')
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.admin {
|
||
width: 100%;
|
||
height: 100vh;
|
||
overflow: hidden;
|
||
background: #f4f4f4;
|
||
|
||
.fade-transform-leave-active,
|
||
.fade-transform-enter-active {
|
||
transition: all .4s;
|
||
}
|
||
|
||
.fade-transform-enter {
|
||
opacity: 0;
|
||
transform: translateX(-20px);
|
||
}
|
||
|
||
.fade-transform-leave-to {
|
||
opacity: 0;
|
||
transform: translateX(20px);
|
||
}
|
||
|
||
.admin-main {
|
||
display: flex;
|
||
align-items: center;
|
||
height: calc(100% - 64px);
|
||
overflow: hidden;
|
||
border-top: 1px solid rgba(0,0,0,0.15);
|
||
|
||
.container {
|
||
flex: 1;
|
||
height: 100%;
|
||
overflow: hidden;
|
||
|
||
.container-app {
|
||
width: 100%;
|
||
height: 100%;
|
||
overflow-y: auto;
|
||
}
|
||
}
|
||
|
||
.left {
|
||
width: 246px;
|
||
height: 100%;
|
||
background: #545c64;
|
||
|
||
img {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 10px;
|
||
opacity: 0.8;
|
||
}
|
||
}
|
||
}
|
||
|
||
.admin-top {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
height: 64px;
|
||
padding: 0 24px 0 36px;
|
||
// box-shadow: 0px 1px 0px 0px rgba(128, 128, 128, 0.1);
|
||
background: #fff;
|
||
|
||
.logo {
|
||
display: flex;
|
||
align-items: baseline;
|
||
|
||
span {
|
||
position: relative;
|
||
bottom: 12px;
|
||
font-size: 16px;
|
||
}
|
||
|
||
img {
|
||
width: 60px;
|
||
margin-right: 12px;
|
||
}
|
||
|
||
h1 {
|
||
line-height: 25px;
|
||
color: #1F2635;
|
||
font-size: 18px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
p {
|
||
margin-top: 1px;
|
||
line-height: 17px;
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
color: #A5A9BC;
|
||
}
|
||
}
|
||
|
||
.admin-middle {
|
||
display: flex;
|
||
align-items: center;
|
||
height: 64px;
|
||
|
||
span {
|
||
position: relative;
|
||
margin-right: 60px;
|
||
height: 64px;
|
||
line-height: 64px;
|
||
font-size: 16px;
|
||
color: #1F2635;
|
||
cursor: pointer;
|
||
transition: all ease 0.5s;
|
||
|
||
&.active::after {
|
||
position: absolute;
|
||
left: 50%;
|
||
bottom: 9px;
|
||
z-index: 1;
|
||
width: 52px;
|
||
height: 4px;
|
||
background: #00A971;
|
||
transform: translateX(-50%);
|
||
content: ' ';
|
||
}
|
||
|
||
&.active, &:hover {
|
||
color: #1FBAD6;
|
||
}
|
||
|
||
&:last-child {
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.admin-right {
|
||
display: flex;
|
||
align-items: center;
|
||
height: 100%;
|
||
|
||
.left {
|
||
display: flex;
|
||
align-items: center;
|
||
cursor: pointer;
|
||
transition: all ease 0.3s;
|
||
|
||
&:hover {
|
||
opacity: 0.5;
|
||
}
|
||
}
|
||
|
||
.userinfo {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
height: 56px;
|
||
margin-left: 20px;
|
||
cursor: pointer;
|
||
transition: all ease 0.3s;
|
||
|
||
&:hover {
|
||
opacity: 0.5;
|
||
}
|
||
|
||
.avatar {
|
||
width: 32px;
|
||
height: 32px;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
span {
|
||
margin-right: 8px;
|
||
color: #1F2635;
|
||
font-size: 14px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
#kefu {
|
||
position: fixed;
|
||
right: 20px;
|
||
bottom: 40px;
|
||
z-index: 999;
|
||
width: 60px;
|
||
height: 60px;
|
||
}
|
||
#kefu .topBtn {
|
||
width: 60px;
|
||
height: 60px;
|
||
background-color: #fff;
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
border-radius: 50%;
|
||
cursor: pointer;
|
||
background-position: center center;
|
||
background-repeat: no-repeat;
|
||
background-size: 40px 40px;
|
||
-webkit-animation: wobble 250ms infinite;
|
||
animation: wobble 250ms infinite;
|
||
background-image: url('data:image/svg+xml;%20charset=utf8,%3Csvg%20t%3D%221575450105478%22%20class%3D%22icon%22%20viewBox%3D%220%200%201220%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20p-id%3D%222883%22%20width%3D%2248%22%20height%3D%2248%22%3E%3Cpath%20d%3D%22M609.524%20103.522c-222.89%200-403.712%20178.472-403.712%20398.78%200%20220.31%20180.823%20398.782%20403.712%20398.782%20222.889%200%20403.712-178.473%20403.712-398.781%200-220.309-180.823-398.781-403.712-398.781v48.762c196.1%200%20354.95%20156.785%20354.95%20350.019s-158.85%20350.019-354.95%20350.019-354.95-156.785-354.95-350.02c0-193.233%20158.85-350.018%20354.95-350.018v-48.762z%22%20fill%3D%22%231296db%22%20p-id%3D%222884%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M786.578%20916.34c166.45-69.217%20278.408-231.055%20278.408-414.035%200-248.026-203.847-449.219-455.457-449.219-251.619%200-455.457%20201.188-455.457%20449.22%200%2055.397%2010.152%20109.367%2029.718%20159.975%204.855%2012.56-1.39%2026.677-13.949%2031.533-12.56%204.855-26.677-1.39-31.532-13.949a490.396%20490.396%200%200%201-3.042-8.078c-1.85%200.077-3.711%200.116-5.581%200.116C58.06%20671.903%200%20614.597%200%20543.903c0-65.005%2049.09-118.69%20112.68-126.91C153.65%20182.56%20360.56%204.324%20609.528%204.324c248.962%200%20455.877%20178.24%20496.85%20412.67%2063.583%208.225%20112.669%2061.907%20112.669%20126.909%200%2070.694-58.06%20128-129.686%20128-1.89%200-3.771-0.04-5.642-0.119-47.536%20129.702-148.34%20235.841-279.493%20290.027-1.161%2033.464-29.012%2060.24-63.2%2060.24-34.925%200-63.237-27.944-63.237-62.416%200-34.471%2028.312-62.415%2063.237-62.415%2017.892%200%2034.048%207.333%2045.551%2019.12z%22%20fill%3D%22%231296db%22%20p-id%3D%222885%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M609.528%20611.405c-58.933%200-112.056-10.644-158.472-28.342-16.123-6.147-30.211-12.702-42.138-19.208-6.926-3.777-11.447-6.59-13.437-7.972-19.24-13.373-44.428%205.446-37.059%2027.688%2035.296%20106.527%20136.054%20179.913%20251.106%20179.913%20115.05%200%20215.796-73.384%20251.092-179.913%207.37-22.243-17.82-41.062-37.06-27.687-1.99%201.383-6.51%204.195-13.434%207.972-11.926%206.505-26.012%2013.06-42.133%2019.207-46.413%2017.698-99.533%2028.342-158.465%2028.342z%22%20fill%3D%22%231296db%22%20p-id%3D%222886%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
|
||
}
|
||
</style>
|