|
@@ -2,7 +2,7 @@
|
|
|
<div class='app-container'>
|
|
|
<el-form inline>
|
|
|
<el-form-item label="设备名称:">
|
|
|
- <el-input v-model="data.form.name" placeholder="请输入设备名称" />
|
|
|
+ <el-input v-model="data.form.name" placeholder="请输入设备名称" clearable />
|
|
|
</el-form-item>
|
|
|
<!-- <el-form-item label="设备分类:">
|
|
|
<el-select v-model="data.form.deviceCategoryId" placeholder="请选择设备分类">
|
|
@@ -10,12 +10,17 @@
|
|
|
</el-select>
|
|
|
</el-form-item> -->
|
|
|
<el-form-item label="所属企业:">
|
|
|
- <el-select v-model="data.form.tenantId" placeholder="请选择所属企业">
|
|
|
+ <el-select v-model="data.form.tenantId" placeholder="请选择所属企业" clearable>
|
|
|
<el-option v-for="item in businessData.options" :key="item.id" :value="item.id" :label="item.name" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="当前状态:">
|
|
|
- <el-select v-model="data.form.status" placeholder="请选择当前状态">
|
|
|
+ <el-form-item label="设备状态:">
|
|
|
+ <el-select v-model="data.form.deviceStatus" placeholder="请选择当前状态" clearable>
|
|
|
+ <el-option v-for="item in dev_change_status" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="绑定状态:">
|
|
|
+ <el-select v-model="data.form.status" placeholder="请选择当前状态" clearable>
|
|
|
<el-option v-for="item in sys_change_status" :key="item.value" :value="item.value" :label="item.label" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
@@ -24,22 +29,23 @@
|
|
|
<el-button icon="Refresh" @click="getRefresh">重置</el-button>
|
|
|
<el-button type="primary" plain icon="Plus" @click="getDialog()">关联设备</el-button>
|
|
|
</el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button icon="Expand" @click="grid = false" />
|
|
|
- <el-button icon="Grid" @click="grid = true" />
|
|
|
- </el-form-item>
|
|
|
+ <!-- <el-form-item>
|
|
|
+ <el-button icon="Grid" title="九宫格" @click="grid = true" />
|
|
|
+ <el-button icon="Expand" title="列表" @click="grid = false" />
|
|
|
+ </el-form-item> -->
|
|
|
</el-form>
|
|
|
<!-- 列表 -->
|
|
|
- <el-table v-if="!grid" :data="data.tableData" v-loading="loading">
|
|
|
- <el-table-column label="设备名称" prop="deviceName" align="center"></el-table-column>
|
|
|
- <el-table-column label="设备型号" prop="clientType" align="center"></el-table-column>
|
|
|
+ <el-table :data="data.tableData" v-loading="loading">
|
|
|
+ <el-table-column label="设备名称" prop="deviceName" align="center" />
|
|
|
+ <el-table-column label="设备型号" prop="clientType" align="center" />
|
|
|
+ <el-table-column label="设备Mac" prop="deviceMac" align="center" />
|
|
|
<el-table-column label="设备图片" align="center" width="100px">
|
|
|
<template #default="scope">
|
|
|
<el-image :src="scope.row.devicePic" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="设备分类" prop="deviceCategoryName" align="center"></el-table-column>
|
|
|
- <el-table-column label="所属门店" prop="storeName" align="center"></el-table-column>
|
|
|
+ <el-table-column label="设备分类" prop="deviceCategoryName" align="center" />
|
|
|
+ <el-table-column label="所属门店" prop="storeName" align="center" />
|
|
|
<el-table-column label="所属城市" align="center">
|
|
|
<template #default="scope">
|
|
|
<span>{{ scope.row.provinceName }}</span>
|
|
@@ -47,7 +53,12 @@
|
|
|
<span v-if="scope.row.areaName"> - {{ scope.row.areaName }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="当前状态" prop="status" align="center">
|
|
|
+ <el-table-column label="设备状态" prop="status" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :options="dev_change_status" :value="scope.row.deviceStatus" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="绑定状态" prop="status" align="center">
|
|
|
<template #default="scope">
|
|
|
<dict-tag :options="sys_change_status" :value="scope.row.status" />
|
|
|
</template>
|
|
@@ -62,10 +73,10 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
- <div v-else class="card_box">
|
|
|
+ <!-- <div v-else class="card_box">
|
|
|
<div class="card" v-for="item in data.tableData" :key="item">
|
|
|
<div class="card-header">
|
|
|
- <i class="state" />
|
|
|
+ <i class="state" :style="{ 'backgroundColor': item.deviceStatus === 0 ? '#8aff5b' : '#ff0000' }" />
|
|
|
<el-dropdown>
|
|
|
<el-icon>
|
|
|
<MoreFilled />
|
|
@@ -81,10 +92,11 @@
|
|
|
</template>
|
|
|
</el-dropdown>
|
|
|
</div>
|
|
|
- <el-image class="icon" src="" />
|
|
|
- <span class="name">猫王音响·Mate X1</span>
|
|
|
+ <span class="name">{{ item.deviceName }}</span>
|
|
|
+ <el-image class="icon" :src="item.devicePic" />
|
|
|
+
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
<pagination v-show="total > 0" :total="total" v-model:page="data.form.pageNum" v-model:limit="data.form.pageSize"
|
|
|
@pagination="getList" />
|
|
|
|
|
@@ -132,7 +144,7 @@ const { deviceOptions } = useDeviceList()
|
|
|
|
|
|
const { proxy } = getCurrentInstance()
|
|
|
|
|
|
-const { sys_change_status } = proxy.useDict("sys_change_status");
|
|
|
+const { sys_change_status, dev_change_status } = proxy.useDict("sys_change_status", "dev_change_status");
|
|
|
// 遮罩层
|
|
|
const loading = ref(false)
|
|
|
|
|
@@ -165,7 +177,7 @@ const data = reactive({
|
|
|
|
|
|
const total = ref(0)
|
|
|
|
|
|
-const grid = ref(false)
|
|
|
+const grid = ref(true)
|
|
|
|
|
|
// 列表
|
|
|
const getList = () => {
|
|
@@ -306,15 +318,15 @@ watch(() => data.dialogForm.tenantId, (val) => {
|
|
|
.state {
|
|
|
width: 10px;
|
|
|
height: 10px;
|
|
|
- background-color: #8aff5b;
|
|
|
border-radius: 50%;
|
|
|
display: inline-block;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.icon {
|
|
|
+ width: 180px;
|
|
|
+ height: 140px;
|
|
|
padding: 0 20px;
|
|
|
- height: 110px;
|
|
|
margin: 15px 0;
|
|
|
}
|
|
|
|