Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev

src/api/account/notificationRecord.ts

@@ -1,7 +1,7 @@
 import server from '@/utils/request'
 
 // 获取记录列表
-export const getList_api = (data:object): any =>server.get(`/notifications/_query`,encodeParams(data))
+export const getList_api = (data:object): any =>server.post(`/notifications/_query`,data)
 // 修改记录状态
 export const changeStatus_api = (type:'_read'|'_unread',data:string[]): any =>server.post(`/notifications/${type}`,data)
 

src/components/AIcon/index.tsx

@@ -77,6 +77,7 @@ const iconKeys = [
     'CloudDownloadOutlined',
     'PauseCircleOutlined',,
     'FormOutlined',
+    'EyeInvisibleOutlined',
 ]
 
 const Icon = (props: {type: string}) => {

src/components/Layout/components/Notice.vue

@@ -26,7 +26,7 @@ import { notification } from 'ant-design-vue';
 import { changeStatus_api } from '@/api/account/notificationRecord';
 import { useUserInfo } from '@/store/userInfo';
 
-const updateCount = computed(()=>useUserInfo().$state.alarmUpdateCount);
+const updateCount = computed(() => useUserInfo().$state.alarmUpdateCount);
 
 const total = ref(0);
 const list = ref<any[]>([]);
@@ -50,10 +50,20 @@ const subscribeNotice = () => {
 const getList = () => {
     loading.value = true;
     const params = {
-        'terms[0].column': 'state',
-        'terms[0].value': 'unread',
         'sorts[0].name': 'notifyTime',
         'sorts[0].order': 'desc',
+        terms: [
+            {
+                terms: [
+                    {
+                        type: 'or',
+                        value: 'unread',
+                        termType: 'eq',
+                        column: 'state',
+                    },
+                ],
+            },
+        ],
     };
     getList_api(params)
         .then((resp: any) => {

src/views/account/Center/components/EditInfoDialog.vue

@@ -5,6 +5,7 @@
         @ok="handleOk"
         width="770px"
         @cancel="emits('update:visible', false)"
+        :confirmLoading="loading"
     >
         <j-form :model="form" layout="vertical" ref="formRef">
             <j-row :gutter="24">
@@ -12,7 +13,10 @@
                     <j-form-item
                         label="姓名"
                         name="name"
-                        :rules="[{ required: true, message: '姓名必填' }]"
+                        :rules="[
+                            { required: true, message: '姓名必填' },
+                            { max: 64, message: '最多可输入64个字符' },
+                        ]"
                     >
                         <j-input
                             v-model:value="form.name"
@@ -56,7 +60,16 @@
             </j-row>
             <j-row :gutter="24">
                 <j-col :span="12">
-                    <j-form-item label="手机号">
+                    <j-form-item
+                        label="手机号"
+                        name="telephone"
+                        :rules="[
+                            {
+                                pattern: /^1[3456789]\d{9}$/,
+                                message: '请输入正确手机号',
+                            },
+                        ]"
+                    >
                         <j-input
                             v-model:value="form.telephone"
                             placeholder="请输入手机号"
@@ -64,7 +77,11 @@
                     </j-form-item>
                 </j-col>
                 <j-col :span="12">
-                    <j-form-item label="邮箱">
+                    <j-form-item
+                        label="邮箱"
+                        name="email"
+                        :rules="[{ type: 'email',message:'邮箱不是一个有效的email' }]"
+                    >
                         <j-input
                             v-model:value="form.email"
                             placeholder="请输入邮箱"
@@ -87,17 +104,19 @@ const props = defineProps<{
     visible: boolean;
     data: userInfoType;
 }>();
+const loading = ref(false)
 const form = ref(props.data);
 const formRef = ref<FormInstance>();
 const handleOk = () => {
     formRef.value?.validate().then(() => {
+        loading.value = true
         updateMeInfo_api(form.value).then((resp) => {
             if (resp.status === 200) {
                 message.success('保存成功');
                 emits('ok');
                 emits('update:visible', false);
             }
-        });
+        }).finally(()=>loading.value = false)
     });
 };
 </script>

src/views/account/Center/components/EditPasswordDialog.vue

@@ -4,6 +4,7 @@
         title="重置密码"
         @ok="handleOk"
         width="520px"
+        :confirmLoading="loading"
         @cancel="emits('update:visible', false)"
     >
         <j-form :model="form" layout="vertical" ref="formRef">
@@ -11,7 +12,7 @@
                 label="旧密码"
                 name="oldPassword"
                 :rules="[
-                    { required: true },
+                    { required: true, message: '请输入密码' },
                     { validator: checkMothods.old, trigger: 'blur' },
                 ]"
             >
