Merge branch 'sqy_dev' into 'main'

fix:oem地区选择调整，适配小屏幕，feat：设备配置新增Topic提示

See merge request huang/yun-teng-iot-front!120

@@ -8,13 +8,13 @@ VITE_PUBLIC_PATH = /
 # Please note that no line breaks
 
 # 本地
-# VITE_PROXY = [["/api","http://192.168.10.147:8080/api"]]
+# VITE_PROXY = [["/api","http://192.168.10.108:8080/api"]]
 
 # 线上
 VITE_PROXY = [["/api","http://101.133.234.90:8080/api"]]
 
 # 实时数据的ws地址
-VITE_WEB_SOCKET = ws://101.133.234.90:8080/api/ws/plugins/telemetry?token=  
+VITE_WEB_SOCKET = ws://101.133.234.90:8080/api/ws/plugins/telemetry?token=
 
 # Delete console
 VITE_DROP_CONSOLE = true
@@ -23,7 +23,7 @@ VITE_DROP_CONSOLE = true
 VITE_GLOB_API_URL=/api
 
 # File upload address， optional
-VITE_GLOB_UPLOAD_URL=/upload
+VITE_GLOB_UPLOAD_URL=/api/yt/oss/upload
 
 # Interface prefix
 VITE_GLOB_API_URL_PREFIX=/yt

@@ -20,7 +20,8 @@ VITE_GLOB_API_URL=http://101.133.234.90:8080/api
 
 # File upload address， optional
 # It can be forwarded by nginx or write the actual address directly
-VITE_GLOB_UPLOAD_URL=http://101.133.234.90:8080/upload
+VITE_GLOB_UPLOAD_URL=http://101.133.234.90:8080/api/yt/oss/upload
+
 
 # Interface prefix
 VITE_GLOB_API_URL_PREFIX=/yt

