Commit 3f7c8c2158276d23812942be4fe2c80344cd115e

Authored by xp.Huang
2 parents 410df39a b9f88a0f

Merge branch 'ft' into 'main_dev'

fix(src/packages): 图表地图 点击切换 标点还存在

See merge request yunteng/thingskit-view!120
@@ -64,6 +64,17 @@ const onHandleSelectCity = async (value: number) => { @@ -64,6 +64,17 @@ const onHandleSelectCity = async (value: number) => {
64 const onHandleSubmit = () => { 64 const onHandleSubmit = () => {
65 emits('submit', selectValues) 65 emits('submit', selectValues)
66 } 66 }
  67 +const resetValue = () => {
  68 + selectValues.provinceValue = 'china'
  69 + selectValues.cityValue = null
  70 + selectValues.countyValue = null
  71 + selectValues.levelStr = areaEnum.COUNTRY
  72 + selectOptions.cityOptions = []
  73 + selectOptions.countryOptions = []
  74 +}
  75 +defineExpose({
  76 + resetValue
  77 +})
67 </script> 78 </script>
68 79
69 <template> 80 <template>
@@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
4 <CollapseItem name="地图" :expanded="true"> 4 <CollapseItem name="地图" :expanded="true">
5 <SettingItemBox name="开启下钻"> 5 <SettingItemBox name="开启下钻">
6 <SettingItem name=""> 6 <SettingItem name="">
7 - <n-switch v-model:value="optionData.drillingIn" size="small"></n-switch> 7 + <n-switch @change="handleChangeDrillingIn" v-model:value="optionData.drillingIn" size="small"></n-switch>
8 </SettingItem> 8 </SettingItem>
9 </SettingItemBox> 9 </SettingItemBox>
10 <SettingItemBox name="返回图标"> 10 <SettingItemBox name="返回图标">
@@ -35,7 +35,12 @@ @@ -35,7 +35,12 @@
35 ></n-input-number> 35 ></n-input-number>
36 </SettingItem> 36 </SettingItem>
37 </SettingItemBox> 37 </SettingItemBox>
38 - <SelectCity :optionData="optionData" :drillingIn="optionData.drillingIn" @submit="onHandleSelectValues" /> 38 + <SelectCity
  39 + ref="SelectCityRef"
  40 + :optionData="optionData"
  41 + :drillingIn="optionData.drillingIn"
  42 + @submit="onHandleSelectValues"
  43 + />
39 <SettingItemBox name="颜色"> 44 <SettingItemBox name="颜色">
40 <SettingItem name="区域颜色"> 45 <SettingItem name="区域颜色">
41 <n-color-picker size="small" :modes="['hex']" v-model:value="seriesList[0].itemStyle.color"></n-color-picker> 46 <n-color-picker size="small" :modes="['hex']" v-model:value="seriesList[0].itemStyle.color"></n-color-picker>
@@ -181,6 +186,8 @@ const symbolOption = ref([ @@ -181,6 +186,8 @@ const symbolOption = ref([
181 } 186 }
182 ]) 187 ])
183 188
  189 +const SelectCityRef = ref<typeof SelectCity>()
  190 +
