add
This commit is contained in:
parent
0ec3177837
commit
01b962d963
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div style="text-align: center;" class="head-title">养殖溯源可视化大屏</div>
|
||||
<!-- <el-select v-model="areaCode" class="m-2" @change="changeArea" placeholder="Select" size="large">
|
||||
<!-- <div style="text-align: center;" class="head-title">养殖溯源可视化大屏</div> -->
|
||||
<!-- <el-select v-model="areaCode" class="m-2" @change="changeArea" placeholder="Select" size="large">
|
||||
<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">
|
||||
|
|
@ -15,28 +15,27 @@
|
|||
<button @click="sendFn('back', { name: '泸县' }), townCode = ''">返回首页</button>
|
||||
<button @click="sendFn('more_order')">更多订单</button>
|
||||
</div> -->
|
||||
|
||||
<div style="height: 100vh;">
|
||||
<div class="menu" v-if="flag">
|
||||
<div class="menu-li sy"></div>
|
||||
<div class="menu-li sc"></div>
|
||||
<div class="menu-li sc"></div>
|
||||
<div class="menu-li sc"></div>
|
||||
<div class="menu-li sc"></div>
|
||||
|
||||
<img src="/static/img/tradeScreen/FH.png" @click="router.go(-1)" class="back-btn" alt="">
|
||||
<div class="cont" v-if="flag">
|
||||
<div class="card" v-for="item in 9">
|
||||
<div class="card-tit">
|
||||
究极公司
|
||||
</div>
|
||||
<div v-if="!flag">
|
||||
<areaChose channel="user-breed-datav"></areaChose>
|
||||
<div class="card-cotnet">
|
||||
<div>商户姓名: 为对方</div>
|
||||
<div class="login">查看详情</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="area" @click="flag=!flag">
|
||||
<div class="area-top">
|
||||
<div class="town">江陽區</div>
|
||||
<div class="town">江陽區</div>
|
||||
</div>
|
||||
<div class="area-bottom"></div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<areaChose v-else></areaChose>
|
||||
<div class="area" @click="flag = !flag">
|
||||
<div class="area-top">
|
||||
<div class="town">江陽區</div>
|
||||
<div class="town">江陽區</div>
|
||||
</div>
|
||||
<div class="area-bottom"></div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup scoped>
|
||||
import { ref, reactive } from "vue"
|
||||
|
|
@ -46,38 +45,38 @@ import { vehicleListApi } from "@/api.js"
|
|||
import areaChose from "@/view/components/areaChose.vue"
|
||||
|
||||
const nowPages = ref('index');
|
||||
const flag=ref(true)
|
||||
const flag = ref(true)
|
||||
|
||||
// 镇列表
|
||||
const options = [
|
||||
{
|
||||
value: '510502',
|
||||
label: '江阳区',
|
||||
},
|
||||
{
|
||||
value: '510503',
|
||||
label: '纳溪区',
|
||||
},
|
||||
{
|
||||
value: '510504',
|
||||
label: '龙马潭区',
|
||||
},
|
||||
{
|
||||
value: '510521',
|
||||
label: '泸县',
|
||||
},
|
||||
{
|
||||
value: '510522',
|
||||
label: '合江县 ',
|
||||
},
|
||||
{
|
||||
value: '510524',
|
||||
label: '叙永县 ',
|
||||
},
|
||||
{
|
||||
value: '510525',
|
||||
label: '古蔺县 ',
|
||||
},
|
||||
{
|
||||
value: '510502',
|
||||
label: '江阳区',
|
||||
},
|
||||
{
|
||||
value: '510503',
|
||||
label: '纳溪区',
|
||||
},
|
||||
{
|
||||
value: '510504',
|
||||
label: '龙马潭区',
|
||||
},
|
||||
{
|
||||
value: '510521',
|
||||
label: '泸县',
|
||||
},
|
||||
{
|
||||
value: '510522',
|
||||
label: '合江县 ',
|
||||
},
|
||||
{
|
||||
value: '510524',
|
||||
label: '叙永县 ',
|
||||
},
|
||||
{
|
||||
value: '510525',
|
||||
label: '古蔺县 ',
|
||||
},
|
||||
]
|
||||
// 区列表
|
||||
const townOptions = []
|
||||
|
|
@ -87,71 +86,141 @@ const areaCode = ref('510521')
|
|||
const townCode = ref("")
|
||||
|
||||
const changeArea = (e) => {
|
||||
townCode.value = ''
|
||||
getTownList()
|
||||
options.forEach(item => {
|
||||
if (item.value == e) {
|
||||
sendFn('choserArea', { name: item.label, code: item.value })
|
||||
}
|
||||
})
|
||||
townCode.value = ''
|
||||
getTownList()
|
||||
options.forEach(item => {
|
||||
if (item.value == e) {
|
||||
sendFn('choserArea', { name: item.label, code: item.value })
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const changeTown = (e) => {
|
||||
console.log(e)
|
||||
townOptions.forEach(item => {
|
||||
if (item.value == e) {
|
||||
sendFn('choseTown', { name: item.label })
|
||||
}
|
||||
})
|
||||
console.log(e)
|
||||
townOptions.forEach(item => {
|
||||
if (item.value == e) {
|
||||
sendFn('choseTown', { name: item.label })
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
const getTownList = () => {
|
||||
townOptions.splice(0, 99999999)
|
||||
axios.get(`https://crmeb-test.shop.lihaink.cn/api/city/get_street?area_code=${areaCode.value}`)
|
||||
.then(function (res) {
|
||||
res.data.data.forEach(item => {
|
||||
townOptions.push({
|
||||
value: item.code,
|
||||
label: item.name
|
||||
})
|
||||
})
|
||||
townOptions.splice(0, 99999999)
|
||||
axios.get(`https://crmeb-test.shop.lihaink.cn/api/city/get_street?area_code=${areaCode.value}`)
|
||||
.then(function (res) {
|
||||
res.data.data.forEach(item => {
|
||||
townOptions.push({
|
||||
value: item.code,
|
||||
label: item.name
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const vehicleList=ref([])
|
||||
const vehicleList = ref([])
|
||||
const getLandList = async () => {
|
||||
let res = await vehicleListApi({
|
||||
areaCode: areaCode.value,
|
||||
streetCode: townCode.value
|
||||
})
|
||||
vehicleList.value=res.data.list
|
||||
let res = await vehicleListApi({
|
||||
areaCode: areaCode.value,
|
||||
streetCode: townCode.value
|
||||
})
|
||||
vehicleList.value = res.data.list
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
getTownList()
|
||||
getLandList()
|
||||
// 发送消息
|
||||
const page = ref(1)
|
||||
const sendFn = (event, data = '') => {
|
||||
if (data.page) page.value = data.page;
|
||||
sendMsg({ channel: 'user-breed-datav', event, data })
|
||||
if (data.page) page.value = data.page;
|
||||
sendMsg({ channel: 'user-breed-datav', event, data })
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
button {
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
<style lang="scss">
|
||||
.cont {
|
||||
height: 500px;
|
||||
width: 90vw;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
overflow-y: auto;
|
||||
|
||||
.card {
|
||||
width: 378px;
|
||||
height: 223px;
|
||||
margin-bottom: 10px;
|
||||
background-image: url('/static/img/breedScreen/bg.png');
|
||||
background-size: 100% 100%;
|
||||
font-size: 16px;
|
||||
padding: 10px;
|
||||
color: white;
|
||||
position: relative;
|
||||
|
||||
.card-tit {
|
||||
color: #00D6DD;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.card-cotnet {
|
||||
margin-top: 50px;
|
||||
|
||||
.login {
|
||||
width: 170px;
|
||||
height: 34px;
|
||||
text-align: center;
|
||||
line-height: 34px;
|
||||
background-image: url('/static/img/tradeScreen/DL.png');
|
||||
background-size: 100% 100%;
|
||||
margin-top: 20px;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// background-color: red;
|
||||
}
|
||||
.head-title{
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
padding-top: 5vh;
|
||||
|
||||
.cont::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
background-color: #153041;
|
||||
}
|
||||
|
||||
.cont::-webkit-scrollbar-track {
|
||||
background-color: #153041;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #084D89;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.back-btn {
|
||||
width: 86.21px;
|
||||
height: 31px;
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
left: 60.96px;
|
||||
z-index: 9;
|
||||
|
||||
}
|
||||
|
||||
.area {
|
||||
position: absolute;
|
||||
font-size: 20px;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
</div>
|
||||
<div class="menu-li ylsq" @click="navgo('plantScreen')">
|
||||
</div>
|
||||
<div class="menu-li ylyz" @click="navgo('plantScreen')">
|
||||
<div class="menu-li ylyz" @click="navgo('breedScreen')">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div class="card" v-for="item in 9">
|
||||
<div class="card-tit">
|
||||
究极公司
|
||||
<span style="font-size: 16px;">2024-01-21</span>
|
||||
<span style="font-size: 16px;color: white;">2024-01-21</span>
|
||||
</div>
|
||||
<div class="card-cotnet">
|
||||
<div>商户姓名: 为对方</div>
|
||||
|
|
@ -52,6 +52,7 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.card-cotnet{
|
||||
margin-top: 25px;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Loading…
Reference in New Issue