This commit is contained in:
parent
4428b1af3a
commit
2ad44878a5
17
src/App.vue
17
src/App.vue
|
@ -39,14 +39,24 @@ const back = ()=>{
|
|||
}
|
||||
}
|
||||
|
||||
// 获取 URL 中的查询参数部分
|
||||
const queryString = window.location.search;
|
||||
|
||||
// 解析查询参数字符串
|
||||
const searchParams = new URLSearchParams(queryString);
|
||||
|
||||
// 读取名为 id 的参数
|
||||
const uid = searchParams.get('local') || localStorage.getItem('local');
|
||||
|
||||
if(searchParams.get('local')) localStorage.setItem('local', searchParams.get('local'));
|
||||
|
||||
const connection = new Push({
|
||||
url: 'wss://chat.lihaink.cn/tts', // websocket地址
|
||||
app_key: 'aaea61749929eb53a4bd75a1474c1d27',
|
||||
});
|
||||
// 假设用户uid为1
|
||||
const uid = 5;
|
||||
|
||||
// 浏览器监听user-2频道的消息,也就是用户uid为1的用户消息
|
||||
const user_channel = connection.subscribe('user-breed-datav');
|
||||
const user_channel = connection.subscribe(uid + 'user-breed-datav');
|
||||
|
||||
// 当user-2频道有message事件的消息时
|
||||
user_channel.on('message', function (data) {
|
||||
|
@ -56,7 +66,6 @@ user_channel.on('message', function (data) {
|
|||
if(data.content.event=='back') back();
|
||||
else mitt.emit(data.content.event, data.content.data);
|
||||
|
||||
|
||||
});
|
||||
// 断线事件
|
||||
user_channel.on('close', function () {
|
||||
|
|
|
@ -8,80 +8,83 @@ import axios from "axios";
|
|||
import { getStreet } from "@/api/index.js";
|
||||
import { useAppStore } from "@/store/app.js";
|
||||
import { useUserStore } from "@/store/user.js";
|
||||
import { sendMsg } from "@/api/sendMsg.js"
|
||||
import { sendMsg } from "@/api/sendMsg.js";
|
||||
|
||||
const appStore = useAppStore();
|
||||
const userSotre = useUserStore();
|
||||
|
||||
const reload = inject('reload');
|
||||
const reload = inject("reload");
|
||||
|
||||
const info = reactive({
|
||||
address: '泸县',
|
||||
areaName: '泸县',
|
||||
pinyin: 'luxian'
|
||||
})
|
||||
address: "泸县",
|
||||
areaName: "泸县",
|
||||
pinyin: "luxian",
|
||||
});
|
||||
|
||||
const areaListRef = ref(null);
|
||||
|
||||
// 选择镇
|
||||
const choseArea = ref(null)
|
||||
const choseArea = ref(null);
|
||||
const open = () => {
|
||||
areaListRef.value.show();
|
||||
}
|
||||
};
|
||||
// 关闭
|
||||
const offAreaList = (e) => {
|
||||
Object.keys(e).forEach(key => {
|
||||
Object.keys(e).forEach((key) => {
|
||||
if (e[key]) {
|
||||
info[key] = e[key];
|
||||
}
|
||||
})
|
||||
});
|
||||
info.address = e.name;
|
||||
// mitt.emit('map_info', info);
|
||||
// reload();
|
||||
if(route.query.type=='main') {
|
||||
sendMsg({ channel: 'user-breed-datav', event: 'changMap', data: {
|
||||
areaName: info.areaName,
|
||||
name: e.name
|
||||
}})
|
||||
if (route.query.type == "main") {
|
||||
sendMsg({
|
||||
channel: "user-breed-datav",
|
||||
event: "changMap",
|
||||
data: {
|
||||
areaName: info.areaName,
|
||||
name: e.name,
|
||||
},
|
||||
});
|
||||
} else {
|
||||
router.push({
|
||||
path: '/indexc',
|
||||
path: "/indexc",
|
||||
query: {
|
||||
areaCode: route.query.areaCode,
|
||||
areaCode: route.query.areaCode || appStore.address.areaCode,
|
||||
streetCode: e.code,
|
||||
name: e.name
|
||||
}
|
||||
})
|
||||
name: e.name,
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const navTo = () => {
|
||||
if (route.path == '/') return location.reload();
|
||||
else if(route.path == '/indexc'){
|
||||
if (route.path == "/") return location.reload();
|
||||
else if (route.path == "/indexc") {
|
||||
appStore.setAddress({
|
||||
areaCode: appStore.address.areaCode,
|
||||
streetCode: ''
|
||||
})
|
||||
router.push('/?areaCode='+appStore.address.areaCode);
|
||||
streetCode: "",
|
||||
});
|
||||
router.push("/?areaCode=" + appStore.address.areaCode);
|
||||
let area = appStore.area;
|
||||
let data = area.find(item => item.code == appStore.address.areaCode);
|
||||
let data = area.find((item) => item.code == appStore.address.areaCode);
|
||||
info.areaName = data?.name;
|
||||
info.address = data?.name;
|
||||
}
|
||||
else if(route.path == '/delivery') {
|
||||
} else if (route.path == "/delivery") {
|
||||
router.push({
|
||||
path: '/indexc',
|
||||
path: "/indexc",
|
||||
query: {
|
||||
areaCode: route.query.areaCode,
|
||||
streetCode: route.query.streetCode,
|
||||
name: route.query.name
|
||||
}
|
||||
})
|
||||
name: route.query.name,
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
let nowTime = ref([]);
|
||||
|
||||
|
@ -94,102 +97,130 @@ const updateClock = () => {
|
|||
let m = now.getMonth() + 1;
|
||||
let d = now.getDate();
|
||||
|
||||
nowTime.value[0] = y + '.' + m.toString().padStart(2, '0') + '.' + d.toString().padStart(2, '0');
|
||||
nowTime.value[0] =
|
||||
y +
|
||||
"." +
|
||||
m.toString().padStart(2, "0") +
|
||||
"." +
|
||||
d.toString().padStart(2, "0");
|
||||
|
||||
nowTime.value[1] = hours.toString().padStart(2, '0') + ':' +
|
||||
minutes.toString().padStart(2, '0') + ':' +
|
||||
seconds.toString().padStart(2, '0');
|
||||
}
|
||||
nowTime.value[1] =
|
||||
hours.toString().padStart(2, "0") +
|
||||
":" +
|
||||
minutes.toString().padStart(2, "0") +
|
||||
":" +
|
||||
seconds.toString().padStart(2, "0");
|
||||
};
|
||||
|
||||
const logout = () => {
|
||||
// router.replace('/login')
|
||||
router.push('/login')
|
||||
}
|
||||
router.push("/login");
|
||||
};
|
||||
|
||||
const list = ref([])
|
||||
const initList = async () => {
|
||||
const list = ref([]);
|
||||
const initList = async (re = false) => {
|
||||
let street = appStore.street;
|
||||
if (street?.length == 0) {
|
||||
if (street?.length == 0 || re) {
|
||||
let { data } = await getStreet({
|
||||
area_code: appStore.address.areaCode
|
||||
})
|
||||
area_code: appStore.address.areaCode,
|
||||
});
|
||||
street = data;
|
||||
appStore.setStreet(street);
|
||||
}
|
||||
let area = appStore.area;
|
||||
if (userSotre.userInfo.street_code) {
|
||||
let data = street.find(item => item.code == appStore.address.streetCode);
|
||||
let data = street.find((item) => item.code == appStore.address.streetCode);
|
||||
info.areaName = data?.name;
|
||||
info.address = data?.name;
|
||||
list.value = [];
|
||||
appStore.setAddress({
|
||||
areaCode: appStore.address.areaCode,
|
||||
streetCode: appStore.address.streetCode
|
||||
})
|
||||
streetCode: appStore.address.streetCode,
|
||||
});
|
||||
} else {
|
||||
let data = area.find(item => item.code == appStore.address.areaCode);
|
||||
let data = area.find((item) => item.code == appStore.address.areaCode);
|
||||
info.areaName = data?.name;
|
||||
info.address = data?.name;
|
||||
// list.value = [data, ...street];
|
||||
list.value = street;
|
||||
if (appStore.address.streetCode) {
|
||||
data = street.find(item => item.code == appStore.address.streetCode);
|
||||
data = street.find((item) => item.code == appStore.address.streetCode);
|
||||
info.address = data?.name;
|
||||
}
|
||||
appStore.setAddress({
|
||||
areaCode: appStore.address.areaCode,
|
||||
streetCode: appStore.address.streetCode
|
||||
})
|
||||
streetCode: appStore.address.streetCode,
|
||||
});
|
||||
}
|
||||
mitt.emit('map_info', info);
|
||||
}
|
||||
mitt.emit("map_info", info);
|
||||
};
|
||||
|
||||
const weather = ref("暂无天气信息")
|
||||
const weather = ref("暂无天气信息");
|
||||
const initWeather = (city = 510500) => {
|
||||
axios.get(`https://restapi.amap.com/v3/weather/weatherInfo?city=${city}&key=5731d3b4c3f34e09226e084ce556e259`).then((res) => {
|
||||
if (res.data.status == 1) {
|
||||
weather.value = res.data.lives[0].weather;
|
||||
}
|
||||
}).catch((e) => {
|
||||
console.log(e);
|
||||
})
|
||||
}
|
||||
axios
|
||||
.get(
|
||||
`https://restapi.amap.com/v3/weather/weatherInfo?city=${city}&key=5731d3b4c3f34e09226e084ce556e259`
|
||||
)
|
||||
.then((res) => {
|
||||
if (res.data.status == 1) {
|
||||
weather.value = res.data.lives[0].weather;
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
});
|
||||
};
|
||||
|
||||
// 选择时间
|
||||
const changeTime = (e) => {
|
||||
console.log(e);
|
||||
}
|
||||
};
|
||||
|
||||
mitt.on("choserArea", (data) => {
|
||||
appStore.setAddress({
|
||||
areaCode: data.code,
|
||||
streetCode: "",
|
||||
});
|
||||
initList();
|
||||
initList(true);
|
||||
router.push({
|
||||
path: '/',
|
||||
path: "/",
|
||||
query: {
|
||||
areaCode: data.code,
|
||||
}
|
||||
})
|
||||
areaCode: data.code,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
mitt.on("choseTown", (data) => {
|
||||
let c = list.value.find(item=>item.name==data.name);
|
||||
if(!c)return;
|
||||
let c = list.value.find((item) => item.name == data.name);
|
||||
console.log(list.value, data, c);
|
||||
if (!c) return;
|
||||
appStore.setAddress({
|
||||
areaCode: appStore.address.areaCode,
|
||||
streetCode: c.code,
|
||||
});
|
||||
initList();
|
||||
router.push({
|
||||
path: '/indexc',
|
||||
path: "/indexc",
|
||||
query: {
|
||||
areaCode: appStore.address.areaCode,
|
||||
streetCode: c.code,
|
||||
name: data.name
|
||||
}
|
||||
})
|
||||
name: data.name,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
mitt.on("goFarmDetail", (data) => {
|
||||
router.push({
|
||||
path: "/delivery",
|
||||
query: {
|
||||
areaCode: route.query.areaCode,
|
||||
streetCode: route.query.streetCode,
|
||||
name: route.query.name,
|
||||
id: data.id,
|
||||
farm_name: data.farm_name,
|
||||
address: data.longitude + ',' + data.latitude,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
|
@ -198,8 +229,7 @@ onMounted(() => {
|
|||
areaCode: route.query.areaCode,
|
||||
streetCode: route.query.streetCode || "",
|
||||
});
|
||||
}
|
||||
else if(route.path=='/'){
|
||||
} else if (route.path == "/") {
|
||||
appStore.setAddress({
|
||||
areaCode: appStore.address.areaCode,
|
||||
streetCode: "",
|
||||
|
@ -207,24 +237,24 @@ onMounted(() => {
|
|||
}
|
||||
initList();
|
||||
|
||||
mitt.on('push_to', (e)=>{
|
||||
mitt.on("push_to", (e) => {
|
||||
appStore.setAddress({
|
||||
areaCode: e.areaCode,
|
||||
streetCode: e.streetCode,
|
||||
});
|
||||
initList();
|
||||
info.address = e.name
|
||||
})
|
||||
info.address = e.name;
|
||||
});
|
||||
|
||||
// 每秒钟更新一次时间
|
||||
setInterval(updateClock, 1000);
|
||||
|
||||
initWeather();
|
||||
|
||||
mitt.on('changMap', (e)=>{
|
||||
if(e.areaName==info.areaName){
|
||||
let c = list.value.find(item=>item.name==e.name);
|
||||
if(c) areaListRef.value.choseTownFn(c);
|
||||
|
||||
mitt.on("changMap", (e) => {
|
||||
if (e.areaName == info.areaName) {
|
||||
let c = list.value.find((item) => item.name == e.name);
|
||||
if (c) areaListRef.value.choseTownFn(c);
|
||||
// router.push({
|
||||
// path: '/delivery',
|
||||
// query: {
|
||||
|
@ -232,8 +262,8 @@ onMounted(() => {
|
|||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -249,7 +279,10 @@ onMounted(() => {
|
|||
<img class="icon" src="/src/assets/head_img/icon.png" alt="" />
|
||||
<div class="item">{{ nowTime[1] }}</div>
|
||||
</div>
|
||||
<div class="head-title"><img class="logo" src="/src/assets/head_img/logo.png"/> <span>吟龙养殖溯源系统可视化大屏</span></div>
|
||||
<div class="head-title">
|
||||
<img class="logo" src="/src/assets/head_img/logo.png" />
|
||||
<span>吟龙养殖溯源系统可视化大屏</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="item" @click.stop="open" style="position: relative">
|
||||
<img src="/src/assets/head_img/location.png" alt="" />
|
||||
|
@ -307,11 +340,11 @@ onMounted(() => {
|
|||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.logo{
|
||||
.logo {
|
||||
height: 2.5rem;
|
||||
width: 2.5rem;
|
||||
}
|
||||
span{
|
||||
span {
|
||||
padding-bottom: 0.5rem;
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
|
|
|
@ -547,10 +547,10 @@ onMounted(() => {
|
|||
// name: '福集镇养殖基地',
|
||||
// value: [105.36, 29.20]
|
||||
// }
|
||||
if(route.query.local){
|
||||
if(route.query.address){
|
||||
dataValue[0] = {
|
||||
name: route.query.farm_name,
|
||||
value: route.query.local.split(',')
|
||||
value: route.query.address.split(',')
|
||||
};
|
||||
console.log(dataValue);
|
||||
}
|
||||
|
|
|
@ -14,15 +14,15 @@ const key = ref(Date.now());
|
|||
<div class="center">
|
||||
<div class="item item_c">
|
||||
<div style="height: 61%; display: flex; justify-content: space-between">
|
||||
<leftItme :key="route.query.name+key+'f'" style="width: 35%"></leftItme>
|
||||
<centerItme :key="route.query.name+key+'c'" style="width: 64%"></centerItme>
|
||||
<leftItme :key="route.query.farm_name+key+'f'" style="width: 35%"></leftItme>
|
||||
<centerItme :key="route.query.farm_name+key+'c'" style="width: 64%"></centerItme>
|
||||
</div>
|
||||
<div style="height: 36%">
|
||||
<bottomItme :key="route.query.name+key+'b'" style="width: 100%"></bottomItme>
|
||||
<bottomItme :key="route.query.farm_name+key+'b'" style="width: 100%"></bottomItme>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<rightItme :key="route.query.name+key+'r'" style="height: 98%"></rightItme>
|
||||
<rightItme :key="route.query.farm_name+key+'r'" style="height: 98%"></rightItme>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -501,7 +501,7 @@ const initMap = () => {
|
|||
name: route.query.name,
|
||||
id: params.data.id,
|
||||
farm_name: params.data.name,
|
||||
local: params.data.value.join(',')
|
||||
address: params.data.value.join(',')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue