zmj
/
screenControl
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add

This commit is contained in:
zmj 2024-02-23 17:18:22 +08:00
parent 7302eb9862
commit 75cb11ae5c
4 changed files with 103 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/api.js
View File

@ -20,7 +20,7 @@ const instacnePlant = axios.create({
const instacneTrade = axios.create({ const instacneTrade = axios.create({
baseURL: "http://192.168.1.24:8686/index", baseURL: "https://shop.lihaink.cn",
timeout: 30000, timeout: 30000,
}); });
@ -98,6 +98,10 @@ export function breedFarmCount(params) {
return instacneBreed.get('/api/dataview.farm/farmCount', { params }) return instacneBreed.get('/api/dataview.farm/farmCount', { params })
} }
// 交易数据大屏获取商户列表
export function merchant_listApi(params) {
return instacneTrade.get('/api/dataview/merchant_list', { params })
}
// //
//api/dataview/merchant?mer_id=36&areaCode=510524&streetCode=510524100 //api/dataview/merchant?mer_id=36&areaCode=510524&streetCode=510524100
// } // }

68
src/view/components/areaChose.vue
View File

@ -1,11 +1,13 @@
<template> <template>
<div class="areacontent"> <div class="areacontent">
<div class="area-list"> <div class="area-list">
<div v-for="(item, index) in options" :key="index" :class="{ act: actIndex == index }" @click="handChose(index)"> {{ <div v-for="(item, index) in options" :key="index" :class="{ act: actIndex == index }"
item.label }} </div> @click="handChose(index)"> {{
item.label }} </div>
</div> </div>
<div class="town-list"> <div class="town-list">
<div class="town-list-li" v-for="(item,index) in townLists" :key="index" @click="handTown(index)">{{ item.name }}</div> <div class="town-list-li" v-for="(item, index) in townLists" :key="index" @click="handTown(index)">{{ item.name
}}</div>
</div> </div>
</div> </div>
</template> </template>
@ -15,6 +17,10 @@ import { apigetTownLists } from "@/api.js"
import { sendMsg } from "@/api.js" import { sendMsg } from "@/api.js"
// 镇列表 // 镇列表
const options = reactive([ const options = reactive([
{
value: '510521',
label: '泸县',
},
{ {
value: '510502', value: '510502',
label: '江阳区', label: '江阳区',
@ -27,10 +33,6 @@ const options = reactive([
value: '510504', value: '510504',
label: '龙马潭区', label: '龙马潭区',
}, },
{
value: '510521',
label: '泸县',
},
{ {
value: '510522', value: '510522',
label: '合江县 ', label: '合江县 ',
@ -52,15 +54,11 @@ const emit = defineEmits(['handTown', 'handArea'])
const handChose = (index) => { const handChose = (index) => {
actIndex.value = index; actIndex.value = index;
getTownListsFn(options[index].value); getTownListsFn(options[index].value);
options.forEach(item => { sendFn('choserArea', { name: options[index].label, code: options[index].value })
if (item.value == options[index].value) { emit('handArea', options[actIndex.value].value,)
sendFn('choserArea', { name: item.label, code: item.value })
emit('handArea', options[actIndex.value].value,)
}
})
} }
const handTown = (index)=>{ const handTown = (index) => {
console.log(townLists.value[index]); console.log(townLists.value[index]);
// townLists.value.forEach(item => { // townLists.value.forEach(item => {
// if (item.value == townLists[index].value) { // if (item.value == townLists[index].value) {
@ -68,10 +66,10 @@ const handTown = (index)=>{
// } // }
// }) // })
townLists.value.forEach(item => { townLists.value.forEach(item => {
if (item.code == townLists.value[index].code) { if (item.code == townLists.value[index].code) {
sendFn('choseTown', { name: item.name }) sendFn('choseTown', { name: item.name, code: item.code })
emit('handTown', options[actIndex.value].value, item.code) emit('handTown', options[actIndex.value].value, item.code)
} }
}) })
} }
@ -85,14 +83,14 @@ getTownListsFn()
const props = defineProps({ const props = defineProps({
channel: { channel: {
type: String, type: String,
default: ()=>'user-3' default: () => 'user-3'
} }
}) })
// 发送消息 // 发送消息
const page = ref(1) const page = ref(1)
const sendFn = (event, data = '') => { const sendFn = (event, data = '') => {
if (data.page) page.value = data.page; if (data.page) page.value = data.page;
sendMsg({ channel: props.channel, event, data }) sendMsg({ channel: props.channel, event, data })
} }
</script> </script>
@ -119,7 +117,7 @@ const sendFn = (event, data = '') => {
color: #9AADC4; color: #9AADC4;
font-family: FZCYJ; font-family: FZCYJ;
cursor: pointer; cursor: pointer;
padding:0 80px; padding: 0 80px;
} }
@ -138,7 +136,8 @@ const sendFn = (event, data = '') => {
justify-content: space-between; justify-content: space-between;
margin-top: 40px; margin-top: 40px;
padding: 0 50px; padding: 0 50px;
.town-list-li{
.town-list-li {
font-size: 18px; font-size: 18px;
color: #E4EFF5; color: #E4EFF5;
background-image: url('/static/img/area/townbg.png'); background-image: url('/static/img/area/townbg.png');
@ -153,17 +152,18 @@ const sendFn = (event, data = '') => {
} }
.town-list::-webkit-scrollbar { .town-list::-webkit-scrollbar {
width: 10px; width: 10px;
background-color: #153041; background-color: #153041;
} }
.town-list::-webkit-scrollbar-track { .town-list::-webkit-scrollbar-track {
background-color: #153041; background-color: #153041;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background-color: #084D89; background-color: #084D89;
border-radius: 5px; border-radius: 5px;
}
} }
}</style> </style>

88
src/view/tradeScreen/index.vue
View File

@ -1,78 +1,37 @@
<template> <template>
<img src="/static/img/tradeScreen/FH.png" @click="router.go(-1)" class="back-btn" alt=""> <img src="/static/img/tradeScreen/FH.png" @click="router.go(-1)" class="back-btn" alt="">
<div style="height: 100vh;"> <div style="height: 100vh;">
<div class="tradmenu" v-if="flag"> <div class="tradmenu" v-if="flag">
<div class="tradmenu-li sy"></div> <div class="tradmenu-li sy" @click="sendFn('header1')"></div>
<div class="tradmenu-li sc"></div> <div class="tradmenu-li sc" @click="sendFn('header2')"></div>
<div class="tradmenu-li sh" @click="router.push('/storeLogin')"></div> <div class="tradmenu-li sh" @click="sendFn('header3', '', `router.push('/storeLogin')`)"></div>
<div class="tradmenu-li dd"></div> <div class="tradmenu-li dd" @click="sendFn('header4')"></div>
<div class="tradmenu-li cw"></div> <div class="tradmenu-li cw" @click="sendFn('header5')"></div>
</div>
<div v-else>
<areaChose></areaChose>
</div>
</div> </div>
<div class="area" @click="flag=!flag"> <div v-else>
<div class="area-top"> <areaChose channel="user-trad"></areaChose>
<div class="town">江陽區</div>
<div class="town">江陽區</div>
</div>
<div class="area-bottom"></div>
</div> </div>
<!-- <div style="text-align: center;">数据之眼可视化大屏</div> </div>
<div> <div class="area" @click="flag = !flag">
<button @click="sendFn('header1', { page: 1 })">首页</button> <div class="area-top">
<button @click="sendFn('header2', { page: 2 })">商品</button> <div class="town">泸县</div>
<button @click="sendFn('header3', { page: 3 })">商户</button> <div class="town"></div>
<button @click="sendFn('header4', { page: 4 })">订单</button> </div>
<button @click="sendFn('header5', { page: 5 })">财务</button> <div class="area-bottom"></div>
<el-select v-model="areaCode" class="m-2" @change="changeArea" placeholder="Select" size="large"> </div>
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-select v-model="townCode" class="m-2" @change="changeTown" placeholder="Select" size="large">
<el-option v-for="item in townOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<div v-if="page == 1">
</div> -->
</template> </template>
<script setup scoped> <script setup scoped>
import { ref, reactive } from "vue" import { ref, reactive } from "vue"
import { sendMsg } from "@/api.js" import { sendMsg } from "@/api.js"
import areaChose from "@/view/components/areaChose.vue" import areaChose from "@/view/components/areaChose.vue"
import {useRouter} from "vue-router" import { useRouter } from "vue-router"
const router =useRouter() const router = useRouter()
const flag=ref(true) const flag = ref(true)
const sendFn = (event, data = '', fn) => {
// const changeArea = (e) => { sendMsg({ channel: 'user-trad', event, data })
// getTownList() if (fn) eval(fn)
// options.forEach(item => {
// if (item.value == e) {
// sendFn('choserArea', { name: item.label, code: item.value })
// }
// })
// }
// const changeTown = (e) => {
// townOptions.forEach(item => {
// if (item.value == e) {
// sendFn('header7', { id: item.value, name: item.label })
// // sendFn('choseTown', { name: item.label })
// }
// })
// }
const page = ref(1)
const sendFn = (event, data = '') => {
if (data.page) page.value = data.page;
sendMsg({ channel: 'user-2', event, data })
} }
</script> </script>
@ -100,14 +59,17 @@ const sendFn = (event, data = '') => {
background-image: url('/static/img/tradeScreen/SC.png'); background-image: url('/static/img/tradeScreen/SC.png');
} }
.sh { .sh {
background-image: url('/static/img/tradeScreen/SH.png'); background-image: url('/static/img/tradeScreen/SH.png');
} }
.dd { .dd {
background-image: url('/static/img/tradeScreen/DD.png'); background-image: url('/static/img/tradeScreen/DD.png');
} }
.cw { .cw {
background-image: url('/static/img/tradeScreen/CW.png'); background-image: url('/static/img/tradeScreen/CW.png');

52
src/view/tradeScreen/storeLogin.vue
View File

@ -1,21 +1,21 @@
<template> <template>
<img src="/static/img/tradeScreen/FH.png" @click="router.go(-1)" class="back-btn" alt=""> <img src="/static/img/tradeScreen/FH.png" @click="router.go(-1)" class="back-btn" alt="">
<div class="cont" v-if="flag"> <div class="cont" v-if="flag">
<div class="card" v-for="item in 9"> <div class="card" v-for="item in merchant_list" :key="item.id">
<div class="card-tit"> <div class="card-tit">
究极公司 {{ item.mer_name }}
<span style="font-size: 14px;color: white;">2024-01-21</span> <span style="font-size: 14px;color: white;">{{ item.create_time.substring(0,10) }}</span>
</div> </div>
<div class="card-cotnet"> <div class="card-cotnet">
<div>商户姓名: 为对方</div> <div>商户姓名: {{ item.real_name }}</div>
<div style="margin: 20px 0;">商户属地: 为对方</div> <div style="margin: 20px 0;">商户属地: {{ item.mer_address }}</div>
<div>商户分类: 为对方</div> <div>商户分类: {{ item.merchantCategory?.category_name }}</div>
<div class="login">登录</div> <div class="login" @click="sendFn('header3-3',{id:item.mer_id})">登录</div>
</div> </div>
</div> </div>
</div> </div>
<areaChose v-else></areaChose> <areaChose v-else></areaChose>
<div class="area" @click="flag=!flag"> <div class="area" @click="flag = !flag">
<div class="area-top"> <div class="area-top">
<div class="town">江陽區</div> <div class="town">江陽區</div>
<div class="town">江陽區</div> <div class="town">江陽區</div>
@ -54,9 +54,11 @@
align-items: center; align-items: center;
margin-top: 10px; margin-top: 10px;
} }
.card-cotnet{
.card-cotnet {
margin-top: 25px; margin-top: 25px;
.login{
.login {
margin: 0 auto; margin: 0 auto;
width: 170px; width: 170px;
height: 34px; height: 34px;
@ -132,11 +134,33 @@
} }
</style> </style>
<script setup > <script setup >
import {useRouter} from "vue-router" import { useRouter } from "vue-router"
import {ref,reactive} from "vue" import { ref, reactive } from "vue"
import areaChose from "../components/areaChose.vue"; import areaChose from "../components/areaChose.vue";
import { merchant_listApi } from "@/api.js"
import { sendMsg } from "@/api.js"
const router=useRouter() const router = useRouter()
const flag=ref(true) const flag = ref(true)
const merchant_list =ref([])
const getmerchant_list = async () => {
let res = await merchant_listApi({
areaCode: 510521,
status: 1,
limit: 50
})
merchant_list.value=res.data.list
console.log(merchant_list.value)
}
const sendFn = (event, data = '') => {
sendMsg({ channel: 'user-trad', event, data })
}
const handLogin=(id)=>{
}
getmerchant_list()
</script> </script>