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

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

See merge request yunteng/thingskit-front!1019

@@ -70,6 +70,9 @@ export const schemas: FormSchema[] = [
     component: 'Input',
     colProps: { span: 21 },
     required: true,
+    componentProps: {
+      maxLength: 20,
+    },
   },
   {
     field: 'dictItemId',

@@ -40,7 +40,7 @@
     rowKey: 'id',
     // searchInfo: searchInfo,
     actionColumn: {
-      width: 200,
+      width: 230,
       title: '操作',
       slots: { customRender: 'action' },
       fixed: 'right',

@@ -49,44 +49,46 @@
       centered
     >
       <div>
-        <Form :label-col="labelCol" :colon="false" :rules="rules" :model="positionState">
-          <Row :gutter="20" class="mt-4">
-            <Col :span="20">
-              <FormItem label="搜索位置">
-                <AutoComplete
-                  v-model:value="positionState.address"
-                  :options="dataSource"
-                  style="width: 100%"
-                  placeholder="搜索位置"
-                  @search="debounceSearch"
-                  @select="handleSelect"
-                  backfill
-                />
-              </FormItem>
-            </Col>
-          </Row>
-          <Row :gutter="20" class="">
-            <Col :span="10">
-              <FormItem label="经度" name="longitude">
-                <Input
-                  @blur="redirectPosition"
-                  @change="redirectPosition"
-                  v-model:value="positionState.longitude"
-                />
-              </FormItem>
-            </Col>
-            <Col :span="10">
-              <FormItem label="纬度" name="latitude">
-                <Input
-                  @blur="redirectPosition"
-                  @change="redirectPosition"
-                  v-model:value="positionState.latitude"
-                />
-              </FormItem>
-            </Col>
-          </Row>
-        </Form>
-        <div ref="wrapRef" style="height: 300px; width: 90%" class="ml-6"></div>
+        <Spin :spinning="spinning">
+          <Form :label-col="labelCol" :colon="false" :rules="rules" :model="positionState">
+            <Row :gutter="20" class="mt-4">
+              <Col :span="20">
+                <FormItem label="搜索位置">
+                  <AutoComplete
+                    v-model:value="positionState.address"
+                    :options="dataSource"
+                    style="width: 100%"
+                    placeholder="搜索位置"
+                    @search="debounceSearch"
+                    @select="handleSelect"
+                    backfill
+                  />
+                </FormItem>
+              </Col>
+            </Row>
+            <Row :gutter="20" class="">
+              <Col :span="10">
+                <FormItem label="经度" name="longitude">
+                  <Input
+                    @blur="redirectPosition"
+                    @change="redirectPosition"
+                    v-model:value="positionState.longitude"
+                  />
+                </FormItem>
+              </Col>
+              <Col :span="10">
+                <FormItem label="纬度" name="latitude">
+                  <Input
+                    @blur="redirectPosition"
+                    @change="redirectPosition"
+                    v-model:value="positionState.latitude"
+                  />
+                </FormItem>
+              </Col>
+            </Row>
+          </Form>
+          <div ref="wrapRef" style="height: 300px; width: 90%" class="ml-6"></div>
+        </Spin>
       </div>
     </Modal>
     <DeptDrawer @register="registerModal" @success="handleSuccess" />
@@ -97,7 +99,7 @@
   import { BasicForm, useForm } from '/@/components/Form';
   import { step1Schemas } from '../../config/data';
   import { useScript } from '/@/hooks/web/useScript';
-  import { Input, message, Modal, Form, Row, Col, AutoComplete } from 'ant-design-vue';
+  import { Input, message, Modal, Form, Row, Col, AutoComplete, Spin } from 'ant-design-vue';
   import { EnvironmentTwoTone } from '@ant-design/icons-vue';
   import { upload } from '/@/api/oss/ossFileUploader';
   import { BAI_DU_MAP_URL } from '/@/utils/fnUtils';
@@ -113,6 +115,7 @@
   import { toRaw } from 'vue';
   import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
   import { buildUUID } from '/@/utils/uuid';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
   export default defineComponent({
     components: {
@@ -126,6 +129,7 @@
       Row,
       Col,
       DeptDrawer,
+      Spin,
     },
     props: {
       isUpdate: {
@@ -134,6 +138,7 @@
     },
     emits: ['next'],
     setup(props, { emit }) {
+      const { createMessage } = useMessage();
       const orgData: any = reactive({
         treeData: [],
       });
@@ -230,17 +235,41 @@
       };
 
       // 地图的弹框
+      const spinning = ref<boolean>(true);
       const visible = ref(false);
-      const selectPosition = () => {
+      const selectPosition = async () => {
         visible.value = true;
         if (!positionState.longitude) {
-          positionState.longitude = '104.05326410962411';
-          positionState.latitude = '30.54855093076791';
-
-          // 根据经纬度获取详细位置
-          if (positionState.longitude && positionState.latitude) {
-            var pt = new BMap.Point(positionState.longitude, positionState.latitude);
-            getAddrByPoint(pt);
+          let getLocalCity = new BMap.LocalCity();
+          let getLocation = new BMap.Geolocation();
+          const userAgent = navigator.userAgent;
+          try {
+            spinning.value = true;
+            if (
+              (userAgent.indexOf('Chrome') > -1 || userAgent.indexOf('WebKit') > -1) &&
+              userAgent.indexOf('Edg') == -1
+            ) {
+              //判断是否是谷歌 或则是谷歌的内核  '104.05326410962411'; '30.54855093076791';
+              await getLocalCity.get(function (res) {
+                positionState.longitude = res?.center.lng || '104.05326410962411';
+                positionState.latitude = res?.center.lat || '30.54855093076791';
+                var pt = new BMap.Point(positionState.longitude, positionState.latitude);
+                getAddrByPoint(pt);
+                spinning.value = false;
+              });
+            } else {
+              await getLocation.getCurrentPosition(function (res) {
+                console.log(res, res);
+                positionState.longitude = res?.longitude || '104.05326410962411';
+                positionState.latitude = res?.latitude || '30.54855093076791';
+                var pt = new BMap.Point(positionState.longitude, positionState.latitude);
+                getAddrByPoint(pt);
+                spinning.value = false;
+              });
+            }
+          } catch (err) {
+            console.log(err, 'err');
+            createMessage.error('获取定位失败');
           }
           initMap(positionState.longitude, positionState.latitude);
         } else {
@@ -498,6 +527,7 @@
         handleSuccess,
         handleTreeOrg,
         devicePositionState,
+        spinning,
       };
     },
   });

@@ -28,6 +28,7 @@
     searchInfo: {
       status: 1,
     },
+    resizeHeightOffset: 50,
     useSearchForm: true,
     showTableSetting: false,
     bordered: true,
@@ -69,12 +70,16 @@
     <BasicTable @register="registerTable">
       <template #name="{ record }">
         <span>{{ record.name }}</span>
-        <ExclamationCircleOutlined @click.stop="handleOpenListDrawer(record)" class="ml-1" />
+        <ExclamationCircleOutlined
+          style="color: #377dff"
+          @click.stop="handleOpenListDrawer(record)"
+          class="ml-1"
+        />
       </template>
       <template #action="{ record }">
-        <Button type="link" :disabled="categoryId === record.id" @click="handleChecked(record)"
-          >选择</Button
-        >
+        <Button type="link" :disabled="categoryId === record.id" @click="handleChecked(record)">{{
+          categoryId === record.id ? '已选择' : '选择'
+        }}</Button>
       </template>
     </BasicTable>
   </BasicDrawer>

@@ -60,7 +60,7 @@
     destroyOnClose
     @close="handleClose"
     title="物模型"
-    width="40%"
+    width="36%"
   >
     <BasicTable @register="registerTable">
       <template #name="{ record }">

@@ -16,13 +16,13 @@
         </div>
       </template>
     </BasicForm>
-    <CateforyList
+    <CategoryList
       @register="registerDrawer"
       @handleOpenListDrawer="handleOpenListDrawer"
       @handleSelectCategory="handleSelectCategory"
       @handleClose="handleClose"
     />
-    <CateforyListDrawer @register="registerListDrawer" :cateforyListInfo="cateforyListInfo" />
+    <CategoryListDrawer @register="registerListDrawer" :cateforyListInfo="cateforyListInfo" />
   </div>
 </template>
 <script lang="ts" setup>
@@ -33,8 +33,8 @@
   import { buildUUID } from '/@/utils/uuid';
   import { Input, Button } from 'ant-design-vue';
   import { useDrawer } from '/@/components/Drawer';
-  import CateforyList from '../components/CateforyList.vue';
-  import CateforyListDrawer from '../components/CateforyListDrawer.vue';
+  import CategoryList from '../components/CategoryList.vue';
+  import CategoryListDrawer from '../components/CategoryListDrawer.vue';
 
   const emits = defineEmits(['next', 'emitDeviceType']);
   const props = defineProps({