简柏林 / thingskit-front · Commits

Commit fd4941e93343f106ea760bb0fff771c41d1af0c8

Authored by loveumiko
1 parent b60e8d59

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

Inline Side-by-side
Showing 6 changed files with 98 additions and 59 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',
@@ -48,46 +48,49 @@ @@ -48,46 +48,49 @@
48 @cancel="handleCancel" 48 @cancel="handleCancel"
49 centered 49 centered
50 > 50 >
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>  
90 - </div> 51 + <div>
  52 +
  53 + <Spin :spinning="spinning">
  54 + <Form :label-col="labelCol" :colon="false" :rules="rules" :model="positionState">
  55 + <Row :gutter="20" class="mt-4">
  56 + <Col :span="20">
  57 + <FormItem label="搜索位置">
  58 + <AutoComplete
  59 + v-model:value="positionState.address"
  60 + :options="dataSource"
  61 + style="width: 100%"
  62 + placeholder="搜索位置"
  63 + @search="debounceSearch"
  64 + @select="handleSelect"
  65 + backfill
  66 + />
  67 + </FormItem>
  68 + </Col>
  69 + </Row>
  70 + <Row :gutter="20" class="">
  71 + <Col :span="10">
  72 + <FormItem label="经度" name="longitude">
  73 + <Input
  74 + @blur="redirectPosition"
  75 + @change="redirectPosition"
  76 + v-model:value="positionState.longitude"
  77 + />
  78 + </FormItem>
  79 + </Col>
  80 + <Col :span="10">
  81 + <FormItem label="纬度" name="latitude">
  82 + <Input
  83 + @blur="redirectPosition"
  84 + @change="redirectPosition"
  85 + v-model:value="positionState.latitude"
  86 + />
  87 + </FormItem>
  88 + </Col>
  89 + </Row>
  90 + </Form>
  91 + <div ref="wrapRef" style="height: 300px; width: 90%" class="ml-6"></div>
  92 + </div>
  93 + </Spin>
91 </Modal> 94 </Modal>
92 <DeptDrawer @register="registerModal" @success="handleSuccess" /> 95 <DeptDrawer @register="registerModal" @success="handleSuccess" />
93 </div> 96 </div>
@@ -97,7 +100,7 @@ @@ -97,7 +100,7 @@
97 import { BasicForm, useForm } from '/@/components/Form'; 100 import { BasicForm, useForm } from '/@/components/Form';
98 import { step1Schemas } from '../../config/data'; 101 import { step1Schemas } from '../../config/data';
99 import { useScript } from '/@/hooks/web/useScript'; 102 import { useScript } from '/@/hooks/web/useScript';
100 - import { Input, message, Modal, Form, Row, Col, AutoComplete } from 'ant-design-vue'; 103 + import { Input, message, Modal, Form, Row, Col, AutoComplete, Spin } from 'ant-design-vue';
101 import { EnvironmentTwoTone } from '@ant-design/icons-vue'; 104 import { EnvironmentTwoTone } from '@ant-design/icons-vue';
102 import { upload } from '/@/api/oss/ossFileUploader'; 105 import { upload } from '/@/api/oss/ossFileUploader';
103 import { BAI_DU_MAP_URL } from '/@/utils/fnUtils'; 106 import { BAI_DU_MAP_URL } from '/@/utils/fnUtils';
@@ -113,6 +116,7 @@ @@ -113,6 +116,7 @@
113 import { toRaw } from 'vue'; 116 import { toRaw } from 'vue';
114 import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue'; 117 import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
115 import { buildUUID } from '/@/utils/uuid'; 118 import { buildUUID } from '/@/utils/uuid';
  119 + import { useMessage } from '/@/hooks/web/useMessage';
116 120
117 export default defineComponent({ 121 export default defineComponent({
118 components: { 122 components: {
@@ -126,6 +130,7 @@ @@ -126,6 +130,7 @@
126 Row, 130 Row,
127 Col, 131 Col,
128 DeptDrawer, 132 DeptDrawer,
  133 + Spin,
129 }, 134 },
130 props: { 135 props: {
131 isUpdate: { 136 isUpdate: {
@@ -134,6 +139,7 @@ @@ -134,6 +139,7 @@
134 }, 139 },
135 emits: ['next'], 140 emits: ['next'],
136 setup(props, { emit }) { 141 setup(props, { emit }) {
  142 + const { createMessage } = useMessage();
137 const orgData: any = reactive({ 143 const orgData: any = reactive({
138 treeData: [], 144 treeData: [],
139 }); 145 });
@@ -220,17 +226,41 @@ @@ -220,17 +226,41 @@
220 }; 226 };
221 227
222 // 地图的弹框 228 // 地图的弹框
  229 + const spinning = ref<boolean>(false);
223 const visible = ref(false); 230 const visible = ref(false);
224 - const selectPosition = () => { 231 + const selectPosition = async () => {
225 visible.value = true; 232 visible.value = true;
226 if (!positionState.longitude) { 233 if (!positionState.longitude) {
227 - positionState.longitude = '104.05326410962411';  
228 - positionState.latitude = '30.54855093076791';  
229 -  
230 - // 根据经纬度获取详细位置  
231 - if (positionState.longitude && positionState.latitude) {  
232 - var pt = new BMap.Point(positionState.longitude, positionState.latitude);  
233 - getAddrByPoint(pt); 234 + let getLocalCity = new BMap.LocalCity();
  235 + let getLocation = new BMap.Geolocation();
  236 + const userAgent = navigator.userAgent;
  237 + try {
  238 + spinning.value = true;
  239 + if (
  240 + (userAgent.indexOf('Chrome') > -1 || userAgent.indexOf('WebKit') > -1) &&
  241 + userAgent.indexOf('Edg') == -1
  242 + ) {
  243 + //判断是否是谷歌 或则是谷歌的内核 '104.05326410962411'; '30.54855093076791';
  244 + await getLocalCity.get(function (res) {
  245 + positionState.longitude = res?.center.lng || '104.05326410962411';
  246 + positionState.latitude = res?.center.lat || '30.54855093076791';
  247 + var pt = new BMap.Point(positionState.longitude, positionState.latitude);
  248 + getAddrByPoint(pt);
  249 + });
  250 + } else {
  251 + await getLocation.getCurrentPosition(function (res) {
  252 + console.log(res, res);
  253 + positionState.longitude = res?.longitude || '104.05326410962411';
  254 + positionState.latitude = res?.latitude || '30.54855093076791';
  255 + var pt = new BMap.Point(positionState.longitude, positionState.latitude);
  256 + getAddrByPoint(pt);
  257 + });
  258 + }
  259 + } catch (err) {
  260 + console.log(err, 'err');
  261 + createMessage.error('获取定位失败');
  262 + } finally {
  263 + spinning.value = false;
234 } 264 }
235 initMap(positionState.longitude, positionState.latitude); 265 initMap(positionState.longitude, positionState.latitude);
236 } else { 266 } else {
@@ -488,6 +518,7 @@ @@ -488,6 +518,7 @@
488 handleSuccess, 518 handleSuccess,
489 handleTreeOrg, 519 handleTreeOrg,
490 devicePositionState, 520 devicePositionState,
  521 + spinning,
491 }; 522 };
492 }, 523 },
493 }); 524 });
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({