fix: iot
This commit is contained in:
xingyu4j
@@ -345,7 +345,7 @@ onMounted(async () => {
|
||||
<Button
|
||||
type="primary"
|
||||
@click="handleCreate"
|
||||
v-hasPermi="['iot:device:create']"
|
||||
v-access:code="['iot:device:create']"
|
||||
>
|
||||
<IconifyIcon icon="ant-design:plus-outlined" class="mr-1" />
|
||||
新增
|
||||
@@ -353,19 +353,19 @@ onMounted(async () => {
|
||||
<Button
|
||||
type="primary"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['iot:device:export']"
|
||||
v-access:code="['iot:device:export']"
|
||||
>
|
||||
<IconifyIcon icon="ant-design:download-outlined" class="mr-1" />
|
||||
导出
|
||||
</Button>
|
||||
<Button @click="handleImport" v-hasPermi="['iot:device:import']">
|
||||
<Button @click="handleImport" v-access:code="['iot:device:import']">
|
||||
<IconifyIcon icon="ant-design:upload-outlined" class="mr-1" />
|
||||
导入
|
||||
</Button>
|
||||
<Button
|
||||
v-show="viewMode === 'list'"
|
||||
@click="handleAddToGroup"
|
||||
v-hasPermi="['iot:device:update']"
|
||||
v-access:code="['iot:device:update']"
|
||||
>
|
||||
<IconifyIcon icon="ant-design:folder-add-outlined" class="mr-1" />
|
||||
添加到分组
|
||||
@@ -374,7 +374,7 @@ onMounted(async () => {
|
||||
v-show="viewMode === 'list'"
|
||||
danger
|
||||
@click="handleDeleteBatch"
|
||||
v-hasPermi="['iot:device:delete']"
|
||||
v-access:code="['iot:device:delete']"
|
||||
>
|
||||
<IconifyIcon icon="ant-design:delete-outlined" class="mr-1" />
|
||||
批量删除
|
||||
|
||||
@@ -53,13 +53,13 @@ const queryParams = ref({
|
||||
});
|
||||
|
||||
// 获取产品名称
|
||||
const getProductName = (productId: number) => {
|
||||
function getProductName(productId: number) {
|
||||
const product = props.products.find((p: any) => p.id === productId);
|
||||
return product?.name || '-';
|
||||
};
|
||||
}
|
||||
|
||||
// 获取设备列表
|
||||
const getList = async () => {
|
||||
async function getList() {
|
||||
loading.value = true;
|
||||
try {
|
||||
const data = await getDevicePage({
|
||||
@@ -71,26 +71,26 @@ const getList = async () => {
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// 处理页码变化
|
||||
const handlePageChange = (page: number, pageSize: number) => {
|
||||
function handlePageChange(page: number, pageSize: number) {
|
||||
queryParams.value.pageNo = page;
|
||||
queryParams.value.pageSize = pageSize;
|
||||
getList();
|
||||
};
|
||||
}
|
||||
|
||||
// 获取设备类型颜色
|
||||
const getDeviceTypeColor = (deviceType: number) => {
|
||||
function getDeviceTypeColor(deviceType: number) {
|
||||
const colors: Record<number, string> = {
|
||||
0: 'blue',
|
||||
1: 'cyan',
|
||||
};
|
||||
return colors[deviceType] || 'default';
|
||||
};
|
||||
}
|
||||
|
||||
// 获取设备状态信息
|
||||
const getStatusInfo = (state: number) => {
|
||||
function getStatusInfo(state: number) {
|
||||
if (state === DeviceStateEnum.ONLINE) {
|
||||
return {
|
||||
text: '在线',
|
||||
@@ -105,7 +105,7 @@ const getStatusInfo = (state: number) => {
|
||||
bgColor: '#fff1f0',
|
||||
borderColor: '#ffccc7',
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
@@ -171,7 +171,7 @@ defineExpose({
|
||||
<a
|
||||
class="value link"
|
||||
@click="
|
||||
(e: MouseEvent) => {
|
||||
(e) => {
|
||||
e.stopPropagation();
|
||||
emit('productDetail', item.productId);
|
||||
}
|
||||
@@ -209,7 +209,7 @@ defineExpose({
|
||||
size="small"
|
||||
class="action-btn btn-edit"
|
||||
@click="
|
||||
(e: MouseEvent) => {
|
||||
(e) => {
|
||||
e.stopPropagation();
|
||||
emit('edit', item);
|
||||
}
|
||||
@@ -289,23 +289,23 @@ defineExpose({
|
||||
.device-card-view {
|
||||
.device-card {
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
box-shadow:
|
||||
0 1px 2px 0 rgba(0, 0, 0, 0.03),
|
||||
0 1px 6px -1px rgba(0, 0, 0, 0.02),
|
||||
0 2px 4px 0 rgba(0, 0, 0, 0.02);
|
||||
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
border: 1px solid #f0f0f0;
|
||||
background: #fff;
|
||||
border: 1px solid #f0f0f0;
|
||||
border-radius: 8px;
|
||||
box-shadow:
|
||||
0 1px 2px 0 rgb(0 0 0 / 3%),
|
||||
0 1px 6px -1px rgb(0 0 0 / 2%),
|
||||
0 2px 4px 0 rgb(0 0 0 / 2%);
|
||||
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
|
||||
&:hover {
|
||||
box-shadow:
|
||||
0 1px 2px -2px rgba(0, 0, 0, 0.16),
|
||||
0 3px 6px 0 rgba(0, 0, 0, 0.12),
|
||||
0 5px 12px 4px rgba(0, 0, 0, 0.09);
|
||||
transform: translateY(-4px);
|
||||
border-color: #e6e6e6;
|
||||
box-shadow:
|
||||
0 1px 2px -2px rgb(0 0 0 / 16%),
|
||||
0 3px 6px 0 rgb(0 0 0 / 12%),
|
||||
0 5px 12px 4px rgb(0 0 0 / 9%);
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
:deep(.ant-card-body) {
|
||||
@@ -313,10 +313,10 @@ defineExpose({
|
||||
}
|
||||
|
||||
.card-content {
|
||||
padding: 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
// 头部区域
|
||||
@@ -327,48 +327,48 @@ defineExpose({
|
||||
margin-bottom: 16px;
|
||||
|
||||
.device-icon {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 6px;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
font-size: 18px;
|
||||
box-shadow: 0 2px 8px rgba(102, 126, 234, 0.25);
|
||||
color: #fff;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 8px rgb(102 126 234 / 25%);
|
||||
}
|
||||
|
||||
.status-badge {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
padding: 2px 10px;
|
||||
border-radius: 12px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
border: 1px solid;
|
||||
line-height: 18px;
|
||||
border: 1px solid;
|
||||
border-radius: 12px;
|
||||
|
||||
.status-dot {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: currentcolor;
|
||||
border-radius: 50%;
|
||||
background: currentColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 设备名称
|
||||
.device-name {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #262626;
|
||||
margin-bottom: 16px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 24px;
|
||||
color: #262626;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// 信息区域
|
||||
@@ -378,30 +378,30 @@ defineExpose({
|
||||
|
||||
.info-item {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12px;
|
||||
gap: 8px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.label {
|
||||
flex-shrink: 0;
|
||||
font-size: 13px;
|
||||
color: #8c8c8c;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.value {
|
||||
font-size: 13px;
|
||||
color: #262626;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 13px;
|
||||
color: #262626;
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
|
||||
&.link {
|
||||
color: #1890ff;
|
||||
@@ -415,11 +415,10 @@ defineExpose({
|
||||
|
||||
&.code {
|
||||
font-family:
|
||||
'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', 'Consolas',
|
||||
monospace;
|
||||
'SF Mono', Monaco, Inconsolata, 'Fira Code', Consolas, monospace;
|
||||
font-size: 12px;
|
||||
color: #595959;
|
||||
font-weight: 500;
|
||||
color: #595959;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -427,28 +426,28 @@ defineExpose({
|
||||
|
||||
// 操作按钮栏
|
||||
.action-bar {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid #f5f5f5;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
||||
.action-btn {
|
||||
flex: 1;
|
||||
height: 32px;
|
||||
padding: 4px 8px;
|
||||
border-radius: 6px;
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
transition: all 0.2s;
|
||||
height: 32px;
|
||||
padding: 4px 8px;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
border: 1px solid;
|
||||
cursor: pointer;
|
||||
pointer-events: auto;
|
||||
cursor: pointer;
|
||||
border: 1px solid;
|
||||
border-radius: 6px;
|
||||
transition: all 0.2s;
|
||||
|
||||
:deep(.anticon) {
|
||||
font-size: 16px;
|
||||
|
||||
@@ -60,7 +60,7 @@ function goToProductDetail(productId: number | undefined) {
|
||||
<!-- 右上：按钮 -->
|
||||
<Button
|
||||
v-if="product.status === 0"
|
||||
v-hasPermi="['iot:device:update']"
|
||||
v-access:code="['iot:device:update']"
|
||||
@click="openForm('update', device.id)"
|
||||
>
|
||||
编辑
|
||||
|
||||
Reference in New Issue
Block a user