0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

This commit is contained in:
JiangQiming 2023-03-09 20:01:09 +08:00
parent cfff69bd43 f245461c68
commit 7f3978fe17
16 changed files with 204 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/account/notificationRecord.ts
View File

@ -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)

1
src/components/AIcon/index.tsx
View File

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

16
src/components/Layout/components/Notice.vue
View File

@ -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) => {

27
src/views/account/Center/components/EditInfoDialog.vue
View File

@ -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>

17
src/views/account/Center/components/EditPasswordDialog.vue
View File

@ -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();

43
src/views/account/Center/index.vue
View File

@ -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%;

20
src/views/account/NotificationRecord/index.vue
View File

@ -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 = {
params: ref({}),
search: (params: object) => {
query.params.value = { ...params };
},
};
const queryParams = ref({});
const tableRef = ref();
const table = {

19
src/views/account/NotificationSubscription/components/EditDialog.vue
View File

@ -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) => {
if (resp.status === 200) {
message.success('操作成功');
emits('ok')
emits('update:visible', false);
}
});
loading.value = true;
save_api(form.value)
.then((resp) => {
if (resp.status === 200) {
message.success('操作成功');
emits('ok');
emits('update:visible', false);
}
})
.finally(() => (loading.value = false));
});
};

32
src/views/account/NotificationSubscription/index.vue
View File

@ -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 = {
params: ref({}),
search: (params: object) => {
query.params.value = {...params};
},
};
const queryParams = ref({});
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=>{
if(resp.status === 200) {
message.success('操作成功！')
table.refresh()
}else message.warning('操作失败！')
})
remove_api(row.id as string).then((resp) => {
if (resp.status === 200) {
message.success('操作成功！');
table.refresh();
} else message.warning('操作失败！');
});
},
refresh: () => {
tableRef.value && tableRef.value.reload();

27
src/views/home/components/BootCardSmall.vue
View File

@ -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 => {
if (row.auth && row.link) {
router.push(`${row.link}${objToParams(row.params || {})}`);
} 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 '';
const jumpPage = (item: bootConfig) => {
if (item.auth === undefined || item.auth) _jumpPage(item.link, item.params);
else message.warning('暂无权限，请联系管理员');
};
</script>

26
src/views/home/components/ComprehensiveHome/index.vue
View File

@ -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',
params: {
save: true,
},
link: 'link/DashBoard',
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>

6
src/views/home/components/DevOpsHome/index.vue
View File

@ -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',
},

18
src/views/home/components/DeviceCountCard.vue
View File

@ -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;
});
getProductCount_api({}).then((resp: any) => {
projectNum.value = resp.result;
});
// 有产品菜单权限则获取数据
menuPermission('device/Product') &&
getDeviceCount_api().then((resp: any) => {
deviceNum.value = resp.result;
});
// 有设备菜单权限则获取数据
menuPermission('device/Instance') &&
getProductCount_api({}).then((resp: any) => {
projectNum.value = resp.result;
});
};
getData();
</script>

8
src/views/home/components/DeviceHome/index.vue
View File

@ -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,
},
},
{

36
src/views/home/index.vue
View File

@ -17,12 +17,22 @@
<div class="card">
<h3 style="margin: 0 0 24px 0">基本信息</h3>
<p>
<span style="font-weight: bold">clientId: </span>
<span>{{ clientId }}</span>
<span class="label">clientId: </span>
<span class="value">{{ clientId }}</span>
</p>
<p>
<span style="font-weight: bold">secureKey:</span>
<span>{{ secureKey }}</span>
<span class="label">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;
else if (resp.result.username === 'admin') {
currentView.value = 'comprehensive';
if (resp.result) {
if (resp.result.username === 'admin')
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;
}
}
}
}

17
src/views/system/Platforms/Api/index.vue
View File

@ -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 {
padding-bottom: 30px;
height: calc(100vh - 230px);
overflow-y: auto;
border-right: 1px solid #e9e9e9;
.content {
background-color: #fff;
padding: 24px;
margin: 0 !important;
.tree-content {
padding-bottom: 30px;
height: calc(100vh - 230px);
overflow-y: auto;
border-right: 1px solid #e9e9e9;
}
}
}
</style>