双屏联动
This commit is contained in:
parent
c666592979
commit
2d541ba5ba
55
src/App.vue
55
src/App.vue
|
|
@ -5,54 +5,27 @@ import { Push } from '@/common/push'
|
|||
|
||||
|
||||
|
||||
// var ws = new WebSocket("ws://192.168.106.167:8080");
|
||||
|
||||
// //当WebSocket创建成功时，触发onopen事件
|
||||
// ws.onopen = function () {
|
||||
// console.log("open");
|
||||
// }
|
||||
// //当客户端收到服务端发来的消息时，触发onmessage事件，参数e.data包含server传递过来的数据
|
||||
// ws.onmessage = function (e) {
|
||||
|
||||
// let data =JSON.parse(e.data)
|
||||
|
||||
// globalEventBus.emit(data.event, data.data ||'')
|
||||
|
||||
|
||||
|
||||
// }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
var connection = new Push({
|
||||
url: 'ws://192.168.1.24:3131', // websocket地址
|
||||
const openPush=()=>{
|
||||
var connection = new Push({
|
||||
url: 'wss://chat.lihaink.cn/tts', // websocket地址
|
||||
app_key: 'aaea61749929eb53a4bd75a1474c1d27',
|
||||
});
|
||||
// 假设用户uid为1
|
||||
var uid = 2;
|
||||
var uid = 10;
|
||||
// 浏览器监听user-2频道的消息，也就是用户uid为1的用户消息
|
||||
var user_channel = connection.subscribe('user-' + uid);
|
||||
|
||||
// 当user-2频道有message事件的消息时
|
||||
user_channel.on('message', function (data) {
|
||||
console.log("收到消息",data)
|
||||
globalEventBus.emit(data.content.event, data.content.data)
|
||||
|
||||
|
||||
console.log("收到消息",data)
|
||||
|
||||
});
|
||||
// 断线事件
|
||||
user_channel.on('close', function () {
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
const areaStroe = areaObj()
|
||||
let res = {
|
||||
|
|
@ -77,28 +50,14 @@ localStorage.setItem("TRADE_USER", JSON.stringify(res.data))
|
|||
let { area_code, street_code } = res.data.user
|
||||
areaStroe.changeArea({ areaCode: area_code, streetCode: street_code })
|
||||
|
||||
|
||||
if (localStorage.getItem("TRADE_USER")) {
|
||||
let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'))
|
||||
areaStroe.changeUserInfo(userInfo)
|
||||
let { area_code, street_code } = userInfo.user
|
||||
areaStroe.changeArea({ areaCode: area_code, streetCode: street_code })
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
if(! JSON.parse(localStorage.getItem("TRADE_TYPE")) )openPush();
|
||||
|
||||
</script>
|
||||
<template>
|
||||
|
|
|
|||
37
src/api.js
37
src/api.js
|
|
@ -3,7 +3,7 @@ import axios from "axios";
|
|||
import { ElMessage } from 'element-plus'
|
||||
import router from "./router";
|
||||
|
||||
let expire = localStorage.getItem("TRADE_USER") ? JSON.parse(localStorage.getItem("TRADE_USER")).expire : {}
|
||||
// let expire = localStorage.getItem("TRADE_USER") ? JSON.parse(localStorage.getItem("TRADE_USER")).expire : {}
|
||||
|
||||
|
||||
// 创建axios 实例
|
||||
|
|
@ -11,27 +11,26 @@ const instacne = axios.create({
|
|||
baseURL: "https://shop.lihaink.cn/",
|
||||
timeout: 30000,
|
||||
});
|
||||
const instacneSend = axios.create({
|
||||
baseURL: "http://chat.lihaink.cn/index/",
|
||||
timeout: 30000,
|
||||
});
|
||||
|
||||
// 请求拦截
|
||||
instacne.interceptors.request.use(
|
||||
(config) => {
|
||||
// 在发送请求之前做什么
|
||||
let timestamp = Math.floor(new Date().getTime() / 1000);
|
||||
|
||||
if (expire) {
|
||||
|
||||
if (timestamp > expire) {
|
||||
ElMessage({
|
||||
message: "登录过期，请重新登录",
|
||||
type: 'warning',
|
||||
})
|
||||
|
||||
localStorage.removeItem('TRADE_USER')
|
||||
router.replace('/login')
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
// let timestamp = Math.floor(new Date().getTime() / 1000);
|
||||
// if (expire) {
|
||||
// if (timestamp > expire) {
|
||||
// ElMessage({
|
||||
// message: "登录过期，请重新登录",
|
||||
// type: 'warning',
|
||||
// })
|
||||
// localStorage.removeItem('TRADE_USER')
|
||||
// router.replace('/login')
|
||||
// }
|
||||
// }
|
||||
|
||||
return config;
|
||||
},
|
||||
|
|
@ -61,7 +60,9 @@ instacne.interceptors.response.use(
|
|||
);
|
||||
|
||||
|
||||
|
||||
export function sendMsg(params) {
|
||||
return instacneSend.get('/dataviewTouchPush', { params })
|
||||
}
|
||||
|
||||
export function getUserNumApi(params) {
|
||||
return instacne.get('/api/dataview/user_merchat_count', { params })
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
<template>
|
||||
<Transition>
|
||||
<div class="address" v-if="props.choseArea">
|
||||
|
||||
<div class="address-li" @click="choseAreaFn">{{ areaStore.area.name||"泸县" }} </div>
|
||||
|
||||
<div class="address" >
|
||||
<div class="address-li" @click="choseAreaFn">{{ "泸县" }} </div>
|
||||
<div class="address-li" @click="choseTownFn(item.code, item.name)" v-for="( item, index ) in areaList ">{{
|
||||
item.name }}
|
||||
</div>
|
||||
</div>
|
||||
</Transition>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
|
@ -16,69 +12,60 @@ import { defineProps, defineEmits, onMounted, reactive, watch ,ref} from "vue"
|
|||
import { useRouter, useRoute } from 'vue-router'
|
||||
import { areaObj } from '@/store/index.js'
|
||||
import axios from "axios"
|
||||
import { sendMsg } from "@/api.js"
|
||||
import { globalEventBus } from '@/common/eventBus'
|
||||
let areaStore = areaObj()
|
||||
const areaName=ref("泸县")
|
||||
|
||||
const isMainScreen=JSON.parse(localStorage.getItem("TRADE_TYPE"))
|
||||
const router = useRouter()
|
||||
const emit = defineEmits(['offAreaList'])
|
||||
const props = defineProps({
|
||||
choseArea: Boolean,
|
||||
})
|
||||
const sendFn = (event, data = '') => {
|
||||
sendMsg({ channel: 'user-10', event, data })
|
||||
}
|
||||
let areaList = reactive([])
|
||||
// 选额镇
|
||||
// 选择镇
|
||||
const choseTownFn = (id, name) => {
|
||||
areaStore.changeArea({
|
||||
if(isMainScreen){
|
||||
sendFn('header7', { name, code: id })
|
||||
}else{
|
||||
areaStore.changeArea({
|
||||
areaCode: areaStore.area.areaCode,
|
||||
streetCode: id,
|
||||
name:name
|
||||
|
||||
})
|
||||
|
||||
props.choseArea = false
|
||||
emit('offAreaList', name)
|
||||
router.replace('/townDetail?code=' + id)
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// x选择区县
|
||||
const choseAreaFn = () => {
|
||||
areaStore.changeArea({
|
||||
if(isMainScreen){
|
||||
sendFn('header6', { name: "泸县", code: 0 })
|
||||
}else{
|
||||
areaStore.changeArea({
|
||||
areaCode: areaStore.area.areaCode,
|
||||
streetCode: null,
|
||||
name:areaStore.area.name
|
||||
name:'泸县'
|
||||
})
|
||||
props.choseArea = false
|
||||
|
||||
emit('offAreaList',areaStore.area.name)
|
||||
router.replace('/')
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
axios.get(`https://crmeb-test.shop.lihaink.cn/api/city/get_street?area_code=${areaStore.area.areaCode}`)
|
||||
axios.get(`https://shop.lihaink.cn/api/city/get_street?area_code=${areaStore.area.areaCode}`)
|
||||
.then(function (response) {
|
||||
response.data.data.forEach(item => {
|
||||
areaList.push(item)
|
||||
})
|
||||
|
||||
})
|
||||
.catch(function (error) {
|
||||
// 处理错误情况
|
||||
})
|
||||
.finally(function () {
|
||||
// 总是会执行
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
globalEventBus.on('header6', data => {
|
||||
|
|
@ -86,7 +73,7 @@ globalEventBus.on('header6', data => {
|
|||
})
|
||||
|
||||
globalEventBus.on('header7', data => {
|
||||
choseTownFn(data.id,data.name)
|
||||
choseTownFn(data.code,data.name)
|
||||
})
|
||||
|
||||
|
||||
|
|
@ -95,22 +82,16 @@ globalEventBus.on('header7', data => {
|
|||
|
||||
<style lang="scss" scoped>
|
||||
.address {
|
||||
left: 1vw;
|
||||
top: 18px;
|
||||
position: absolute;
|
||||
width: 8vw;
|
||||
height: 18vh;
|
||||
background-color: #001E32;
|
||||
color: #C7DBE3;
|
||||
z-index: 9999;
|
||||
overflow-y: auto;
|
||||
box-sizing: border-box;
|
||||
padding: 5px;
|
||||
|
||||
.address-li {
|
||||
padding: 2px 5px;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
|
||||
border-bottom: 0.1px solid #0E293C;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="headers">
|
||||
<div class="logo" >
|
||||
<div class="logo">
|
||||
|
||||
</div>
|
||||
<div class="tab" v-if="role != 1">
|
||||
|
|
@ -28,23 +28,19 @@
|
|||
src="/static/index/DD.png" alt="">
|
||||
<img @click="showFn(3, '/order')" class="tab-img" v-else style="width: 7vw;height:3vh;"
|
||||
src="/static/index/DDXZ.png" alt="">
|
||||
|
||||
</div>
|
||||
<div class="tab-li">
|
||||
<img @click="showFn(4, '/finance')" class="tab-img" v-if="show[4]" style="width: 6vw;height:2vh;"
|
||||
src="/static/index/CW.png" alt="">
|
||||
<img @click="showFn(4, '/finance')" class="tab-img" v-else style="width: 7vw;height:3vh;"
|
||||
src="/static/index/CWXZ.png" alt="">
|
||||
|
||||
</div>
|
||||
<div class="tab-li" v-if="route.path == '/storeLogin'" @click="router.replace('/Businesses')">
|
||||
<img @click="showFn(4, '/finance')" class="tab-img" v-if="show[4]" style="width: 6vw;height:2vh;"
|
||||
src="/static/index/FH.png" alt="">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" v-else>
|
||||
|
||||
<div class="tab-li">
|
||||
<img @click="showFn(2, '/storeLogin')" class="tab-img" v-if="show[2]" style="width: 6vw;height:2vh;"
|
||||
src="/static/index/SH.png" alt="">
|
||||
|
|
@ -54,12 +50,10 @@
|
|||
</div>
|
||||
<div class="right">
|
||||
<datePicker></datePicker>
|
||||
<div class="rigth-li" @click="choseAreaFn"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
|
||||
src="/static/index/DW.png" alt=""> {{ areaStore.area.name||"泸县" }}
|
||||
<div class="rigth-li b-cls" @click="choseAreaFn"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
|
||||
src="/static/index/DW.png" alt=""> {{ areaStore.area.name || "泸县" }}
|
||||
<areaList :choseArea="choseArea" @offAreaList="offAreaList" class="a-cls" :key="areaStore.area.areaCode" />
|
||||
</div>
|
||||
<areaList :choseArea="choseArea" @offAreaList="offAreaList" style="left: 12vw;" :key="areaStore.area.areaCode">
|
||||
</areaList>
|
||||
|
||||
|
||||
<div class="right-line">
|
||||
<span>
|
||||
|
|
@ -81,30 +75,20 @@
|
|||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, watch } from "vue"
|
||||
import areaList from "./areaList.vue";
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import { areaObj } from "@/store/index.js"
|
||||
import datePicker from "@/components/datePicker.vue"
|
||||
|
||||
import { globalEventBus } from '@/common/eventBus'
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
import { sendMsg } from "@/api.js"
|
||||
const areaStore = areaObj()
|
||||
const isMainScreen=JSON.parse(localStorage.getItem("TRADE_TYPE"))
|
||||
let area = ref(areaStore.area.name || '')
|
||||
let userinfo = JSON.parse(localStorage.getItem('TRADE_USER'))
|
||||
let role = ref(userinfo.role)
|
||||
|
|
@ -114,52 +98,43 @@ const route = useRoute()
|
|||
// 标题
|
||||
const show = reactive([false, true, true, true, true])
|
||||
|
||||
|
||||
const sendFn = (event, data = '') => {
|
||||
sendMsg({ channel: 'user-10', event, data })
|
||||
}
|
||||
|
||||
|
||||
const showFn = (index, src) => {
|
||||
show.forEach((item, i) => {
|
||||
show[i] = true
|
||||
})
|
||||
show[index] = !show[index]
|
||||
if (src) {
|
||||
|
||||
if (src && !isMainScreen) {
|
||||
if (areaStore.area.streetCode && src == '/') {
|
||||
|
||||
|
||||
router.push("/townDetail?code=510524102")
|
||||
return
|
||||
}
|
||||
router.replace(src)
|
||||
|
||||
}
|
||||
else if(isMainScreen){
|
||||
sendFn(`header${index+1}`)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const changeArea = (name, code) => {
|
||||
areaStore.changeArea({
|
||||
areaCode: code,
|
||||
streetCode: null,
|
||||
name,
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
// router.go(0)
|
||||
|
||||
router.replace('/')
|
||||
console.log(areaStore.area.name)
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
watch(
|
||||
if( !isMainScreen){
|
||||
watch(
|
||||
() => route.path,
|
||||
(value, oldValue) => {
|
||||
|
||||
|
||||
|
||||
if (value == '/index') {
|
||||
showFn(0)
|
||||
area.value = areaStore.area.name || '泸县'
|
||||
|
|
@ -190,16 +165,13 @@ watch(
|
|||
}
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
const choseAreaFn = () => {
|
||||
|
||||
if (role.value == 2) {
|
||||
choseArea.value = true
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
// 选额镇
|
||||
|
|
@ -207,13 +179,8 @@ const choseArea = ref(false)
|
|||
// 关闭
|
||||
const offAreaList = (name) => {
|
||||
choseArea.value = false
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// area.value = name
|
||||
}
|
||||
|
||||
const out = () => {
|
||||
localStorage.removeItem('TRADE_USER')
|
||||
router.replace('/login')
|
||||
|
|
@ -243,71 +210,30 @@ const updateTime = () => {
|
|||
document.getElementById("time").innerHTML = currentTime;
|
||||
document.getElementById("days").innerHTML = currentDays;
|
||||
}
|
||||
const SCREEN_TYPE=JSON.parse(localStorage.getItem('SCREEN_TYPE'))
|
||||
onMounted(() => {
|
||||
setInterval(updateTime, 1000)
|
||||
localStorage.setItem("SCREEN_TYPE",JSON.stringify(route.query)||'' )
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
globalEventBus.on('compheader1', data => {
|
||||
showFn(0, '/')
|
||||
|
||||
|
||||
if (SCREEN_TYPE.type == 'r') {
|
||||
showFn(0, '/')
|
||||
}
|
||||
})
|
||||
|
||||
globalEventBus.on('compheader2', data => {
|
||||
showFn(1, '/commodity')
|
||||
|
||||
if (SCREEN_TYPE.type == 'r'){
|
||||
showFn(1, '/commodity')
|
||||
}
|
||||
})
|
||||
|
||||
globalEventBus.on('compheader3', data => {
|
||||
showFn(2, '/Businesses')
|
||||
|
||||
if (SCREEN_TYPE.type == 'r'){
|
||||
showFn(2, '/Businesses')
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
globalEventBus.on('compheader4', data => {
|
||||
|
||||
showFn(3, '/order')
|
||||
|
||||
|
||||
if (SCREEN_TYPE.type == 'r'){
|
||||
showFn(3, '/order')
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
globalEventBus.on('compheader5', data => {
|
||||
showFn(4, '/finance')
|
||||
|
||||
|
||||
if (SCREEN_TYPE.type == 'r'){
|
||||
showFn(4, '/finance')
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
|
||||
globalEventBus.on('choserArea', data => {
|
||||
changeArea(data.name, data.code)
|
||||
|
||||
|
||||
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
@ -316,7 +242,6 @@ globalEventBus.on('choserArea', data => {
|
|||
|
||||
<style lang="scss" >
|
||||
.popperClass {
|
||||
// background-color: red;
|
||||
color: red;
|
||||
border: none;
|
||||
}
|
||||
|
|
@ -329,12 +254,9 @@ globalEventBus.on('choserArea', data => {
|
|||
justify-content: space-between;
|
||||
background-image: url('/static/index/LOGO.png');
|
||||
background-color: #000C14;
|
||||
|
||||
background-size: cover;
|
||||
|
||||
.logo {
|
||||
width: 20vw;
|
||||
// margin-right: 30px;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
}
|
||||
|
|
@ -345,7 +267,6 @@ globalEventBus.on('choserArea', data => {
|
|||
margin-left: 120px;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
// background-color: white;
|
||||
|
||||
.tab-li {
|
||||
width: 8vw;
|
||||
|
|
@ -354,7 +275,6 @@ globalEventBus.on('choserArea', data => {
|
|||
cursor: pointer;
|
||||
height: 1.5vh;
|
||||
position: relative;
|
||||
// background-color: red;
|
||||
|
||||
.tab-img {
|
||||
position: absolute;
|
||||
|
|
@ -373,41 +293,6 @@ globalEventBus.on('choserArea', data => {
|
|||
position: relative;
|
||||
align-items: center;
|
||||
|
||||
.address {
|
||||
left: 1vw;
|
||||
top: 18px;
|
||||
position: absolute;
|
||||
width: 8vw;
|
||||
height: 18vh;
|
||||
background-color: #001E32;
|
||||
color: #C7DBE3;
|
||||
z-index: 9999;
|
||||
overflow-y: auto;
|
||||
box-sizing: border-box;
|
||||
padding: 5px;
|
||||
|
||||
.address-li {
|
||||
padding: 2px 5px;
|
||||
cursor: pointer;
|
||||
|
||||
border-bottom: 0.1px solid #0E293C;
|
||||
}
|
||||
}
|
||||
|
||||
.address::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
background-color: #153041;
|
||||
}
|
||||
|
||||
.address::-webkit-scrollbar-track {
|
||||
background-color: #153041;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #4AB9D0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.rigth-li {
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
|
|
@ -428,11 +313,29 @@ globalEventBus.on('choserArea', data => {
|
|||
width: 1px;
|
||||
height: 7px;
|
||||
background-color: #4BB9D0;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.a-cls{
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 2vh;
|
||||
display: block;
|
||||
z-index: 999;
|
||||
transition: 300ms;
|
||||
left: 2vw;
|
||||
|
||||
}
|
||||
.b-cls{
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.b-cls:hover .a-cls{
|
||||
height: 18vh;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.v-enter-active,
|
||||
.v-leave-active {
|
||||
|
|
|
|||
|
|
@ -34,8 +34,6 @@ import { ref, reactive, defineProps } from "vue"
|
|||
import { getSalesRankApi } from "@/api.js"
|
||||
import * as echarts from 'echarts';
|
||||
import { globalEventBus } from '@/common/eventBus'
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
areaCodes: Object,
|
||||
})
|
||||
|
|
@ -48,8 +46,6 @@ let merchantRankingTotal = ref(0)
|
|||
let productRankingTotal = ref(0)
|
||||
let townProductCount = ref(0)
|
||||
|
||||
|
||||
|
||||
const addFn = (data) => {
|
||||
let list = []
|
||||
data.forEach((item, i) => {
|
||||
|
|
@ -58,16 +54,11 @@ const addFn = (data) => {
|
|||
`<div style="line-height:30px; text-align: center;background-image: url('/index/PM${(i + 1) <= 3 ? (i + 1) : 4}.png');width: 30px;height: 30px;background-size: cover;" >${i + 1}</div> `,
|
||||
`<div style='background:red;position:relative'><img src="${item.image || item.mini_banner}" style="width: 30px;height: 30px;position:absolute" alt=""></div>`,
|
||||
`<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name || item.mer_name}</div>`,
|
||||
`<div style=' transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width: ${item.store_name ? (item.total_sales / productRankingTotal.value).toFixed(2) * 100 : (item.total_sales / townProductCount.value).toFixed(2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
|
||||
`<div style=' transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width: ${item.store_name ? (item.total_sales / productRankingTotal.value).toFixed(2) * 100 : (item.total_sales / merchantRankingTotal.value).toFixed(2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
|
||||
`<div style=' position: relative;line-height:30px;text-align:center' >${item.total_sales} <span style='font-size:10px'>单</span>
|
||||
|
||||
<img src="/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
|
||||
|
||||
<img src="/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
|
||||
</div>`,
|
||||
|
||||
],
|
||||
|
||||
|
||||
)
|
||||
})
|
||||
return list
|
||||
|
|
@ -239,6 +230,7 @@ getSalesRankApi(props.areaCodes).then(res => {
|
|||
config.data = addFn(merchantRankingList)
|
||||
pageNum.value = Math.ceil(townProductCountList.length / 8)
|
||||
initStoreOption(townProductCountList.slice(0, 8), townProductCount.value)
|
||||
console.log(townProductCount.value,'townProductCount')
|
||||
})
|
||||
const pageFN = (Num) => {
|
||||
|
||||
|
|
|
|||
|
|
@ -59,7 +59,6 @@ import * as echarts from 'echarts';
|
|||
import { onMounted, defineProps } from "vue"
|
||||
import { order_user_num_countApi } from "@/api.js"
|
||||
import { areaObj } from '../../store';
|
||||
|
||||
const areaStore = areaObj()
|
||||
|
||||
order_user_num_countApi(
|
||||
|
|
@ -73,9 +72,6 @@ order_user_num_countApi(
|
|||
orderData2.series[0].data.push(res.data.monthOrderPayNum)
|
||||
initCharts('orderData', orderData)
|
||||
initCharts('orderData2', orderData2)
|
||||
|
||||
|
||||
console.log(45454)
|
||||
})
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||
|
||||
const routes = [
|
||||
{
|
||||
|
|
@ -52,21 +52,15 @@ const routes = [
|
|||
name: 'login',
|
||||
component: () => import('@/view/login.vue'),
|
||||
},
|
||||
|
||||
|
||||
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
mode: 'hash',
|
||||
history: createWebHistory(),
|
||||
history: createWebHashHistory(),
|
||||
routes
|
||||
})
|
||||
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
|
||||
let token = localStorage.getItem("TRADE_USER")
|
||||
|
||||
if (to.name == "login" && token) {
|
||||
next("/")
|
||||
return
|
||||
|
|
|
|||
|
|
@ -5,33 +5,24 @@ import {
|
|||
const lastMouth = () => {
|
||||
var thirtyDaysAgo = new Date();
|
||||
thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30); // 设置为30天前的日期
|
||||
|
||||
var year = thirtyDaysAgo.getFullYear();
|
||||
var month = thirtyDaysAgo.getMonth() + 1; // 月份从0开始，需要加1
|
||||
var day = thirtyDaysAgo.getDate();
|
||||
|
||||
// 格式化为字符串，如果需要补0可以使用padStart函数
|
||||
var formattedDate = year + '-' + month.toString().padStart(2, '0') + '-' + day.toString().padStart(2, '0');
|
||||
|
||||
|
||||
return formattedDate
|
||||
|
||||
}
|
||||
const now = () => {
|
||||
// 创建一个新的Date对象，表示当前日期和时间
|
||||
var today = new Date();
|
||||
|
||||
// 获取年、月、日
|
||||
var year = today.getFullYear();
|
||||
var month = today.getMonth() + 1; // 月份从0开始，需要加1
|
||||
var day = today.getDate();
|
||||
|
||||
// 格式化为字符串
|
||||
var formattedDate = year + "-" + month + "-" + day;
|
||||
return formattedDate
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
export const areaObj = defineStore('counter', {
|
||||
|
|
@ -44,7 +35,7 @@ export const areaObj = defineStore('counter', {
|
|||
|
||||
},
|
||||
time: [lastMouth(), now()],
|
||||
// 商户请求的参数
|
||||
// 商户登录请求的参数
|
||||
store: {
|
||||
areaCode: "",
|
||||
streetCode: "",
|
||||
|
|
@ -59,8 +50,6 @@ export const areaObj = defineStore('counter', {
|
|||
},
|
||||
changeUserInfo(obj) {
|
||||
this.userInfo = obj
|
||||
|
||||
|
||||
if (obj?.user?.merchant) {
|
||||
let { area_id, mer_id, street_id } = obj.user.merchant
|
||||
this.store.areaCode = area_id
|
||||
|
|
|
|||
|
|
@ -31,13 +31,7 @@ import { areaObj } from '@/store/index.js'
|
|||
import router from "../router";
|
||||
import { globalEventBus } from '@/common/eventBus'
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const showLogin = ref(false)
|
||||
|
||||
const areaStore = areaObj()
|
||||
const route = useRouter()
|
||||
let status = ref(0)
|
||||
|
|
@ -47,13 +41,10 @@ const num = (n) => {
|
|||
htmls = htmls.concat('<input type="radio" name="rate" readonly>')
|
||||
}
|
||||
return htmls
|
||||
|
||||
}
|
||||
|
||||
|
||||
let baseData = {}
|
||||
const changeTable = (num) => {
|
||||
|
||||
configs.data.splice(0, configs.data.length)
|
||||
status.value = num
|
||||
merchant_listApi(
|
||||
|
|
@ -69,7 +60,6 @@ const changeTable = (num) => {
|
|||
|
||||
}
|
||||
|
||||
|
||||
const hdClick = (e) => {
|
||||
if (e.columnIndex == 10) {
|
||||
merchantApi(
|
||||
|
|
@ -78,15 +68,13 @@ const hdClick = (e) => {
|
|||
...areaStore.area
|
||||
}
|
||||
).then(res => {
|
||||
localStorage.setItem('TRAD_STORE_INFO',JSON.stringify(res.data) )
|
||||
areaStore.storeLogin(res.data)
|
||||
router.push('/storeLogin')
|
||||
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
const addConfigData = (data) => {
|
||||
data.forEach((item, i) => {
|
||||
if (i % 2 == 0) {
|
||||
|
|
@ -120,15 +108,10 @@ const addConfigData = (data) => {
|
|||
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.status ? '开启' : '关闭'}</div>`,
|
||||
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;color:#3D9EB5; cursor: pointer;'>登录</div>`,
|
||||
]
|
||||
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
const configs = reactive({
|
||||
|
|
@ -158,25 +141,25 @@ onMounted(() => {
|
|||
|
||||
|
||||
|
||||
globalEventBus.on('header3-1' , data => {
|
||||
globalEventBus.on('header3-1', data => {
|
||||
changeTable(1)
|
||||
})
|
||||
globalEventBus.on('header3-2' , data => {
|
||||
globalEventBus.on('header3-2', data => {
|
||||
changeTable(0)
|
||||
})
|
||||
|
||||
globalEventBus.on('header3-3' , data => {
|
||||
globalEventBus.on('header3-3', data => {
|
||||
merchantApi(
|
||||
{
|
||||
mer_id: data.id,
|
||||
...areaStore.area
|
||||
}
|
||||
).then(res => {
|
||||
areaStore.storeLogin(res.data)
|
||||
router.push('/storeLogin')
|
||||
{
|
||||
mer_id: data.id,
|
||||
...areaStore.area
|
||||
}
|
||||
).then(res => {
|
||||
areaStore.storeLogin(res.data)
|
||||
router.push('/storeLogin')
|
||||
|
||||
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
|
@ -231,8 +214,6 @@ globalEventBus.on('header3-3' , data => {
|
|||
background-image: url('/static/index/actbg.png');
|
||||
background-size: 100% 100%;
|
||||
border: none;
|
||||
// border-bottom: 6px solid #BF6D5D
|
||||
// border-bottom: 6px solid #BF6D5D;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<div class="box" :style="{ opacity: showLoading ? 0 : 1 }">
|
||||
<div class="body">
|
||||
<div class="l">
|
||||
<topLeft :areaCodes="areaStore.area" :key="areaStore.area.areaCode" />
|
||||
<topLeft :areaCodes="areaStore.area" :key="areaStore.area.areaCode" />
|
||||
</div>
|
||||
<div class="c" id="">
|
||||
<topCenter :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></topCenter>
|
||||
|
|
@ -38,24 +38,22 @@ import bottomLeft from "@/components/index/bottomLeft.vue"
|
|||
import bottomCenter from "@/components/index/bottomCenter.vue"
|
||||
import bottomRight from "@/components/index/bottomRight.vue"
|
||||
import { areaObj } from '@/store/index.js'
|
||||
import { useRouter } from "vue-router"
|
||||
const router = useRouter()
|
||||
|
||||
|
||||
|
||||
import { useRouter, useRoute } from "vue-router"
|
||||
const route = useRoute()
|
||||
const showLoading = ref(true)
|
||||
const areaStore = areaObj()
|
||||
const areaCodes = reactive({
|
||||
...areaStore.area
|
||||
})
|
||||
console.log(areaCodes,'areacodes')
|
||||
|
||||
setTimeout(() => {
|
||||
showLoading.value = false
|
||||
}, 1000);
|
||||
|
||||
|
||||
}, 500);
|
||||
|
||||
if (route.query?.type) { localStorage.setItem("TRADE_TYPE", true) }
|
||||
else {
|
||||
localStorage.setItem("TRADE_TYPE", false)
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@keyframes jump {
|
||||
|
|
|
|||
|
|
@ -124,24 +124,18 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="bottom">
|
||||
|
||||
<div class="ranking">
|
||||
<img src="/static/storeLogin/SPXSPH.png" class="img-cls" alt="">
|
||||
<dv-scroll-board :config="config1" v-if="config1.data.length" class="list" />
|
||||
|
||||
</div>
|
||||
<div class="ranking">
|
||||
<img src="/static/storeLogin/SPFKPH.png" class="img-cls" alt="">
|
||||
<dv-scroll-board :config="config2" v-if="config2.data.length" class="list" />
|
||||
|
||||
</div>
|
||||
<div class="ranking">
|
||||
<img src="/static/storeLogin/SPJGPH.png" class="img-cls" alt="">
|
||||
<dv-scroll-board :config="config3" v-if="config3.data.length" class="list" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -153,18 +147,12 @@ import { merchant_count_mainApi, merchant_product_rankingApi, merchant_product_v
|
|||
import { areaObj } from "../store";
|
||||
|
||||
const areaStore = areaObj()
|
||||
let query
|
||||
let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'))
|
||||
|
||||
|
||||
|
||||
// console.log
|
||||
|
||||
|
||||
let query;
|
||||
let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'));
|
||||
let storeLogin=JSON.parse(localStorage.getItem('TRAD_STORE_INFO'))
|
||||
|
||||
if (areaStore.userInfo.user?.merchant) {
|
||||
let { area_id, mer_id, street_id } = areaStore.userInfo.user?.merchant
|
||||
|
||||
query = {
|
||||
areaCode: area_id,
|
||||
streetCode: street_id,
|
||||
|
|
@ -181,8 +169,14 @@ if (userInfo.user?.merchant) {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
if(storeLogin?.merchant){
|
||||
let { area_id, mer_id, street_id } =storeLogin.merchant
|
||||
query = {
|
||||
areaCode: area_id,
|
||||
streetCode: street_id,
|
||||
mer_id: mer_id
|
||||
}
|
||||
}
|
||||
|
||||
const config1 = reactive({
|
||||
oddRowBGC: "#001C2E",
|
||||
|
|
@ -289,7 +283,7 @@ const addData1 = (data) => {
|
|||
`<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.cart_info.product.store_name}</div>`,
|
||||
`<div style=' transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:${(item.total / total1) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
|
||||
`<div style=' position: relative;line-height:30px;text-align:center;' >${item.total} <span style='font-size:10px'>单</span>
|
||||
<img src="/static/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
|
||||
<img src="/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
|
||||
</div>`,
|
||||
]
|
||||
)
|
||||
|
|
@ -309,7 +303,7 @@ const addData2 = (data) => {
|
|||
`<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name}</div>`,
|
||||
`<div style=' transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:${(item.total / total2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
|
||||
`<div style=' position: relative;line-height:30px;text-align:center;' >${item.total} <span style='font-size:10px'>人</span>
|
||||
<img src="/static/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
|
||||
<img src="/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
|
||||
</div>`,
|
||||
]
|
||||
)
|
||||
|
|
@ -329,14 +323,11 @@ const addData3 = (data) => {
|
|||
`<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name}</div>`,
|
||||
`<div style=' transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:${(item.total / total3) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
|
||||
`<div style=' position: relative;line-height:30px;text-align:center;' >${item.total} <span style='font-size:10px'>单</span>
|
||||
<img src="/static/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
|
||||
<img src="/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
|
||||
</div>`,
|
||||
]
|
||||
)
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue