refactor(设备管理): 替换dict-tag为el-tag并优化按钮图标显示

统一将字典标签组件dict-tag替换为el-tag组件,使用不同颜色区分状态
优化按钮图标显示方式,使用i标签替代icon属性
调整radio-group的value绑定方式为label属性
This commit is contained in:
2025-09-30 18:33:26 +08:00
parent 5e252eccae
commit 924e6b8a54
4 changed files with 110 additions and 76 deletions

View File

@@ -31,7 +31,7 @@
<el-table-column prop="supplier" label="设备厂商" align="center" v-if="columns.showColumn('supplier')" />
<el-table-column prop="status" label="设备状态" align="center" v-if="columns.showColumn('status')">
<template #default="scope">
<dict-tag :options="options.statusOptions" :value="scope.row.status" />
<el-tag :type="scope.row.status === 1 ? 'success' : 'danger'">{{ scope.row.status === 1 ? '启用' : '停用' }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="deviceImage" label="设备图片" align="center" v-if="columns.showColumn('deviceImage')">
@@ -59,7 +59,7 @@
<el-table-column prop="updatedTime" label="更新时间" v-if="columns.showColumn('updatedTime')" />
<el-table-column label="操作">
<template #default="scope">
<el-button type="danger" size="small" icon="delete" title="删除" @click="handleDelete(scope.row)"></el-button>
<el-button type="danger" size="small" icon="el-icon-delete" title="删除" @click="handleDelete(scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
@@ -76,9 +76,9 @@
</el-form-item>
<el-form-item label="设备状态" prop="status">
<el-radio-group v-model="queryParams2.status" @click="handleQuery2">
<el-radio-button :value="-1">全部</el-radio-button>
<el-radio-button :value="1">启用</el-radio-button>
<el-radio-button :value="0">停用</el-radio-button>
<el-radio-button :label="-1">全部</el-radio-button>
<el-radio-button :label="1">启用</el-radio-button>
<el-radio-button :label="0">停用</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item>

View File

@@ -3,8 +3,9 @@
<!-- 工具区域 -->
<el-row :gutter="15" class="mb10">
<el-col :span="1.5">
<el-button type="primary" plain icon="plus" @click="handleAdd">
新增
<el-button type="primary" plain @click="handleAdd">
<i class="el-icon-plus"></i>
<span>新增</span>
</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
@@ -19,16 +20,11 @@
highlight-current-row
@sort-change="sortChange">
<el-table-column prop="id" label="设备台账id" align="center" v-if="columns.showColumn('id')" />
<el-table-column prop="fkDeviceType" label="设备类型" align="center" v-if="columns.showColumn('fkDeviceType')">
<template #default="scope">
<dict-tag :options="options.fkDeviceTypeOptions" :value="scope.row.fkDeviceType" />
</template>
</el-table-column>
<el-table-column prop="deviceName" label="设备名称" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('deviceName')" />
<el-table-column prop="workshop" label="所属车间" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('workshop')" />
<el-table-column prop="workline" label="所属产线" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('workline')" />
<el-table-column prop="purchaseTime" label="购买时间" :show-overflow-tooltip="true" v-if="columns.showColumn('purchaseTime')" />
<el-table-column prop="supplier" label="设备厂商" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('supplier')" />
<el-table-column prop="deviceName" label="设备名称" align="center" v-if="columns.showColumn('deviceName')" />
<el-table-column prop="workshop" label="所属车间" align="center" v-if="columns.showColumn('workshop')" />
<el-table-column prop="workline" label="所属产线" align="center" v-if="columns.showColumn('workline')" />
<el-table-column prop="purchaseTime" label="购买时间" v-if="columns.showColumn('purchaseTime')" />
<el-table-column prop="supplier" label="设备厂商" align="center" v-if="columns.showColumn('supplier')" />
<el-table-column prop="status" label="设备状态" align="center" v-if="columns.showColumn('status')">
<template #default="scope">
<dict-tag :options="options.statusOptions" :value="scope.row.status" />
@@ -39,27 +35,28 @@
<el-image :src="scope.row.deviceImage"></el-image>
</template>
</el-table-column>
<el-table-column prop="deviceFile" label="设备文件" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('deviceFile')" />
<el-table-column
prop="deviceSpecification"
label="设备规格"
align="center"
:show-overflow-tooltip="true"
v-if="columns.showColumn('deviceSpecification')" />
<el-table-column
prop="responsiblePerson"
label="设备负责人"
align="center"
:show-overflow-tooltip="true"
v-if="columns.showColumn('responsiblePerson')" />
<el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('remark')" />
<el-table-column prop="createdBy" label="创建人" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('createdBy')" />
<el-table-column prop="createdTime" label="创建时间" :show-overflow-tooltip="true" v-if="columns.showColumn('createdTime')" />
<el-table-column prop="updatedBy" label="更新人" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('updatedBy')" />
<el-table-column prop="updatedTime" label="更新时间" :show-overflow-tooltip="true" v-if="columns.showColumn('updatedTime')" />
<el-table-column prop="remark" label="备注" align="center" v-if="columns.showColumn('remark')" />
<el-table-column prop="createdBy" label="创建人" align="center" v-if="columns.showColumn('createdBy')" />
<el-table-column prop="createdTime" label="创建时间" v-if="columns.showColumn('createdTime')" />
<el-table-column prop="updatedBy" label="更新人" align="center" v-if="columns.showColumn('updatedBy')" />
<el-table-column prop="updatedTime" label="更新时间" v-if="columns.showColumn('updatedTime')" />
<el-table-column label="操作">
<template #default="scope">
<el-button type="danger" size="small" icon="delete" title="删除" @click="handleDelete(scope.row)"></el-button>
<el-button type="danger" size="small" title="删除" @click="handleDelete(scope.row)">
<i class="el-icon-delete"></i>
</el-button>
</template>
</el-table-column>
</el-table>
@@ -76,21 +73,28 @@
</el-form-item>
<el-form-item label="设备状态" prop="status">
<el-radio-group v-model="queryParams2.status" @click="handleQuery2">
<el-radio-button :value="-1">全部</el-radio-button>
<el-radio-button :value="1">启用</el-radio-button>
<el-radio-button :value="0">停用</el-radio-button>
<el-radio-button :label="-1">全部</el-radio-button>
<el-radio-button :label="1">启用</el-radio-button>
<el-radio-button :label="0">停用</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-button icon="search" type="primary" @click="handleQuery2">查询</el-button>
<el-button icon="refresh" @click="resetQuery2">重置</el-button>
<el-button type="primary" @click="handleQuery2">
<i class="el-icon-search"></i>
<span>查询</span>
</el-button>
<el-button @click="resetQuery2">
<i class="el-icon-refresh"></i>
<span>重置</span>
</el-button>
</el-form-item>
</el-form>
<!-- 工具区域 -->
<el-row :gutter="15" class="mb10">
<el-col :span="1.5">
<el-button type="success" plain icon="plus" @click="handleBind">
新增
<el-button type="success" plain @click="handleBind">
<i class="el-icon-plus"></i>
<span>新增</span>
</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch2" @queryTable="getList" :columns="columns"></right-toolbar>
@@ -108,17 +112,17 @@
<el-table-column type="selection" width="55" />
<el-table-column prop="id" label="设备台账id" align="center" v-if="columns.showColumn('id')" />
<el-table-column prop="deviceName" label="设备名称" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('deviceName')" />
<el-table-column prop="deviceName" label="设备名称" align="center" v-if="columns.showColumn('deviceName')" />
<el-table-column
prop="deviceCode"
label="设备编号(二维码)"
align="center"
:show-overflow-tooltip="true"
v-if="columns.showColumn('deviceCode')" />
<el-table-column prop="workshop" label="所属车间" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('workshop')" />
<el-table-column prop="workline" label="所属产线" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('workline')" />
<el-table-column prop="purchaseTime" label="购买时间" :show-overflow-tooltip="true" v-if="columns.showColumn('purchaseTime')" />
<el-table-column prop="supplier" label="设备厂商" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('supplier')" />
<el-table-column prop="workshop" label="所属车间" align="center" v-if="columns.showColumn('workshop')" />
<el-table-column prop="workline" label="所属产线" align="center" v-if="columns.showColumn('workline')" />
<el-table-column prop="purchaseTime" label="购买时间" v-if="columns.showColumn('purchaseTime')" />
<el-table-column prop="supplier" label="设备厂商" align="center" v-if="columns.showColumn('supplier')" />
<el-table-column prop="status" label="设备状态" align="center" v-if="columns.showColumn('status')">
<template #default="scope">
<dict-tag :options="options.statusOptions" :value="scope.row.status" />
@@ -129,29 +133,29 @@
<el-image :src="scope.row.deviceImage"></el-image>
</template>
</el-table-column>
<el-table-column prop="deviceFile" label="设备文件" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('deviceFile')" />
<el-table-column prop="deviceFile" label="设备文件" align="center" v-if="columns.showColumn('deviceFile')" />
<el-table-column
prop="deviceSpecification"
label="设备规格"
align="center"
:show-overflow-tooltip="true"
v-if="columns.showColumn('deviceSpecification')" />
<el-table-column
prop="responsiblePerson"
label="设备负责人"
align="center"
:show-overflow-tooltip="true"
v-if="columns.showColumn('responsiblePerson')" />
<el-table-column prop="fkDeviceType" label="设备类型" align="center" v-if="columns.showColumn('fkDeviceType')">
<template #default="scope">
<dict-tag :options="options.fkDeviceTypeOptions" :value="scope.row.fkDeviceType" />
</template>
</el-table-column>
<el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('remark')" />
<el-table-column prop="createdBy" label="创建人" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('createdBy')" />
<el-table-column prop="createdTime" label="创建时间" :show-overflow-tooltip="true" v-if="columns.showColumn('createdTime')" />
<el-table-column prop="updatedBy" label="更新人" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('updatedBy')" />
<el-table-column prop="updatedTime" label="更新时间" :show-overflow-tooltip="true" v-if="columns.showColumn('updatedTime')" />
<el-table-column prop="remark" label="备注" align="center" v-if="columns.showColumn('remark')" />
<el-table-column prop="createdBy" label="创建人" align="center" v-if="columns.showColumn('createdBy')" />
<el-table-column prop="createdTime" label="创建时间" v-if="columns.showColumn('createdTime')" />
<el-table-column prop="updatedBy" label="更新人" align="center" v-if="columns.showColumn('updatedBy')" />
<el-table-column prop="updatedTime" label="更新时间" v-if="columns.showColumn('updatedTime')" />
</el-table>
<pagination :total="total2" v-model:page="queryParams2.pageNum" v-model:limit="queryParams2.pageSize" @pagination="getList_nobind" />

View File

@@ -53,7 +53,7 @@
<el-table-column prop="name" label="点检检名称" align="center" :show-overflow-tooltip="true" v-if="columns_showColumn('name')" />
<el-table-column prop="innerType" label="类别" align="center" v-if="columns_showColumn('innerType')">
<template slot-scope="scope">
<dict-tag :options="options.innerTypeOptions" :value="scope.row.innerType" />
<el-tag :type="scope.row.innerType === 1 ? 'success' : 'primary'">{{ scope.row.innerType === 1 ? '检查' : '保养' }}</el-tag>
</template>
</el-table-column>
<el-table-column label="添加设备" align="center">
@@ -72,7 +72,7 @@
<el-table-column prop="status" label="点检状态" align="center" v-if="columns_showColumn('status')">
<template slot-scope="scope">
<dict-tag :options="options.statusOptions" :value="scope.row.status" />
<el-tag :type="scope.row.status === 1 ? 'success' : 'danger'">{{ scope.row.status === 1 ? '启用' : '停用' }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true" v-if="columns_showColumn('remark')" />
@@ -108,7 +108,8 @@
<el-col :lg="12">
<el-form-item label="类别" prop="innerType">
<el-radio-group v-model="form.innerType">
<el-radio v-for="item in options.innerTypeOptions" :key="item.dictValue" :value="parseInt(item.dictValue)" :label="item.dictLabel">
<el-radio v-for="item in options.innerTypeOptions" :key="item.dictValue" :label="item.dictValue">
{{ item.dictLabel }}
</el-radio>
</el-radio-group>
</el-form-item>
@@ -116,7 +117,8 @@
<el-col :lg="12">
<el-form-item label="点检状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio v-for="item in options.statusOptions" :key="item.dictValue" :value="parseInt(item.dictValue)" :label="item.dictLabel">
<el-radio v-for="item in options.statusOptions" :key="item.dictValue" :label="item.dictValue">
{{ item.dictLabel }}
</el-radio>
</el-radio-group>
</el-form-item>
@@ -139,7 +141,7 @@
<Devicelist :message="messageFromParent" :flag="point"></Devicelist>
<template slot="footer">
<el-button text @click="open_device = false">取消</el-button>
<el-button type="primary" @click="open_device = false">提交</el-button>
<el-button type="primary" @click="open_device = false">确认</el-button>
</template>
</el-dialog>
</div>

View File

@@ -14,9 +14,9 @@
</el-form-item>
<el-form-item label="类别" prop="innerType">
<el-radio-group v-model="queryParams.innerType" @change="handleQuery">
<el-radio-button label="全部" :value="-1" />
<el-radio-button label="检查" :value="1" />
<el-radio-button label="保养" :value="2" />
<el-radio-button :label="-1">全部</el-radio-button>
<el-radio-button :label="1">检查</el-radio-button>
<el-radio-button :label="2">保养</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="巡检类型" prop="excuteCycleType">
@@ -26,21 +26,28 @@
</el-form-item>
<el-form-item label="巡检状态" prop="status">
<el-radio-group v-model="queryParams.status" @change="handleQuery">
<el-radio-button label="全部" :value="-1" />
<el-radio-button label="停用" :value="0" />
<el-radio-button label="启用" :value="1" />
<el-radio-button :label="-1">全部</el-radio-button>
<el-radio-button :label="0">停用</el-radio-button>
<el-radio-button :label="1">启用</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-button icon="search" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="refresh" @click="resetQuery">重置</el-button>
<el-button type="primary" @click="handleQuery">
<i class="el-icon-search"></i>
<span>搜索</span>
</el-button>
<el-button @click="resetQuery">
<i class="el-icon-refresh"></i>
<span>重置</span>
</el-button>
</el-form-item>
</el-form>
<!-- 工具区域 -->
<el-row :gutter="15" class="mb10">
<el-col :span="1.5">
<el-button type="primary" v-hasPermi="['deviceManagement:devicerouteinspectionplan:add']" plain icon="plus" @click="handleAdd">
新增
<el-button type="primary" v-hasPermi="['deviceManagement:devicerouteinspectionplan:add']" plain @click="handleAdd">
<i class="el-icon-plus"></i>
<span>新增</span>
</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
@@ -51,18 +58,22 @@
<el-table-column prop="name" label="巡检名称" align="center" :show-overflow-tooltip="true" v-if="showColumn('name')" />
<el-table-column prop="innerType" label="类别" align="center" v-if="showColumn('innerType')">
<template slot="default" slot-scope="scope">
<dict-tag :options="options.innerTypeOptions" :value="scope.row.innerType" />
<el-tag :type="scope.row.innerType === 1 ? 'success' : 'warning'">{{ scope.row.innerType === 1 ? '检查' : '保养' }}</el-tag>
</template>
</el-table-column>
<!-- <el-table-column prop="fkPersonId" label="执行人" align="center" :show-overflow-tooltip="true" v-if="showColumn('fkPersonId')" /> -->
<el-table-column label="添加设备" align="center">
<template slot="default" slot-scope="scope">
<el-button type="primary" size="small" icon="MessageBox" title="添加设备" @click="AddDevice(scope.row)"></el-button>
<el-button type="primary" size="small" title="添加设备" @click="AddDevice(scope.row)">
<i class="el-icon-folder-add"></i>
</el-button>
</template>
</el-table-column>
<el-table-column prop="excuteCycleType" label="执行周期类型" align="center" v-if="showColumn('excuteCycleType')">
<template slot="default" slot-scope="scope">
<dict-tag :options="options.excuteCycleTypeOptions" :value="scope.row.excuteCycleType" />
<el-tag v-if="scope.row.excuteCycleType === 1" type="primary">按天</el-tag>
<el-tag v-else-if="scope.row.excuteCycleType === 2" type="warning">按周</el-tag>
<el-tag v-else-if="scope.row.excuteCycleType === 3" type="success">按月</el-tag>
</template>
</el-table-column>
<el-table-column prop="dayNum" label="每第几天" align="center" v-if="showColumn('dayNum')" />
@@ -82,22 +93,26 @@
v-if="showColumn('excuteDayStartTime')" /> -->
<el-table-column prop="status" label="巡检状态" align="center" v-if="showColumn('status')">
<template slot="default" slot-scope="scope">
<dict-tag :options="options.statusOptions" :value="scope.row.status" />
<el-tag :type="scope.row.status === 1 ? 'success' : 'danger'">{{ scope.row.status === 1 ? '启用' : '停用' }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true" v-if="showColumn('remark')" />
<el-table-column label="操作" width="160">
<template slot="default" slot-scope="scope">
<el-button type="success" size="small" icon="edit" title="编辑" @click="handleUpdate(scope.row)"></el-button>
<el-button type="danger" size="small" icon="delete" title="删除" @click="handleDelete(scope.row)"></el-button>
<el-button type="success" size="small" title="编辑" @click="handleUpdate(scope.row)">
<i class="el-icon-edit"></i>
</el-button>
<el-button type="danger" size="small" title="删除" @click="handleDelete(scope.row)">
<i class="el-icon-delete"></i>
</el-button>
</template>
</el-table-column>
</el-table>
<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
<!-- 添加或修改巡检计划对话框 -->
<el-dialog :title="title" :lock-scroll="false" :close-on-click-modal="false" v-model="open">
<el-dialog :title="title" :lock-scroll="false" :close-on-click-modal="false" :visible.sync="open" width="60%">
<el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
<el-row :gutter="20">
<el-col :lg="12">
@@ -108,7 +123,8 @@
<el-col :lg="12">
<el-form-item label="类别" prop="innerType">
<el-radio-group v-model="form.innerType">
<el-radio v-for="item in options.innerTypeOptions" :key="item.dictValue" :value="parseInt(item.dictValue)" :label="item.dictLabel">
<el-radio v-for="item in options.innerTypeOptions" :key="item.dictValue" :label="parseInt(item.dictValue)">
{{ item.dictLabel }}
</el-radio>
</el-radio-group>
</el-form-item>
@@ -164,7 +180,7 @@
<el-col :lg="12">
<el-form-item label="巡检状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio v-for="item in options.statusOptions" :key="item.dictValue" :value="parseInt(item.dictValue)">
<el-radio v-for="item in options.statusOptions" :key="item.dictValue" :label="parseInt(item.dictValue)">
{{ item.dictLabel }}
</el-radio>
</el-radio-group>
@@ -178,16 +194,28 @@
</el-row>
</el-form>
<template slot="footer" v-if="opertype != 3">
<el-button text @click="cancel">取消</el-button>
<el-button type="primary" @click="submitForm">提交</el-button>
<el-button @click="cancel">
<i class="el-icon-circle-close"></i>
<span>取消</span>
</el-button>
<el-button type="primary" @click="submitForm">
<i class="el-icon-check"></i>
<span>提交</span>
</el-button>
</template>
</el-dialog>
<el-dialog title="添加设备" :lock-scroll="false" v-model="open_device">
<el-dialog title="添加设备" :lock-scroll="false" :visible.sync="open_device" width="80%">
<Devicelist :message="messageFromParent"></Devicelist>
<template slot="footer">
<el-button text @click="open_device = false">取消</el-button>
<el-button type="primary" @click="open_device = false">提交</el-button>
<el-button @click="open_device = false">
<i class="el-icon-circle-close"></i>
<span>取消</span>
</el-button>
<el-button type="primary" @click="open_device = false">
<i class="el-icon-check"></i>
<span>提交</span>
</el-button>
</template>
</el-dialog>
</div>