@@ -54,7 +54,7 @@ export const alarmSearchSchemas: FormSchema[] = [
   },
   {
     field: 'endTime',
-    label: '告警时间范围',
+    label: '告警时间',
     component: 'DatePicker',
     componentProps: {
       valueFormat: 'x',

@@ -54,7 +54,7 @@ export const searchFormSchema: FormSchema[] = [
     field: 'username',
     label: '联系人姓名',
     component: 'Input',
-    colProps: { span: 6 },
+    colProps: { span: 8 },
     componentProps: {
       maxLength: 36,
       placeholder: '请输入联系人姓名',

@@ -5,7 +5,48 @@
       <Image :src="deviceDetail.deviceInfo.avatar" :width="100" />
     </div>
     <div>
-      <p>设备信息</p>
+      <div class="flex" style="align-items: center">
+        <div>设备信息</div>
+        <Tooltip
+          title="帮助"
+          @click="openTopicModal"
+          placement="right"
+          v-if="deviceDetail.deviceType !== DeviceTypeEnum.SENSOR"
+        >
+          <QuestionCircleOutlined class="ml-2" style="font-size: 1rem" />
+        </Tooltip>
+        <BasicModal
+          @register="registerTopicModal"
+          centered
+          :footer="null"
+          title="设备Topic"
+          :canFullscreen="false"
+          :minHeight="50"
+          :height="50"
+          :useWrapper="false"
+        >
+          <div v-if="deviceDetail.deviceType === DeviceTypeEnum.GATEWAY" class="flex">
+            <div> 网关设备Topic : v1/gateway/telemetry </div>
+            <a-button
+              size="small"
+              class="ml-4"
+              @click="copyTopic('v1/gateway/telemetry')"
+              color="success"
+              >复制</a-button
+            >
+          </div>
+          <div v-if="deviceDetail.deviceType === DeviceTypeEnum.DIRECT_CONNECTION" class="flex">
+            <div> 直连设备Topic : v1/devices/me/telemetry </div>
+            <a-button
+              size="small"
+              class="ml-4"
+              @click="copyTopic('v1/devices/me/telemetry')"
+              color="success"
+              >复制</a-button
+            >
+          </div>
+        </BasicModal>
+      </div>
       <Description @register="register" class="mt-4" :data="deviceDetail" />
     </div>
     <div class="mt-4">
@@ -22,23 +63,28 @@
 </template>
 <script lang="ts">
   import { defineComponent, ref, unref, nextTick } from 'vue';
-  import { Image } from 'ant-design-vue';
+  import { Image, Tooltip } from 'ant-design-vue';
   import { descSchema } from '../../config/detail.config';
   import { useScript } from '/@/hooks/web/useScript';
   import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { BAI_DU_MAP_URL } from '/@/utils/fnUtils';
-  import { useModal } from '/@/components/Modal';
+  import { BasicModal, useModal } from '/@/components/Modal';
   import ManageDeviceTokenModal from '../modal/ManageDeviceTokenModal.vue';
   import { getDeviceToken } from '/@/api/device/deviceManager';
   import { Description, useDescription } from '/@/components/Description';
-  import wz from '/@/assets/images/wz.png';
+  import { QuestionCircleOutlined } from '@ant-design/icons-vue';
+  import { DeviceTypeEnum } from '/@/api/device/model/deviceModel';
 
+  import wz from '/@/assets/images/wz.png';
   export default defineComponent({
     components: {
       Image,
       Description,
       ManageDeviceTokenModal,
+      QuestionCircleOutlined,
+      BasicModal,
+      Tooltip,
     },
     props: {
       deviceDetail: {
@@ -108,6 +154,13 @@
         const token = await getDeviceToken(props.deviceDetail.tbDeviceId);
         openModal(true, token);
       };
+      const copyTopic = (value) => {
+        clipboardRef.value = value;
+        console.log(clipboardRef.value);
+        createMessage.success('复制成功~');
+      };
+
+      const [registerTopicModal, { openModal: openTopicModal }] = useModal();
 
       return {
         wrapRef,
@@ -117,6 +170,10 @@
         manageDeviceToken,
         registerModal,
         register,
+        openTopicModal,
+        registerTopicModal,
+        DeviceTypeEnum,
+        copyTopic,
       };
     },
   });

@@ -82,7 +82,7 @@ export const searchFormSchema: FormSchema[] = [
     field: 'roleName',
     label: '角色名称',
     component: 'Input',
-    colProps: { span: 8 },
+    colProps: { span: 6 },
     componentProps: {
       maxLength: 255,
     },
@@ -97,7 +97,7 @@ export const searchFormSchema: FormSchema[] = [
         { label: '停用', value: 0 },
       ],
     },
-    colProps: { span: 8 },
+    colProps: { span: 6 },
   },
 ];
 

@@ -94,7 +94,6 @@ export const schemas: FormSchema[] = [
     field: 'synopsis',
     component: 'InputTextArea',
     label: '公司简介',
-
     colProps: {
       span: 24,
     },
@@ -133,11 +132,106 @@ export const schemas: FormSchema[] = [
     },
   },
   {
+    field: 'prov',
+    label: '所在城市',
+    component: 'Input',
+    colProps: {
+      span: 24,
+    },
+
+    slot: 'customProv',
+  },
+  {
+    field: 'address',
+    component: 'Input',
+    label: '详细地址',
+    colProps: {
+      span: 24,
+    },
+    componentProps: {
+      maxLength: 100,
+      placeholder: '请输入详细地址',
+    },
+    dynamicRules: () => {
+      return [
+        {
+          required: false,
+          validator: (_, value) => {
+            if (String(value).length > 100) {
+              return Promise.reject('字数不超过100个字');
+            }
+            return Promise.resolve();
+          },
+        },
+      ];
+    },
+  },
+
+  {
+    field: 'contacts',
+    component: 'Input',
+    label: '联系人',
+    colProps: {
+      span: 24,
+    },
+    componentProps: {
+      maxLength: 25,
+      placeholder: '请输入联系人',
+    },
+    dynamicRules: () => {
+      return [
+        {
+          required: false,
+          validator: (_, value) => {
+            if (String(value).length > 25) {
+              return Promise.reject('字数不超过25个字');
+            }
+            return Promise.resolve();
+          },
+        },
+      ];
+    },
+  },
+  {
+    field: 'tel',
+    component: 'Input',
+    label: '联系电话',
+    colProps: {
+      span: 24,
+    },
+    componentProps: {
+      placeholder: '请输入联系电话',
+    },
+    rules: phoneRule,
+  },
+  {
+    field: 'qrcode',
+    label: '二维码',
+    component: 'Input',
+    colProps: {
+      span: 24,
+    },
+    slot: 'qrcode',
+  },
+  {
+    field: 'id',
+    label: '唯一id',
+    component: 'Input',
+    show: false,
+    componentProps: {
+      maxLength: 36,
+      placeholder: '请输入唯一id',
+    },
+  },
+];
+
+export const provSchemas: FormSchema[] = [
+  {
     field: 'nameProv',
     component: 'ApiSelect',
-    label: '所在城市',
+    label: '',
     colProps: {
-      span: 5,
+      span: 6,
     },
     componentProps({ formModel, formActionType }) {
       const { updateSchema } = formActionType;
@@ -259,12 +353,8 @@ export const schemas: FormSchema[] = [
     field: 'nameCity',
     component: 'Select',
     label: '',
-    labelWidth: 0,
     colProps: {
-      span: 5,
-      style: {
-        marginLeft: '-5rem',
-      },
+      span: 6,
     },
   },
   {
@@ -272,10 +362,7 @@ export const schemas: FormSchema[] = [
     component: 'Select',
     label: '',
     colProps: {
-      span: 5,
-      style: {
-        marginLeft: '-10rem',
-      },
+      span: 6,
     },
     componentProps: {
       placeholder: '区/县',
@@ -287,112 +374,9 @@ export const schemas: FormSchema[] = [
     label: '',
     colProps: {
       span: 6,
-      style: {
-        marginLeft: '-10rem',
-      },
     },
     componentProps: {
       placeholder: '城镇/街道',
     },
   },
-  {
-    field: 'address',
-    component: 'Input',
-    label: '详细地址',
-    colProps: {
-      span: 24,
-    },
-    componentProps: {
-      maxLength: 100,
-      placeholder: '请输入详细地址',
-    },
-    dynamicRules: () => {
-      return [
-        {
-          required: false,
-          validator: (_, value) => {
-            if (String(value).length > 100) {
-              return Promise.reject('字数不超过100个字');
-            }
-            return Promise.resolve();
-          },
-        },
-      ];
-    },
-  },
-
-  {
-    field: 'contacts',
-    component: 'Input',
-    label: '联系人',
-    colProps: {
-      span: 24,
-    },
-    componentProps: {
-      maxLength: 25,
-      placeholder: '请输入联系人',
-    },
-    dynamicRules: () => {
-      return [
-        {
-          required: false,
-          validator: (_, value) => {
-            if (String(value).length > 25) {
-              return Promise.reject('字数不超过25个字');
-            }
-            return Promise.resolve();
-          },
-        },
-      ];
-    },
-  },
-  {
-    field: 'tel',
-    component: 'Input',
-    label: '联系电话',
-    colProps: {
-      span: 24,
-    },
-    componentProps: {
-      placeholder: '请输入联系电话',
-    },
-    rules: phoneRule,
-  },
-  {
-    field: 'qrcode',
-    label: '二维码',
-    component: 'Input',
-    componentProps: {
-      maxLength: 255,
-      placeholder: '请输入二维码',
-    },
-    dynamicRules: () => {
-      return [
-        {
-          required: false,
-          validator: (_, value) => {
-            if (String(value).length > 255) {
-              return Promise.reject('字数不超过255个字');
-            }
-            return Promise.resolve();
-          },
-        },
-      ];
-    },
-
-    colProps: {
-      span: 24,
-    },
-    slot: 'qrcode',
-  },
-  {
-    field: 'id',
-    label: '唯一id',
-    component: 'Input',
-    show: false,
-    componentProps: {
-      maxLength: 36,
-      placeholder: '请输入唯一id',
-    },
-  },
 ];

@@ -14,12 +14,12 @@
           >
             <img v-if="logoPic" :src="logoPic" />
             <div v-else>
-              <div style="margin-top: 30px">
-                <PlusOutlined style="font-size: 50px" />
+              <div style="margin-top: 1.875rem">
+                <PlusOutlined style="font-size: 2.5rem" />
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 180px; height: 100px; align-items: center; font-size: 9px"
+                style="width: 180px; height: 100px; align-items: center; font-size: 0.5625rem"
               >
                 支持.PNG、.JPG格式，建议尺寸为32*32px，大小不超过500KB</div
               >
@@ -37,12 +37,12 @@
           >
             <img v-if="bgPic" :src="bgPic" alt="avatar" />
             <div v-else>
-              <div style="margin-top: 30px">
-                <PlusOutlined style="font-size: 50px" />
+              <div style="margin-top: 1.875rem">
+                <PlusOutlined style="font-size: 2.5rem" />
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 280px; height: 100px; align-items: center; font-size: 9px"
+                style="width: 280px; height: 100px; align-items: center; font-size: 0.5625rem"
               >
                 支持.PNG、.JPG格式，建议尺寸为1080*1620px，大小不超过5M</div
               >
@@ -64,12 +64,12 @@
             :before-upload="beforeUploadHomeSwiper"
           >
             <div v-if="fileList.length < 5">
-              <div style="margin-top: 30px">
-                <PlusOutlined style="font-size: 50px" />
+              <div style="margin-top: 1.875rem">
+                <PlusOutlined style="font-size: 2.5rem" />
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 150px; height: 70px; align-items: center; font-size: 9px"
+                style="width: 150px; height: 70px; align-items: center; font-size: 0.5625rem"
                 >支持.PNG、.JPG格式，建议尺寸为800*600px，大小不超过3M</div
               >
             </div>

@@ -13,12 +13,12 @@
           >
             <img v-if="logoPic" :src="logoPic" />
             <div v-else>
-              <div style="margin-top: 30px">
-                <PlusOutlined style="font-size: 50px" />
+              <div style="margin-top: 1.875rem">
+                <PlusOutlined style="font-size: 2.5rem" />
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 180px; height: 100px; align-items: center; font-size: 9px"
+                style="width: 180px; height: 100px; align-items: center; font-size: 0.5625rem"
               >
                 支持.PNG、.JPG格式，建议尺寸为32*32px，大小不超过500KB</div
               >
@@ -44,7 +44,7 @@
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 130px; height: 70px; align-items: center; font-size: 9px"
+                style="width: 130px; height: 70px; align-items: center; font-size: 0.5625rem"
               >
                 支持.ICON格式，建议尺寸为16*16px</div
               >
@@ -62,12 +62,12 @@
           >
             <img v-if="bgPic" :src="bgPic" alt="avatar" />
             <div v-else>
-              <div style="margin-top: 30px">
-                <PlusOutlined style="font-size: 50px" />
+              <div style="margin-top: 1.875rem">
+                <PlusOutlined style="font-size: 2.5rem" />
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 280px; height: 130px; align-items: center; font-size: 9px"
+                style="width: 280px; height: 130px; align-items: center; font-size: 0.5625rem"
               >
                 支持.PNG、.JPG格式，建议尺寸为1920*1080px以上，大小不超过5M</div
               >

@@ -13,18 +13,21 @@
           >
             <img v-if="qrcodePic" :src="qrcodePic" alt="avatar" />
             <div v-else>
-              <div style="margin-top: 30px">
-                <PlusOutlined style="font-size: 50px" />
+              <div style="margin-top: 1.875rem">
+                <PlusOutlined style="font-size: 2.5rem" />
               </div>
               <div
                 class="ant-upload-text flex"
-                style="width: 180px; height: 100px; align-items: center; font-size: 9px"
+                style="width: 180px; height: 100px; align-items: center; font-size: 0.5625rem"
               >
                 支持.PNG、.JPG格式，建议尺寸为300*300px，大小不超过2M</div
               >
             </div>
           </Upload>
         </template>
+        <template #customProv>
+          <BasicForm @register="registerCustomForm" />
+        </template>
       </BasicForm>
     </Card>
     <Loading v-bind="compState" />
@@ -32,7 +35,7 @@
       @click="handleUpdateInfo"
       size="large"
       type="primary"
-      style="margin-top: 20px; border-radius: 5px"
+      style="margin-top: 1rem; border-radius: 0.5rem"
       >更新基本信息</a-button
     >
   </div>
@@ -42,7 +45,7 @@
   import { defineComponent, onMounted, ref } from 'vue';
   import { Card, Upload } from 'ant-design-vue';
   import { BasicForm, useForm } from '/@/components/Form/index';
-  import { schemas } from '../config/enterPriseInfo.config';
+  import { schemas, provSchemas } from '../config/enterPriseInfo.config';
   import { getAreaList, getEnterPriseDetail, updateEnterPriseDetail } from '/@/api/oem/index';
   import { Loading } from '/@/components/Loading';
   import { useMessage } from '/@/hooks/web/useMessage';
@@ -66,15 +69,30 @@
         loading: false,
         tip: '拼命加载中...',
       });
-      const [registerForm, { getFieldsValue, setFieldsValue, updateSchema, validate }] = useForm({
+      const [registerForm, { getFieldsValue, setFieldsValue, validate }] = useForm({
         labelWidth: 80,
         schemas,
         showResetButton: false,
         showSubmitButton: false,
         wrapperCol: {
-          span: 10,
+          span: 12,
+        },
+      });
+
+      const [
+        registerCustomForm,
+        { getFieldsValue: getNameTown, updateSchema, setFieldsValue: setNameTown },
+      ] = useForm({
+        labelWidth: 80,
+        schemas: provSchemas,
+        showResetButton: false,
+        showSubmitButton: false,
+        compact: true,
+        actionColOptions: {
+          span: 0,
         },
       });
+
       const { createMessage } = useMessage();
 
       const qrcodePic = ref();
@@ -103,9 +121,10 @@
       const handleUpdateInfo = async () => {
         try {
           const fieldsValue = getFieldsValue();
+          const { nameTown } = getNameTown();
           const newFieldValue: any = {
             ...fieldsValue,
-            codeTown: fieldsValue.nameTown,
+            codeTown: nameTown,
             qrCode: qrcodePic.value,
           };
           delete newFieldValue.nameProv;
@@ -157,7 +176,7 @@
           item.label = item.name;
           item.value = item.code;
         });
-        const { codeCountry, codeProv, codeCity, codeCoun, codeTown } = code;
+        const { codeProv, codeCity, codeCoun, codeTown } = code;
         updateSchema([
           {
             field: 'nameCity',
@@ -227,7 +246,7 @@
               options: couns,
               async onChange(value) {
                 if (value === undefined) {
-                  setFieldsValue({
+                  setNameTown({
                     nameTown: undefined,
                   });
                   updateSchema({
@@ -243,7 +262,7 @@
                     item.label = item.name;
                     item.value = item.code;
                   });
-                  setFieldsValue({
+                  setNameTown({
                     nameTown: undefined,
                   });
                   updateSchema({
@@ -264,8 +283,7 @@
             },
           },
         ]);
-        setFieldsValue({
-          nameCountry: codeCountry,
+        setNameTown({
           nameProv: codeProv,
           nameCity: codeCity,
           nameCoun: codeCoun,
@@ -286,12 +304,11 @@
             codeTown,
           };
           updateCityData(cities, couns, towns, code);
-          setFieldsValue(res);
-          qrcodePic.value = res.qrCode;
-        } else {
-          setFieldsValue(res);
-          qrcodePic.value = res.qrCode;
+          setFieldsValue({ nameCountry: codeCountry });
         }
+        setFieldsValue(res);
+        console.log(res);
+        qrcodePic.value = res.qrCode;
       });
 
       return {
@@ -301,6 +318,7 @@
         handleUpdateInfo,
         customUploadqrcodePic,
         beforeUploadqrcodePic,
+        registerCustomForm,
       };
     },
   });

@@ -4,7 +4,6 @@ import { h } from 'vue';
 import { Switch } from 'ant-design-vue';
 import { setRoleStatus } from '/@/api/system/system';
 import { useMessage } from '/@/hooks/web/useMessage';
-import { RoleEnum } from '/@/enums/roleEnum';
 export const columns: BasicColumn[] = [
   {
     title: '角色名称',
@@ -66,23 +65,13 @@ export const searchFormSchema: FormSchema[] = [
     field: 'roleName',
     label: '角色名称',
     component: 'Input',
-    colProps: { span: 8 },
+    colProps: { span: 6 },
     componentProps: {
       maxLength: 255,
       placeholder: '请输入角色名称',
     },
   },
-  {
-    field: 'roleType',
-    label: '',
-    component: 'Input',
-    colProps: { span: 8 },
-    defaultValue: RoleEnum.TENANT_ADMIN,
-    ifShow: false,
-    componentProps: {
-      maxLength: 20,
-    },
-  },
+
   {
     field: 'status',
     label: '状态',
@@ -93,7 +82,7 @@ export const searchFormSchema: FormSchema[] = [
         { label: '停用', value: 0 },
       ],
     },
-    colProps: { span: 8 },
+    colProps: { span: 6 },
   },
 ];