简柏林 / thingskit-front · Commits

Commit 3d8e7abfaac1a15b7575b1cfa348ef6ab87617b4

Authored by xp.Huang
2 parents 718f7211 9535d5fa

Merge branch 'fix/device-location' into 'main_dev' 

fix: 修改设备位置自动获取当前位置和产品的样式修改

See merge request yunteng/thingskit-front!1019
Inline Side-by-side
Showing 6 changed files with 95 additions and 57 deletions
@@ -70,6 +70,9 @@ export const schemas: FormSchema[] = [ @@ -70,6 +70,9 @@ export const schemas: FormSchema[] = [
70 component: 'Input', 70 component: 'Input',
71 colProps: { span: 21 }, 71 colProps: { span: 21 },
72 required: true, 72 required: true,
  73 + componentProps: {
  74 + maxLength: 20,
  75 + },
73 }, 76 },
74 { 77 {
75 field: 'dictItemId', 78 field: 'dictItemId',
@@ -40,7 +40,7 @@ @@ -40,7 +40,7 @@
40 rowKey: 'id', 40 rowKey: 'id',
41 // searchInfo: searchInfo, 41 // searchInfo: searchInfo,
42 actionColumn: { 42 actionColumn: {
43 - width: 200, 43 + width: 230,
44 title: '操作', 44 title: '操作',
45 slots: { customRender: 'action' }, 45 slots: { customRender: 'action' },
46 fixed: 'right', 46 fixed: 'right',
@@ -49,44 +49,46 @@ @@ -49,44 +49,46 @@
49 centered 49 centered
50 > 50 >
51 <div> 51 <div>
52 - <Form :label-col="labelCol" :colon="false" :rules="rules" :model="positionState">  
53 - <Row :gutter="20" class="mt-4">  
54 - <Col :span="20">  
55 - <FormItem label="搜索位置">  
56 - <AutoComplete  
57 - v-model:value="positionState.address"  
58 - :options="dataSource"  
59 - style="width: 100%"  
60 - placeholder="搜索位置"  
61 - @search="debounceSearch"  
62 - @select="handleSelect"  
63 - backfill  
64 - />  
65 - </FormItem>  
66 - </Col>  
67 - </Row>  
68 - <Row :gutter="20" class="">  
69 - <Col :span="10">  
70 - <FormItem label="经度" name="longitude">  
71 - <Input  
72 - @blur="redirectPosition"  
73 - @change="redirectPosition"  
74 - v-model:value="positionState.longitude"  
75 - />  
76 - </FormItem>  
77 - </Col>  
78 - <Col :span="10">  
79 - <FormItem label="纬度" name="latitude">  
80 - <Input  
81 - @blur="redirectPosition"  
82 - @change="redirectPosition"  
83 - v-model:value="positionState.latitude"  
84 - />  
85 - </FormItem>  
86 - </Col>  
87 - </Row>  
88 - </Form>  
89 - <div ref="wrapRef" style="height: 300px; width: 90%" class="ml-6"></div> 52 + <Spin :spinning="spinning">
  53 + <Form :label-col="labelCol" :colon="false" :rules="rules" :model="positionState">
  54 + <Row :gutter="20" class="mt-4">
  55 + <Col :span="20">
  56 + <FormItem label="搜索位置">
  57 + <AutoComplete
  58 + v-model:value="positionState.address"
  59 + :options="dataSource"
  60 + style="width: 100%"
  61 + placeholder="搜索位置"
  62 + @search="debounceSearch"
  63 + @select="handleSelect"
  64 + backfill
  65 + />
  66 + </FormItem>
  67 + </Col>
  68 + </Row>
  69 + <Row :gutter="20" class="">
  70 + <Col :span="10">
  71 + <FormItem label="经度" name="longitude">
  72 + <Input
  73 + @blur="redirectPosition"
  74 + @change="redirectPosition"
  75 + v-model:value="positionState.longitude"
  76 + />
  77 + </FormItem>
  78 + </Col>
  79 + <Col :span="10">
  80 + <FormItem label="纬度" name="latitude">
  81 + <Input
  82 + @blur="redirectPosition"
  83 + @change="redirectPosition"
  84 + v-model:value="positionState.latitude"
  85 + />
  86 + </FormItem>
  87 + </Col>
  88 + </Row>
  89 + </Form>
  90 + <div ref="wrapRef" style="height: 300px; width: 90%" class="ml-6"></div>
  91 + </Spin>
90 </div> 92 </div>
91 </Modal> 93 </Modal>
92 <DeptDrawer @register="registerModal" @success="handleSuccess" /> 94 <DeptDrawer @register="registerModal" @success="handleSuccess" />
@@ -97,7 +99,7 @@ @@ -97,7 +99,7 @@
97 import { BasicForm, useForm } from '/@/components/Form'; 99 import { BasicForm, useForm } from '/@/components/Form';
98 import { step1Schemas } from '../../config/data'; 100 import { step1Schemas } from '../../config/data';
99 import { useScript } from '/@/hooks/web/useScript'; 101 import { useScript } from '/@/hooks/web/useScript';
100 - import { Input, message, Modal, Form, Row, Col, AutoComplete } from 'ant-design-vue'; 102 + import { Input, message, Modal, Form, Row, Col, AutoComplete, Spin } from 'ant-design-vue';
101 import { EnvironmentTwoTone } from '@ant-design/icons-vue'; 103 import { EnvironmentTwoTone } from '@ant-design/icons-vue';
102 import { upload } from '/@/api/oss/ossFileUploader'; 104 import { upload } from '/@/api/oss/ossFileUploader';
103 import { BAI_DU_MAP_URL } from '/@/utils/fnUtils'; 105 import { BAI_DU_MAP_URL } from '/@/utils/fnUtils';
@@ -113,6 +115,7 @@ @@ -113,6 +115,7 @@
113 import { toRaw } from 'vue'; 115 import { toRaw } from 'vue';
114 import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue'; 116 import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
115 import { buildUUID } from '/@/utils/uuid'; 117 import { buildUUID } from '/@/utils/uuid';
  118 + import { useMessage } from '/@/hooks/web/useMessage';
116 119
117 export default defineComponent({ 120 export default defineComponent({
118 components: { 121 components: {
@@ -126,6 +129,7 @@ @@ -126,6 +129,7 @@
126 Row, 129 Row,
127 Col, 130 Col,
128 DeptDrawer, 131 DeptDrawer,
  132 + Spin,
129 }, 133 },
130 props: { 134 props: {
131 isUpdate: { 135 isUpdate: {
@@ -134,6 +138,7 @@ @@ -134,6 +138,7 @@
134 }, 138 },
135 emits: ['next'], 139 emits: ['next'],
136 setup(props, { emit }) { 140 setup(props, { emit }) {
  141 + const { createMessage } = useMessage();
137 const orgData: any = reactive({ 142 const orgData: any = reactive({
138 treeData: [], 143 treeData: [],
139 }); 144 });
@@ -230,17 +235,41 @@ @@ -230,17 +235,41 @@
230 }; 235 };
231 236
232 // 地图的弹框 237 // 地图的弹框
  238 + const spinning = ref<boolean>(true);
233 const visible = ref(false); 239 const visible = ref(false);
234 - const selectPosition = () => { 240 + const selectPosition = async () => {
235 visible.value = true; 241 visible.value = true;
236 if (!positionState.longitude) { 242 if (!positionState.longitude) {
237 - positionState.longitude = '104.05326410962411';  
238 - positionState.latitude = '30.54855093076791';  
239 -  
240 - // 根据经纬度获取详细位置  
241 - if (positionState.longitude && positionState.latitude) {  
242 - var pt = new BMap.Point(positionState.longitude, positionState.latitude);  
243 - getAddrByPoint(pt); 243 + let getLocalCity = new BMap.LocalCity();
  244 + let getLocation = new BMap.Geolocation();
  245 + const userAgent = navigator.userAgent;
  246 + try {
  247 + spinning.value = true;
  248 + if (
  249 + (userAgent.indexOf('Chrome') > -1 || userAgent.indexOf('WebKit') > -1) &&
  250 + userAgent.indexOf('Edg') == -1
  251 + ) {
  252 + //判断是否是谷歌 或则是谷歌的内核 '104.05326410962411'; '30.54855093076791';
  253 + await getLocalCity.get(function (res) {
  254 + positionState.longitude = res?.center.lng || '104.05326410962411';
  255 + positionState.latitude = res?.center.lat || '30.54855093076791';
  256 + var pt = new BMap.Point(positionState.longitude, positionState.latitude);
  257 + getAddrByPoint(pt);
  258 + spinning.value = false;
  259 + });
  260 + } else {
  261 + await getLocation.getCurrentPosition(function (res) {
  262 + console.log(res, res);
  263 + positionState.longitude = res?.longitude || '104.05326410962411';
  264 + positionState.latitude = res?.latitude || '30.54855093076791';
  265 + var pt = new BMap.Point(positionState.longitude, positionState.latitude);
  266 + getAddrByPoint(pt);
  267 + spinning.value = false;
  268 + });
  269 + }
  270 + } catch (err) {
  271 + console.log(err, 'err');
  272 + createMessage.error('获取定位失败');
244 } 273 }
245 initMap(positionState.longitude, positionState.latitude); 274 initMap(positionState.longitude, positionState.latitude);
246 } else { 275 } else {
@@ -498,6 +527,7 @@ @@ -498,6 +527,7 @@
498 handleSuccess, 527 handleSuccess,
499 handleTreeOrg, 528 handleTreeOrg,
500 devicePositionState, 529 devicePositionState,
  530 + spinning,
501 }; 531 };
502 }, 532 },
503 }); 533 });
src/views/device/profiles/components/CategoryList.vue renamed from src/views/device/profiles/components/CateforyList.vue
@@ -28,6 +28,7 @@ @@ -28,6 +28,7 @@
28 searchInfo: { 28 searchInfo: {
29 status: 1, 29 status: 1,
30 }, 30 },
  31 + resizeHeightOffset: 50,
31 useSearchForm: true, 32 useSearchForm: true,
32 showTableSetting: false, 33 showTableSetting: false,
33 bordered: true, 34 bordered: true,
@@ -69,12 +70,16 @@ @@ -69,12 +70,16 @@
69 <BasicTable @register="registerTable"> 70 <BasicTable @register="registerTable">
70 <template #name="{ record }"> 71 <template #name="{ record }">
71 <span>{{ record.name }}</span> 72 <span>{{ record.name }}</span>
72 - <ExclamationCircleOutlined @click.stop="handleOpenListDrawer(record)" class="ml-1" /> 73 + <ExclamationCircleOutlined
  74 + style="color: #377dff"
  75 + @click.stop="handleOpenListDrawer(record)"
  76 + class="ml-1"
  77 + />
73 </template> 78 </template>
74 <template #action="{ record }"> 79 <template #action="{ record }">
75 - <Button type="link" :disabled="categoryId === record.id" @click="handleChecked(record)"  
76 - >选择</Button  
77 - > 80 + <Button type="link" :disabled="categoryId === record.id" @click="handleChecked(record)">{{
  81 + categoryId === record.id ? '已选择' : '选择'
  82 + }}</Button>
78 </template> 83 </template>
79 </BasicTable> 84 </BasicTable>
80 </BasicDrawer> 85 </BasicDrawer>
src/views/device/profiles/components/CategoryListDrawer.vue renamed from src/views/device/profiles/components/CateforyListDrawer.vue
@@ -60,7 +60,7 @@ @@ -60,7 +60,7 @@
60 destroyOnClose 60 destroyOnClose
61 @close="handleClose" 61 @close="handleClose"
62 title="物模型" 62 title="物模型"
63 - width="40%" 63 + width="36%"
64 > 64 >
65 <BasicTable @register="registerTable"> 65 <BasicTable @register="registerTable">
66 <template #name="{ record }"> 66 <template #name="{ record }">
@@ -16,13 +16,13 @@ @@ -16,13 +16,13 @@
16 </div> 16 </div>
17 </template> 17 </template>
18 </BasicForm> 18 </BasicForm>
19 - <CateforyList 19 + <CategoryList
20 @register="registerDrawer" 20 @register="registerDrawer"
21 @handleOpenListDrawer="handleOpenListDrawer" 21 @handleOpenListDrawer="handleOpenListDrawer"
22 @handleSelectCategory="handleSelectCategory" 22 @handleSelectCategory="handleSelectCategory"
23 @handleClose="handleClose" 23 @handleClose="handleClose"
24 /> 24 />
25 - <CateforyListDrawer @register="registerListDrawer" :cateforyListInfo="cateforyListInfo" /> 25 + <CategoryListDrawer @register="registerListDrawer" :cateforyListInfo="cateforyListInfo" />
26 </div> 26 </div>
27 </template> 27 </template>
28 <script lang="ts" setup> 28 <script lang="ts" setup>
@@ -33,8 +33,8 @@ @@ -33,8 +33,8 @@
33 import { buildUUID } from '/@/utils/uuid'; 33 import { buildUUID } from '/@/utils/uuid';
34 import { Input, Button } from 'ant-design-vue'; 34 import { Input, Button } from 'ant-design-vue';
35 import { useDrawer } from '/@/components/Drawer'; 35 import { useDrawer } from '/@/components/Drawer';
36 - import CateforyList from '../components/CateforyList.vue';  
37 - import CateforyListDrawer from '../components/CateforyListDrawer.vue'; 36 + import CategoryList from '../components/CategoryList.vue';
  37 + import CategoryListDrawer from '../components/CategoryListDrawer.vue';
38 38
39 const emits = defineEmits(['next', 'emitDeviceType']); 39 const emits = defineEmits(['next', 'emitDeviceType']);
40 const props = defineProps({ 40 const props = defineProps({