feat: 数据采集-模版管理：增加中文词条注释

src/views/iot/device/template/component/deviceTemplateDialog.vue

@@ -1,18 +1,28 @@
 <template>
 	<div class="component-container">
 		<div class="filter-container">
+			<!-- 添加变量列表 -->
 			<el-button type="primary" icon="el-icon-circle-plus-outline" @click="openDialog('create')"> 添加变量列表 </el-button>
 		</div>
 		<el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
+			<!-- 序号 -->
 			<el-table-column label="序号" type="index" width="60" align="center" />
+			<!-- 变量名 -->
 			<el-table-column label="变量名" prop="title" align="center" show-overflow-tooltip min-width="180" />
+			<!-- 变量编码 -->
 			<el-table-column label="变量编码" prop="dataAttribName" align="center" />
+			<!-- 数据地址 -->
 			<el-table-column label="数据地址" prop="dataAddressTitle" align="center" />
+			<!-- 系数 -->
 			<el-table-column label="系数" prop="dataCoef" align="center" />
+			<!-- 存盘周期 -->
 			<el-table-column label="存盘周期" prop="saveCycle" align="center" />
+			<!-- 操作 -->
 			<el-table-column label="操作" align="center" width="180">
 				<template #default="{ row, $index }">
+					<!-- 修改 -->
 					<el-button type="primary" size="small" @click="handleUpdate(row)"> 修改 </el-button>
+					<!-- 删除 -->
 					<el-button v-if="row.status != 'deleted'" size="small" type="danger" @click="handleDelete(row, $index)"> 删除 </el-button>
 				</template>
 			</el-table-column>
@@ -23,78 +33,104 @@
 			<el-form ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="95px">
 				<el-row>
 					<el-col :span="8">
+						<!-- 变量名称 -->
 						<el-form-item label="变量名称" prop="title">
+							<!-- 请输入变量名称 -->
 							<el-input v-model="temp.title" placeholder="请输入变量名称" />
 						</el-form-item>
 					</el-col>
 					<el-col :span="8">
+						<!-- 变量编码 -->
 						<el-form-item label="变量编码" prop="dataAttribName">
+							<!-- 请输入变量编码 -->
 							<el-input v-model="temp.dataAttribName" placeholder="请输入变量编码" />
 						</el-form-item>
 					</el-col>
 					<el-col :span="8">
+						<!-- 单位 -->
 						<el-form-item label="单位" prop="unit">
+							<!-- 请输入单位 -->
 							<el-input v-model="temp.unit" placeholder="请输入单位" />
 						</el-form-item>
 					</el-col>
 				</el-row>
+				<!-- 数据来源 -->
 				<div class="label">数据来源</div>
 				<el-row>
 					<el-col :span="8" v-if="mode === 1">
+						<!-- 数据区 -->
 						<el-form-item label="数据区" prop="area">
+							<!-- 请选择数据区 -->
 							<el-select v-model="temp.area" placeholder="请选择数据区" filterable @change="handleAreaChange" style="width: 100%">
 								<el-option v-for="(item, index) in dataAreaOptions" :key="index" :label="item.name" :value="item.name" />
 							</el-select>
 						</el-form-item>
 					</el-col>
 					<el-col :span="8" v-if="mode === 1">
+						<!-- 数据地址 -->
 						<el-form-item label="数据地址" prop="dataAddress">
+							<!-- 请选择数据地址 -->
 							<el-select v-model="temp.dataAddress" placeholder="请选择数据地址" filterable class="filter-item" @change="handleSelectChange" style="width: 100%">
 								<el-option v-for="(item, index) in dataAddressOptions" :key="index" :label="item.title" :value="item.value" />
 							</el-select>
 						</el-form-item>
 					</el-col>
 					<el-col :span="8" v-if="mode === 0">
+						<!-- 数据地址 -->
 						<el-form-item label="数据地址" prop="dataAddress">
+							<!-- 请输入数据地址 -->
 							<el-input v-model="temp.dataAddress" placeholder="请输入数据地址" />
 						</el-form-item>
 					</el-col>
 					<el-col :span="8">
