This commit is contained in:
weipengfei 2024-02-24 10:11:55 +08:00
commit 6ee2b7bb36
3 changed files with 40 additions and 101 deletions

View File

@ -56,7 +56,7 @@ const handChose = (index) => {
getTownListsFn(options[index].value); getTownListsFn(options[index].value);
sendFn('choserArea', { name: options[index].label, code: options[index].value }) sendFn('choserArea', { name: options[index].label, code: options[index].value })
emit('handArea', options[actIndex.value].label,) emit('handArea', {name:options[actIndex.value].label,code:options[actIndex.value].value},)
} }
const handTown = (index) => { const handTown = (index) => {
@ -68,7 +68,7 @@ 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, code: item.code }) sendFn('choseTown', { name: item.name, code: item.code })
emit('handTown', item.name) emit('handTown', {name:item.name,code:item.code})
} }
}) })
} }

View File

@ -1,28 +1,15 @@
<template> <template>
<!-- <div style="text-align: center;">伤感情</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">
<el-option v-for="item in townOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<button @click="sendFn('back', { name: '泸县' }), townCode = ''">返回首页</button>
<button @click="sendFn('refresh'), townCode = ''">刷新</button>
<button @click="sendFn('choseLand', { landName: item.title,id:item.id })" v-for="item in landList"> {{ item.title }}</button>
<button @click="sendFn('backHome', { name: '泸县' }), townCode = ''">返回首页</button>
<button @click="sendFn('detail', { name: item.title,id:item.id })" v-for="item in landList"> {{ item.title }}</button>
<p>地块</p> -->
<div class="content" v-if="flag"> <div class="content" v-if="flag">
<div class="plant-li" v-for="item in 10"> <div class="plant-li" v-for="item in landList" :key="item.id" @click="handClick(item)">
究极地块 {{ item.title }}
</div> </div>
</div> </div>
<areaChose v-else></areaChose> <areaChose v-else channel="user-plant" @handTown="handTown" @handArea="handArea"></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">{{ area }}</div>
<div class="town">江陽區</div> <div class="town">{{ town }}</div>
</div> </div>
<div class="area-bottom"></div> <div class="area-bottom"></div>
</div> </div>
@ -30,101 +17,54 @@
<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 axios from "axios"
import { landListApi } from "@/api.js" import { landListApi } from "@/api.js"
import areaChose from "../components/areaChose.vue" import areaChose from "../components/areaChose.vue"
const flag = ref(true) const flag = ref(true)
const town = ref("")
const area = ref("泸县")
let areaCode = 0
// const handTown = (e) => {
const options = [ town.value = e.name
{ getLandList(areaCode ,e.code)
value: '510502',
label: '江阳区',
},
{
value: '510503',
label: '纳溪区',
},
{
value: '510504',
label: '龙马潭区',
},
{
value: '510521',
label: '泸县',
},
{
value: '510522',
label: '合江县 ',
},
{
value: '510524',
label: '叙永县 ',
}, {
value: '510525',
label: '古蔺县 ',
},
]
//
const townOptions = []
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 })
}
})
} }
const changeTown = (e) => { const handArea = (e) => {
townOptions.forEach(item => { area.value = e.name
if (item.value == e) { areaCode=e.code
sendFn('choseTown', { name: item.label }) town.value = ''
} getLandList(e.code)
})
getLandList()
}
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
})
})
})
} }
const landList=ref([]) const landList=ref([])
const getLandList = async () => { const getLandList = async (areaCode=510521,streetCode='') => {
let res = await landListApi({ let res = await landListApi({
areaCode: areaCode.value, areaCode,
streetCode: townCode.value streetCode,
}) })
landList.value=res.data.list landList.value=res.data.list
console.log(landList.value)
} }
getLandList()
getTownList() const handClick=(item)=>{
let data={
id:item.id,
landName:item.title,
areaCode:item.county_code,
townCode:item.town_code,
town_name:item.town_name
}
sendMsg({ channel: 'user-plant', event:'choseLand', data })
// sendFn('choseLand', {id:item.id,landName:item.title,townCode:item.town_code} )
}
// //
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: 'user-3', event, data }) sendMsg({ channel: 'user-plant', event, data })
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -140,6 +80,7 @@ const sendFn = (event, data = '') => {
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
overflow-y: auto; overflow-y: auto;
.plant-li { .plant-li {
width: 165.9px; width: 165.9px;
height: 190.48px; height: 190.48px;
@ -181,5 +122,4 @@ const sendFn = (event, data = '') => {
background-size: 100% 100%; background-size: 100% 100%;
transform: translateY(-20px); transform: translateY(-20px);
} }
</style> </style>

View File

@ -31,18 +31,17 @@ const flag = ref(true)
const town=ref("") const town=ref("")
const area=ref("泸县") const area=ref("泸县")
const sendFn = (event, data = '', fn) => { const sendFn = (event, data = '', fn) => {
sendMsg({ channel: 'user-trad', event, data }) sendMsg({ channel: 'user-trad', event, data })
if (fn) eval(fn) if (fn) eval(fn)
} }
const handTown=(e)=>{ const handTown=(e)=>{
town.value=e town.value=e.name
} }
const handArea=(e)=>{ const handArea=(e)=>{
area.value=e area.value=e.name
town.value='' town.value=''
} }
</script> </script>