@@ -24,7 +25,7 @@
                 label="密码"
                 name="newPassword"
                 :rules="[
-                    { required: true },
+                    { required: true,message:'请输入密码' },
                     { validator: checkMothods.new, trigger: 'blur' },
                 ]"
             >
@@ -37,7 +38,7 @@
                 label="确认密码"
                 name="confirmPassword"
                 :rules="[
-                    { required: true },
+                    { required: true, message: '请输入确认密码' },
                     { validator: checkMothods.confirm, trigger: 'blur' },
                 ]"
             >
@@ -63,6 +64,7 @@ const emits = defineEmits(['ok', 'update:visible']);
 const props = defineProps<{
     visible: boolean;
 }>();
+const loading = ref(false)
 const formRef = ref<FormInstance>();
 const form = ref<formType>({
     oldPassword: '',
@@ -72,7 +74,7 @@ const form = ref<formType>({
 
 const checkMothods = {
     old: async (_rule: Rule, value: string) => {
-        if (!value) return Promise.reject('请输入密码');
+        if (!value) return Promise.reject();
         try {
             const resp: any = await checkOldPassword_api(value);
             if (resp.status === 200 && !resp.result.passed)
@@ -83,7 +85,7 @@ const checkMothods = {
         }
     },
     new: async (_rule: Rule, value: string) => {
-        if (!value) return Promise.reject('请输入密码');
+        if (!value) return Promise.reject();
         else if (
             form.value.confirmPassword &&
             value !== form.value.confirmPassword
@@ -99,7 +101,7 @@ const checkMothods = {
         }
     },
     confirm: async (_rule: Rule, value: string) => {
-        if (!value) return Promise.reject('请输入确认密码');
+        if (!value) return Promise.reject();
 
         try {
             const resp: any = await validateField_api('password', value);
@@ -114,6 +116,7 @@ const checkMothods = {
 
 const handleOk = () => {
     formRef.value?.validate().then(() => {
+        loading.value = true
         const params = {
             oldPassword: form.value.oldPassword,
             newPassword: form.value.newPassword,
@@ -124,7 +127,7 @@ const handleOk = () => {
                 emits('ok');
                 emits('update:visible', false);
             }
-        });
+        }).finally(()=>loading.value = false)
     });
 };
 console.clear();

src/views/account/Center/index.vue

@@ -8,10 +8,15 @@
                         style="width: 350px; justify-content: center"
                     >
                         <img
+                            v-if="userInfo.avatar"
                             :src="userInfo.avatar"
                             style="width: 140px; border-radius: 70px"
                             alt=""
                         />
+                        <div class="default-avatar" v-else>
+                            <AIcon type="UserOutlined" />
+                        </div>
+
                         <div
                             style="
                                 width: 100%;
@@ -29,6 +34,7 @@
                                 }"
                                 :action="`${BASE_API_PATH}/file/static`"
                                 @change="upload.changeBackUpload"
+                                :beforeUpload="upload.beforeUpload"
                             >
                                 <j-button>
                                     <AIcon type="UploadOutlined" />
@@ -51,11 +57,17 @@
                         </div>
                         <div class="info-card">
                             <p>注册时间</p>
-                            <p>{{ moment(userInfo.createTime).format('YYYY-MM-DD HH:mm:ss') }}</p>
+                            <p>
+                                {{
+                                    moment(userInfo.createTime).format(
+                                        'YYYY-MM-DD HH:mm:ss',
+                                    )
+                                }}
+                            </p>
                         </div>
                         <div class="info-card">
                             <p>电话</p>
-                            <p>{{ userInfo.telephone }}</p>
+                            <p>{{ userInfo.telephone || '-' }}</p>
                         </div>
                         <div class="info-card">
                             <p>姓名</p>
@@ -117,7 +129,7 @@
                             type="link"
                             @click="editPasswordVisible = true"
                         >
-                            <AIcon type="EditOutlined" style="color: #1d39c4;" />
+                            <AIcon type="EditOutlined" style="color: #1d39c4" />
                         </PermissionButton>
                     </span>
                 </div>
@@ -205,7 +217,7 @@
             <EditInfoDialog
                 v-if="editInfoVisible"
                 v-model:visible="editInfoVisible"
-                :data="{...userInfo}"
+                :data="{ ...userInfo }"
                 @ok="getUserInfo"
             />
             <EditPasswordDialog
@@ -277,6 +289,15 @@ const upload = reactive({
             message.error('logo上传失败，请稍后再试');
         }
     },
+    beforeUpload: ({ size, type }: File) => {
+        const imageTypes = ['jpg', 'png', 'jfif', 'pjp', 'pjpeg', 'jpeg'];
+        const typeBool =
+            imageTypes.filter((typeStr) => type.includes(typeStr)).length > 0;
+        const sizeBool = size < 4 * 1024 * 1024;
+
+        (typeBool && sizeBool) || message.error('请上传正确格式的图片');
+        return typeBool && sizeBool;
+    },
 });
 // 首页视图
 const isApiUser = ref<boolean>();
@@ -346,7 +367,7 @@ function getViews() {
     background-color: #f0f2f5;
     min-height: 100vh;
     .card {
-        margin: 24px;
+        margin: 16px 0;
         padding: 24px;
         background-color: #fff;
         position: relative;
@@ -370,6 +391,18 @@ function getViews() {
             flex-wrap: wrap;
             .content-item {
                 margin-right: 24px;
+
+                .default-avatar {
+                    background-color: #ccc;
+                    color: #fff;
+                    border-radius: 50%;
+                    font-size: 70px;
+                    width: 140px;
+                    height: 140px;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                }
                 .info-card {
                     width: 25%;
 

src/views/account/NotificationRecord/index.vue

@@ -1,14 +1,17 @@
 <template>
     <page-container>
         <div class="notification-record-container">
-            <Search :columns="columns" @search="query.search" />
+            <j-advanced-search
+                :columns="columns"
+                @search="(params:any)=>queryParams = {...params}"
+            />
 
             <j-pro-table
                 ref="tableRef"
                 :columns="columns"
                 :request="getList_api"
                 model="TABLE"
-                :params="query.params.value"
+                :params="queryParams"
                 :defaultParams="{
                     'sorts[0].name': 'notifyTime',
                     'sorts[0].order': 'desc',
@@ -52,8 +55,8 @@
                                         ? '标为未读'
                                         : '标为已读',
                             }"
-                        >1
+                            >
-                            <AIcon type="ReadIconOutlined" />
+                            <AIcon type="icon-a-PIZHU1" />
                         </PermissionButton>
                         <PermissionButton
                             type="link"
@@ -158,15 +161,10 @@ const columns = [
         key: 'action',
         ellipsis: true,
         scopedSlots: true,
-        width:'200px'
+        width: '200px',
     },
 ];
-const query = {
+const queryParams = ref({});
-    params: ref({}),
-    search: (params: object) => {
-        query.params.value = { ...params };
-    },
-};
 
 const tableRef = ref();
 const table = {

src/views/account/NotificationSubscription/components/EditDialog.vue

@@ -3,6 +3,7 @@
         visible
         :title="props.data.id ? '编辑' : '新增'"
         width="865px"
+        :confirmLoading="loading"
         @ok="confirm"
         @cancel="emits('update:visible', false)"
     >
@@ -92,6 +93,7 @@ const props = defineProps<{
     data: rowType;
 }>();
 
+const loading = ref(false);
 const initForm = {
     subscribeName: '',
     topicConfig: {},
@@ -106,13 +108,16 @@ const form = ref({
 const confirm = () => {
     formRef.value &&
         formRef.value.validate().then(() => {
-            save_api(form.value).then((resp) => {
+            loading.value = true;
-                if (resp.status === 200) {
+            save_api(form.value)
-                    message.success('操作成功');
+                .then((resp) => {
-                    emits('ok')
+                    if (resp.status === 200) {
-                    emits('update:visible', false);
+                        message.success('操作成功');
-                }
+                        emits('ok');
-            });
+                        emits('update:visible', false);
+                    }
+                })
+                .finally(() => (loading.value = false));
         });
 };
 

src/views/account/NotificationSubscription/index.vue

@@ -1,13 +1,16 @@
 <template>
     <page-container>
         <div class="notification-subscription-container">
-            <Search :columns="columns" @search="query.search" />
+            <j-advanced-search
+                :columns="columns"
+                @search="(params:any)=>queryParams = {...params}"
+            />
             <j-pro-table
                 ref="tableRef"
                 :columns="columns"
                 :request="getNoticeList_api"
                 model="TABLE"
-                :params="query.params.value"
+                :params="queryParams"
                 :defaultParams="{
                     sorts: [{ name: 'notifyTime', order: 'desc' }],
                 }"
@@ -105,7 +108,7 @@ import EditDialog from './components/EditDialog.vue';
 import {
     getNoticeList_api,
     changeStatus_api,
-    remove_api
+    remove_api,
 } from '@/api/account/notificationSubscription';
 import { rowType } from './typing';
 import { message } from 'ant-design-vue';
@@ -147,19 +150,14 @@ const columns = [
         key: 'action',
         ellipsis: true,
         scopedSlots: true,
-        width: '200px'
+        width: '200px',
     },
 ];
-const query = {
+const queryParams = ref({});
-    params: ref({}),
-    search: (params: object) => {
-        query.params.value = {...params};
-    },
-};
 const dialogVisible = ref<boolean>(false);
 const tableRef = ref();
 const table = {
-    seletctRow: ref<rowType>(),
+    seletctRow: ref<any>({}),
     edit: (row?: rowType) => {
         table.seletctRow = {
             ...(row || ({} as any)),
@@ -176,12 +174,12 @@ const table = {
         });
     },
     delete: (row: rowType) => {
-        remove_api(row.id as string).then(resp=>{
+        remove_api(row.id as string).then((resp) => {
-            if(resp.status === 200) {
+            if (resp.status === 200) {
-                message.success('操作成功！')
+                message.success('操作成功！');
-                table.refresh()
+                table.refresh();
-            }else message.warning('操作失败！')
+            } else message.warning('操作失败！');
-        })
+        });
     },
     refresh: () => {
         tableRef.value && tableRef.value.reload();

src/views/home/components/BootCardSmall.vue

@@ -28,34 +28,19 @@
 
 <script setup lang="ts">
 import { message } from 'ant-design-vue';
-import { bootConfig } from "../typing";
+import { bootConfig } from '../typing';
+import { useMenuStore } from '@/store/menu';
 
-const router = useRouter();
 const props = defineProps({
     cardData: Array<bootConfig>,
     cardTitle: String,
 });
 const { cardData, cardTitle } = toRefs(props);
+const { jumpPage: _jumpPage } = useMenuStore();
 
-const jumpPage = (row: bootConfig): void => {
+const jumpPage = (item: bootConfig) => {
-    if (row.auth && row.link) {
+    if (item.auth === undefined || item.auth) _jumpPage(item.link, item.params);
-        router.push(`${row.link}${objToParams(row.params || {})}`);
+    else message.warning('暂无权限，请联系管理员');
-    } else {
-        message.warning('暂无权限，请联系管理员');
-    }
-};
-
-const objToParams = (source: object): string => {
-    if (Object.prototype.toString.call(source) === '[object Object]') {
-        const paramsArr = <any>[];
-        // 直接使用for in遍历对象ts会报错
-        Object.entries(source).forEach(([prop, value]) => {
-            if (typeof value === 'object') value = JSON.stringify(value);
-            paramsArr.push(`${prop}=${value}`);
-        });
-        if (paramsArr.length > 0) return '?' + paramsArr.join('&');
-    }
-    return '';
 };
 </script>
 

src/views/home/components/ComprehensiveHome/index.vue

@@ -36,7 +36,7 @@
             <ProductChooseDialog
                 v-if="productDialogVisible"
                 v-model:visible="productDialogVisible"
-                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id })"
+                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id, tab: 'Device'})"
             />
             <DeviceChooseDialog
                 v-if="deviceDialogVisible"
@@ -80,7 +80,7 @@ const deviceBootConfig: bootConfig[] = [
         auth: productPermission('add'),
         image: '/images/home/guide-home1.png',
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {
@@ -100,7 +100,7 @@ const deviceBootConfig: bootConfig[] = [
         auth: rulePermission('add'),
         image: '/images/home/guide-home3.png',
         params: {
-            type: 'add',
+            save: true,
         },
     },
 ];
@@ -115,7 +115,7 @@ const deviceStepDetails: recommendList[] = [
         linkUrl: 'device/Product',
         auth: productPermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {
@@ -182,10 +182,7 @@ const opsBootConfig: bootConfig[] = [
     {
         english: 'STEP3',
         label: '实时监控',
-        link: 'link/Dashboard',
+        link: 'link/DashBoard',
-        params: {
-            save: true,
-        },
         image: '/images/home/guide-home6.png',
     },
 ];
@@ -230,4 +227,17 @@ const opsStepDetails: recommendList[] = [
 
 const productDialogVisible = ref(false);
 const deviceDialogVisible = ref(false);
+
+
+
+// 设备管理-产品---新增弹窗  {save:true}
+// 设备管理-产品-产品详情---设备接入标签页 {id: 'xxxx', tab:'xxx'}
+// 规则引擎-规则编排---新增弹窗 {save: true}
+
+
+// 设备管理-设备---新增弹窗
+// 设备管理-设备---导入弹窗
+// 设备管理-设备-设备详情---设备诊断标签页
+
+// 运维管理-日志管理---系统日志标签页
 </script>

src/views/home/components/DevOpsHome/index.vue

@@ -32,12 +32,12 @@ const opsBootConfig: bootConfig[] = [
     {
         english: 'STEP1',
         label: '设备接入配置',
-        link: 'link/accessConfig',
+        link: 'link/AccessConfig',
     },
     {
         english: 'STEP2',
         label: '日志排查',
-        link: 'link/Log',
+        link: 'Log',
         params: {
             key: 'system',
         },
@@ -45,7 +45,7 @@ const opsBootConfig: bootConfig[] = [
     {
         english: 'STEP3',
         label: '实时监控',
-        link: 'link/dashboard',
+        link: 'link/DashBoard',
         params: {
             type: 'add',
         },

src/views/home/components/DeviceCountCard.vue

@@ -26,13 +26,19 @@ const { jumpPage } = useMenuStore();
 const projectNum = ref(0);
 const deviceNum = ref(0);
 
+const menuPermission = useMenuStore().hasPermission;
 const getData = () => {
-    getDeviceCount_api().then((resp: any) => {
+    // 有产品菜单权限则获取数据
-        deviceNum.value = resp.result;
+    menuPermission('device/Product') &&
-    });
+        getDeviceCount_api().then((resp: any) => {
-    getProductCount_api({}).then((resp: any) => {
+            deviceNum.value = resp.result;
-        projectNum.value = resp.result;
+        });
-    });
+
+    // 有设备菜单权限则获取数据
+    menuPermission('device/Instance') &&
+        getProductCount_api({}).then((resp: any) => {
+            projectNum.value = resp.result;
+        });
 };
 getData();
 </script>

src/views/home/components/DeviceHome/index.vue

@@ -23,7 +23,7 @@
             <ProductChooseDialog
                 v-if="productDialogVisible"
                 v-model:visible="productDialogVisible"
-                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id })"
+                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id, tab: 'Device'})"
             />
             <DeviceChooseDialog
                 v-if="deviceDialogVisible"
@@ -67,7 +67,7 @@ const deviceBootConfig: bootConfig[] = [
         link: 'device/Product',
         auth: productPermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {
@@ -85,7 +85,7 @@ const deviceBootConfig: bootConfig[] = [
         link: 'rule-engine/Instance',
         auth: rulePermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
 ];
@@ -98,7 +98,7 @@ const deviceStepDetails: recommendList[] = [
         linkUrl: 'device/Product',
         auth: productPermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {

src/views/home/index.vue

@@ -17,12 +17,22 @@
                     <div class="card">
                         <h3 style="margin: 0 0 24px 0">基本信息</h3>
                         <p>
-                            <span style="font-weight: bold">clientId: </span>
+                            <span class="label">clientId: </span>
-                            <span>{{ clientId }}</span>
+                            <span class="value">{{ clientId }}</span>
                         </p>
                         <p>
-                            <span style="font-weight: bold">secureKey:</span>
+                            <span class="label">secureKey:</span>
-                            <span>{{ secureKey }}</span>
+                            <span class="value">
+                                {{ showKey ? secureKey : '****************' }}
+                            </span>
+                            <AIcon
+                                :type="
+                                    showKey
+                                        ? 'EyeOutlined'
+                                        : 'EyeInvisibleOutlined'
+                                "
+                                @click="showKey = !showKey"
+                            />
                         </p>
                     </div>
                 </template>
@@ -47,14 +57,15 @@ const currentView = ref<string>('');
 const loading = ref<boolean>(true);
 const clientId = useUserInfo().$state.userInfos.id;
 const secureKey = ref<string>('');
-
+const showKey = ref(false);
 // 获取选择的视图
 const setCurrentView = () => {
     getView_api().then((resp: any) => {
         if (resp.status === 200) {
-            if (resp.result) currentView.value = resp.result?.content;
+            if (resp.result) {
-            else if (resp.result.username === 'admin') {
+                if (resp.result.username === 'admin')
-                currentView.value = 'comprehensive';
+                    currentView.value = 'comprehensive';
+                else currentView.value = resp.result?.content;
             } else currentView.value = 'init';
         }
     });
@@ -90,6 +101,15 @@ if (isNoCommunity) {
         p {
             margin: 0;
             font-size: 16px;
+
+            .label {
+                font-weight: bold;
+                margin-right: 3px;
+            }
+            .value {
+                margin-right: 10px;
+                font-size: 14px;
+            }
         }
     }
 }

src/views/system/Platforms/Api/index.vue

@@ -3,7 +3,7 @@
         <div class="top">
             <slot name="top" />
         </div>
-        <j-row :gutter="24">
+        <j-row :gutter="24" class="content">
             <j-col
                 :span="24"
                 v-if="props.showTitle"
@@ -151,11 +151,16 @@ function init() {
 
 <style lang="less" scoped>
 .api-page-container {
-    .tree-content {
+    .content {
-        padding-bottom: 30px;
+        background-color: #fff;
-        height: calc(100vh - 230px);
+        padding: 24px;
-        overflow-y: auto;
+        margin: 0 !important;
-        border-right: 1px solid #e9e9e9;
+        .tree-content {
+            padding-bottom: 30px;
+            height: calc(100vh - 230px);
+            overflow-y: auto;
+            border-right: 1px solid #e9e9e9;
+        }
     }
 }
 </style>