+						<!-- 数据类型 -->
 						<el-form-item label="数据类型" prop="dataType">
+							<!-- 请选择数据类型 -->
 							<el-select v-model="temp.dataType" placeholder="请选择数据类型" filterable style="width: 100%">
 								<el-option v-for="(item, index) in dataTypeOptions" :key="index" :label="item.title" :value="item.value" />
 							</el-select>
 						</el-form-item>
 					</el-col>
 				</el-row>
+				<!-- 数据处理 -->
 				<div class="label">数据处理</div>
 				<el-row>
 					<el-col :span="8">
+						<!-- 初始值 -->
 						<el-form-item label="初始值" prop="dataInitial">
+							<!-- 请输入 -->
 							<el-input v-model="temp.dataInitial" placeholder="请输入" />
 						</el-form-item>
 					</el-col>
 					<el-col :span="8">
+						<!-- 基值 -->
 						<el-form-item label="基值" prop="dataBaseline">
+							<!-- 请输入 -->
 							<el-input v-model="temp.dataBaseline" placeholder="请输入" />
 						</el-form-item>
 					</el-col>
 					<el-col :span="8">
+						<!-- 系数 -->
 						<el-form-item label="系数" prop="dataCoef">
+							<!-- 请输入 -->
 							<el-input v-model="temp.dataCoef" placeholder="请输入" />
 						</el-form-item>
 					</el-col>
 				</el-row>
 				<el-row>
 					<el-col :span="8">
+						<!-- 存盘周期 -->
 						<el-form-item label="存盘周期" prop="saveCycle">
+							<!-- 请输入 -->
 							<el-input v-model="temp.saveCycle" placeholder="请输入" />
 						</el-form-item>
 					</el-col>
 				</el-row>
 			</el-form>
 			<template #footer class="dialog-footer">
+				<!-- 取消 -->
 				<el-button @click="closeDialog"> 取 消 </el-button>
+				<!-- 保存 -->
 				<el-button type="primary" @click="dialogStatus === 'create' ? createData() : updateData()"> 保 存 </el-button>
 			</template>
 		</el-dialog>
