This commit is contained in:
quantulr
2022-10-19 00:22:39 +08:00
parent e2da1fd45b
commit 88e3b00298
44 changed files with 1827 additions and 1324 deletions

View File

@ -20,7 +20,7 @@
<div class="b">暂无</div>
</div>
</div>
<div class="rightBox">
<!-- <div class="rightBox">
<div class="head">
<div class="a">领域</div>
<div class="b">需求数量</div>
@ -36,92 +36,65 @@
<div class="a">暂无</div>
<div class="b">暂无</div>
</div>
</div>
</div> -->
</div>
</template>
<script setup>
import { defineComponent, getCurrentInstance, onMounted, reactive } from "vue";
import * as echarts from "echarts";
import {
countDemandByProvince,
countDemandByCity,
countDemandByArea,
} from "@/api/website/home/index";
// import { demand } from "@/api/website/home/index";
const { proxy } = getCurrentInstance();
const loading = shallowRef(true);
let treeData = {
340000: {
code: "340000",
name: "安徽省",
count: 107,
industry: { "1-1": 2, "1-2": 1, "2-1": 3 },
children: {
340100: {
code: "340100",
name: "合肥市",
count: 106,
industry: { "1-1": 1, "1-2": 1, "2-1": 2 },
children: {
340111: {
code: "340111",
name: "包河区",
count: 105,
industry: { "1-1": 1, "2-1": 1 },
children: null,
},
340121: {
code: "340121",
name: "长丰县",
count: 105,
industry: { "1-2": 1, "2-1": 1 },
children: null,
},
},
},
340200: {
code: "340200",
name: "芜湖市",
count: 105,
industry: { "1-1": 1, "2-1": 1 },
children: {},
},
},
},
500000: {
code: "500000",
name: "重庆",
count: 300,
industry: null,
children: {
500100: {
code: "500100",
name: "市辖区",
count: 300,
industry: null,
children: null,
},
},
},
630000: {
code: "630000",
name: "青海省",
count: 1200,
industry: null,
children: {
630200: {
code: "630200",
name: "海东市",
count: 1200,
industry: null,
children: null,
},
},
},
};
const snapTree = shallowRef({});
let treeData = [];
const snapTree = shallowRef([]);
function searchRegionData(code) {
// console.log(code, treeData,'searchRegionData')
return deepFindTree(code, treeData);
}
const searchRegionData = async (code, level) => {
if (level == "province") {
const provcode = code.substring(0, 2) + "0000";
let data = {};
if (
snapTree.value.length &&
snapTree.value[0].code.substring(0, 2) == code.substring(0, 2) &&
snapTree.value[0].code.substring(2, 4) != code.substring(2, 4)
) {
data = snapTree.value;
} else {
const resp = await countDemandByCity(provcode);
snapTree.value = resp.data;
data = resp.data;
}
return data.find((item) => item.code == code) || false;
} else if (level == "city") {
const ctcode = code.substring(0, 4) + "00";
let data = {};
if (
snapTree.value.length &&
snapTree.value[0].code.substring(0, 4) == code.substring(0, 4) &&
snapTree.value[0].code.substring(4, 6) != code.substring(4, 6)
) {
data = snapTree.value;
} else {
const resp = await countDemandByArea(ctcode);
snapTree.value = resp.data;
data = resp.data;
}
return data.find((item) => item.code == code) || false;
} else {
if (treeData.length) {
return treeData.find((item) => item.code == code) || false;
} else {
const { data } = await countDemandByProvince();
return data.find((item) => item.code == code) || false;
}
}
};
function deepFindTree(code, tree) {
let snap = false;
@ -201,13 +174,11 @@ const state = reactive({
onMounted(() => {
// 数据接口
const res = { code: 200, message: "ok", data: {} };
// demand().then((res) => {
// if (200 == res.code) {
treeData = res.data;
snapTree.value = res.data;
loading.value = false;
// }
// });
countDemandByProvince().then((res) => {
treeData = res.data;
snapTree.value = res.data;
loading.value = false;
});
// let echartsDomList = document.querySelectorAll('.echartsDom');
// // 兼容echarts
// echartsDomList.forEach(element => {
@ -249,15 +220,15 @@ onMounted(() => {
function goBack() {
state.isShowGoBack = false;
loading.value = true;
state.district.search("中国", (status, result) => {
state.district.search("中国", async (status, result) => {
if (status == "complete") {
getData(result.districtList[0], "", 100000);
await getData(result.districtList[0], "", 100000);
snapTree.value = treeData;
}
});
}
function echartsMapClick(params) {
async function echartsMapClick(params) {
//地图点击事件
if (params.data.cityCode == "710000") {
return;
@ -267,11 +238,11 @@ function echartsMapClick(params) {
}
if (params.data.level == "street") return; //此处的params.data为state.mapData里的数据
let snap = searchRegionData(params.data.cityCode);
snapTree.value = {};
if (snap) {
snapTree.value = snap["children"];
}
await searchRegionData(params.data.cityCode, params.data.level);
// snapTree.value = {};
// if (snap) {
// snapTree.value = snap["children"];
// }
state.cityCode = params.data.cityCode;
state.cityName = params.data.name;
state.district.setLevel(params.data.level); //行政区级别
@ -291,7 +262,7 @@ function echartsMapClick(params) {
});
}
function getData(data, level, adcode) {
async function getData(data, level, adcode) {
//处理获取出来的边界数据
var subList = data.districtList;
if (subList) {
@ -306,7 +277,7 @@ function getData(data, level, adcode) {
}
}
state.mapData = [];
let item = searchRegionData(cityCode);
let item = await searchRegionData(cityCode, level);
if (item) {
console.log("1 searchRegionData(cityCode)", item);
}
@ -327,7 +298,7 @@ function getData(data, level, adcode) {
var name = subList[i].name;
var cityCode = subList[i].adcode;
//这个mapData里包含每个区域的code、名称、对应的等级实现第三步功能时能用上
let item = searchRegionData(cityCode);
let item = await searchRegionData(cityCode, level);
if (item) {
console.log("2 searchRegionData(cityCode)", item);