184 const onHandleSelectValues = (values: any) => { 191 const onHandleSelectValues = (values: any) => {
185 const { cityValue, countyValue, provinceValue } = values 192 const { cityValue, countyValue, provinceValue } = values
186 props.optionData.mapRegion.saveSelect = values 193 props.optionData.mapRegion.saveSelect = values
@@ -192,4 +199,8 @@ const onHandleSelectValues = (values: any) => { @@ -192,4 +199,8 @@ const onHandleSelectValues = (values: any) => {
192 ? 'china' 199 ? 'china'
193 : provinceValue 200 : provinceValue
194 } 201 }
  202 +
  203 +const handleChangeDrillingIn = () => {
  204 + SelectCityRef.value?.resetValue()
  205 +}
195 </script> 206 </script>
@@ -64,6 +64,18 @@ const onHandleSelectCity = async (value: number) => { @@ -64,6 +64,18 @@ const onHandleSelectCity = async (value: number) => {
64 const onHandleSubmit = () => { 64 const onHandleSubmit = () => {
65 emits('submit', selectValues) 65 emits('submit', selectValues)
66 } 66 }
  67 +
  68 +const resetValue = () => {
  69 + selectValues.provinceValue = 'china'
  70 + selectValues.cityValue = null
  71 + selectValues.countyValue = null
  72 + selectValues.levelStr = areaEnum.COUNTRY
  73 + selectOptions.cityOptions = []
  74 + selectOptions.countryOptions = []
  75 +}
  76 +defineExpose({
  77 + resetValue
  78 +})
67 </script> 79 </script>
68 80
69 <template> 81 <template>
@@ -3,7 +3,7 @@ import { OverrideMapBaseConfig } from './index' @@ -3,7 +3,7 @@ import { OverrideMapBaseConfig } from './index'
3 import { chartInitConfig } from '@/settings/designSetting' 3 import { chartInitConfig } from '@/settings/designSetting'
4 import { CreateComponentType } from '@/packages/index.d' 4 import { CreateComponentType } from '@/packages/index.d'
5 import cloneDeep from 'lodash/cloneDeep' 5 import cloneDeep from 'lodash/cloneDeep'
6 -import dataJson from './data.json' 6 +// import dataJson from './data.json'
7 7
8 //省市区枚举 8 //省市区枚举
9 export const enum areaEnum { 9 export const enum areaEnum {
@@ -21,7 +21,7 @@ export const option = { @@ -21,7 +21,7 @@ export const option = {
21 iconDistanceRight: 20, 21 iconDistanceRight: 20,
22 iconDistanceTop: 20, 22 iconDistanceTop: 20,
23 drillingIn: false, 23 drillingIn: false,
24 - dataset: dataJson, 24 + // dataset: dataJson,
25 mapRegion: { 25 mapRegion: {
26 adcode: 'china', 26 adcode: 'china',
27 showHainanIsLands: true, 27 showHainanIsLands: true,
@@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
4 <CollapseItem name="地图" :expanded="true"> 4 <CollapseItem name="地图" :expanded="true">
5 <SettingItemBox name="开启下钻"> 5 <SettingItemBox name="开启下钻">
6 <SettingItem name=""> 6 <SettingItem name="">
7 - <n-switch v-model:value="optionData.drillingIn" size="small"></n-switch> 7 + <n-switch @change="handleChangeDrillingIn" v-model:value="optionData.drillingIn" size="small"></n-switch>
8 </SettingItem> 8 </SettingItem>
9 </SettingItemBox> 9 </SettingItemBox>
10 <SettingItemBox name="返回图标"> 10 <SettingItemBox name="返回图标">
@@ -14,11 +14,7 @@ @@ -14,11 +14,7 @@
14 </SettingItemBox> 14 </SettingItemBox>
15 <SettingItemBox name="图标颜色"> 15 <SettingItemBox name="图标颜色">
16 <SettingItem name=""> 16 <SettingItem name="">
17 - <n-color-picker  
18 - size="small"  
19 - :modes="['hex']"  
20 - v-model:value="optionData.iconColor"  
21 - ></n-color-picker> 17 + <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.iconColor"></n-color-picker>
22 </SettingItem> 18 </SettingItem>
23 </SettingItemBox> 19 </SettingItemBox>
24 <SettingItemBox name="图标距离"> 20 <SettingItemBox name="图标距离">
@@ -39,7 +35,12 @@ @@ -39,7 +35,12 @@
39 ></n-input-number> 35 ></n-input-number>
40 </SettingItem> 36 </SettingItem>
41 </SettingItemBox> 37 </SettingItemBox>
42 - <SelectCity :optionData="optionData" :drillingIn="optionData.drillingIn" @submit="onHandleSelectValues" /> 38 + <SelectCity
  39 + ref="SelectCityRef"
  40 + :optionData="optionData"
  41 + :drillingIn="optionData.drillingIn"
  42 + @submit="onHandleSelectValues"
  43 + />
43 <SettingItemBox name="区域颜色"> 44 <SettingItemBox name="区域颜色">
44 <SettingItem name="0%处颜色"> 45 <SettingItem name="0%处颜色">
45 <n-color-picker 46 <n-color-picker
@@ -281,6 +282,8 @@ const props = defineProps({ @@ -281,6 +282,8 @@ const props = defineProps({
281 } 282 }
282 }) 283 })
283 284
  285 +const SelectCityRef = ref<typeof SelectCity>()
  286 +
284 const initMapRegionOptions = () => { 287 const initMapRegionOptions = () => {
285 mapChinaJson.features.forEach((element: any) => { 288 mapChinaJson.features.forEach((element: any) => {
286 if (element.properties.name) { 289 if (element.properties.name) {
@@ -309,4 +312,8 @@ const onHandleSelectValues = (values: any) => { @@ -309,4 +312,8 @@ const onHandleSelectValues = (values: any) => {
309 ? 'china' 312 ? 'china'
310 : provinceValue 313 : provinceValue
311 } 314 }
  315 +
  316 +const handleChangeDrillingIn = () => {
  317 + SelectCityRef.value?.resetValue()
  318 +}
312 </script> 319 </script>
@@ -7,6 +7,7 @@ @@ -7,6 +7,7 @@
7 :option="option.value" 7 :option="option.value"
8 :manual-update="isPreview()" 8 :manual-update="isPreview()"
9 :loading="loading" 9 :loading="loading"
  10 + :loadingOptions="{ maskColor: '#18181C', text: '加载中', textColor: 'white' }"
10 autoresize 11 autoresize
11 > 12 >
12 </v-chart> 13 </v-chart>
@@ -142,6 +143,7 @@ const getGeojson = async (regionId: any) => { @@ -142,6 +143,7 @@ const getGeojson = async (regionId: any) => {
142 ) 143 )
143 const { geoJson, name, code, level } = data 144 const { geoJson, name, code, level } = data
144 const geoJsonFile = JSON.parse(geoJson) 145 const geoJsonFile = JSON.parse(geoJson)
  146 + if (!geoJsonFile) return
145 saveGeojson.value = geoJsonFile 147 saveGeojson.value = geoJsonFile
146 registerMap(level === areaEnum.COUNTRY ? name : code, { geoJSON: geoJsonFile as any, specialAreas: {} }) 148 registerMap(level === areaEnum.COUNTRY ? name : code, { geoJSON: geoJsonFile as any, specialAreas: {} })
147 loading.value = false 149 loading.value = false
@@ -199,16 +201,16 @@ const hainanLandsHandle = async (newData: boolean) => { @@ -199,16 +201,16 @@ const hainanLandsHandle = async (newData: boolean) => {
199 } 201 }
200 202
201 //监听 dataset 数据发生变化 203 //监听 dataset 数据发生变化
202 -watch(  
203 - () => props.chartConfig.option.dataset,  
204 - newData => {  
205 - dataSetHandle(newData)  
206 - },  
207 - {  
208 - immediate: true,  
209 - deep: false  
210 - }  
211 -) 204 +// watch(
  205 +// () => props.chartConfig.option.dataset,
  206 +// newData => {
  207 +// dataSetHandle(newData)
  208 +// },
  209 +// {
  210 +// immediate: true,
  211 +// deep: false
  212 +// }
  213 +// )
212 214
213 //监听是否显示南海群岛 215 //监听是否显示南海群岛
214 watch( 216 watch(
@@ -7,28 +7,46 @@ @@ -7,28 +7,46 @@
7 <collapse-item name="时间配置" :expanded="true"> 7 <collapse-item name="时间配置" :expanded="true">
8 <setting-item-box name="快捷选择"> 8 <setting-item-box name="快捷选择">
9 <setting-item name="日期"> 9 <setting-item name="日期">
10 - <n-select clearable @change="shortCutSelect" v-model:value="optionData.shortcut" size="small" :options="intervalOption" /> 10 + <n-select
  11 + clearable
  12 + @change="shortCutSelect"
  13 + v-model:value="optionData.shortcut"
  14 + size="small"
  15 + :options="intervalOption"
  16 + />
11 </setting-item> 17 </setting-item>
12 </setting-item-box> 18 </setting-item-box>
13 <setting-item-box name="基础"> 19 <setting-item-box name="基础">
14 <setting-item name="类型"> 20 <setting-item name="类型">
15 - <n-select v-model:value="optionData.componentInteractEventKey" size="small" :options="datePickerTypeOptions"  
16 - @update:value="datePickerTypeUpdate"/> 21 + <n-select
  22 + v-model:value="optionData.componentInteractEventKey"
  23 + size="small"
  24 + :options="datePickerTypeOptions"
  25 + @update:value="datePickerTypeUpdate"
  26 + />
17 </setting-item> 27 </setting-item>
18 </setting-item-box> 28 </setting-item-box>
19 <setting-item-box name="默认值"> 29 <setting-item-box name="默认值">
20 <setting-item name="类型"> 30 <setting-item name="类型">
21 - <n-select v-model:value="optionData.defaultType" size="small" :options="defaultTypeOptions"  
22 - @update:value="defaultTypeUpdate" /> 31 + <n-select
  32 + v-model:value="optionData.defaultType"
  33 + size="small"
  34 + :options="defaultTypeOptions"
  35 + @update:value="defaultTypeUpdate"
  36 + />
23 </setting-item> 37 </setting-item>
24 -  
25 </setting-item-box> 38 </setting-item-box>
26 <setting-item-box v-if="optionData.defaultType === DefaultTypeEnum.STATIC" :alone="true"> 39 <setting-item-box v-if="optionData.defaultType === DefaultTypeEnum.STATIC" :alone="true">
27 <setting-item name="静态默认值"> 40 <setting-item name="静态默认值">
28 - <n-date-picker size="small" clearable v-model:value="optionData.dataset" :type="optionData.componentInteractEventKey" /> 41 + <n-date-picker
  42 + size="small"
  43 + clearable
  44 + v-model:value="optionData.dataset"
  45 + :type="optionData.componentInteractEventKey"
  46 + />
29 </setting-item> 47 </setting-item>
30 </setting-item-box> 48 </setting-item-box>
31 - <setting-item-box v-if="optionData.defaultType === DefaultTypeEnum.DYNAMIC" > 49 + <setting-item-box v-if="optionData.defaultType === DefaultTypeEnum.DYNAMIC">
32 <template #name> 50 <template #name>
33 <n-text></n-text> 51 <n-text></n-text>
34 <n-tooltip trigger="hover"> 52 <n-tooltip trigger="hover">
@@ -43,7 +61,7 @@ @@ -43,7 +61,7 @@
43 <setting-item :name="differValueName"> 61 <setting-item :name="differValueName">
44 <n-input-number v-model:value="optionData.differValue[0]" class="input-num-width" size="small"> 62 <n-input-number v-model:value="optionData.differValue[0]" class="input-num-width" size="small">
45 <template #suffix> 63 <template #suffix>
46 - {{DifferUnitObject[optionData.differUnit[0]]}} 64 + {{ DifferUnitObject[optionData.differUnit[0]] }}
47 </template> 65 </template>
48 </n-input-number> 66 </n-input-number>
49 </setting-item> 67 </setting-item>
@@ -53,7 +71,7 @@ @@ -53,7 +71,7 @@
53 <setting-item v-if="isRange" name="结束值动态偏移量"> 71 <setting-item v-if="isRange" name="结束值动态偏移量">
54 <n-input-number v-model:value="optionData.differValue[1]" class="input-num-width" size="small"> 72 <n-input-number v-model:value="optionData.differValue[1]" class="input-num-width" size="small">
55 <template #suffix> 73 <template #suffix>
56 - {{DifferUnitObject[optionData.differUnit[1]]}} 74 + {{ DifferUnitObject[optionData.differUnit[1]] }}
57 </template> 75 </template>
58 </n-input-number> 76 </n-input-number>
59 </setting-item> 77 </setting-item>
@@ -61,18 +79,17 @@ @@ -61,18 +79,17 @@
61 <n-select v-model:value="optionData.differUnit[1]" size="small" :options="differUnitOptions" /> 79 <n-select v-model:value="optionData.differUnit[1]" size="small" :options="differUnitOptions" />
62 </setting-item> 80 </setting-item>
63 </setting-item-box> 81 </setting-item-box>
64 -  
65 </collapse-item> 82 </collapse-item>
66 </template> 83 </template>
67 84
68 <script lang="ts" setup> 85 <script lang="ts" setup>
69 -import { PropType,computed } from 'vue' 86 +import { PropType, computed, ref } from 'vue'
70 import { icon } from '@/plugins' 87 import { icon } from '@/plugins'
71 import { CollapseItem, SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting' 88 import { CollapseItem, SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting'
72 import { option } from './config' 89 import { option } from './config'
73 import { intervalOption } from './shortcutTime' 90 import { intervalOption } from './shortcutTime'
74 import { ComponentInteractEventEnum, DefaultTypeEnum, DifferUnitEnum, DifferUnitObject } from './interact' 91 import { ComponentInteractEventEnum, DefaultTypeEnum, DifferUnitEnum, DifferUnitObject } from './interact'
75 -import dayjs from "dayjs"; 92 +import dayjs from 'dayjs'
76 93
77 const { HelpOutlineIcon } = icon.ionicons5 94 const { HelpOutlineIcon } = icon.ionicons5
78 95
@@ -152,7 +169,6 @@ const defaultTypeOptions = [ @@ -152,7 +169,6 @@ const defaultTypeOptions = [
152 } 169 }
153 ] 170 ]
154 171
155 -  
156 const differUnitOptions = [ 172 const differUnitOptions = [
157 // ManipulateType 173 // ManipulateType
158 { 174 {
@@ -193,7 +209,6 @@ const differUnitOptions = [ @@ -193,7 +209,6 @@ const differUnitOptions = [
193 } 209 }
194 ] 210 ]
195 211
196 -  
197 const isRange = computed(() => { 212 const isRange = computed(() => {
198 return props.optionData.componentInteractEventKey.endsWith('range') 213 return props.optionData.componentInteractEventKey.endsWith('range')
199 }) 214 })
@@ -206,8 +221,13 @@ const differUnitName = computed(() => { @@ -206,8 +221,13 @@ const differUnitName = computed(() => {
206 return isRange.value ? '开始值偏移单位' : '偏移单位' 221 return isRange.value ? '开始值偏移单位' : '偏移单位'
207 }) 222 })
208 223
  224 +const startTs = ref(0)
  225 +const endTs = ref(0)
  226 +
209 const datePickerTypeUpdate = () => { 227 const datePickerTypeUpdate = () => {
210 - props.optionData.dataset = isRange.value ? [dayjs().valueOf(), dayjs().valueOf()] : [dayjs().valueOf()] 228 + props.optionData.dataset = isRange.value
  229 + ? [startTs.value ? startTs.value : dayjs().valueOf(), endTs.value ? endTs.value : dayjs().valueOf()]
  230 + : [dayjs().valueOf()]
211 } 231 }
212 232
213 const defaultTypeUpdate = (v: string) => { 233 const defaultTypeUpdate = (v: string) => {
@@ -220,9 +240,9 @@ const defaultTypeUpdate = (v: string) => { @@ -220,9 +240,9 @@ const defaultTypeUpdate = (v: string) => {
220 } 240 }
221 241
222 const shortCutSelect = (value: number) => { 242 const shortCutSelect = (value: number) => {
223 - const startTs = Date.now() - value  
224 - const endTs = Date.now()  
225 - props.optionData.dataset = [startTs, endTs] as any 243 + startTs.value = Date.now() - value
  244 + endTs.value = Date.now()
  245 + props.optionData.dataset = [startTs.value, endTs.value] as any
226 } 246 }
227 // shortCutSelect(24*60*60*1000)//默认近1天 247 // shortCutSelect(24*60*60*1000)//默认近1天
228 </script> 248 </script>