@@ -199,6 +235,7 @@ export default {
 			this.getList();
 		},
 		handleDelete(row: any) {
+			// 是否确认删除变量名称为"' + row.title + '"的数据项?
 			this.$confirm('是否确认删除变量名称为"' + row.title + '"的数据项?', '警告', {
 				confirmButtonText: '确定',
 				cancelButtonText: '取消',
@@ -209,6 +246,7 @@ export default {
 				})
 				.then(() => {
 					this.getList();
+					// 删除成功
 					this.msgSuccess('删除成功');
 				})
 		},
@@ -265,6 +303,7 @@ export default {
 					api.data.editDeviceTemplate(tempData).then(() => {
 						this.handleFilter();
 						this.closeDialog();
+						// 操作成功！
 						ElMessage.success('操作成功！');
 					});
 				}

src/views/iot/device/template/component/edit.vue

@@ -2,30 +2,41 @@
 	<el-dialog :title="textMap[dialogStatus]" v-model="dialogVisible" :width="dialogWidth" :before-close="closeDialog" :close-on-click-modal="false">
 		<div class="page-full" style="height: 65vh;">
 			<el-form class="form" ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="120px" style="width: 400px">
+				<!-- 模板名称 -->
 				<el-form-item label="模板名称" prop="title">
+					<!-- 请输入模板名称 -->
 					<el-input v-model.trim="temp.title" placeholder="请输入模板名称" />
 				</el-form-item>
+				<!-- 读取模式 -->
 				<el-form-item label="读取模式" prop="mode">
+					<!-- 请选择模式 -->
 					<el-select v-model="temp.mode" placeholder="请选择模式" class="filter-item" style="width: 100%" @change="handleModeChange">
 						<!-- <el-option label="顺序读取" :value="0" /> -->
+						<!-- 批量读取 -->
 						<el-option label="批量读取" :value="1" />
 					</el-select>
 				</el-form-item>
+				<!-- 备注 -->
 				<el-form-item label="备注" prop="remarks">
+					<!-- 请输入备注 -->
 					<el-input v-model="temp.remarks" placeholder="请输入备注" />
 				</el-form-item>
 			</el-form>
 			<el-tabs v-model="activeName" v-if="dialogStatus === 'update'" :key="tabsKey">
+				<!-- 数据区 -->
 				<el-tab-pane label="数据区" name="1" v-if="temp.mode !== 0">
 					<DataAreaDialog :templateNumber="temp.number" ref="dataAreaDialog" v-if="activeName === '1'" />
 				</el-tab-pane>
+				<!-- 变量列表 -->
 				<el-tab-pane label="变量列表" name="2">
 					<DeviceTemplateDialog :templateNumber="temp.number" :mode="temp.mode" ref="deviceTemplateDialog" v-if="activeName === '2'" />
 				</el-tab-pane>
 			</el-tabs>
 		</div>
 		<template #footer class="dialog-footer">
+			<!-- 取消 -->
 			<el-button @click="closeDialog"> 取 消 </el-button>
+			<!-- 保存 -->
 			<el-button type="primary" @click="dialogStatus === 'create' ? createData() : updateData()"> 保 存 </el-button>
 		</template>
 	</el-dialog>

src/views/iot/device/template/component/importFile.vue

@@ -1,10 +1,14 @@
 <template>
+	<!-- 导入 -->
 	<el-dialog title="导入" v-model="dialogVisible" :close-on-click-modal="false" class="import-dialog" :before-close="handleClose">
+		<!-- 上传文件 -->
 		<h3 class="title">上传文件</h3>
+		<!-- 说明：请上传文件，支持格式.XLS|.XLSX -->
 		<p class="tips">说明：请上传文件，支持格式.XLS|.XLSX</p>
 		<input type="file" ref="upload" style="display: none" accept=".xls,.xlsx" class="outputlist_upload" />
 		<div class="file-box" @click="handleUpload">
 			<el-image :src="equiUploadImg" />
+			<!-- 上传文件 -->
 			<span>上传文件</span>
 		</div>
 		<div v-if="fileName" class="file-content">
@@ -14,12 +18,12 @@
 			</span>
 			<span class="el-icon-close" @click="removeFile"></span>
 		</div>
-
+		<!-- 错误信息： -->
 		<div v-if="info.length" style="color: #f00">错误信息：</div>
 		<div class="file-content" v-for="(item, index) in info" :key="index">
 			<span>{{ item }}</span>
 		</div>
-
+		<!-- 导入 -->
 		<el-button type="primary" class="import-btn" @click="handleImport" :loading="importLoading">导入</el-button>
 	</el-dialog>
 </template>
@@ -87,6 +91,7 @@ export default {
 				// 如果没有文件名
 				return false;
 			} else if (!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())) {
+				// 上传格式不正确，请上传xls或者xlsx格式！
 				ElMessage.error('上传格式不正确，请上传xls或者xlsx格式！');
 				return false;
 			}
@@ -100,6 +105,7 @@ export default {
 
 		handleImport() {
 			if (!this.fm) {
+				// 请上传文件！
 				return ElMessage.error('请上传文件！');
 			}
 			this.importLoading = true;
@@ -114,6 +120,7 @@ export default {
 						let info = res.data.Info || [];
 						this.info = info;
 						if (!info.length) {
+							// 导入成功
 							ElMessage.success('导入成功');
 						}
 					}

src/views/iot/device/template/component/list.vue

@@ -3,6 +3,7 @@
 		<el-dialog v-model="isShowDialog" :show-close="false" width="850" :fullscreen="dialogFullScreen">
 			<template #header="{ close, titleId, titleClass }">
 				<div class="my-header">
+					<!-- 数据记录 -->
 					<h4 :id="titleId" :class="titleClass">数据记录</h4>
 
 					<div>
@@ -18,7 +19,9 @@
 			</template>
 
 			<el-table :data="tableData.data" style="width: 100%" v-loading="tableData.loading">
+				<!-- 时间 -->
 				<el-table-column label="时间" prop="ts" align="center" width="180" />
+				<!-- 属性值 -->
 				<el-table-column label="属性值" prop="value" align="center" show-overflow-tooltip />
 			</el-table>
 			<pagination v-show="tableData.total > 0" :total="tableData.total" v-model:page="tableData.param.pageNum" v-model:limit="tableData.param.pageSize" @pagination="typeList" />

src/views/iot/device/template/index.vue

@@ -3,22 +3,27 @@
 		<el-card shadow="never">
 			<div class="search">
 				<el-form :model="params" inline ref="queryRef">
+					<!-- 模板名称 -->
 					<el-form-item label="模板名称" prop="title">
+						<!-- 请输入模板名称 -->
 						<el-input v-model="params.title" placeholder="请输入模板名称" clearable style="width: 240px" @keyup.enter.native="getList(1)" />
 					</el-form-item>
 					<el-form-item>
+						<!-- 查询 -->
 						<el-button type="primary" class="ml10" @click="getList(1)">
 							<el-icon>
 								<ele-Search />
 							</el-icon>
 							查询
 						</el-button>
+						<!-- 重置 -->
 						<el-button @click="resetQuery()">
 							<el-icon>
 								<ele-Refresh />
 							</el-icon>
 							重置
 						</el-button>
+						<!-- 新增模板 -->
 						<el-button type="primary" @click="addOrEdit()" v-auth="'add'">
 							<el-icon>
 								<ele-FolderAdd />
@@ -29,19 +34,29 @@
 				</el-form>
 			</div>
 			<el-table :data="tableData" style="width: 100%" v-loading="loading">
+				<!-- 序号 -->
 				<el-table-column type="index" label="序号" width="80" align="center" />
+				<!-- 模板名称 -->
 				<el-table-column prop="title" label="模板名称" align="center" show-overflow-tooltip></el-table-column>
+				<!-- 模式 -->
 				<el-table-column prop="mode" label="模式" align="center" width="120" show-overflow-tooltip>
 					<template #default="{ row }">
+						<!-- 顺序读取/批量读取 -->
 						{{ row.mode === 0 ? '顺序读取' : '批量读取' }}
 					</template>
 				</el-table-column>
+				<!-- 备注 -->
 				<el-table-column prop="remarks" label="备注" align="center" show-overflow-tooltip></el-table-column>
+				<!-- 操作 -->
 				<el-table-column label="操作" width="160" align="center">
 					<template #default="scope">
+						<!-- 导入 -->
 						<el-button size="small" text type="primary" v-auth="'upload'" @click="handleImport(scope.row)">导入</el-button>
+						<!-- 导出 -->
 						<el-button size="small" text type="primary" v-auth="'download'" @click="handleExport(scope.row)">导出</el-button>
+						<!-- 详情 -->
 						<el-button size="small" text type="primary" v-auth="'detail'" @click="addOrEdit(scope.row)">详情</el-button>
+						<!-- 删除 -->
 						<el-button size="small" text type="info" v-auth="'del'" @click="onDel(scope.row)">删除</el-button>
 					</template>
 				</el-table-column>
@@ -91,14 +106,21 @@ const resetQuery = () => {
 };
 
 const onDel = (row: any) => {
-	ElMessageBox.confirm(`此操作将删除模板：“${row.title}”，是否继续?`, '提示', {
-		confirmButtonText: '确认',
-		cancelButtonText: '取消',
-		type: 'warning',
-	}).then(async () => {
-		await api.template.deleteTemplate({ number: row.number });
-		ElMessage.success('删除成功');
-		getList();
-	});
+	// `此操作将删除模板：“${row.title}”，是否继续?
+	ElMessageBox.confirm(
+		`此操作将删除模板：“${row.title}”，是否继续?`,
+		// 提示
+		'提示',
+		{
+			// 确认
+			confirmButtonText: '确认',
+			// 取消
+			cancelButtonText: '取消',
+			type: 'warning',
+		}).then(async () => {
+			await api.template.deleteTemplate({ number: row.number });
+			ElMessage.success('删除成功');
+			getList();
+		});
 };
 </script>