update 小修改“

Reviewed-on: mt-fe-group/mt-yd-ui#4

.dockerignore

@@ -0,0 +1,7 @@
+.vscode/
+.idea/
+node_modules/
+dist/
+**/*.log
+LICENSE
+README.md

.drone.yml

@@ -0,0 +1,52 @@
+---
+kind: pipeline
+type: docker
+name: default
+
+steps:
+- name: build
+  image: docker:dind
+  volumes:
+  - name: dockersock
+    path: /var/run/docker.sock
+  - name: dockerconfig
+    path: /root/.docker
+  commands:
+  - docker build -t harbor.picaiba.com/kszny/mes-ui:1.0.0-india ./ && docker push harbor.picaiba.com/kszny/mes-ui:1.0.0-india
+
+- name: deploy
+  image: harbor.picaiba.com/tools/kubectl:1.19.8
+  commands:
+  - echo "172.27.0.20 lb.kubesphere.local" >> /etc/hosts
+  #- echo "52.74.223.119 github.com" >> /etc/hosts
+  - sleep 1
+  - kubectl scale --replicas=0 deployment/mes-ui -n mes-india
+  - sleep 3
+  - kubectl scale --replicas=1 deployment/mes-ui -n mes-india
+  depends_on:
+  - build
+
+- name: notification
+  image: lddsb/drone-dingtalk-message
+  settings:
+    token: 37a6483274f6de648a26d6710e4d8160eb7d471752abb2d70f8b7958af58fe11
+    type: markdown
+    secret: SEC83b10f5fefd6127e4073360d4447bb7276a90386aeee1275b2797dd377a903e7
+    tpl: http://res.picaiba.com/msg/msg.md
+    tips_title: 你有新消息
+    success_color: 008800
+    failure_color: FF0000
+
+volumes:
+- name: dockersock
+  host:
+    path: /var/run/docker.sock
+- name: dockerconfig
+  host:
+    path: /root/.docker
+
+trigger:
+  branch:
+  - develop
+  event:
+  - push

.prettierrc

@@ -2,6 +2,7 @@
 	"singleQuote": true,
 	"tabWidth": 2,
 	"bracketSameLine": true,
+	"jsxBracketSameLine": true,
 	"embeddedLanguageFormatting": "auto",
 	"printWidth": 180,
 	"quoteProps": "consistent",

AddOrUpdateConfig.md

@@ -2,6 +2,82 @@
 
 > 通过传入合理的配置项来使用 addOrUpdate Dialog
 
+## 用途
+
+通过给对话框传递配置项，并自动根据这些配置项来初始化对话框的功能
+
+## props
+
+- configs 对象
+
+```
+<my-dialog :configs="SomeConfigs" ... />
+
+
+type Operation = {
+		name: 'add' | 'edit' | 'detail' | 'delete' | ...,
+		url: string, /** 该操作需要的接口地址，如删除接口 */
+		showAlways: boolean,
+		showOnEdit: boolean,
+		permission: string,
+	}
+
+type SubTableConfig = {
+		[_:string]: any,
+		title: string, /** 表格的名称 */
+		url: string, /** 涉及的接口 */
+		tableConfigs: {
+			[_:string]: any,
+			type?: 'index' | ...,
+			prop: string,
+			name: string,
+			rules?: any[],
+			fixed?: string,
+			width?: string,
+			subcomponent: VueComponent,
+			options: any[],
+			formField: boolean, /** 是否在新增编辑子表单里出现该字段 */
+		}[], /** 表格prop配置数组，参考 components/base-table 组件和 element-ui 文档 */
+	}
+
+type ExtraComponent = {
+		name: string,
+		label: string,
+		hasModel: boolean, /** 是否需要为该组件设置 v-model */
+		component: VueComponent, /** 动态加载的 vue 组件 */
+		props: {
+			[_:string]: string | object
+			extraParams?: { /** 上传组件使用 */
+				typeCode: string
+			}
+		}[]
+	}
+
+type Field = {
+	[_:string]: string | boolean | object | object[],
+	name: string,
+	type?: 'input' | 'select' | ...,
+	options?: any[], /** 设置 type 为 select 时的选项数据 */
+	label?: string, /** 没有时会用 name 替代 */
+	placeholder?: string, /** 没有时会生成默认占位符 */
+	api?: string, /** 如果有该字段，就自动从api地址获取数据并填充到对应的输入框里，一般为 getCode 的接口 */
+	relatedField?: string, /** 关联字段，当设置此字段时，意味着需要在对话框组件上监听 select-change 事件，并当该字段数据被改变时刷新 relatedField 的列表，一般是像选择产线时更新工段列表这样的场景使用 */,
+	required?: boolean, /** 验证规则的简写，只需要限制必填项时，不需要其他验证规则时使用 */
+	rules?: object[], /** 规则设置参考 element-ui 的表单验证配置 */
+}
+
+type Configs = {
+	type: 'dialog',
+	infoUrl: string, /** 编辑时获取信息的接口地址 */
+	fields: Field[],
+	extraComponents?: ExtraComponent[],
+	subtable?: SubTableConfig[],
+	operations?: Operation[]
+}
+
+
+```
+
 ## 示例
 
 ```js
@@ -79,7 +155,7 @@ const addOrUpdateConfigs = {
 }
 ```
 
-## 配置项
+## 配置项解释
 
 <br>
 
@@ -136,6 +212,7 @@ const addOrUpdateConfigs = {
 含义：有些对话框里需要额外的表格来展示更深层次的数据，如“产品属性”
 类型：object
 选项：
+
 - title, 内嵌表格的标题
 - url, 内嵌表格的数据地址
 - tableConfigs，内嵌表格的配置选项
@@ -154,13 +231,14 @@ const addOrUpdateConfigs = {
       - 值：`edit` | `delete` | `detail`，需要其他可自行添加（修改 base-table 组件）
 
 ### extraComponents
+
 含义: 需要在对话框里使用的自定义组件列表
 类型: Array<object>
 对象选项：
- - name: 该组件对应的 dataForm 字段（需要参照后端文档来指定）
+
- - hasModel: boolean, 上传组件一般设置为 false，设置是否和 dataForm 关联
+- name: 该组件对应的 dataForm 字段（需要参照后端文档来指定）
- - label
+- hasModel: boolean, 上传组件一般设置为 false，设置是否和 dataForm 关联
- - fieldType: 设置该组件的数据将以什么数据类型形式来保存
+- label
- - component: 组件
+- fieldType: 设置该组件的数据将以什么数据类型形式来保存
- - props 传给组件的配置
+- component: 组件
- 
+- props 传给组件的配置

Dockerfile

@@ -0,0 +1,10 @@
+FROM node:12 AS builder
+WORKDIR /app
+ADD package.json /app/
+RUN npm config set registry https://registry.npmmirror.com && npm install 
+ADD . /app
+RUN npm run build:prod
+
+FROM busybox
+LABEL maintainer thomas.hairong@gmail.com
+COPY --from=builder /app/dist /html

TODO.md

@@ -0,0 +1,7 @@
+# TODO List 
+
+1. 按钮加权限
+2. 国际化
+3. 表格高度 √
+4. 表格时间格式修改 √
+5. icon列表 √

package.json

@@ -3,7 +3,8 @@
   "version": "5.0.0",
   "private": true,
   "scripts": {
-    "serve": "vue-cli-service serve",
+    "serve": "vue-cli-service serve --mode production",
+    "serve:dev": "vue-cli-service serve --mode development",
     "build": "vue-cli-service build",
     "build:prod": "vue-cli-service build --mode production",
     "build:sit": "vue-cli-service build --mode production.sit",

public/i18n.js

@@ -0,0 +1,25 @@
+/**
+ * Created by Jacky.Gao on 2017-10-01.
+ */
+ import defaultI18nJsonData from './designer.json';
+ import en18nJsonData from './designer_en.json';
+ export default function buildLocal () {
+    let language = getCookie('language') || 'zh-CN';
+    window.i18n = defaultI18nJsonData;
+    if (language !== 'zh-CN') {
+        window.i18n = en18nJsonData;
+    }
+}
+
+function getCookie (name) {
+    var strcookie = document.cookie;//获取cookie字符串
+    var arrcookie = strcookie.split("; ");//分割
+    //遍历匹配
+    for (var i = 0; i < arrcookie.length; i++) {
+        var arr = arrcookie[i].split("=");
+        if (arr[0] == name){
+            return arr[1];
+        }
+    }
+    return "";
+}

public/index.html

@@ -10,7 +10,7 @@
     window.SITE_CONFIG['version'] = 'v5.0.0';
     window.SITE_CONFIG['nodeEnv'] = '<%= process.env.VUE_APP_NODE_ENV %>';
     window.SITE_CONFIG['apiURL'] = '';                      // api请求地址
-    window.SITE_CONFIG['projURL'] = '/yd-monitor';                      // api请求地址
+    window.SITE_CONFIG['projURL'] = '';                     // api请求地址
     window.SITE_CONFIG['storeState'] = {};                  // vuex本地储存初始化状态（用于不刷新页面的情况下，也能重置初始化项目中所有状态）
     window.SITE_CONFIG['contentTabDefault'] = {             // 内容标签页默认属性对象
       'name': '',        // 名称, 由 this.$route.name 自动赋值（默认，名称 === 路由名称 === 路由路径）
@@ -31,25 +31,25 @@
   <!-- 开发环境 -->
   <% if (process.env.VUE_APP_NODE_ENV === 'dev') { %>
     <script>
-    window.SITE_CONFIG['apiURL'] = 'http://192.168.1.65:8080';
+    window.SITE_CONFIG['apiURL'] = 'http://india.mes.picaiba.com/';
     </script>
   <% } %>
   <!-- 集成测试环境 -->
   <% if (process.env.VUE_APP_NODE_ENV === 'prod:sit') { %>
     <script>
-      window.SITE_CONFIG['apiURL'] = 'http://localhost:8080/renren-admin';
+      window.SITE_CONFIG['apiURL'] = 'http://india.mes.picaiba.com/';
     </script>
   <% } %>
   <!-- 验收测试环境 -->
   <% if (process.env.VUE_APP_NODE_ENV === 'prod:uat') { %>
     <script>
-      window.SITE_CONFIG['apiURL'] = 'http://localhost:8080/renren-admin';
+      window.SITE_CONFIG['apiURL'] = 'http://india.mes.picaiba.com/';
     </script>
   <% } %>
   <!-- 生产环境 -->
   <% if (process.env.VUE_APP_NODE_ENV === 'prod') { %>
     <script>
-      window.SITE_CONFIG['apiURL'] = 'http://localhost:8080/renren-admin';
+      window.SITE_CONFIG['apiURL'] = 'http://india.mes.picaiba.com/';
     </script>
   <% } %>
 </head>

src/assets/scss/variables.scss

@@ -5,7 +5,7 @@ $base--line-height: 1.15;
 $navbar--height: 50px;
 
 // Sidebar
-$sidebar--width: 230px;
+$sidebar--width: 300px;
 $sidebar--width-fold: 64px;
 $sidebar--background-color-dark: #263238;
 $sidebar--text-color-dark: #8a979e;

src/components/base-detail-page/index.vue

@@ -93,8 +93,8 @@ import { pick } from 'lodash/object'
 
 // 标题 for i18n
 const title = {
-	detail: '详情',
+	detail: i18n.t('detail'),
-	add: '新增',
+	add: i18n.t('add'),
 	edit: '编辑'
 }
 
@@ -112,7 +112,7 @@ const btnName = {
 	save: '保存',
 	update: '更新',
 	reset: '重置',
-	cancel: '取消'
+	cancel: i18n.t('cancel')
 	// add more...
 }
 
@@ -140,11 +140,11 @@ export default {
 			if (!name) return null
 			// for i18n
 			const defaultNames = {
-				name: '名称',
+				name: i18n.t('name'),
-				code: '编码',
+				code: i18n.t('code'),
-				remark: '备注',
+				remark: i18n.t('remark'),
-				description: '描述',
+				description: i18n.t('desc'),
-				specifications: '规格'
+				specifications: i18n.t('prod.spec')
 				// add more...
 			}
 
@@ -164,11 +164,11 @@ export default {
 			btnName,
 			btnType,
 			defaultNames: {
-				name: '名称',
+				name: i18n.t('name'),
-				code: '编码',
+				code: i18n.t('code'),
-				remark: '备注',
+				remark: i18n.t('remark'),
-				description: '描述',
+				description: i18n.t('desc'),
-				specifications: '规格'
+				specifications: i18n.t('prod.spec')
 				// add more...
 			},
 			defaultPlaceholders: {}, // 自动根据 defaultNames 计算得来
@@ -320,11 +320,11 @@ export default {
 					: this.defaultPlaceholders[opt.name]
 					? this.defaultPlaceholders[opt.name]
 					: opt.label
-					? (opt.type === 'select' ? '请选择' : '请输入') + opt.label
+					? (opt.type === 'select' ? i18n.t('choose') : '请输入') + opt.label
 					: null
 
 				// : opt.type === 'select'
-				// ? '请选择'
+				// ? i18n.t('choose')
 				// : '请输入'
 			}
 		},
@@ -455,7 +455,7 @@ export default {
 								.then(({ data: res }) => {
 									if (res && res.code === 0) {
 										this.$message({
-											message: btn.name === 'save' ? '添加成功!' : '更新成功!',
+											message: btn.name === 'save' ? i18n.t('prompt.success') : '更新成功!',
 											type: 'success',
 											duration: 1500,
 											onClose: () => {

src/components/base-dialog/AttrForm/index.vue

@@ -1,13 +1,17 @@
 <template>
 	<div class="attr-form">
-		<h3>{{ title }} <el-button style="margin-left: 8px;" type="text" v-if="!isDetail && !showAddAttr" @click="showAddAttr = true">添加</el-button></h3>
+		<h3>
+			{{ title }} <el-button style="margin-left: 8px;" type="text" v-if="!isDetail && !showAddAttr" @click="showAddAttr = true">{{ $t('add') }}</el-button>
+		</h3>
 		<div v-if="!showAddAttr">
 			<component
 				key="sub-table"
 				:is="require('../../base-table/index.vue').default"
 				:table-head-configs="filterTableConfigs()"
 				:data="dataList"
-				:max-height="500"
+				:page="pageIndex"
+				:size="pageSize"
+				:max-height="calcMaxHeight(8)"
 				@operate-event="handleOperations"
 			/>
 			<el-pagination
@@ -28,7 +32,7 @@
 						<el-row :gutter="20" style="padding: 0 24px;">
 							<el-col :span="attrFormFields.length > 6 ? 6 : 12" v-for="field in attrFormFields" :key="field.prop + 'col'">
 								<el-form-item :key="field.prop" :prop="field.prop" :label="field.name" style="width: 100%">
-									<el-input v-if="field.formType === 'input' || !field.formType" v-model="AttrForm[field.prop]" placeholder="请填写" clearable />
+									<el-input v-if="field.formType === 'input' || !field.formType" v-model="AttrForm[field.prop]" :placeholder="$t('hints.input')" clearable />
 									<el-select v-if="field.formType === 'select'" v-model="AttrForm[field.prop]" clearable>
 										<el-option v-for="opt in field.formOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
 									</el-select>
@@ -40,17 +44,18 @@
 				</el-col>
 			</el-row>
 			<el-row style="text-align: right;">
-				<el-button size="small" @click="handleCloseAttrForm">取消</el-button>
+				<el-button size="small" @click="handleCloseAttrForm">{{ $t('cancel') }}</el-button>
-				<el-button type="success" size="small" @click="handleSaveAttrForm">保存</el-button>
+				<el-button type="success" size="small" @click="handleSaveAttrForm">{{ $t('save') }}</el-button>
 			</el-row>
 		</div>
 	</div>
 </template>
 
 <script>
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import { pick } from 'lodash/object'
-
+import { calcMaxHeight } from '@/utils'
 export default {
 	name: 'AttrForm',
 	components: { BaseTable },
@@ -90,6 +95,7 @@ export default {
 	},
 	data() {
 		return {
+			calcMaxHeight,
 			showAddAttr: false,
 			dataList: [],
 			pageIndex: 1,
@@ -121,18 +127,11 @@ export default {
 		}
 	},
 	methods: {
-		/** filter tableConfigs */
 		filterTableConfigs() {
-			// return this.tableConfigs.map(item => {
+			if (this.isDetail) {
-			// 	const {prop, name, filter} = item
+				/** 如果是查看详情，就屏蔽操作列 */
-			// 	const newConfigs = {prop,name,filter}
+				return this.tableConfigs.filter(opt => opt.prop !== 'operations')
-			// 	if (item.type) newConfigs.type = item.type
+			}
-			// 	if (item.fixed) newConfigs.fixed = item.fixed
-			// 	if (item.width) newConfigs.width = item.width
-			// 	if (item.subcomponent) newConfigs.subcomponent = item.subcomponent
-			// 	if (item.options) newConfigs.options = item.options
-			// 	return newConfigs
-			// })
 			return this.tableConfigs
 		},
 		/** init dataform */
@@ -200,9 +199,9 @@ export default {
 		deleteHandle(id) {
 			var ids = id ? [id] : []
 
-			this.$confirm(`确定对id=${ids.join(',')}进行${id ? '删除' : '批量删除'}操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -212,7 +211,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {
@@ -245,7 +244,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {
@@ -281,4 +280,4 @@ export default {
 .attr-form >>> .el-form .el-form-item__label {
 	padding: 0;
 }
-</style>
+</style>

src/components/base-dialog/addOrUpdate/index.vue

@@ -1,5 +1,12 @@
 <template>
-	<el-dialog class="super-flexible-dialog" :title="isDetail ? title.detail : !dataForm.id ? title.add : title.edit" :visible.sync="visible" @close="handleClose">
+	<el-dialog
+		class="super-flexible-dialog"
+		:title="isDetail ? title.detail : !dataForm.id ? title.add : title.edit"
+		:visible.sync="visible"
+		@close="handleClose"
+		:distory-on-close="true"
+		:close-on-click-modal="false"
+	>
 		<div style="max-height: 60vh; overflow-y: scroll; overflow-x: hidden;">
 			<el-form ref="dataForm" :model="dataForm" :rules="dataFormRules">
 				<!-- 如果需要更精细一点的布局，可以根据配置项实现地再复杂一点，但此处暂时全部采用一行两列布局  -->
@@ -31,7 +38,7 @@
 								:disabled="isDetail"
 								@change="emitSelectChange(configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name, $event)"
 							>
-								<el-option v-for="opt in configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].options" :key="opt.label" :label="opt.label" :value="opt.value" />
+								<el-option v-for="opt in configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].options" :key="opt.label + Math.random()" :label="opt.label" :value="opt.value" />
 							</el-select>
 							<el-switch v-if="getType(n, c) === 'switch'" v-model="dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]" :disabled="isDetail" />
 							<el-cascader
@@ -40,6 +47,7 @@
 								:options="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].options"
 								:props="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].props"
 								:disabled="isDetail"
+								clearable
 							/>
 							<el-time-select v-if="getType(n, c) === 'time'" v-model="dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]" :disabled="isDetail" />
 							<el-date-picker
@@ -97,20 +105,22 @@
 					>{{ btnName[operate.name] }}</el-button
 				>
 			</template>
-			<el-button v-if="isDetail" @click="handleClick({ name: 'cancel' })">返回</el-button>
+			<el-button v-if="isDetail" @click="handleClick({ name: 'cancel' })">{{ $t('cancel') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
 
 <script>
+import CKEditor from 'ckeditor4-vue'
 import AttrForm from '../AttrForm'
 import { pick } from 'lodash/object'
-
+import { pick as __pick } from '@/utils/filters'
+import i18n from '@/i18n'
 // 标题 for i18n
 const title = {
-	detail: '详情',
+	detail: i18n.t('detail'),
-	add: '新增',
+	add: i18n.t('add'),
-	edit: '编辑'
+	edit: i18n.t('edit')
 }
 
 // 或者也可以改造成自定义颜色：
@@ -124,10 +134,10 @@ const btnType = {
 
 const btnName = {
 	// for i18n
-	save: '保存',
+	save: i18n.t('save'),
-	update: '更新',
+	update: i18n.t('update'),
-	reset: '重置',
+	reset: i18n.t('reset'),
-	cancel: '取消'
+	cancel: i18n.t('cancel')
 	// add more...
 }
 
@@ -139,13 +149,6 @@ export default {
 	components: { AttrForm },
 	props: {
 		configs: {
-			/**
-			 * TODO: 定义及使用方式，应改用README.md文件记录
-			 * type: 'dialog' | 'drawer' | 'page'
-			 * fields: Array<string|object>
-			 * - fields.object: { name, type: 'number'|'textarea'|'select'|'date'|.., required: boolean,  validator: boolean(是否需要验证), [options]: any[], api: string(自动获取数据的接口，一般为getcode接口)}
-			 * operations: Array[object], 操作名和对应的接口地址，还有permission(如，sys:dict:update)
-			 */
 			type: Object,
 			default: () => ({}) // 此处省去类型检查，使用者自行注意就好
 		}
@@ -155,11 +158,11 @@ export default {
 			if (!name) return null
 			// for i18n
 			const defaultNames = {
-				name: '名称',
+				name: i18n.t('name'),
-				code: '编码',
+				code: i18n.t('code'),
-				remark: '备注',
+				remark: i18n.t('remark'),
-				description: '描述',
+				description: i18n.t('desc'),
-				specifications: '规格'
+				specifications: i18n.t('prod.spec')
 				// add more...
 			}
 
@@ -179,11 +182,11 @@ export default {
 			btnName,
 			btnType,
 			defaultNames: {
-				name: '名称',
+				name: i18n.t('name'),
-				code: '编码',
+				code: i18n.t('code'),
-				remark: '备注',
+				remark: i18n.t('remark'),
-				description: '描述',
+				description: i18n.t('desc'),
-				specifications: '规格'
+				specifications: i18n.t('prod.spec')
 				// add more...
 			},
 			defaultPlaceholders: {}, // 自动根据 defaultNames 计算得来
@@ -205,9 +208,14 @@ export default {
 			return Math.ceil(this.configs.fields.length / COLUMN_PER_ROW)
 		}
 	},
+	created() {
+		/** load lang */
+		// CKEditor.load()
+		// console.log('lang', CKEditor.component.props.config.defaultLanguage = 'en' )
+	},
 	mounted() {
 		/** 计算 defaultPlaceholders */
-		const prefix = '请输入'
+		const prefix = i18n.t('hints.input')
 		Object.entries(this.defaultNames).map(([key, value]) => {
 			this.defaultPlaceholders[key] = prefix + value
 		})
@@ -248,11 +256,27 @@ export default {
 					})
 				} // end if (item.api)
 
+				// 如果有 relatedField，就需要在当前item的数据加载后，刷新 relatedField 的列表
+				if (item.relatedField) {
+					this.$watch(
+						function() {
+							return this.dataForm[item.name]
+						},
+						function(val, old) {
+							if (val && val !== old) {
+								this.$emit('select-change', { name: item.name, id: val })
+							}
+						},
+						{ deep: true, immediate: true }
+					)
+				}
+
 				if (item.required) {
 					const requiredRule = {
 						required: true,
-						message: '请输入必填项',
+						message: i18n.t('validate.required'),
-						trigger: 'change'
+						// trigger: 'change'
+						trigger: 'blur'
 					}
 					/** 检查是否已经存在该字段的规则 */
 					const exists = this.dataFormRules[item.name] || null
@@ -295,20 +319,16 @@ export default {
 			/** 检查是否需要额外的组件 */
 			this.configs.extraComponents &&
 				this.configs.extraComponents.forEach(item => {
-					if (Object.hasOwn(this.dataForm, [item.name])) {
+					// if (Object.hasOwn(this.dataForm, [item.name])) {
-						console.log('有了!')
+					if (this.dataForm.hasOwnProperty(item.name)) {
 						return
 					} else {
-						console.log('新建！')
 						this.$set(this.dataForm, [item.name], calDefault(item.fieldType))
 					}
-
-					console.log('component: ', item.component)
 				})
 
 			/** 单独设置 id */
 			this.$set(this.dataForm, 'id', null)
-			console.log('mounted: this.dataForm', JSON.stringify(this.dataForm))
 		})
 	},
 
@@ -327,6 +347,11 @@ export default {
 		},
 
 		getPlaceholder(n, c) {
+			if (this.isDetail) {
+				/** 如果是详情，就不展示 提示文本 */
+				return ''
+			}
+
 			const opt = this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]
 			if (opt) {
 				// if opt is valid
@@ -335,11 +360,11 @@ export default {
 					: this.defaultPlaceholders[opt.name]
 					? this.defaultPlaceholders[opt.name]
 					: opt.label
-					? (opt.type === 'select' ? '请选择' : '请输入') + opt.label
+					? (opt.type === 'select' ? i18n.t('choose') : i18n.t('hints.input')) + opt.label
 					: null
 
 				// : opt.type === 'select'
-				// ? '请选择'
+				// ? i18n.t('choose')
 				// : '请输入'
 			}
 		},
@@ -375,18 +400,20 @@ export default {
 					}).then(({ data: res }) => {
 						if (res && res.code === 0) {
 							const dataFormKeys = Object.keys(this.dataForm)
-							console.log('data form keys: ', dataFormKeys, pick(res.data, dataFormKeys))
+							console.log('keys ===> ', dataFormKeys)
-							this.dataForm = pick(res.data, dataFormKeys)
+							// console.log('data form keys: ', dataFormKeys, pick(res.data, dataFormKeys))
-
+							this.dataForm = __pick(res.data, dataFormKeys)
+							console.log('pick(res.data, dataFormKeys) ===> ', __pick(res.data, dataFormKeys))
 							// LABEL: FILE_RELATED
 							/** 对文件下载进行分流 */
 							this.fileList = {}
 							if (this.dataForm.files) {
-								console.log('files: ', this.dataForm.files)
+								// console.log('files: ', this.dataForm.files)
 								this.dataForm.files.forEach(file => {
 									// const fileName = file.fileUrl.split('/').pop()
 									/** [1] 处理 fileList */
-									if (Object.hasOwn(this.fileList, file.typeCode)) {
+									// if (Object.hasOwn(this.fileList, file.typeCode)) {
+									if (this.fileList.hasOwnProperty(file.typeCode)) {
 										/** 已存在 */
 										// this.fileList[file.typeCode].push({ id: file.id, name: fileName, typeCode: file.typeCode })
 										this.fileList[file.typeCode].push(file)
@@ -396,13 +423,13 @@ export default {
 									}
 
 									/** [2] 处理 fileForm */
-									if (Object.hasOwn(this.fileForm, file.typeCode)) {
+									// if (Object.hasOwn(this.fileForm, file.typeCode)) {
+									if (this.fileForm.hasOwnProperty(file.typeCode)) {
 										this.fileForm[file.typeCode].push(file.id)
 									} else {
 										this.fileForm[file.typeCode] = [file.id]
 									}
 								})
-								console.log('after分流：', this.fileList)
 							}
 						}
 					})
@@ -411,25 +438,28 @@ export default {
 					if (this.shouldWait)
 						this.shouldWait.then(() => {
 							if (this.tempForm.length) {
-								console.log('create new, tempform', JSON.stringify(this.tempForm.length))
+								// console.log('create new, tempform', JSON.stringify(this.tempForm.length))
 								this.tempForm.forEach(item => {
-									console.log('item data', item.data)
+									// console.log('item data', item.data)
 									this.dataForm[item.name] = item.data
 								})
-								console.log('create new, dataform', JSON.stringify(this.dataForm))
+								// console.log('create new, dataform', JSON.stringify(this.dataForm))
 							}
+							this.shouldWait = null
 						})
 				}
 			})
 		},
 
 		emitSelectChange(name, id) {
+			const currentField = this.configs.fields.find(item => item.name === name)
+			if (currentField.relatedField) {
+				this.dataForm[currentField.relatedField] = null
+			}
 			this.$emit('select-change', { name, id })
 		},
 
-		handleEditorReady(val) {
+		handleEditorReady(val) {},
-			console.log('editor  rready..', val)
-		},
 
 		handleClick(btn) {
 			/** 提取url */
@@ -448,7 +478,6 @@ export default {
 						if (valid) {
 							/** 对于文件上传的单独处理（合并处理） */
 							if (Object.keys(this.fileForm).length) {
-								console.log('fileform 有值')
 								// LABEL: FILE_RELATED
 								let fileIds = []
 								for (const [key, item] of Object.entries(this.fileForm)) {
@@ -461,7 +490,7 @@ export default {
 								this.$set(this.dataForm, 'fileIds', fileIds)
 							}
 
-							console.log('before send: ', this.dataForm)
+							// console.log('before send: ', this.dataForm)
 
 							this.$http({
 								url: this.$http.adornUrl(urls[btn.name].url),
@@ -471,7 +500,8 @@ export default {
 								.then(({ data: res }) => {
 									if (res && res.code === 0) {
 										this.$message({
-											message: btn.name === 'save' ? '添加成功!' : '更新成功!',
+											message: i18n.t('prompt.success'),
+											// message: btn.name === 'save' ? i18n.t('prompt.success') : '更新成功!',
 											type: 'success',
 											duration: 1500,
 											onClose: () => {
@@ -505,14 +535,14 @@ export default {
 					}
 					break
 				case 'cancel':
-					this.visible = false
+					this.handleClose()
 				// add more..
 			}
 		},
 
 		// LABEL: FILE_RELATED
 		handleUploadListUpdate(filelist, typeCode = 'DefaultTypeCode') {
-			console.log('before handleUploadListUpdate(): ', JSON.parse(JSON.stringify(this.fileForm)))
+			// console.log('before handleUploadListUpdate(): ', JSON.parse(JSON.stringify(this.fileForm)))
 			// 设备类型 typeCode: EquipmentTypeFile
 			// 设备信息 typeCode: EquipmentInfoFile | EquipmentInfoImage
 
@@ -529,7 +559,7 @@ export default {
 				typeCode,
 				filelist.map(item => item.id)
 			)
-			console.log('after handleUploadListUpdate(): ', this.fileForm)
+			// console.log('after handleUploadListUpdate(): ', this.fileForm)
 		},
 
 		handleClose() {

src/components/base-table/components/cell-container.vue

@@ -0,0 +1,11 @@
+<template>
+	<div class="cell-container">
+		
+	</div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style></style>

src/components/base-table/components/detailComponent.js

@@ -1,11 +1,5 @@
-/**
+import i18n from '@/i18n'
- * @Author: lb
+
- * @CreateDate: 2022.8.8
- * @Modifier: 
- * @ModifiedDate: 
- * 表格里的文本组件
- * 一般用途：展示查看详情入口
- */
 export default {
   name: 'TableTextComponent',
   props: {
@@ -17,12 +11,12 @@ export default {
   data() {
     return {
       // for i18n inject:
-      defaultText: '查看详情'
+      defaultText: i18n.t('viewdetail')
     }
   },
   methods: {
     emitClick() {
-      console.log('inject data:' ,this.injectData)
+      // console.log('inject data:' ,this.injectData)
       this.$emit('emit-data', {
         type: this.injectData.head?.actionName || 'view-detail-action',
         data: this.injectData.head?.emitFullData ? this.injectData : this.injectData.id
@@ -30,7 +24,7 @@ export default {
     }
   },
   render: function (h) {
-    // console.log(this)
+    // console.log('button content:', this.injectData)
-    return h('span', null, [h('el-button', { props: { type: 'text' }, style: { paddingLeft: 0 }, on: { click: this.emitClick } }, this.injectData.buttonContent || this.defaultText)])
+    return h('span', null, [h('el-button', { props: { type: 'text' }, style: { paddingLeft: 0 }, on: { click: this.emitClick } }, this.injectData.head?.buttonContent || this.defaultText)])
   }
 }

src/components/base-table/components/operationComponent.js

@@ -1,11 +1,5 @@
-/**
+import i18n from '@/i18n'
- * @Author: lb
+
- * @CreateDate: 2022.8.8
- * @Modifier: 
- * @ModifiedDate: 
- * 表格里的操作组件
- * 一般用途：展示添加删除按钮
- */
 export default {
   name: 'TableOperations',
   props: {
@@ -24,29 +18,46 @@ export default {
       },
       colors: {
         delete: '#FF5454',
+        preview: '#f09843',
+        design: '#99089f',
+        // 'view-trend': 'red'
         // add more...
       },
       text: {
         // TODO: i18n
-        edit: '编辑',
+        edit: i18n.t('edit'),
-        detail: '详情',
+        detail: i18n.t('detail'),
-        delete: '删除',
+        delete: i18n.t('delete'),
-        viewAttr: '查看属性'
+        viewAttr: i18n.t('viewattr'),
+        preview: i18n.t('preview'),
+        design: i18n.t('design'),
+        'view-trend': '查看趋势'
         // add more...
       }
     }
   },
   methods: {
     // 发射事件
-    emit(eventType) {
+    emit(opt) {
-      this.$emit('emit-data', { type: eventType, data: this.injectData.head?.emitFullData ? this.injectData : this.injectData.id })
+      let emitFull = false
+      let eventType = 'default'
+      let customField
+      if (typeof opt === 'object') {
+        eventType = opt.name
+        customField = opt.emitField || 'id'
+        emitFull = opt.emitFull || false
+      } else {
+        eventType = opt
+      }
+      this.$emit('emit-data', { type: eventType, data: emitFull ? this.injectData : customField ? this.injectData[customField] : this.injectData.id })
     }
   },
   render: function (h) {
     let btns = []
     for (const optionStr of this.injectData.head?.options) {
+      const optObj = typeof optionStr === 'object'
       // btns.push(h('el-button', { props: { type: this.btnTypes[optionStr] } }, optionStr))
-      btns.push(h('el-button', { props: { type: 'text' }, style: { color: this.colors[optionStr] || '#409EFF' }, on: { click: this.emit.bind(null, optionStr) } }, this.text[optionStr]))
+      btns.push(h('el-button', { props: { type: 'text' }, style: { color: optObj ? this.colors[optionStr.name] : this.colors[optionStr] || '#409EFF' }, on: { click: this.emit.bind(null, optionStr) } }, typeof optionStr === 'object' ? this.text[optionStr.name] : this.text[optionStr]))
     }
     return h('span', null, btns)
   }

src/components/base-table/components/table-head.vue

@@ -0,0 +1,40 @@
+<template>
+	<el-table-column
+		:label="opt.label ? opt.label : opt.name"
+		:prop="opt.prop || null"
+		:width="opt.width || null"
+		:min-width="opt.minWidth || null"
+		:fixed="opt.fixed || null"
+		:show-overflow-tooltip="opt.showOverflowTooltip || false"
+		filter-placement="top"
+		:align="opt.align || null"
+		v-bind="opt.more"
+	>
+		<template v-if="opt.prop" slot-scope="scope">
+			<component v-if="opt.subcomponent" :is="opt.subcomponent" :key="idx + 'sub'" :inject-data="{ ...scope.row, head: opt }" @emit-data="handleSubEmitData" />
+			<!-- 直接展示数据或应用过滤器 -->
+			<span v-else>{{ scope.row[opt.prop] | commonFilter(opt.filter) }}</span>
+		</template>
+		<!-- 递归 -->
+		<template v-if="!opt.prop && opt.children">
+			<TableHead v-for="(subhead, index) in opt.children" :key="'subhead' + index" :opt="subhead" />
+		</template>
+	</el-table-column>
+</template>
+
+<script>
+export default {
+	name: 'TableHead',
+	filters: {
+		commonFilter: (source, filterType = a => a) => {
+			return filterType(source)
+		}
+	},
+	props: {
+		opt: {
+			type: Object,
+			default: () => ({})
+		}
+	}
+}
+</script>

src/components/base-table/index.vue

@@ -1,6 +1,14 @@
 <template>
 	<div class="base-table">
-		<el-table :data="data" style="width: 100%" fit border :header-cell-style="{ background: '#FAFAFA', color: '#606266', height: '40px' }" :max-height="maxHeight">
+		<el-table
+			:data="data"
+			style="width: 100%"
+			fit
+			border
+			:header-cell-style="{ background: '#FAFAFA', color: '#606266', height: '40px' }"
+			:max-height="maxHeight"
+			:span-method="spanMethod || null"
+		>
 			<!-- 表格头定义 -->
 			<template v-for="(head, idx) in tableHeadConfigs">
 				<!-- 带type的表头 -->
@@ -12,20 +20,24 @@
 					:header-align="head.align || 'center'"
 					:align="head.align || 'center'"
 					:width="head.width || 50"
+					:index="head.type === 'index' ? val => {
+						return val + 1 + (page - 1) * size
+					} : null"
 					v-bind="head.more"
 				></el-table-column>
 				<!-- 普通的表头 -->
 				<el-table-column
 					v-else
-					:key="idx+'else'"
+					:key="idx + 'else'"
 					:label="head.label ? head.label : head.name"
-					:prop="head.prop"
+					:prop="head.prop || null"
-					:width="head.width"
+					:width="head.width || null"
-					:min-width="head.minWidth"
+					:min-width="head.minWidth || null"
-					:fixed="head.fixed"
+					:fixed="head.fixed || null"
-					:show-overflow-tooltip="head.showOverflowTooltip || false"
+					:show-overflow-tooltip="head.showOverflowTooltip || true"
+					:tooltip-effect="head.tooltipEffect || 'light'"
 					filter-placement="top"
-					:align="head.align"
+					:align="head.align || null"
 					v-bind="head.more"
 				>
 					<!-- 子组件 -->
@@ -34,6 +46,11 @@
 						<!-- 直接展示数据或应用过滤器 -->
 						<span v-else>{{ scope.row[head.prop] | commonFilter(head.filter) }}</span>
 					</template>
+
+					<!-- 多级表头 -->
+					<template v-if="!head.prop && head.children">
+						<TableHead v-for="(subhead, subindex) in head.children" :key="'subhead-' + idx + '-subindex-' + subindex" :opt="subhead" />
+					</template>
 				</el-table-column>
 			</template>
 		</el-table>
@@ -41,6 +58,7 @@
 </template>
 
 <script>
+import TableHead from './components/table-head.vue'
 export default {
 	name: 'BaseTable',
 	props: {
@@ -55,6 +73,21 @@ export default {
 		maxHeight: {
 			type: Number,
 			default: 500
+		},
+		spanMethod: {
+			type: Function,
+			default: () => {
+				;() => [0, 0]
+			},
+			required: false
+		},
+		page: {
+			type: Number,
+			default: 1
+		},
+		size: {
+			type: Number,
+			default: 10
 		}
 	},
 	filters: {
@@ -69,6 +102,7 @@ export default {
 		handleSubEmitData(payload) {
 			this.$emit('operate-event', payload)
 		}
-	}
+	},
+	components: { TableHead }
 }
 </script>

src/components/base-upload/index.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="base-upload" style="border-radius: 8px; margin-top: 38px; padding: 0; max-height: 500px;">
+	<div class="base-upload" style="border-radius: 8px; margin-top: 48px; padding: 0; max-height: 500px;">
 		<el-upload
 			class="yd-upload"
 			action="#"
@@ -13,7 +13,7 @@
 			<!-- :before-remove="beforeRemove" -->
 			<!-- accept="image/*" -->
 			<!-- <el-upload class="yd-upload" :action="$http.adornUrl(url)" multiple name="files" :data="extraParams" :file-list="fileList" :on-remove="handleRemove" :before-remove="beforeRemove"> -->
-			<el-button :disabled="readOnly" size="small" type="primary">{{ buttonContent }}</el-button>
+			<el-button :disabled="readOnly" type="primary">{{ buttonContent }}</el-button>
 			<div v-if="tip" slot="tip" class="el-upload__tip">{{ tip }}</div>
 		</el-upload>
 	</div>
@@ -58,14 +58,14 @@ export default {
 
 		this.$watch('uploaderInjectFileList', function(val) {
 			if (val && val.length) {
-				console.log('this.uploaderInjectFileList', this.uploaderInjectFileList)
+				// console.log('this.uploaderInjectFileList', this.uploaderInjectFileList)
 				/** uploaderInjectFileList 里关于文件的信息比较全，需要手动过滤一下 */
 				this.fileList = val.map(item => {
 					const name = item.fileUrl.split('/').pop()
 					return { ...pick(item, ['id', 'fileName', 'typeCode']), name }
 				})
 			}
-			console.log('fillist: ', this.fileList)
+			// console.log('fillist: ', this.fileList)
 		})
 
 		// if (this.parentDataForm) {
@@ -101,8 +101,6 @@ export default {
 
 		/** 大小验证，由配置文件开启 */
 		validateFile(file) {
-			console.log('[*] 验证文件大小')
-
 			const isRightSize = file.size / 1024 / 1024 < 2
 			if (!isRightSize) {
 				// this.$message.error(this.$t('upload.picSizeAlarm'))
@@ -113,7 +111,7 @@ export default {
 
 		/** 图片验证，由配置文件开启 */
 		validateImage(file) {
-			console.log('[*] 验证图片')
+			// console.log('[*] 验证图片')
 
 			const isRightSize = file.size / 1024 / 1024 < 2
 			if (!isRightSize) {
@@ -148,15 +146,14 @@ export default {
 				responseType: 'blob'
 			}).then(({ data: res }) => {
 				const blob = new Blob([res])
-				console.log('blob', blob)
+				// console.log('blob', blob)
 				if ('download' in document.createElement('a')) {
 					const alink = document.createElement('a')
-					console.log('filename: ', fileName)
+					// console.log('filename: ', fileName)
 					alink.download = fileName
 					alink.style.display = 'none'
 					alink.target = '_blank'
 					alink.href = URL.createObjectURL(blob)
-					console.log('下载地址：', alink.href)
 					document.body.appendChild(alink)
 					alink.click()
 					URL.revokeObjectURL(alink.href)
@@ -184,14 +181,33 @@ export default {
 	margin-bottom: 20px;
 }
 
-.base-upload >>> .el-upload--text {
+/* .base-upload >>> .el-button {
+	display: block;
+	width: 200px;
+	position: relative;
+	left: -50px;
+} */
+
+/* .base-upload >>> .el-upload--text {
 	width: 100px;
 	position: relative;
-	left: -72px;
+	left: -100px;
-}
+} */
 
 .base-upload >>> .el-upload__tip {
 	margin-top: 0;
 	margin-left: 5px;
 }
+
+.base-upload {
+	display: flex;
+}
+
+.yd-upload {
+	/* background-color: #efefef; */
+	flex-grow: 1;
+	display: flex;
+	flex-direction: column;
+	align-items: flex-start;
+}
 </style>

src/i18n/en.js

@@ -0,0 +1,623 @@
+const t = {}
+
+t.loading = 'Loading...'
+t.createTime = 'Create Time'
+
+t.brand = {}
+t.brand.lg = 'Monitoring System'
+t.brand.mini = 'PMS'
+
+t.routes = {}
+t.routes['产品池'] = 'Products Pool'
+t.routes['基本资料'] = 'Basic Data'
+t.routes['设备数采'] = 'Equipment PLC'
+t.routes['厂务管理'] = 'Factory Management'
+t.routes['报表管理'] = 'Report Management'
+t.routes['质量管理'] = 'Quality Management'
+t.routes['权限管理'] = 'Permission Management'
+t.routes['系统设置'] = 'System Settings'
+t.routes['日志管理'] = 'Log Management'
+t.routes['数据分析'] = 'Data Analysis'
+
+// 二级
+t.routes['厂务'] = 'Factory Affair'
+t.routes['设备'] = 'Equipment'
+t.routes['字典管理'] = 'Dict Management'
+t.routes['PLC信息'] = 'PLC'
+t.routes['设备与PLC关联配置'] = 'Relations between plc & equipments'
+t.routes['设备生产实时数据'] = 'Realtime Equipment Data'
+t.routes['产线生产实时数据'] = 'Realtime Productline Data'
+t.routes['质量检查实时数据'] = 'Realtime Quality Inspection Data'
+t.routes['报表总览'] = 'Report Overview'
+t.routes['报表分类'] = 'Report Types'
+t.routes['报表详情'] = 'Report Detail'
+t.routes['报表设计'] = 'Report Design'
+t.routes['报表预览'] = 'Report Preview'
+t.routes['质量检测基础数据'] = 'Quality Inspection Basic Data'
+t.routes['当前检测数据'] = 'Current Inspection Data'
+t.routes['检测统计数据'] = 'Statistics Data'
+t.routes['质量检查信息记录'] = 'Quality Inspection Records'
+t.routes['用户管理'] = 'User Management'
+t.routes['部门管理'] = 'Department Management'
+t.routes['角色管理'] = 'Role Management'
+t.routes['菜单管理'] = 'Menu Management'
+t.routes['参数管理'] = 'Params Management'
+t.routes['定时任务'] = 'Timed Tasks'
+t.routes['文件上传'] = 'File Upload'
+t.routes['登录日志'] = 'Login Records'
+t.routes['操作日志'] = 'Oprations Records'
+t.routes['设备效率分析'] = 'Equipment Efficiency Analysis'
+t.routes['设备异常分析'] = 'Equipment Exceptions Analysis'
+t.routes['设备状态时序图'] = 'Equipment Status Timesequence'
+
+// 三级
+t.routes['工厂'] = 'Factory'
+t.routes['产线'] = 'Product Lines'
+t.routes['工段'] = 'Work Sections'
+t.routes['设备类型'] = 'Equipment Types'
+t.routes['设备分组'] = 'Equipment Groups'
+t.routes['设备信息'] = 'Equipment Details'
+t.routes['设备参数状态监控'] = 'Current Equipment State'
+t.routes['设备分组报警信息'] = 'Equipment Group Alarm'
+t.routes['设备历史参数'] = 'Equipment Historical Parameters'
+t.routes['质量检测类型'] = 'Quality Inpection Types'
+t.routes['质量检测信息'] = 'Quality Inpection Details'
+t.routes['安灯检测盒'] = 'Andeng inspection box'
+
+
+t.andeng = {}
+t.andeng.inspectContent = 'Inspection Content'
+t.andeng.btnVal = 'Button Value'
+t.andeng.btnBoxModel = 'Button Box Model'
+
+
+t.dictValueList = 'View Details'
+t.save = 'Save'
+t.add = 'Add'
+t.delete = 'Delete'
+t.deleteBatch = 'Delete Batch'
+t.update = 'Update'
+t.query = 'Search'
+t.export = 'Export'
+t.handle = 'Operations'
+t.confirm = 'Confirm'
+t.cancel = 'Cancel'
+t.clear = 'Clear'
+t.logout = 'Logout'
+t.manage = 'Handle'
+t.createDate = 'Create Date'
+t.keyword = 'Keyword(s): '
+t.choose = 'Please Choose '
+t.remark = 'Remark'
+t.delMark = 'Delete Mark '
+t.isvalid = 'is valid'
+t.available = 'available'
+t.unavailable = 'unavailable'
+t.alert = 'alert'
+t.creator = 'Creator'
+t.creatorName = 'Creator\'s name'
+t.updator = 'Updator'
+t.updatorName = 'Updator\'s name'
+t.updateTime = 'Update Time'
+t.version = 'Version'
+t.search = 'Search'
+t.countPerPage = '每页数' // ?
+t.currentPage = '当前页' // ?
+t.fetchList = '获取数据列表' // ?
+t.multi = '多选' // ?
+t.do = '进行' // ?
+t.submit = '表单提交' // ?
+t.desc = 'Description'
+t.disable = 'Disable'
+t.equipment = 'Equipment'
+t.enabled = 'Enabled'
+t.cannotempty = 'can\'t be empty'
+t.parameter = 'Parameters'
+t.enable = 'Enable'
+t.index = 'Index'
+t.relation = '关联'
+t.fetchInfo = 'Fetch Info'
+t.name = 'Name'
+t.code = 'Code'
+t.attrName = 'Attribute name'
+t.attrValue = 'Attribute value'
+t.unit = 'Unit'
+t.table = 'Table'
+t.table2 = 'Table'
+t.downloadurl = 'Download Url'
+t.recordTime = 'Record Time'
+t.notCollect = 'No'
+t.collect = 'Yes'
+t.required = 'Required'
+t.paramUrl = 'Parameter url'
+t.enname = 'English Name'
+t.collectOrNot = 'Collect or not'
+t.min = 'Min Value'
+t.max = 'Max Value'
+t.status = 'Status'
+t.normal = 'Normal'
+t.addr = 'Address'
+t.planStop = 'Plan to stop'
+t.startTime = 'Start Time'
+t.endTime = 'End Time'
+t.today = 'Today'
+
+t.graph = 'Graph'
+t.category = 'Category'
+t.categoryName = 'Category Name'
+t.categoryCode = 'Category Code'
+t.rate = 'Rate'
+t.link = 'Link Url'
+t.refresh = 'Refresh'
+t.abbr = 'Abbreviation'
+t.detail = 'Details'
+t.viewdetail = 'Details'
+t.viewattr = 'View Attributions'
+t.edit = 'Edit'
+t.source = 'Source'
+t.auto = 'Auto'
+t.manual = 'Manually'
+t.loaddone = 'Loaded'
+t.produceTime = 'Date of manufacture'
+t.enterTime = 'Enter Time'
+t.manufacturer = 'Manufacturer'
+t.success = 'success!'
+t.all = 'All'
+t.reset = 'Reset'
+t.preview = 'Preview'
+t.design = 'Design'
+t.timetype = 'Time Type'
+t.reftimerange = 'By time range'
+t.refdate = 'By date'
+t.hour = 'Hour(s)'
+
+t.errors = {}
+t.errors.nosection = 'There is no sections on this product line.'
+t.errors.numsection = 'There are {num} sections on this product line.'
+t.errors.nodata = 'Error, no data available!'
+
+t.hints = {}
+t.hints.input = 'Please input '
+t.hints.select = 'Please select '
+t.hints.date = 'Please select date'
+t.hints.checktime = 'Please select inspection time'
+t.hints.number = 'Please input correct number'
+t.hints.integer = 'Please input correct integer'
+t.hints.addr = 'Please input address'
+t.hints.upload2m = 'File size cannot be larger than 2MB (2048KB)'
+t.hints.upload2mPic = 'Image files only. File size cannot be larger than 2MB (2048KB)'
+
+t.factory = {}
+t.factory.title = 'Factory'
+t.factory.name = 'Factory Name'
+t.factory.code = 'Factory Code'
+
+t.prod = {}
+t.prod.id = 'Product ID'
+t.prod.name = 'Product Name'
+t.prod.code = 'Product Code'
+t.prod.type = 'Product Type'
+t.prod.area = 'Area'
+t.prod.spec = 'Product Specification'
+t.prod.attr = 'Attributes'
+t.prod.attrcode = 'Attribute Code'
+t.prod.attrcodeHints = 'Please input attribute code'
+t.prod.attrname = 'Attribute Node'
+t.prod.attrnameHints = 'Please input attribute name'
+t.prod.attrvalueHints = 'Please input attribute value'
+t.prod.descHints = 'Please input description'
+// t.prod.processTime = 'Processing Time (Hours)'
+t.prod.processTime = 'Processing Time (s)'
+t.prod.processTimeHints = 'Please input processing time'
+t.prod.relatedPid = 'Related Product'
+
+t.alarm = {}
+t.alarm.name = 'Alarm'
+t.alarm.info = 'Alarm Informations'
+t.alarm.view = 'View Alarm'
+t.alarm.eq = 'Alarm Equipment'
+t.alarm.type = 'Alarm Type'
+t.alarm.code = 'Alarm Code'
+t.alarm.level = 'Alarm Level'
+t.alarm.content = 'Alarm Content'
+t.alarm.source = 'Alarm Source'
+t.alarm.det = 'Alarm Details'
+t.alarm.externalCode = 'External Code'
+t.alarm.description = 'Description'
+t.alarm.remark = 'Remark'
+
+
+t.report = {}
+t.report.name = 'Report Name'
+t.report.det = 'Report Content'
+t.report.type = 'Report Type'
+t.report.code = 'Report Code'
+t.report.lnk = 'Report Url'
+
+t.inspect = {}
+t.inspect.type = 'Inspection Type'
+t.inspect.code = 'Inspection Code'
+t.inspect.det = 'Inspection Details'
+t.inspect.detcode = 'Inspection Content Code'
+t.inspect.people = 'Inspector'
+t.inspect.time = 'Inspection Time'
+t.inspect.typetotal = 'Total Inspection Types'
+t.inspect.typename = 'Inspection Type'
+t.inspect.typecode = 'Inspection Code'
+t.inspect.ioTotal = 'Data of input/output and total inspections'
+t.inspect.plTotal = 'Inspection contents in each line'
+t.inspect.inTotal = 'Up Sum'
+t.inspect.outTotal = 'Down Sum'
+t.inspect.checkTotal = 'Total Inspections'
+t.inspect.rate = 'Rate'
+t.inspect.typeCount = 'Data of inspection types'
+
+
+t.realtime = {}
+t.realtime.eq = 'Realtime data of equipments'
+t.realtime.pl = 'Realtime data of product lines'
+t.realtime.inspect = 'Realtime data of quality inspections'
+t.realtime.in = 'in'
+t.realtime.out = 'out'
+t.realtime.data = 'scrap'
+t.realtime.num = 'scrap quantity'
+t.realtime.rate = 'scrap rate'
+t.realtime.total = 'total production'
+t.realtime.goodrate = 'Passed Rate'
+t.realtime.runState = 'running state'
+t.realtime.state = 'status'
+t.realtime.hasFault = 'malfunction'
+t.realtime.recentParamValue = 'recent parameters'
+t.realtime.view = 'view'
+t.realtime.input = 'input' //'投入数'
+t.realtime.output = 'output' //'产出数'
+t.realtime.eqName = 'Equipment name'
+t.realtime.eqCode = 'Equipment cdoe'
+t.realtime.productionSnapshotTime = 'production recording time' // '生产量记录时间'
+t.realtime.statusSnapshotTime = 'status recording time' // '状态记录时间'
+t.realtime.refresh = 'Refresh data...'
+
+
+t.ws = {}
+t.ws.title = 'Work Section'
+t.ws.id = 'Work Section ID'
+t.ws.name = 'Work Section Name'
+t.ws.code = 'Work Section Code'
+t.ws.binded = 'Binded Equipments'
+t.ws.unbind = 'Equipment Name'
+t.ws.eqbindplaceholder = 'Select an equipment'
+t.ws.sort = 'sort'
+t.ws.setorder = 'Please input order of equipments in the work section.'
+t.ws.bind = 'bind'
+t.ws.eqbind = 'Binded Equipment(s)'
+t.ws.belong = 'Product Line'
+
+t.file = {}
+t.file.title = 'File'
+t.file.name = 'File Name'
+t.file.code = 'File Code'
+t.file.typeName = 'File Type'
+t.file.typeCode = 'File Type Code'
+
+t.eq = {}
+t.eq.title = 'Equipment'
+t.eq.id = 'Equipment ID'
+t.eq.name = 'Equipment Name'
+t.eq.code = 'Equipment Code'
+t.eq.type = 'Equipment Type'
+t.eq.grade = 'Specification of equipment'
+t.eq.group = 'Equipment Group'
+t.eq.groupname = 'Group Name'
+t.eq.groupcode = 'Group Code'
+t.eq.excode = 'External Code'
+t.eq.input = 'Input Device'
+t.eq.output = 'Output Device'
+t.eq.tvalue = 'Device\'s TT Value'
+t.eq.processingTime = 'Processing Time (s)'
+t.eq.dtype = 'Data source'
+t.eq.dtypenone = 'none'
+t.eq.dtypeinput = 'Input Data Device'
+t.eq.dtypeoutput = 'Output Data Device'
+t.eq.upload = 'Upload'
+t.eq.image = 'Equipment Pictures'
+t.eq.viewattr = 'Equipment Attributions'
+t.eq.plcbarcode = 'PLC Bar Code'
+t.eq.plccode = 'PLC Code'
+t.eq.plcname = 'PLC Name'
+t.eq.port = 'Port'
+t.eq.type = 'Type'
+t.eq.typecode = 'Type Code'
+t.eq.parent = 'Parent'
+t.eq.mtbf = 'Mean time between failures[MTBF] (h)'
+t.eq.mttr = 'Mean time to repair[MTTR] (h)'
+t.eq.efficienttimeh = 'Working time(h)'
+t.eq.shutdowntimeh = 'Off time(h)'
+t.eq.worktimeh = 'Working time(h)'
+t.eq.downtimeh = 'Malfunction duration(h)'
+t.eq.stoptimeh = 'Halt duration(h)'
+t.eq.worktime = 'Functioning duration'
+t.eq.stoptime = 'Halt duration'
+t.eq.downtime = 'Malfunction duration'
+t.eq.downcount = 'Malfunction counts'
+t.eq.downrate = 'Malfunction rates'
+t.eq.stoplost = 'Lost'
+t.eq.ratio = 'percentage'
+t.eq.time = 'time'
+t.eq.timetrend = 'trend'
+t.eq.nogap = 'no interval'
+t.eq.monthgap = 'by month'
+t.eq.daygap = 'by day'
+t.eq.weekgap = 'by week'
+t.eq.hourgap = 'by hour'
+t.eq.workdurationratio = 'Functioning duration ratio' // '工作时长比率'
+t.eq.stopdurationratio = 'Halt duration ratio' // '停机时长比率'
+t.eq.stopratio = 'Halt ratio' // '停机比率'
+t.eq.downdurationratio = 'Malfunction duration ratio' // '故障时长比率'
+t.eq.speedefficiency = 'Speed launch rate' //'速度开动率'
+t.eq.speedlost = 'Speed lost'
+t.eq.timeefficiency = 'Time launch rate' //'时间开动率'
+t.eq.year = 'year'
+t.eq.month = 'month'
+t.eq.realyield = 'Actual processing speed'
+t.eq.designyield = 'Theoretical processing speed'
+t.eq.viewtrend = 'View Trends'
+
+
+
+t.pl = {}
+t.pl.title = 'Product Line'
+t.pl.id = 'Product Line ID'
+t.pl.name = 'Product Line Name'
+t.pl.code = 'Product Line Code'
+t.pl.status = 'Product Line Status'
+t.pl.belong = 'Product Line'
+t.pl.tvalue = 'TT Value'
+t.pl.factoryHints = 'Please select a factory'
+
+
+t.prompt = {}
+t.prompt.title = 'Prompt'
+t.prompt.info = 'Are you sure to {handle}?'
+t.prompt.sure = 'Are you sure to delete this record?'
+t.prompt.success = 'success'
+t.prompt.failed = 'failed'
+t.prompt.deleteBatch = 'Please choose items to delete.'
+t.prompt.month = 'Please choose month'
+
+t.validate = {}
+t.validate.required = 'This is required.'
+t.validate.format = '{attr} has a wrong format.'
+
+t.upload = {}
+t.upload.title = 'Upload Assets'
+t.upload.text = '将文件拖到此处，或<em>点击上传</em>'
+t.upload.tip = 'Only support files with format: {format}'
+t.upload.button = 'upload'
+
+t.datePicker = {}
+t.datePicker.range = 'to'
+t.datePicker.start = 'Start Time'
+t.datePicker.end = 'End Time'
+t.datePicker.starttime = 'Start Time'
+t.datePicker.endtime = 'End Time'
+
+t.fullscreen = {}
+t.fullscreen.prompt = 'This operation is not supported by your browser.'
+
+t.updatePassword = {}
+t.updatePassword.title = 'Update Password'
+t.updatePassword.username = 'Username'
+t.updatePassword.password = 'Current Password'
+t.updatePassword.newPassword = 'New Password'
+t.updatePassword.confirmPassword = 'Confirm Password'
+t.updatePassword.validate = {}
+t.updatePassword.validate.confirmPassword = 'The two passwords are different. Please check again.'
+
+t.contentTabs = {}
+t.contentTabs.closeCurrent = 'Close current tab'
+t.contentTabs.closeOther = 'Close other tabs'
+t.contentTabs.closeAll = 'Close all tabs'
+
+/* 页面 */
+t.notFound = {}
+t.notFound.desc = 'Sorry! The page you\'re looking is missing.'
+t.notFound.back = 'Back'
+t.notFound.home = 'Home Page'
+
+t.login = {}
+t.login.title = 'Login'
+t.login.username = 'Username'
+t.login.password = 'Password'
+t.login.captcha = 'Captcha'
+t.login.demo = 'Demo'
+t.login.copyright = 'Copyright @Intelligent Automation Research Institute Co., Ltd  Version: 1.0'
+
+t.schedule = {}
+t.schedule.beanName = 'Bean Name'
+t.schedule.beanNameTips = 'spring bean name, eg: testTask'
+t.schedule.pauseBatch = 'Pause'
+t.schedule.resumeBatch = 'Resume'
+t.schedule.runBatch = 'Run'
+t.schedule.log = 'Log List'
+t.schedule.params = 'Parameters'
+t.schedule.cronExpression = 'cron expression'
+t.schedule.cronExpressionTips = 'ex: 0 0 12 * * ?'
+t.schedule.remark = 'Remark'
+t.schedule.status = 'Status'
+t.schedule.status0 = 'Pause'
+t.schedule.status1 = 'Normal'
+t.schedule.statusLog0 = 'Failed'
+t.schedule.statusLog1 = 'Success'
+t.schedule.pause = 'Pause'
+t.schedule.resume = 'Resume'
+t.schedule.run = 'Excute'
+t.schedule.jobId = 'Job ID'
+t.schedule.times = 'Time Cost (ms)'
+t.schedule.createDate = 'Executed Tune' // ?
+
+t.oss = {}
+t.oss.config = '云存储配置'
+t.oss.upload = '上传文件'
+t.oss.url = 'URL地址'
+t.oss.createDate = 'Create Time'
+t.oss.type = '类型'
+t.oss.type1 = '七牛'
+t.oss.type2 = '阿里云'
+t.oss.type3 = '腾讯云'
+t.oss.qiniuDomain = '域名'
+t.oss.qiniuDomainTips = '七牛绑定的域名'
+t.oss.qiniuPrefix = '路径前缀'
+t.oss.qiniuPrefixTips = '不设置默认为空'
+t.oss.qiniuAccessKey = 'AccessKey'
+t.oss.qiniuAccessKeyTips = '七牛AccessKey'
+t.oss.qiniuSecretKey = 'SecretKey'
+t.oss.qiniuSecretKeyTips = '七牛SecretKey'
+t.oss.qiniuBucketName = '空间名'
+t.oss.qiniuBucketNameTips = '七牛存储空间名'
+t.oss.aliyunDomain = '域名'
+t.oss.aliyunDomainTips = '阿里云绑定的域名，如：http://cdn.renren.io'
+t.oss.aliyunPrefix = '路径前缀'
+t.oss.aliyunPrefixTips = '不设置默认为空'
+t.oss.aliyunEndPoint = 'EndPoint'
+t.oss.aliyunEndPointTips = '阿里云EndPoint'
+t.oss.aliyunAccessKeyId = 'AccessKeyId'
+t.oss.aliyunAccessKeyIdTips = '阿里云AccessKeyId'
+t.oss.aliyunAccessKeySecret = 'AccessKeySecret'
+t.oss.aliyunAccessKeySecretTips = '阿里云AccessKeySecret'
+t.oss.aliyunBucketName = 'BucketName'
+t.oss.aliyunBucketNameTips = '阿里云BucketName'
+t.oss.qcloudDomain = '域名'
+t.oss.qcloudDomainTips = '腾讯云绑定的域名'
+t.oss.qcloudPrefix = '路径前缀'
+t.oss.qcloudPrefixTips = '不设置默认为空'
+t.oss.qcloudAppId = 'AppId'
+t.oss.qcloudAppIdTips = '腾讯云AppId'
+t.oss.qcloudSecretId = 'SecretId'
+t.oss.qcloudSecretIdTips = '腾讯云SecretId'
+t.oss.qcloudSecretKey = 'SecretKey'
+t.oss.qcloudSecretKeyTips = '腾讯云SecretKey'
+t.oss.qcloudBucketName = 'BucketName'
+t.oss.qcloudBucketNameTips = '腾讯云BucketName'
+t.oss.qcloudRegion = '所属地区'
+t.oss.qcloudRegionTips = '请选择'
+t.oss.qcloudRegionBeijing1 = '北京一区（华北）'
+t.oss.qcloudRegionBeijing = '北京'
+t.oss.qcloudRegionShanghai = '上海（华东）'
+t.oss.qcloudRegionGuangzhou = '广州（华南）'
+t.oss.qcloudRegionChengdu = '成都（西南）'
+t.oss.qcloudRegionChongqing = '重庆'
+t.oss.qcloudRegionSingapore = '新加坡'
+t.oss.qcloudRegionHongkong = '香港'
+t.oss.qcloudRegionToronto = '多伦多'
+t.oss.qcloudRegionFrankfurt = '法兰克福'
+
+t.dept = {}
+t.dept.name = 'Department Name'
+t.dept.parentName = 'Superior Department'
+t.dept.sort = 'Sort'
+t.dept.parentNameDefault = 'First tier department'
+t.dept.chooseerror = 'Please select a department'
+t.dept.title = 'Department Selection'
+
+t.dict = {}
+t.dict.dictName = 'Dictionary Name'
+t.dict.dictType = 'Dictionary Type'
+t.dict.dictLabel = 'Dictionary Label'
+t.dict.dictValue = 'Dictionary Value'
+t.dict.sort = 'Sort'
+t.dict.remark = 'Remark'
+t.dict.createDate = 'Create Time'
+
+t.logError = {}
+t.logError.requestUri = 'Request URI'
+t.logError.requestMethod = 'Request Method'
+t.logError.requestParams = 'Request Parameters'
+t.logError.ip = 'IP'
+t.logError.userAgent = 'User Agent'
+t.logError.createDate = 'Create Time'
+t.logError.errorInfo = 'Exceptions'
+
+t.logLogin = {}
+t.logLogin.creatorName = 'User Name'
+t.logLogin.status = 'Status'
+t.logLogin.status0 = 'Failed'
+t.logLogin.status1 = 'Success'
+t.logLogin.status2 = 'Account has been locked'
+t.logLogin.operation = 'Operation Type'
+t.logLogin.operation0 = 'Login'
+t.logLogin.operation1 = 'Logout'
+t.logLogin.ip = 'IP'
+t.logLogin.userAgent = 'User-Agent'
+t.logLogin.createDate = 'Create Time'
+
+t.logOperation = {}
+t.logOperation.status = 'Status'
+t.logOperation.status0 = 'Failed'
+t.logOperation.status1 = 'Success'
+t.logOperation.creatorName = 'User Name'
+t.logOperation.operation = 'User Operations'
+t.logOperation.requestUri = 'Request URI'
+t.logOperation.requestMethod = 'Request Method'
+t.logOperation.requestParams = 'Request Parameters'
+t.logOperation.requestTime = 'Request Duration'
+t.logOperation.ip = 'IP'
+t.logOperation.userAgent = 'User-Agent'
+t.logOperation.createDate = 'Create Time'
+
+t.menu = {}
+t.menu.name = 'Name'
+t.menu.icon = 'Icons'
+t.menu.type = 'Type'
+t.menu.type0 = 'Menu'
+t.menu.type1 = 'Button'
+t.menu.sort = 'Sort'
+t.menu.url = 'Route'
+t.menu.permissions = '授权标识'
+t.menu.permissionsTips = '多个用逗号分隔，如：sys:menu:save,sys:menu:update'
+t.menu.parentName = '上级菜单'
+t.menu.parentNameDefault = 'First tier menu'
+t.menu.resource = '授权资源'
+t.menu.resourceUrl = '资源URL'
+t.menu.resourceMethod = 'Request methods'
+t.menu.resourceAddItem = '添加一项'
+
+t.params = {}
+t.params.name = 'Parameter Name'
+t.params.code = 'Parameter Code'
+t.params.paramCode = 'Parameter Code'
+t.params.paramValue = 'Parameter Value'
+t.params.paramStdValue = 'Standard Parameter Code'
+t.params.plctitle = 'PLC Collection Parameters'
+t.params.plcid = 'PLC连接表ID'
+t.params.remark = 'Remark'
+
+t.role = {}
+t.role.name = 'Role Name'
+t.role.remark = 'Remark'
+t.role.createDate = 'Create Time'
+t.role.menuList = 'Menu authorization' // ?
+t.role.deptList = 'Data authorization' // ?
+
+t.user = {}
+t.user.username = 'User Name'
+t.user.deptName = 'Department'
+t.user.email = 'Email'
+t.user.mobile = 'Phone'
+t.user.status = 'Status'
+t.user.status0 = 'Pause' // ?
+t.user.status1 = 'Normal'
+t.user.createDate = 'Create Time'
+t.user.password = 'Password'
+t.user.confirmPassword = 'Confirm Password'
+t.user.realName = 'Actual Name'
+t.user.gender = 'Gender'
+t.user.gender0 = 'male'
+t.user.gender1 = 'female'
+t.user.gender2 = 'secret'
+t.user.roleIdList = 'Role Configurations'
+t.user.validate = {}
+t.user.validate.confirmPassword = 'The two passwords are different. Please check again.'
+t.user.select = 'Select an user'
+t.user.selecterror = 'Pick up a record'
+
+export default t

src/i18n/index.js

@@ -2,8 +2,9 @@ import Vue from 'vue'
 import VueI18n from 'vue-i18n'
 import Cookies from 'js-cookie'
 import zhCNLocale from 'element-ui/lib/locale/lang/zh-CN'
+import enLocale from 'element-ui/lib/locale/lang/en'
 import zhCN from './zh-CN'
-
+import en from './en'
 Vue.use(VueI18n)
 
 export const messages = {
@@ -11,11 +12,36 @@ export const messages = {
     '_lang': '简体中文',
     ...zhCN,
     ...zhCNLocale
+  },
+  'en': {
+    '_lang': 'English',
+    ...en,
+    ...enLocale
   }
 }
 
+export function getLanguage() {
+  if (Cookies.get('language')) {
+    return Cookies.get('language')
+  }
+
+  // if has not choose language
+  const language = (navigator.language || navigator.browserLanguage)
+
+  const locales = Object.keys(messages)
+  for (const locale of locales) {
+    if (language.indexOf(locale) > -1) {
+      Cookies.set('language', locale)
+      return locale
+    }
+  }
+  Cookies.set('language', 'en')
+  return 'en'
+
+}
+
 export default new VueI18n({
   // locale: Cookies.get('language') || 'zh-CN',
-  locale: 'zh-CN', // 先默认中文
+  locale: getLanguage(), // 先默认中文
   messages
 })

src/i18n/zh-CN.js

@@ -1,39 +1,394 @@
 const t = {}
 
 t.loading = '加载中...'
+t.createTime = '添加时间'
 
 t.brand = {}
-t.brand.lg = '人人权限系统'
+t.brand.lg = '生产监控系统'
-t.brand.mini = '人人'
+t.brand.mini = '监控'
 
-t.add = '新增'
+t.routes = {}
-t.delete = '删除'
+// 一级
-t.deleteBatch = '删除'
+t.routes['产品池'] = '产品池'
-t.update = '修改'
+t.routes['基本资料'] = '基本资料'
-t.query = '查询'
+t.routes['设备数采'] = '设备数采'
-t.export = '导出'
+t.routes['厂务管理'] = '厂务管理'
-t.handle = '操作'
+t.routes['报表管理'] = '报表管理'
-t.confirm = '确定'
+t.routes['质量管理'] = '质量管理'
-t.cancel = '取消'
+t.routes['权限管理'] = '权限管理'
-t.clear = '清除'
+t.routes['系统设置'] = '系统设置'
-t.logout = '退出'
+t.routes['日志管理'] = '日志管理'
-t.manage = '处理'
+t.routes['数据分析'] = '数据分析'
-t.createDate = '创建时间'
+
-t.keyword = '关键字：'
+// 二级
-t.choose = '请选择'
+t.routes['厂务'] = '厂务'
+t.routes['设备'] = '设备'
+t.routes['字典管理'] = '字典管理'
+t.routes['PLC信息'] = 'PLC信息'
+t.routes['设备与PLC关联配置'] = '设备与PLC关联配置'  // ?
+t.routes['设备生产实时数据'] = '设备生产实时数据'
+t.routes['产线生产实时数据'] = '产线生产实时数据'
+t.routes['质量检查实时数据'] = '质量检查实时数据'
+t.routes['报表总览'] = '报表总览'
+t.routes['报表分类'] = '报表分类'
+t.routes['报表详情'] = '报表详情'
+t.routes['报表设计'] = '报表设计'
+t.routes['报表预览'] = '报表预览'
+t.routes['质量检测基础数据'] = '质量检测基础数据'
+t.routes['当前检测数据'] = '当前检测数据'
+t.routes['检测统计数据'] = '检测统计数据'
+t.routes['质量检查信息记录'] = '质量检查信息记录'
+t.routes['用户管理'] = '用户管理'
+t.routes['部门管理'] = '部门管理'
+t.routes['角色管理'] = '角色管理'
+t.routes['菜单管理'] = '菜单管理'
+t.routes['参数管理'] = '参数管理'
+t.routes['定时任务'] = '定时任务'
+t.routes['文件上传'] = '文件上传'
+t.routes['登录日志'] = '登录日志'
+t.routes['操作日志'] = '操作日志'
+t.routes['设备效率分析'] = '设备效率分析'
+t.routes['设备异常分析'] = '设备异常分析'
+t.routes['设备状态时序图'] = '设备状态时序图'
+
+// 三级
+t.routes['工厂'] = '工厂'
+t.routes['产线'] = '产线'
+t.routes['工段'] = '工段'
+t.routes['设备类型'] = '设备类型'
+t.routes['设备分组'] = '设备分组'
+t.routes['设备信息'] = '设备信息'
+t.routes['设备参数状态监控'] = '设备参数状态监控'
+t.routes['设备分组报警信息'] = '设备分组报警信息'
+t.routes['设备历史参数'] = '设备历史参数'
+t.routes['质量检测类型'] = '质量检测类型'
+t.routes['质量检测信息'] = '质量检测信息'
+t.routes['安灯检测盒'] = '安灯检测盒'
+
+t.andeng = {}
+t.andeng.inspectContent = '检测内容'
+t.andeng.btnVal = '按钮值'
+t.andeng.btnBoxModel = '按钮盒模式'
+
+
+t.dictValueList = '查看值列表'
+t.save = '保存'
+t.add = '新增' // 1
+t.delete = '删除' // 1
+t.deleteBatch = '批量删除' // 1
+t.update = '修改' // 1
+t.query = '查询' // 1
+t.export = '导出' // 1
+t.handle = '操作' // 1
+t.confirm = '确定' // 1
+t.cancel = '取消' // 1
+t.clear = '清除' // 1
+t.logout = '退出' // 1
+t.manage = '处理' // 1
+t.createDate = '创建时间' // 1
+t.keyword = '关键字：' // 1
+t.choose = '请选择' // 1
+t.remark = '备注' // 1
+t.delMark = '删除标志' // 0
+t.isvalid = '是否有效' // 0
+t.available = '可用' // 0
+t.unavailable = '不可用' // 0
+t.alert = '弹窗' // 0
+t.creator = '创建人' // 1
+t.creatorName = '创建人姓名' // 1
+t.updator = '更新人' // 1
+t.updatorName = '更新人姓名' // 1
+t.updateTime = '更新时间'
+t.version = '版本号' // 1
+t.search = '查询' // 1
+t.countPerPage = '每页数' // ?
+t.currentPage = '当前页' // ?
+t.fetchList = '获取数据列表' // ?
+t.multi = '多选' // ?
+t.do = '进行' // ?
+t.submit = '表单提交' // ?
+t.desc = '描述' // 1
+t.disable = '停用' // 1
+t.equipment = '设备' // 1
+t.enabled = '启用状态' // ?
+t.cannotempty = '不能为空' // ?
+t.parameter = '参数名' // 1
+t.enable = '启用' // 1
+t.index = '序号' // 1
+t.relation = '关联' // ?
+t.fetchInfo = '获取信息' // ?
+t.name = '名称' // 1
+t.code = '编码' // 1
+t.attrName = '属性名称' // 1
+t.attrValue = '属性值' // 1
+t.unit = '单位' // 1
+t.table = '表' // 1
+t.table2 = '表格' // 1
+t.downloadurl = '下载地址' // 1
+t.recordTime = '记录时间' // 1
+t.notCollect = '不采集' // 1
+t.collect = '采集' // 1
+t.required = '必填' // 1
+t.paramUrl = '参数地址' // 1
+t.enname = '英文名称' // 1
+t.collectOrNot = '是否采集' // 1
+t.min = '最小值' // 1
+t.max = '最大值' // 1
+t.status = '状态' // 1
+t.normal = '正常' // ?
+t.addr = '地址' // 1
+t.planStop = '计划停机' // ?
+t.startTime = '开始时间' // 1
+t.endTime = '结束时间' // 1
+t.to = '至' // 1
+t.today = '今天' // 1
+
+t.graph = '图形'
+t.category = '分类'
+t.categoryName = '分类名称'
+t.categoryCode = '分类编码'
+t.rate = '比例'
+t.link = '链接地址'
+t.refresh = '刷新'
+t.abbr = '缩写'
+t.detail = '详情'
+t.viewdetail = '查看详情'
+t.viewattr = '查看属性'
+t.edit = '编辑'
+t.source = '来源'
+t.auto = '自动'
+t.manual = '手动'
+t.loaddone = '加载完成'
+t.produceTime = '生产日期'
+t.enterTime = '进厂日期'
+t.manufacturer = '制造商'
+t.success = '修改成功!'
+t.all = '全部'
+t.reset = '重置'
+t.preview = '预览'
+t.design = '设计'
+t.timetype = '时间类型'
+t.reftimerange = '按时间段'
+t.refdate = '按日期'
+t.hour = '小时'
+
+t.errors = {}
+t.errors.nosection = '该产线没有工段'
+t.errors.numsection = '该产线有{num}条工段'
+t.errors.nodata = '没有查询到相关数据!'
+
+t.hints = {}
+t.hints.input = '请输入'
+t.hints.select = '请选择'
+t.hints.date = '请选择日期'
+t.hints.checktime = '请选择检测时间'
+t.hints.number = '请输入正确的数值'
+t.hints.integer = '请输入正确的整数'
+t.hints.addr = '请输入地址'
+t.hints.upload2m = '上传文件大小不要超过 2MB (2048KB)'
+t.hints.upload2mPic = '上传图片文件，且大小不要超过 2MB (2048KB)'
+
+t.factory = {}
+t.factory.title = '工厂'
+t.factory.name = '工厂名称'
+t.factory.code = '工厂编码'
+
+t.prod = {}
+t.prod.id = '产品ID'
+t.prod.name = '产品名称'
+t.prod.code = '产品编码'
+t.prod.type = '产品类型'
+t.prod.area = '单位平方数'
+t.prod.spec = '规格'
+t.prod.attr = '属性'
+t.prod.attrcode = '属性编码'
+t.prod.attrcodeHints = '请输入属性编码'
+t.prod.attrname = '属性名称'
+t.prod.attrnameHints = '请输入属性名称'
+t.prod.attrvalueHints = '请输入属性值'
+t.prod.descHints = '请输入描述'
+// t.prod.processTime = '加工时间 (h)'
+t.prod.processTime = '产线完成单位产品用时 (s)'
+t.prod.processTimeHints = '请输入完成单位产品用时'
+// t.prod.processTimeHints = '请输入加工时间'
+t.prod.relatedPid = '关联产品'
+
+t.alarm = {}
+t.alarm.name = '报警'
+t.alarm.info = '报警信息'
+t.alarm.view = '查看报警'
+t.alarm.eq = '报警设备'
+t.alarm.type = '报警类型'
+t.alarm.code = '报警编码'
+t.alarm.level = '报警级别'
+t.alarm.content = '报警内容'
+t.alarm.source = '报警来源'
+t.alarm.det = '报警详细内容'
+t.alarm.externalCode = '外部编码'
+t.alarm.description = '描述'
+t.alarm.remark = '备注'
+
+t.report = {}
+t.report.name = '报表名称'
+t.report.det = '报表内容'
+t.report.type = '报表分类'
+t.report.code = '报表编码'
+t.report.lnk = '链接地址'
+
+t.inspect = {}
+t.inspect.type = '检测类型'
+t.inspect.code = '检测编码'
+t.inspect.det = '检测内容'
+t.inspect.detcode = '内容编码'
+t.inspect.people = '检测人员'
+t.inspect.time = '检测时间'
+t.inspect.typetotal = '检测类型总数'
+t.inspect.typename = '检测类型名称'
+t.inspect.typecode = '检测类型编码'
+t.inspect.ioTotal = '上下片及检测总数统计'
+t.inspect.plTotal = '各产线检测内容统计'
+t.inspect.inTotal = '上片总数'
+t.inspect.outTotal = '下片总数'
+t.inspect.checkTotal = '检测总数'
+t.inspect.rate = '比例'
+t.inspect.typeCount = '检测类型统计数据'
+
+
+t.realtime = {}
+t.realtime.eq = '设备生产实时数据'
+t.realtime.pl = '产线生产实时数据'
+t.realtime.inspect = '质量检查实时数据'
+t.realtime.in = '进数据'
+t.realtime.out = '出数据'
+t.realtime.data = '报废数据'
+t.realtime.num = '报废数量'
+t.realtime.rate = '报废比例'
+t.realtime.total = '总产量'
+t.realtime.goodrate = '良品率'
+t.realtime.runState = '是否运行'
+t.realtime.state = '状态'
+t.realtime.hasFault = '是否故障'
+t.realtime.recentParamValue = '参数近期值'
+t.realtime.view = '查看'
+t.realtime.input = '投入数'
+t.realtime.output = '产出数'
+t.realtime.eqName = '设备名称'
+t.realtime.eqCode = '设备编码'
+t.realtime.productionSnapshotTime = '生产量记录时间'
+t.realtime.statusSnapshotTime = '状态记录时间'
+t.realtime.refresh = '刷新数据'
+
+
+t.ws = {}
+t.ws.title = '工段'
+t.ws.id = '工段ID'
+t.ws.name = '工段名称'
+t.ws.code = '工段编码'
+t.ws.binded = '已绑定的设备'
+t.ws.unbind = '设备名称'
+t.ws.eqbindplaceholder = '选择一个设备进行绑定'
+t.ws.sort = '工段排序'
+t.ws.setorder = '请输入工段中设备的顺序'
+t.ws.bind = '绑定'
+t.ws.eqbind = '设备绑定'
+t.ws.belong = '所属产线'
+
+t.file = {}
+t.file.title = '文件'
+t.file.name = '文件名称'
+t.file.code = '文件编号'
+t.file.typeName = '文件类型名称'
+t.file.typeCode = '文件类型编号'
+
+t.eq = {}
+t.eq.title = '设备'
+t.eq.id = '设备ID'
+t.eq.name = '设备名称'
+t.eq.code = '设备编码'
+t.eq.type = '设备类型'
+t.eq.grade = '设备规格'
+t.eq.group = '设备分组'
+t.eq.groupname = '分组名称'
+t.eq.groupcode = '分组编码'
+t.eq.excode = '设备外部代码'
+t.eq.input = '上片数据设备'
+t.eq.output = '下片数据设备'
+t.eq.tvalue = '设备TT值'
+t.eq.processingTime = '单件产品加工时间(秒)'
+t.eq.dtype = '数据类别'
+t.eq.dtypenone = '无类别'
+t.eq.dtypeinput = '上片数据设备'
+t.eq.dtypeoutput = '下片数据设备'
+t.eq.upload = '上传资料'
+t.eq.image = '设备图片'
+t.eq.viewattr = '查看设备属性'
+t.eq.plcbarcode = 'plc条码'
+t.eq.plccode = 'PLC编码'
+t.eq.plcname = 'PLC名称'
+t.eq.port = '端口'
+t.eq.type = '类型名称'
+t.eq.typecode = '类型编码'
+t.eq.parent = '父类'
+t.eq.mtbf = '平均故障间隔时间[MTBF] (h)'
+t.eq.mttr = '平均维修时间[MTTR] (h)'
+t.eq.efficienttimeh = '有效时间(h)'
+t.eq.shutdowntimeh = '关机时间(h)'
+t.eq.worktimeh = '工作时长(h)'
+t.eq.downtimeh = '故障时长(h)'
+t.eq.stoptimeh = '停机时长(h)'
+t.eq.worktime = '工作时长'
+t.eq.stoptime = '停机时长'
+t.eq.downtime = '故障时长'
+t.eq.downcount = '故障次数'
+t.eq.downrate = '故障比率'
+t.eq.stoplost = '中断损失'
+t.eq.ratio = '百分比'
+t.eq.time = '时间'
+t.eq.timetrend = '时间区间走势'
+t.eq.nogap = '无间隔'
+t.eq.monthgap = '按月'
+t.eq.daygap = '按天'
+t.eq.weekgap = '按周'
+t.eq.hourgap = '按小时'
+t.eq.workdurationratio = '工作时长比率'
+t.eq.stopdurationratio = '停机时长比率'
+t.eq.stopratio = '停机比率'
+t.eq.downdurationratio = '故障时长比率'
+t.eq.speedefficiency = '速度开动率'
+t.eq.speedlost = '速度损失'
+t.eq.timeefficiency = '时间开动率'
+t.eq.year='年'
+t.eq.month='月'
+t.eq.realyield = '实际加工速度'
+t.eq.designyield = '理论加工速度' 
+t.eq.viewtrend = '查看趋势' 
+
+
+t.pl = {}
+t.pl.title = '产线'
+t.pl.id = '产线ID'
+t.pl.name = '产线名称'
+t.pl.code = '产线编码'
+t.pl.status = '产线状态'
+t.pl.belong = '所属产线'
+t.pl.tvalue = '产线TT值(每小时下片数量)'
+t.pl.factoryHints = '请选择所属工厂'
 
 t.prompt = {}
 t.prompt.title = '提示'
 t.prompt.info = '确定进行[{handle}]操作?'
+t.prompt.sure = '确定删除这条记录吗?'
 t.prompt.success = '操作成功'
 t.prompt.failed = '操作失败'
 t.prompt.deleteBatch = '请选择删除项'
+t.prompt.month = '请选择月份'
 
 t.validate = {}
 t.validate.required = '必填项不能为空'
 t.validate.format = '{attr}格式错误'
 
 t.upload = {}
+t.upload.title = '上传资料'
 t.upload.text = '将文件拖到此处，或<em>点击上传</em>'
 t.upload.tip = '只支持{format}格式文件！'
 t.upload.button = '点击上传'
@@ -42,6 +397,8 @@ t.datePicker = {}
 t.datePicker.range = '至'
 t.datePicker.start = '开始日期'
 t.datePicker.end = '结束日期'
+t.datePicker.starttime = '开始时间'
+t.datePicker.endtime = '结束时间'
 
 t.fullscreen = {}
 t.fullscreen.prompt = '您的浏览器不支持此操作'
@@ -72,7 +429,7 @@ t.login.username = '用户名'
 t.login.password = '密码'
 t.login.captcha = '验证码'
 t.login.demo = '在线演示'
-t.login.copyright = '人人开源'
+t.login.copyright = '版权所有：中建材智能自动化研究院有限公司    版本: 1.0'
 
 t.schedule = {}
 t.schedule.beanName = 'bean名称'
@@ -224,8 +581,13 @@ t.menu.resourceMethod = '请求方式'
 t.menu.resourceAddItem = '添加一项'
 
 t.params = {}
+t.params.name = '参数名称'
+t.params.code = '参数编码'
 t.params.paramCode = '编码'
 t.params.paramValue = '值'
+t.params.paramStdValue = '参数设定标准值'
+t.params.plctitle = 'PLC采集参数'
+t.params.plcid = 'PLC连接表ID'
 t.params.remark = '备注'
 
 t.role = {}

src/router/index.js

@@ -3,6 +3,7 @@ import Router from 'vue-router'
 import http from '@/utils/request'
 import { isURL } from '@/utils/validate'
 import Cookies from 'js-cookie'
+import i18n from '@/i18n'
 
 Vue.use(Router)
 
@@ -29,7 +30,7 @@ export const pageRoutes = [
     meta: { title: '登录' },
     beforeEnter(to, from, next) {
       if (Cookies.get('token')) {
-        Vue.prototype.$message({ message:'已经登录过了', type: 'error' })
+        Vue.prototype.$message({ message: '已经登录过了', type: 'error' })
         next(false)
       } else {
         next()
@@ -91,6 +92,7 @@ router.beforeEach((to, from, next) => {
   if (window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] || fnCurrentRouteIsPageRoute(to, pageRoutes)) {
     return next()
   }
+
   // 获取字典列表, 添加并全局变量保存
   http.get(http.adornUrl('/sys/dict/type/all')).then(({ data: res }) => {
     if (res.code !== 0) {
@@ -98,20 +100,22 @@ router.beforeEach((to, from, next) => {
     }
     window.SITE_CONFIG['dictList'] = res.data
   }).catch((err) => {
-    // console.log("catch /sys/dict/type/all", err)
   })
   // 获取菜单列表, 添加并全局变量保存
   http.get(http.adornUrl('/sys/menu/nav')).then(({ data: res }) => {
-    if (res.code !== 0) {
+    /** axios 的拦截器已经拦截出错情况，此处只考虑正确情况即可 */
-      Vue.prototype.$message.error(res.msg)
-      return next({ name: 'login' })
-    }
-    console.log('menulist: ', res.data)
     window.SITE_CONFIG['menuList'] = res.data
+    // .map(item => {
+    //   if (item.name === '产品池') {
+    //     console.log('Got you')
+    //     item.name = 
+    //   }
+    //   return item
+    // })
     fnAddDynamicMenuRoutes(window.SITE_CONFIG['menuList'])
     next({ ...to, replace: true })
   }).catch((err) => {
-    next({ name: 'login' })
+    // Vue.prototype.$message.error(err)
   })
 })
 
@@ -140,8 +144,11 @@ function fnCurrentRouteIsPageRoute(route, pageRoutes = []) {
  */
 function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
   var temp = []
+
   for (var i = 0; i < menuList.length; i++) {
     if (menuList[i].children && menuList[i].children.length >= 1) {
+      // 菜单的国际化
+      menuList[i].name = i18n.t(`routes["${menuList[i].name}"]`)
       temp = temp.concat(menuList[i].children)
       continue
     }
@@ -153,9 +160,15 @@ function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
       meta: {
         ...window.SITE_CONFIG['contentTabDefault'],
         menuId: menuList[i].id,
-        title: menuList[i].name
+        // 菜单的国际化
+        title: i18n.t(`routes["${menuList[i].name}"]`)
       }
     }
+
+    // 菜单的国际化
+    menuList[i].name = i18n.t(`routes["${menuList[i].name}"]`)
+
+    // console.log('route ===', route.meta.title)
     // eslint-disable-next-line
     let URL = (menuList[i].url || '').replace(/{{([^}}]+)?}}/g, (s1, s2) => eval(s2)) // URL支持{{ window.xxx }}占位符变量
     if (isURL(URL)) {
@@ -168,9 +181,11 @@ function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
     }
     routes.push(route)
   }
+
   if (temp.length >= 1) {
     return fnAddDynamicMenuRoutes(temp, routes)
   }
+
   // 添加路由
   router.addRoutes([
     {

src/utils/filters.js

@@ -1,7 +1,24 @@
 /** filters */
+import moment from 'moment'
 
 export const dictFilter = dictTypeId => {
 	return val => {
 		return JSON.parse(localStorage.getItem('dictList'))[dictTypeId].find(item => item.dictValue === val)?.dictLabel || '-'
 	}
+}
+
+export const timeFilter = (val) => {
+	return moment(val).format('YYYY-MM-DD HH:mm:ss')
+}
+
+export const pick = (obj, paths) => {
+	let result = {}
+	paths.forEach(key => {
+		if (obj.hasOwnProperty(key)) {
+			result[key] = obj[key];
+		} else {
+			result[key] = null
+		}
+	})
+	return result
 }

src/utils/index.js

@@ -5,7 +5,7 @@ import store from '@/store'
  * 权限
  * @param {*} key
  */
-export function hasPermission (key) {
+export function hasPermission(key) {
   return window.SITE_CONFIG['permissions'].indexOf(key) !== -1 || false
 }
 
@@ -13,7 +13,7 @@ export function hasPermission (key) {
  * 获取字典数据列表
  * @param dictType  字典类型
  */
-export function getDictDataList (dictType) {
+export function getDictDataList(dictType) {
   const type = window.SITE_CONFIG['dictList'].find((element) => (element.dictType === dictType))
   if (type) {
     return type.dataList
@@ -27,7 +27,7 @@ export function getDictDataList (dictType) {
  * @param dictType  字典类型
  * @param dictValue  字典值
  */
-export function getDictLabel (dictType, dictValue) {
+export function getDictLabel(dictType, dictValue) {
   const type = window.SITE_CONFIG['dictList'].find((element) => (element.dictType === dictType))
   if (type) {
     const val = type.dataList.find((element) => (element.dictValue === dictValue + ''))
@@ -44,16 +44,17 @@ export function getDictLabel (dictType, dictValue) {
 /**
  * 清除登录信息
  */
-export function clearLoginInfo () {
+export function clearLoginInfo() {
   store.commit('resetStore')
   Cookies.remove('token')
   window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] = false
+  window.SITE_CONFIG['dynamicMenuRoutes'] = []
 }
 
 /**
  * 获取uuid
  */
-export function getUUID () {
+export function getUUID() {
   return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
     return (c === 'x' ? (Math.random() * 16 | 0) : ('r&0x3' | '0x8')).toString(16)
   })
@@ -62,7 +63,7 @@ export function getUUID () {
 /**
  * 获取svg图标(id)列表
  */
-export function getIconList () {
+export function getIconList() {
   var res = []
   var list = document.querySelectorAll('svg symbol')
   for (var i = 0; i < list.length; i++) {
@@ -78,7 +79,7 @@ export function getIconList () {
  * @param {*} id
  * @param {*} pid
  */
-export function treeDataTranslate (data, id = 'id', pid = 'pid') {
+export function treeDataTranslate(data, id = 'id', pid = 'pid') {
   var res = []
   var temp = {}
   for (var i = 0; i < data.length; i++) {
@@ -97,3 +98,19 @@ export function treeDataTranslate (data, id = 'id', pid = 'pid') {
   }
   return res
 }
+
+/** 计算表格的最大高 */
+export function calcMaxHeight(num) {
+  const FIXED_HEIGHT = 220
+  let clientHeight = 0
+  const bodyHeight = document.body.clientHeight || null
+  const documentHeight = document.documentElement.clientHeight || null
+  if (bodyHeight && documentHeight) {
+    clientHeight = Math.max(bodyHeight, documentHeight)
+  } else {
+    clientHeight = documentHeight ? documentHeight : bodyHeight
+  }
+
+  const finalHeight = clientHeight - num - FIXED_HEIGHT
+  return finalHeight > 0 ? finalHeight : -finalHeight
+}

src/utils/request.js

@@ -7,7 +7,10 @@ import isPlainObject from 'lodash/isPlainObject'
 import merge from 'lodash/merge'
 
 const http = axios.create({
-  baseURL: window.SITE_CONFIG['apiURL'],
+  // baseURL: window.SITE_CONFIG['apiURL'],
+  baseURL: '/api',
+  // baseURL: '/yd-monitor',
+  // baseURL: process.env.NODE_ENV === 'production' ? '/api' : '/yd-monitor',
   timeout: 1000 * 180,
   withCredentials: true
 })
@@ -71,7 +74,9 @@ http.interceptors.response.use(response => {
  */
 http.adornUrl = (actionName) => {
   // 非生产环境 && 开启代理, 接口前缀统一使用[/proxyApi/]前缀做代理拦截!
-  return (process.env.NODE_ENV !== 'production' && process.env.OPEN_PROXY ? '/proxyApi/' : window.SITE_CONFIG.projURL) + actionName
+  // return (process.env.NODE_ENV !== 'production' && process.env.OPEN_PROXY ? window.SITE_CONFIG.projURL : '') + actionName
+  // return (process.env.NODE_ENV !== 'production' ? '/yd-monitor' : '/api') + actionName
+  return actionName
 }
 
 /**

src/views/main-navbar.vue

@@ -9,14 +9,18 @@
 		<div class="aui-navbar__body">
 			<el-menu class="aui-navbar__menu mr-auto" mode="horizontal">
 				<el-menu-item index="1" @click="$store.state.sidebarFold = !$store.state.sidebarFold">
-					<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch" aria-hidden="true"><use xlink:href="#icon-outdent"></use></svg>
+					<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch" aria-hidden="true">
+						<use xlink:href="#icon-outdent"></use>
+					</svg>
 				</el-menu-item>
 				<el-menu-item index="2" @click="refresh()">
-					<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--refresh" aria-hidden="true"><use xlink:href="#icon-sync"></use></svg>
+					<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--refresh" aria-hidden="true">
+						<use xlink:href="#icon-sync"></use>
+					</svg>
 				</el-menu-item>
 			</el-menu>
 			<el-menu class="aui-navbar__menu" mode="horizontal">
-				<el-menu-item index="2">
+				<!-- <el-menu-item index="2">
 					<a href="https://www.renren.io/" target="_blank">
 						<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-earth"></use></svg>
 					</a>
@@ -25,9 +29,25 @@
 					<a href="https://gitee.com/renrenio/renren-security" target="_blank">
 						<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#gitee"></use></svg>
 					</a>
+				</el-menu-item> -->
+				<el-menu-item index="3">
+					<el-dropdown placement="bottom" :show-timeout="0" @command="handleCommand">
+						<span class="el-dropdown-link">
+							<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
+								<use xlink:href="#icon-earth"></use>
+							</svg>
+							<!-- <i class="el-icon-arrow-down el-icon--right"></i> -->
+						</span>
+						<el-dropdown-menu slot="dropdown">
+							<el-dropdown-item :disabled="getLang() === 'zh-CN'" command="toCN">中文</el-dropdown-item>
+							<el-dropdown-item :disabled="getLang() === 'en'" command="toEN">En</el-dropdown-item>
+						</el-dropdown-menu>
+					</el-dropdown>
 				</el-menu-item>
 				<el-menu-item index="4" @click="fullscreenHandle()">
-					<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-fullscreen"></use></svg>
+					<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
+						<use xlink:href="#icon-fullscreen"></use>
+					</svg>
 				</el-menu-item>
 				<el-menu-item index="5" class="aui-navbar__avatar">
 					<el-dropdown placement="bottom" :show-timeout="0">
@@ -49,6 +69,7 @@
 	</nav>
 </template>
 <script>
+import Cookies from 'js-cookie'
 import screenfull from 'screenfull'
 import UpdatePassword from './main-navbar-update-password'
 import { clearLoginInfo } from '@/utils'
@@ -64,6 +85,26 @@ export default {
 		UpdatePassword
 	},
 	methods: {
+		// 获取当前语言环境
+		getLang() {
+			return Cookies.get('language')
+		},
+		// 切换语言环境
+		handleCommand(command) {
+			// 切换语言选项时，可能需要手动刷新页面
+			switch (command) {
+				case 'toCN':
+					this.$root.$i18n.locale = 'zh-CN'
+					window.navigator.language = 'zh-cn'
+					break
+				case 'toEN':
+					console.log('root', this.$root.$i18n.locale)
+					this.$root.$i18n.locale = 'en'
+					location.reload()
+					window.navigator.language = 'en-US'
+					break
+			}
+		},
 		// 全屏
 		fullscreenHandle() {
 			if (!screenfull.enabled) {

src/views/main-sidebar.vue

@@ -8,7 +8,7 @@
 				:collapseTransition="false"
 				class="aui-sidebar__menu"
 			>
-				<sub-menu v-for="menu in $store.state.sidebarMenuList" :key="menu.id" :menu="menu" />
+				<sub-menu v-for="menu in unhiddenMenuList" :key="menu.id" :menu="menu" />
 			</el-menu>
 		</div>
 	</aside>
@@ -18,13 +18,41 @@
 import SubMenu from './main-sidebar-sub-menu'
 export default {
 	data() {
-		return {}
+		return {
+			unhiddenMenuList: []
+		}
 	},
 	components: {
 		SubMenu
 	},
-	created() {
+	mounted() {
-		this.$store.state.sidebarMenuList = window.SITE_CONFIG['menuList']
+		// this.$store.state.sidebarMenuList = window.SITE_CONFIG['menuList']
+		this.$nextTick(() => {
+			console.log(`window.SITE_CONFIG['menuList']`, window.SITE_CONFIG['menuList'])
+			this.unhiddenMenuList = this.getUnhiddenRoutesListFrom(window.SITE_CONFIG['menuList'])
+			/** 本地保存一份，store保存一份，感觉 store 都不需要保存... */
+			this.$store.state.sidebarMenuList = this.unhiddenMenuList
+		})
+	},
+	methods: {
+		getUnhiddenRoutesListFrom(fullList) {
+			const list = []
+			if (fullList.length) {
+				fullList.forEach(menu => {
+					if (menu.sort !== 99) {
+						/** 前后端约定，路由排序值为 99 时不在前端的侧边栏展示该路由 */
+						const newRouteItem = JSON.parse(JSON.stringify(menu))
+						if (menu.children) {
+							newRouteItem.children = this.getUnhiddenRoutesListFrom(menu.children)
+						}
+						list.push(newRouteItem)
+					} else {
+						// console.log(menu.name, '是应该被隐藏的路由')
+					}
+				})
+			}
+			return list
+		}
 	}
 }
 </script>

src/views/modules/home.vue

@@ -20,7 +20,6 @@
 			<h3>官方微信群</h3>
 			<ul>
 				<li>扫码下面的二维码，关注【人人开源】公众号，回复【加群】，即可根据提示加入微信群！</li>
-				<li><img src="https://cdn.renren.io/f5cef202207132229319338.jpg" alt="微信群" /></li>
 			</ul>
 		</div>
 	</el-card>

src/views/modules/job/schedule-add-or-update.vue

@@ -58,6 +58,12 @@ export default {
     }
   },
   methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
     init () {
       this.visible = true
       this.$nextTick(() => {
@@ -85,7 +91,7 @@ export default {
         if (!valid) {
           return false
         }
-        this.$http[!this.dataForm.id ? 'post' : 'put']('/sys/schedule', this.dataForm).then(({ data: res }) => {
+        this.$http[!this.dataForm.id ? 'post' : 'put'](this.$http.adornUrl('/sys/schedule'), this.dataForm).then(({ data: res }) => {
           if (res.code !== 0) {
             return this.$message.error(res.msg)
           }

src/views/modules/job/schedule-log.vue

@@ -1,11 +1,11 @@
 <template>
   <el-dialog :visible.sync="visible" :title="$t('schedule.log')" :close-on-click-modal="false" :close-on-press-escape="false" width="75%">
-    <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+    <el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
       <el-form-item>
         <el-input v-model="dataForm.jobId" :placeholder="$t('schedule.jobId')" clearable></el-input>
       </el-form-item>
       <el-form-item>
-        <el-button @click="getDataList()">{{ $t('query') }}</el-button>
+        <el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -56,6 +56,12 @@ export default {
     }
   },
   methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
     init () {
       this.visible = true
       this.getDataList()

src/views/modules/job/schedule.vue

@@ -1,12 +1,12 @@
 <template>
   <el-card shadow="never" class="aui-card--fill">
     <div class="mod-job__schedule">
-      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+      <el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
         <el-form-item>
           <el-input v-model="dataForm.beanName" :placeholder="$t('schedule.beanName')" clearable></el-input>
         </el-form-item>
         <el-form-item>
-          <el-button @click="getDataList()">{{ $t('query') }}</el-button>
+          <el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
         </el-form-item>
         <el-form-item>
           <el-button v-if="$hasPermission('sys:schedule:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
@@ -97,6 +97,12 @@ export default {
     Log
   },
   methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
     // 暂停
     pauseHandle (id) {
       if (!id && this.dataListSelections.length <= 0) {
@@ -111,7 +117,7 @@ export default {
         cancelButtonText: this.$t('cancel'),
         type: 'warning'
       }).then(() => {
-        this.$http.put('/sys/schedule/pause', id ? [id] : this.dataListSelections.map(item => item.id)).then(({ data: res }) => {
+        this.$http.put(this.$http.adornUrl('/sys/schedule/pause'), id ? [id] : this.dataListSelections.map(item => item.id)).then(({ data: res }) => {
           if (res.code !== 0) {
             return this.$message.error(res.msg)
           }
@@ -140,7 +146,7 @@ export default {
         cancelButtonText: this.$t('cancel'),
         type: 'warning'
       }).then(() => {
-        this.$http.put('/sys/schedule/resume', id ? [id] : this.dataListSelections.map(item => item.id)).then(({ data: res }) => {
+        this.$http.put(this.$http.adornUrl('/sys/schedule/resume'), id ? [id] : this.dataListSelections.map(item => item.id)).then(({ data: res }) => {
           if (res.code !== 0) {
             return this.$message.error(res.msg)
           }
@@ -169,7 +175,7 @@ export default {
         cancelButtonText: this.$t('cancel'),
         type: 'warning'
       }).then(() => {
-        this.$http.put('/sys/schedule/run', id ? [id] : this.dataListSelections.map(item => item.id)).then(({ data: res }) => {
+        this.$http.put(this.$http.adornUrl('/sys/schedule/run'), id ? [id] : this.dataListSelections.map(item => item.id)).then(({ data: res }) => {
           if (res.code !== 0) {
             return this.$message.error(res.msg)
           }

src/views/modules/monitoring/equipment-add-or-update.vue

@@ -1,254 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="设备名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="设备名称"></el-input>
-			</el-form-item>
-			<el-form-item label="英文名称" prop="enName">
-				<el-input v-model="dataForm.enName" placeholder="英文名称"></el-input>
-			</el-form-item>
-			<el-form-item label="缩写" prop="abbr">
-				<el-input v-model="dataForm.abbr" placeholder="缩写"></el-input>
-			</el-form-item>
-			<el-form-item label="进厂日期" prop="enterTime">
-				<el-input v-model="dataForm.enterTime" placeholder="进厂日期"></el-input>
-			</el-form-item>
-			<el-form-item label="生产日期" prop="productionTime">
-				<el-input v-model="dataForm.productionTime" placeholder="生产日期"></el-input>
-			</el-form-item>
-			<el-form-item label="设备类型，关联设备类型表" prop="equipmentTypeId">
-				<el-input v-model="dataForm.equipmentTypeId" placeholder="设备类型，关联设备类型表"></el-input>
-			</el-form-item>
-			<el-form-item label="分组id （关联 T_EQUIPMENT_GROUP）" prop="groupId">
-				<el-input v-model="dataForm.groupId" placeholder="分组id （关联 T_EQUIPMENT_GROUP）"></el-input>
-			</el-form-item>
-			<el-form-item label="0:无类别，1:上片数据设备，2:下片数据设备" prop="dataType">
-				<el-input v-model="dataForm.dataType" placeholder="0:无类别，1:上片数据设备，2:下片数据设备"></el-input>
-			</el-form-item>
-			<el-form-item label="每小时生产数量" prop="tvalue">
-				<el-input v-model="dataForm.tvalue" placeholder="每小时生产数量"></el-input>
-			</el-form-item>
-			<el-form-item label="单件加工时间 s/件" prop="processingTime">
-				<el-input v-model="dataForm.processingTime" placeholder="单件加工时间 s/件"></el-input>
-			</el-form-item>
-			<el-form-item label="制造商" prop="manufacturer">
-				<el-input v-model="dataForm.manufacturer" placeholder="制造商"></el-input>
-			</el-form-item>
-			<el-form-item label="规格" prop="spec">
-				<el-input v-model="dataForm.spec" placeholder="规格"></el-input>
-			</el-form-item>
-			<el-form-item label="功能描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="功能描述"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-			<el-form-item label="外部系统代码" prop="externalCode">
-				<el-input v-model="dataForm.externalCode" placeholder="外部系统代码"></el-input>
-			</el-form-item>
-			<el-form-item label="统一用的外部代码，代表用哪个设备的数据代替该设备，目前用于生产数量统计" prop="externalCodeStatis">
-				<el-input v-model="dataForm.externalCodeStatis" placeholder="统一用的外部代码，代表用哪个设备的数据代替该设备，目前用于生产数量统计"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				code: '',
-				name: '',
-				enName: '',
-				abbr: '',
-				enterTime: '',
-				productionTime: '',
-				equipmentTypeId: '',
-				groupId: '',
-				dataType: '',
-				tvalue: '',
-				processingTime: '',
-				manufacturer: '',
-				spec: '',
-				description: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: '',
-				externalCode: '',
-				externalCodeStatis: ''
-			},
-			dataRule: {
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
-				enName: [{ required: true, message: '英文名称不能为空', trigger: 'blur' }],
-				abbr: [{ required: true, message: '缩写不能为空', trigger: 'blur' }],
-				enterTime: [{ required: true, message: '进厂日期不能为空', trigger: 'blur' }],
-				productionTime: [{ required: true, message: '生产日期不能为空', trigger: 'blur' }],
-				equipmentTypeId: [{ required: true, message: '设备类型，关联设备类型表不能为空', trigger: 'blur' }],
-				groupId: [{ required: true, message: '分组id （关联 T_EQUIPMENT_GROUP）不能为空', trigger: 'blur' }],
-				dataType: [{ required: true, message: '0:无类别，1:上片数据设备，2:下片数据设备不能为空', trigger: 'blur' }],
-				tvalue: [{ required: true, message: '每小时生产数量不能为空', trigger: 'blur' }],
-				processingTime: [{ required: true, message: '单件加工时间 s/件不能为空', trigger: 'blur' }],
-				manufacturer: [{ required: true, message: '制造商不能为空', trigger: 'blur' }],
-				spec: [{ required: true, message: '规格不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '功能描述不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }],
-				externalCode: [{ required: true, message: '外部系统代码不能为空', trigger: 'blur' }],
-				externalCodeStatis: [{ required: true, message: '统一用的外部代码，代表用哪个设备的数据代替该设备，目前用于生产数量统计不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipment/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.code = data.equipment.code
-							this.dataForm.name = data.equipment.name
-							this.dataForm.enName = data.equipment.enName
-							this.dataForm.abbr = data.equipment.abbr
-							this.dataForm.enterTime = data.equipment.enterTime
-							this.dataForm.productionTime = data.equipment.productionTime
-							this.dataForm.equipmentTypeId = data.equipment.equipmentTypeId
-							this.dataForm.groupId = data.equipment.groupId
-							this.dataForm.dataType = data.equipment.dataType
-							this.dataForm.tvalue = data.equipment.tvalue
-							this.dataForm.processingTime = data.equipment.processingTime
-							this.dataForm.manufacturer = data.equipment.manufacturer
-							this.dataForm.spec = data.equipment.spec
-							this.dataForm.description = data.equipment.description
-							this.dataForm.enabled = data.equipment.enabled
-							this.dataForm.remark = data.equipment.remark
-							this.dataForm.valid = data.equipment.valid
-							this.dataForm.creatorId = data.equipment.creatorId
-							this.dataForm.creatorName = data.equipment.creatorName
-							this.dataForm.createTime = data.equipment.createTime
-							this.dataForm.updaterId = data.equipment.updaterId
-							this.dataForm.updaterName = data.equipment.updaterName
-							this.dataForm.updateTime = data.equipment.updateTime
-							this.dataForm.version = data.equipment.version
-							this.dataForm.externalCode = data.equipment.externalCode
-							this.dataForm.externalCodeStatis = data.equipment.externalCodeStatis
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipment/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							enName: this.dataForm.enName,
-							abbr: this.dataForm.abbr,
-							enterTime: this.dataForm.enterTime,
-							productionTime: this.dataForm.productionTime,
-							equipmentTypeId: this.dataForm.equipmentTypeId,
-							groupId: this.dataForm.groupId,
-							dataType: this.dataForm.dataType,
-							tvalue: this.dataForm.tvalue,
-							processingTime: this.dataForm.processingTime,
-							manufacturer: this.dataForm.manufacturer,
-							spec: this.dataForm.spec,
-							description: this.dataForm.description,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version,
-							externalCode: this.dataForm.externalCode,
-							externalCodeStatis: this.dataForm.externalCodeStatis
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/equipment.vue

@@ -1,17 +1,25 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('search') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipment:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipment:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				<el-button @click="exportHandle()">导出</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipment:export')" @click="exportHandle()">{{ $t('export') }}</el-button>
 			</el-form-item>
 		</el-form>
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table
+			:page="pageIndex"
+			:size="pageSize"
+			:data="dataList"
+			:table-head-configs="tableConfigs"
+			:max-height="calcMaxHeight(8)"
+			@operate-event="handleOperations"
+			@refreshDataList="getDataList"
+		/>
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -22,57 +30,113 @@
 			layout="total, sizes, prev, pager, next, jumper"
 		></el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update
+			v-if="addOrUpdateVisible"
+			ref="addOrUpdate"
+			:configs="addOrUpdateConfigs"
+			@refreshDataList="getDataList"
+			@select-change="handleDialogSelectChange"
+			@destory-dialog="handleDestroyDialog"
+		/>
 	</div>
 </template>
 
 <script>
+import i18n from '@/i18n'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
 // import AddOrUpdate from './equipment-add-or-update'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
-import moment from 'moment'
 import CKEditor from 'ckeditor4-vue'
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+import Cookies from 'js-cookie'
 
 const tableConfigs = [
 	{
 		type: 'index',
-		name: '序号'
+		name: i18n.t('index')
-		// more: {
-		// 	index: function(index) {
-		// 		return (index + 1) * 2
-		// 	}
-		// }
 	},
-	{ prop: 'createTime', name: '添加时间', filter: val => moment(val).format('YYYY-MM-DD HH:mm:ss') },
+	{
-	{ prop: 'name', name: '设备名称' },
+		prop: 'createTime',
-	{ prop: 'code', name: '设备编码' },
+		name: i18n.t('createTime'),
-	{ prop: 'equipmentTypeName', name: '设备类型' },
+		filter: timeFilter
-	{ prop: 'groupName', name: '设备分组' },
+	},
-	{ prop: 'enName', name: '英文名称' },
+	{ prop: 'name', name: i18n.t('eq.name') },
-	{ prop: 'abbr', name: '缩写' },
+	{ prop: 'code', name: i18n.t('eq.code') },
-	{ prop: 'details', name: '详情', subcomponent: TableTextComponent, actionName: 'view-detail' },
+	{ prop: 'equipmentTypeName', name: i18n.t('eq.type') },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'groupName', name: i18n.t('eq.group') },
+	{ prop: 'enName', name: i18n.t('enname') },
+	{ prop: 'abbr', name: i18n.t('abbr') },
+	{ prop: 'lineName', name: i18n.t('pl.title') },
+	{ prop: 'sectionName', name: i18n.t('ws.title') },
+	{
+		prop: 'details',
+		name: i18n.t('detail'),
+		subcomponent: TableTextComponent,
+		actionName: 'view-detail'
+	},
+	{
+		prop: 'operations',
+		name: i18n.t('handle'),
+		fixed: 'right',
+		width: 180,
+		subcomponent: TableOperateComponent,
+		options: ['edit', 'delete']
+	}
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/equipment',
 	fields: [
-		{ name: 'name', label: '设备名称', required: true },
+		{ name: 'name', label: i18n.t('eq.name'), required: true },
-		{ name: 'code', label: '设备编码' },
+		{ name: 'code', label: i18n.t('eq.code'), required: true, api: '/monitoring/equipment/getCode' },
-		{ name: 'enName', label: '英文名称' },
+		{ name: 'enName', label: i18n.t('enname') },
-		{ name: 'abbr', label: '缩写' },
+		{ name: 'abbr', label: i18n.t('abbr') },
-		{ name: 'equipmentTypeId', label: '设备类型', required: true, type: 'select', options: [] },
+		{
-		{ name: 'groupId', label: '设备分组', required: true, type: 'select', options: [] },
+			name: 'equipmentTypeId',
+			label: i18n.t('eq.type'),
+			required: true,
+			type: 'select',
+			options: []
+		},
+		{
+			name: 'lineId',
+			label: i18n.t('pl.title'),
+			required: true,
+			type: 'select',
+			options: [],
+			relatedField: 'sectionId' // 关联下面的id，在更换lineId时，会清空相应的sectionId选择结果
+		},
+		{
+			name: 'sectionId',
+			label: i18n.t('ws.title'),
+			required: true,
+			type: 'select',
+			options: []
+		},
+		{
+			name: 'sort',
+			label: i18n.t('ws.sort'),
+			type: 'number',
+			rules: [{ type: 'number', message: i18n.t('hints.number'), trigger: 'blur', transform: val => Number(val) }]
+		},
+		{
+			name: 'groupId',
+			label: i18n.t('eq.group'),
+			required: true,
+			type: 'select',
+			options: []
+		},
 		{
 			name: 'productionTime',
-			label: '生产日期',
+			label: i18n.t('produceTime'),
 			type: 'date',
 			props: {
 				'type': 'date', // element-ui 的配置
-				'placeholder': '请选择日期',
+				'placeholder': i18n.t('hints.date'),
 				'value-format': 'yyyy-MM-ddTHH:mm:ss',
 				'style': {
 					width: '100%'
@@ -81,101 +145,140 @@ const addOrUpdateConfigs = {
 		},
 		{
 			name: 'enterTime',
-			label: '进厂日期',
+			label: i18n.t('enterTime'),
 			type: 'date',
 			props: {
 				'type': 'date', // element-ui 的配置
-				'placeholder': '请选择日期',
+				'placeholder': i18n.t('hints.date'),
 				'value-format': 'yyyy-MM-ddTHH:mm:ss',
 				'style': {
 					width: '100%'
 				}
 			}
 		},
-		{ name: 'tvalue', label: '设备TT值', required: true, rules: [{ type: 'number', message: '请输入正确的浮点值', trigger: 'blur', transform: val => Number(val) }] },
+		{
-		{ name: 'processingTime', label: '单件产品加工时间(秒)', rules: [{ type: 'number', message: '请输入正确的数值', trigger: 'blur', transform: val => Number(val) }] },
+			name: 'tvalue',
-		{ name: 'manufacturer', label: '制造商' },
+			label: i18n.t('eq.tvalue'),
-		{ name: 'spec', label: '设备规格' },
+			required: true,
+			rules: [
+				{
+					type: 'number',
+					message: i18n.t('hints.number'),
+					trigger: 'blur',
+					transform: val => Number(val)
+				}
+			]
+		},
+		{
+			name: 'processingTime',
+			label: i18n.t('eq.processingTime'),
+			rules: [
+				{
+					type: 'number',
+					message: i18n.t('hints.number'),
+					trigger: 'blur',
+					transform: val => Number(val)
+				}
+			]
+		},
+		{ name: 'manufacturer', label: i18n.t('manufacturer') },
+		{ name: 'spec', label: i18n.t('eq.grade') },
 		{
 			name: 'dataType',
-			label: '数据类别',
+			label: i18n.t('eq.dtype'),
 			required: true,
 			type: 'select',
 			options: [
-				{ value: 0, label: '无类别' },
+				{ value: 0, label: i18n.t('eq.dtypenone') },
-				{ value: 1, label: '上片数据设备' },
+				{ value: 1, label: i18n.t('eq.dtypeinput') },
-				{ value: 2, label: '下片数据设备' }
+				{ value: 2, label: i18n.t('eq.dtypeoutput') }
 			]
 		},
-		{ name: 'remark', label: '备注 ' }
+		{ name: 'remark', label: i18n.t('remark') }
 	],
-	// TODO: 富文本  √
-	// TODO: 设备资料上传 √
-	// TODO: 设备图片上传 √
 	extraComponents: [
 		{
 			name: 'description',
 			hasModel: true,
-			label: '功能描述',
+			label: i18n.t('desc'),
 			fieldType: 'string',
 			component: CKEditor.component,
 			props: {
-				value: 'tests',
+				// value: 'tests',
 				config: {
 					// ckeditor 的配置: https://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR_config.html
 					// toolbar: [['Bold']]
+					language: Cookies.get('language') || 'en'
 				}
 			}
 		},
 		{
 			name: 'files',
-			label: '上传资料',
+			label: i18n.t('upload.title'),
 			fieldType: 'array',
 			component: () => import('@/components/base-upload'),
 			props: {
 				// 上传组件需要的 props
 				url: '/monitoring/attachment/uploadFileFormData',
 				extraParams: { typeCode: 'EquipmentInfoFile' },
-				buttonContent: '点击上传',
+				buttonContent: i18n.t('upload.button'),
-				tip: '上传文件大小不要超过 2mb (2048kb)'
+				tip: i18n.t('hints.upload2m')
 			}
 		},
 		{
 			name: 'files',
-			label: '设备图片',
+			label: i18n.t('eq.image'),
 			fieldType: 'array',
 			component: () => import('@/components/base-upload'),
 			props: {
 				// 上传组件需要的 props
 				url: '/monitoring/attachment/uploadFileFormData',
 				extraParams: { typeCode: 'EquipmentInfoImage' },
-				buttonContent: '点击上传',
+				buttonContent: i18n.t('upload.button'),
-				tip: '上传图片文件，且大小不要超过 2mb (2048kb)'
+				tip: i18n.t('hints.upload2mPic')
 			}
 		}
 	],
 	subtable: {
-		title: '查看设备属性',
+		title: i18n.t('eq.viewattr'),
 		url: '/monitoring/equipmentAttr',
 		relatedField: 'equipmentId',
 		tableConfigs: [
-			{ type: 'index', name: '序号' },
+			{ type: 'index', width: 100, name: i18n.t('index') },
-			{ prop: 'createTime', name: '创建时间' },
+			{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-			{ prop: 'attrName', name: '属性名称', formField: true },
+			{ prop: 'attrName', name: i18n.t('attrName'), formField: true },
-			{ prop: 'attrValue', name: '属性值', formField: true },
+			{ prop: 'attrValue', name: i18n.t('attrValue'), formField: true },
-			{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+			{
+				prop: 'operations',
+				name: i18n.t('handle'),
+				fixed: 'right',
+				width: 180,
+				subcomponent: TableOperateComponent,
+				options: ['edit', 'delete']
+			}
 		]
 	},
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/equipment', permission: '', showOnEdit: false },
+		{
-		{ name: 'update', url: '/monitoring/equipment', permission: '', showOnEdit: true }
+			name: 'save',
+			url: '/monitoring/equipment',
+			permission: 'monitoring:equipment:save',
+			showOnEdit: false
+		},
+		{
+			name: 'update',
+			url: '/monitoring/equipment',
+			permission: 'monitoring:equipment:update',
+			showOnEdit: true
+		}
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			tableConfigs,
 			addOrUpdateConfigs,
 			dataForm: {
@@ -198,9 +301,52 @@ export default {
 		console.log('activated')
 		this.getDataList()
 		this.getGroupList()
+		this.getPlList()
 		this.getTypeList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
+		// 获取产线列表，用于刷新工段列表
+		getPlList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
+				method: 'get'
+			}).then(({ data: res }) => {
+				const plConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'lineId')
+				plConfig.options =
+					res.data?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
+			})
+		},
+		// 获取工段列表
+		getWsList(id) {
+			let params = {
+				page: 1,
+				limit: 999
+			}
+			if (id) {
+				params.lineId = id
+			}
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/workshopSection/page'),
+				method: 'get',
+				params: this.$http.adornParams(params)
+			}).then(({ data: res }) => {
+				const wsConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'sectionId')
+				wsConfig.options =
+					res.data?.list?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
+			})
+		},
 		// 获取设备类型列表
 		getTypeList() {
 			this.$http({
@@ -213,7 +359,11 @@ export default {
 				})
 			}).then(({ data }) => {
 				const eqTypeConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'equipmentTypeId')
-				eqTypeConfig.options = data.data?.list?.map(item => ({ value: item.id, label: item.name })) || []
+				eqTypeConfig.options =
+					data.data?.list?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
 			})
 		},
 		// 获取设备分组列表
@@ -228,7 +378,11 @@ export default {
 				})
 			}).then(({ data }) => {
 				const groupConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'groupId')
-				groupConfig.options = data.data?.list?.map(item => ({ value: item.id, label: item.name })) || []
+				groupConfig.options =
+					data.data?.list?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
 			})
 		},
 		// 获取数据列表
@@ -245,6 +399,8 @@ export default {
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
 					this.dataList = data.data.list
+					// this.dataList = new Array(20).fill('1')
+					// console.log('data list', this.dataList)
 					this.totalPage = data.data.total
 				} else {
 					this.dataList = []
@@ -268,6 +424,13 @@ export default {
 		selectionChangeHandle(val) {
 			this.dataListSelections = val
 		},
+		// 对话框里的某个选择改变了
+		handleDialogSelectChange({ name, id }) {
+			switch (name) {
+				case 'lineId':
+					this.getWsList(id)
+			}
+		},
 		handleOperations({ type, data: id }) {
 			switch (type) {
 				case 'view-detail':
@@ -289,13 +452,17 @@ export default {
 		},
 		exportHandle() {
 			// this.$http.get(this.$http.adornUrl('/monitoring/equipment/export')).then(({ data: res }) => {
-			this.$http({ url: this.$http.adornUrl('/monitoring/equipment/export'), method: 'get', responseType: 'blob' }).then(res => {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipment/export'),
+				method: 'get',
+				responseType: 'blob'
+			}).then(res => {
 				let fileName = 'equipment-list.xls'
 				if (res.headers['content-disposition']) {
 					const contentDisposition = res.headers['content-disposition']
 					fileName = contentDisposition.slice(contentDisposition.indexOf('filename=') + 9)
 				}
-				
+
 				fileName = decodeURIComponent(fileName)
 
 				const blob = new Blob([res.data])
@@ -335,9 +502,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -347,7 +514,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentAdd.vue

@@ -1,32 +0,0 @@
-<template>
-	<div class="equipment-add">
-		<h2>{{ $route.params.isdetail ? '查看详情' : $route.params.equipmentId ? '编辑' : '新增' }}</h2>
-		<p>id: {{ $route.params.equipmentId }}</p>
-	</div>
-</template>
-
-<script>
-export default {
-	name: 'EquipmentAdd',
-	props: {},
-	data() {
-		return {}
-	},
-	watch: {
-		'$route.params': function(val, oldVal) {}
-	},
-	methods: {}
-}
-</script>
-
-<style scoped>
-.equipment-add {
-	background: #fff;
-	padding: 12px;
-	min-height: 50vh;
-}
-
-h2 {
-	margin: 8px 0;
-}
-</style>

src/views/modules/monitoring/equipmentAlarmLog-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="报警信息ID，关联T_equipment_group_alarm表" prop="alarmId">
 				<el-input v-model="dataForm.alarmId" placeholder="报警信息ID，关联T_equipment_group_alarm表"></el-input>
@@ -19,31 +19,31 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -143,7 +143,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentAlarmLog.vue

@@ -1,39 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenalarmlog:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenalarmlog:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="alarmId" header-align="center" align="center" label="报警信息ID，关联T_equipment_group_alarm表"> </el-table-column>
-			<el-table-column prop="alarmSource" header-align="center" align="center" label="报警来源"> </el-table-column>
-			<el-table-column prop="alarmContent" header-align="center" align="center" label="报警详细内容"> </el-table-column>
-			<el-table-column prop="alarmEquipmentId" header-align="center" align="center" label="报警设备id 关联equipment表"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-			<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -51,30 +28,35 @@
 
 <script>
 import AddOrUpdate from './equipmentAlarmLog-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
-
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 const tableConfigs = [
 	{ prop: 'id', name: 'ID' },
 	{ prop: 'alarmId', name: '报警信息ID，关联T_equipment_group_alarm表' },
 	{ prop: 'alarmSource', name: '报警来源' },
 	{ prop: 'alarmContent', name: '报警详细内容' },
 	{ prop: 'alarmEquipmentId', name: '报警设备id 关联equipment表' },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'remark', name: i18n.t('remark') },
-	{ prop: 'valid', name: '删除标志，是否有效:1 可用 0不可用' },
+	{ prop: 'valid', name: i18n.t('delMark') },
-	{ prop: 'creatorId', name: '创建人' },
+	{ prop: 'creatorId', name: i18n.t('creator') },
-	{ prop: 'creatorName', name: '创建人姓名' },
+	{ prop: 'creatorName', name: i18n.t('creatorName') },
-	{ prop: 'createTime', name: '创建时间' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'updaterId', name: '更新人' },
+	{ prop: 'updaterId', name: i18n.t('updator') },
-	{ prop: 'updaterName', name: '更新人姓名' },
+	{ prop: 'updaterName', name: i18n.t('updatorName') },
-	{ prop: 'updateTime', name: '更新时间' },
+	{ prop: 'updateTime', name: i18n.t('updateTime'), filter: timeFilter },
-	{ prop: 'version', name: '版本号' },		{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'version', name: i18n.t('version') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 export default {
 	data() {
-		return {tableConfigs,
+		return {
+			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -88,12 +70,19 @@ export default {
 		}
 	},
 	components: {
-		AddOrUpdate,BaseTable
+		AddOrUpdate,
+		BaseTable
 	},
 	activated() {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -145,9 +134,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -157,7 +146,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentAttr-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="设备ID" prop="equipmentId">
 				<el-input v-model="dataForm.equipmentId" placeholder="设备ID"></el-input>
@@ -16,31 +16,31 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -136,7 +136,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentCurrentState.vue

@@ -0,0 +1,258 @@
+<template>
+	<div class="mod-config">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
+			<el-form-item>
+				<el-select v-model="dataForm.lineId" :placeholder="'产线'" clearable>
+					<el-option v-for="line in lineList" :key="line.code" :value="line.id" :label="line.name" />
+				</el-select>
+			</el-form-item>
+			<el-form-item>
+				<el-select v-model="dataForm.equipmentId" :placeholder="'设备名称'" clearable>
+					<el-option v-for="eq in eqList" :key="eq.code" :value="eq.id" :label="eq.name" />
+				</el-select>
+			</el-form-item>
+			<el-form-item>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
+				<!-- <el-button v-if="$hasPermission('monitoring:equipmentgroup:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
+			</el-form-item>
+		</el-form>
+
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<el-pagination
+			@size-change="sizeChangeHandle"
+			@current-change="currentChangeHandle"
+			:current-page="pageIndex"
+			:page-sizes="[10, 20, 50, 100]"
+			:page-size="pageSize"
+			:total="totalPage"
+			layout="total, sizes, prev, pager, next, jumper"
+		>
+		</el-pagination>
+		<!-- 弹窗, 新增 / 修改 -->
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
+	</div>
+</template>
+
+<script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+// import AddOrUpdate from './equipmentGroup-add-or-update'
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+// import TableOperateComponent from '@/components/base-table/components/operationComponent'
+import TableTextComponent from '@/components/base-table/components/detailComponent'
+
+const tableConfigs = [
+	{
+		type: 'index',
+		name: i18n.t('index')
+	},
+	{ prop: 'equipmentName', name: i18n.t('realtime.eqName') },
+	{ prop: 'equipmentCode', name: i18n.t('realtime.eqCode') },
+	{ prop: 'inputNum', name: i18n.t('realtime.input') },
+	{ prop: 'outputNum', name: i18n.t('realtime.output') },
+	{
+		prop: 'run',
+		name: i18n.t('realtime.runState'),
+		filter: val => {
+			if (val !== null && val !== undefined) return val ? '是' : '否'
+		}
+	},
+	{
+		prop: 'status',
+		name: i18n.t('realtime.state'),
+		filter: val => {
+			if (val !== null && val !== undefined) return ['正常', '计划停机', '故障'][+val]
+		}
+	},
+	{
+		prop: 'error',
+		name: i18n.t('realtime.hasFault'),
+		filter: val => {
+			if (val !== null && val !== undefined) return val ? '是' : '否'
+		}
+	},
+	{ prop: 'quantityTime', name: i18n.t('realtime.productionSnapshotTime'), filter: timeFilter },
+	{ prop: 'statusTime', name: i18n.t('realtime.statusSnapshotTime'), filter: timeFilter },
+	{
+		prop: 'alarm',
+		name: i18n.t('realtime.recentParamValue'),
+		buttonContent: i18n.t('realtime.view'),
+		subcomponent: TableTextComponent,
+		emitFullData: true,
+		actionName: 'view-alarm'
+	}
+	// { prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+]
+
+const addOrUpdateConfigs = {
+	type: 'dialog',
+	infoUrl: '/monitoring/equipmentGroup',
+	fields: [{ name: 'name', label: i18n.t('eq.groupname') }, { name: 'code', label: i18n.t('eq.groupcode') }, 'remark'],
+	operations: [
+		{ name: 'cancel', showAlways: true },
+		{ name: 'save', url: '/monitoring/equipmentGroup', permission: 'monitoring:equipmentgroup:save', showOnEdit: false },
+		{ name: 'update', url: '/monitoring/equipmentGroup', permission: 'monitoring:equipmentgroup:update', showOnEdit: true }
+	]
+}
+
+export default {
+	data() {
+		return {
+			addOrUpdateConfigs,
+			calcMaxHeight,
+			tableConfigs,
+			dataForm: {
+				equipmentId: '',
+				lineId: ''
+			},
+			dataList: [],
+			eqList: [],
+			lineList: [],
+			pageIndex: 1,
+			pageSize: 10,
+			totalPage: 0,
+			dataListLoading: false,
+			dataListSelections: [],
+			addOrUpdateVisible: false
+		}
+	},
+	components: {
+		AddOrUpdate,
+		BaseTable
+	},
+	activated() {
+		this.getEqList()
+		this.getLineList()
+		this.getDataList()
+	},
+	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
+		// 设备
+		getEqList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipment/page'),
+				method: 'get'
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.eqList = data.data.list
+				} else {
+					this.eqList = []
+				}
+			})
+		},
+		// 产线
+		getLineList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
+				method: 'get'
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.lineList = data.data
+				} else {
+					this.lineList = []
+				}
+			})
+		},
+		// 获取数据列表
+		getDataList() {
+			this.addOrUpdateVisible = false
+			this.dataListLoading = true
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipmentValueMonitor/realTimePage'),
+				method: 'get',
+				params: this.$http.adornParams({
+					page: this.pageIndex,
+					limit: this.pageSize,
+					equipmentId: this.dataForm.equipmentId,
+					lineId: this.dataForm.lineId
+				})
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.dataList = data.data.list
+					this.totalPage = data.data.total
+				} else {
+					this.dataList = []
+					this.totalPage = 0
+				}
+				this.dataListLoading = false
+			})
+		},
+		// 每页数
+		sizeChangeHandle(val) {
+			this.pageSize = val
+			this.pageIndex = 1
+			this.getDataList()
+		},
+		// 当前页
+		currentChangeHandle(val) {
+			this.pageIndex = val
+			this.getDataList()
+		},
+		// 多选
+		selectionChangeHandle(val) {
+			this.dataListSelections = val
+		},
+		handleOperations({ type, data }) {
+			switch (type) {
+				case 'view-alarm':
+					const { equipmentId: id } = data
+					this.$router.push({
+						name: 'monitoring-equipmentHistoricalParameters',
+						params: { id }
+					})
+					break
+				// case 'edit':
+				// 	return this.addOrUpdateHandle(id)
+				// case 'delete':
+				// 	return this.deleteHandle(id)
+			}
+		},
+		// 新增 / 修改
+		addOrUpdateHandle(id) {
+			this.addOrUpdateVisible = true
+			this.$nextTick(() => {
+				this.$refs.addOrUpdate.init(id)
+			})
+		},
+		// 删除
+		deleteHandle(id) {
+			var ids = id
+				? [id]
+				: this.dataListSelections.map(item => {
+						return item.id
+				  })
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
+				confirmButtonText: i18n.t('confirm'),
+				cancelButtonText: i18n.t('cancel'),
+				type: 'warning'
+			}).then(() => {
+				this.$http({
+					url: this.$http.adornUrl('/monitoring/equipmentGroup'),
+					method: 'delete',
+					data: this.$http.adornData(ids, false, 'raw')
+				}).then(({ data }) => {
+					if (data && data.code === 0) {
+						this.$message({
+							message: i18n.t('prompt.success'),
+							type: 'success',
+							duration: 1500,
+							onClose: () => {
+								this.getDataList()
+							}
+						})
+					} else {
+						this.$message.error(data.msg)
+					}
+				})
+			})
+		}
+	}
+}
+</script>

src/views/modules/monitoring/equipmentEfficiency.vue

@@ -0,0 +1,375 @@
+<template>
+	<!-- 设备效率分析 -->
+	<div class="mod-config">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
+			<!-- 工厂 -->
+			<el-form-item>
+				<!-- <el-select v-model="dataForm.factoryId" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-select> -->
+				<el-select v-model="dataForm.ftId" :placeholder="$t('factory.title')" clearable>
+					<el-option v-for="factory in factoryList" :key="factory.id" :value="factory.id" :label="factory.name" />
+				</el-select>
+			</el-form-item>
+			<!-- 产线 -->
+			<el-form-item>
+				<el-select v-model="dataForm.productlines" :placeholder="$t('pl.title')" multiple clearable>
+					<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id" :label="productLine.name" />
+				</el-select>
+			</el-form-item>
+			<!-- 时间类型 -->
+			<!-- 按时间段 -->
+			<el-form-item>
+				<el-select v-model="timeType" :placeholder="$t('timetype')" clearable>
+					<el-option value="range" :label="$t('reftimerange')" />
+					<el-option value="date" :label="$t('refdate')" />
+				</el-select>
+			</el-form-item>
+			<!-- 日期选择 -->
+			<el-form-item v-if="timeType === 'date'">
+				<el-date-picker key="range-picker" v-model="rawTime" type="date" :placeholder="$t('hints.date')" format="yyyy-MM-dd" />
+			</el-form-item>
+			<!-- 时间段选择 -->
+			<el-form-item v-else>
+				<el-date-picker
+					key="time-picker"
+					v-model="rawTime"
+					type="daterange"
+					:range-separator="$t('datePicker.range')"
+					:start-placeholder="$t('datePicker.starttime')"
+					:end-placeholder="$t('datePicker.endtime')"
+					format="yyyy-MM-dd"
+				/>
+			</el-form-item>
+			<!-- 按钮 -->
+			<el-form-item>
+				<el-button @click="currentChangeHandle(1)">{{ $t('search') }}</el-button>
+				<!-- <el-button v-if="$hasPermission('monitoring:equipmentEffiency:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
+			</el-form-item>
+		</el-form>
+
+		<transition mode="out-in" name="slide-to-left">
+			<equipment-efficiency-graph v-if="showGraph" key="graph" ref="eegraph" @close-graph="showGraph = false" />
+			<base-table v-else :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)"
+				@operate-event="handleOperations" @refreshDataList="getDataList" />
+			<!-- v-loading="dataIsLoading " -->
+		</transition>
+		<!-- <el-pagination
+			@size-change="sizeChangeHandle"
+			@current-change="currentChangeHandle"
+			:current-page="pageIndex"
+			:page-sizes="[10, 20, 50, 100]"
+			:page-size="pageSize"
+			:total="totalPage"
+			layout="total, sizes, prev, pager, next, jumper"
+		></el-pagination> -->
+	</div>
+</template>
+
+<script>
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+// import TableOperateComponent from '@/components/base-table/components/operationComponent'
+import TableTextComponent from '@/components/base-table/components/detailComponent'
+import EquipmentEfficiencyGraph from './equipmentEfficiencyGraph.vue'
+import { calcMaxHeight } from '@/utils'
+// import { timeFilter } from '@/utils/filters'
+import moment from 'moment'
+
+const tableConfigs = [
+	{
+		type: 'index',
+		name: i18n.t('index')
+	},
+	{
+		// name: i18n.t('createTime'),
+		prop: 'factoryName',
+		name: i18n.t('factory.title')
+	},
+	{ prop: 'pdName', name: i18n.t('pl.title') },
+	{ prop: 'wsName', name: i18n.t('ws.title') },
+	{ prop: 'eqName', name: i18n.t('eq.title') },
+	{
+		name: i18n.t('eq.efficienttimeh'),
+		children: [
+			{ prop: 'workTime', name: i18n.t('eq.worktimeh'), width: 120, filter: val => `${val} `+i18n.t('hour') },
+			{ prop: 'workRate', name: i18n.t('eq.workdurationratio'), width: 120, filter: val => (val * 100).toFixed(2) + '%' }
+		]
+	},
+	{
+		name: i18n.t('eq.shutdowntimeh'),
+		children: [
+			{ prop: 'stopTime', name: i18n.t('eq.stoptimeh'), width: 120, filter: val => `${val} `+i18n.t('hour') },
+			{ prop: 'stopRate', name: i18n.t('eq.stopratio'), width: 120, filter: val => (val * 100).toFixed(2) + '%' }
+		]
+	},
+	{
+		name: i18n.t('eq.stoplost'),
+		children: [
+			{ prop: 'downTime', name: i18n.t('eq.downtimeh'), width: 120, filter: val => `${val} `+i18n.t('hour') },
+			{ prop: 'downRate', name: i18n.t('eq.downrate'), width: 120, filter: val => (val * 100).toFixed(2) + '%' },
+			{ prop: 'timeEfficiency', name: i18n.t('eq.timeefficiency'), width: 120, filter: val => (val * 100).toFixed(2) + '%' }
+		]
+	},
+	{
+		name: i18n.t('eq.speedlost'),
+		children: [
+			{ prop: 'realYield', name: i18n.t('eq.realyield'), width: 120, filter: val => `${val} `+i18n.t('hour') },
+			{ prop: 'designYield', name: i18n.t('eq.designyield'), width: 120, filter: val => `${val} `+i18n.t('hour') },
+			{ prop: 'peEfficiency', name: i18n.t('eq.speedefficiency'), width: 120, filter: val => (val * 100).toFixed(2) + '%' }
+		]
+	},
+	{
+		name: 'OEE',
+		prop: 'oee',
+		filter: val => (val * 100).toFixed(2) + '%'
+	},
+	{
+		name: 'TEEP',
+		prop: 'teep',
+		filter: val => (val * 100).toFixed(2) + '%'
+	},
+	{
+		prop: 'operations',
+		name: i18n.t('handle'),
+		fixed: 'right',
+		width: 120,
+		subcomponent: TableTextComponent,
+		// options: ['edit', 'delete']
+		// options: ['view-trend'] // 查看趋势
+		buttonContent: i18n.t('eq.viewtrend'),
+		actionName: 'view-trend',
+		emitFullData: true
+	}
+]
+
+export default {
+	data() {
+		return {
+			/** hfxny part */
+			factoryList: [],
+			productLineList: [],
+			showGraph: false,
+			/** */
+			calcMaxHeight,
+			tableConfigs,
+			timeType: 'date',
+			rawTime: null, // [] or datetime
+			dataForm: {
+				type: 1,
+				ftId: null,
+				productlines: [],
+				startTime: null,
+				entTime: null
+			},
+			dataList: [],
+			pageIndex: 1,
+			pageSize: 10,
+			totalPage: 0,
+			dataListLoading: false
+		}
+	},
+	components: {
+		BaseTable,
+		EquipmentEfficiencyGraph
+	},
+
+	activated() {
+		this.getFactoryList().then(() => {
+			this.getProductLineList()
+		})
+	},
+	watch: {
+		timeType() {
+			// 防止切换日期类型时报错
+			this.rawTime = null
+		}
+	},
+	methods: {
+		// 获取工厂列表
+		getFactoryList() {
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/factory/list'),
+				method: 'get'
+			}).then(({ data: res }) => {
+				if (res && res.code === 0) {
+					this.factoryList = res.data
+					/** set default */
+					if (this.factoryList.length) {
+						this.dataForm.ftId = this.factoryList[0].id
+					}
+				} else {
+					this.factoryList = []
+					this.dataForm.ftId = null
+				}
+			})
+		},
+
+		// 选择工厂时
+		handleFactoryChange(val) {
+			this.getProductLineList()
+		},
+
+		// 获取产线列表
+		getProductLineList() {
+			const query = {
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
+				method: 'get'
+			}
+			if (this.dataForm.ftId) {
+				query.params = this.$http.adornParams({
+					factoryId: this.dataForm.ftId
+				});
+			}
+			this.$http(query).then(({ data: res }) => {
+				if (res && res.code === 0 && res.data.length) {
+					this.productLineList = res.data
+					/** set default */
+					this.dataForm.productlines = [this.productLineList[0].id]
+				} else {
+					this.productLineList = []
+					this.dataForm.productlines = []
+				}
+			})
+		},
+
+		// 时间类型预处理
+		getTimeRange() {
+			let startTime
+			let endTime
+			if (this.rawTime instanceof Array) {
+				startTime = this.rawTime[0] ? moment(this.rawTime[0]).format('YYYY-MM-DDTHH:mm:ss') : '' // 强制axios使用北京时间
+				endTime = this.rawTime[1] ? moment(this.rawTime[1]).format('YYYY-MM-DDTHH:mm:ss') : ''
+			} else {
+				if (this.rawTime) {
+					startTime = moment(this.rawTime).format('YYYY-MM-DDTHH:mm:ss')
+					endTime = moment(startTime)
+						.add(1, 'd')
+						.format('YYYY-MM-DDTHH:mm:ss')
+				} else {
+					startTime = ''
+					endTime = ''
+				}
+			}
+			return { startTime, endTime }
+		},
+
+		// 获取数据列表
+		getDataList() {
+			const { startTime, endTime } = this.getTimeRange()
+			this.showGraph = false
+			// this.dataListLoading = true
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/eqAnalysis/oee'),
+				method: 'post',
+				data: {
+					startTime,
+					endTime,
+					ftId: this.dataForm.ftId,
+					productlines: this.dataForm.productlines,
+					// limit: this.pageIndex,
+					// page: this.pageSize,
+					type: 1
+				}
+			}).then(({ data: res }) => {
+				if (res.data && res.code !== 500) {
+					console.log('oee data:', res)
+					if (res.data.length) {
+						this.dataList = res.data
+						// this.dataList = Array(20).fill(1)
+					} else {
+						this.dataList.splice(0)
+					}
+				} else {
+					this.dataList.splice(0)
+					this.$message.error(res.msg)
+				}
+			})
+		},
+
+		// 查看趋势
+		viewTrend(data) {
+			const { startTime, endTime } = this.getTimeRange()
+			const injectData = {
+				// 时间段
+				startTime,
+				endTime,
+				// 设备id
+				equipmentId: data.eqId,
+				equipmentName: data.eqName,
+				// 时间类型, type 按年，按月，按日等
+				type: 1, // 默认 type 1, 1无间隔；2按月分隔；3按周分隔；4按天分隔
+				// 时长数据: 工作时长， 停机时长，故障时长
+				workTime: data.workTime,
+				stopTime: data.stopTime,
+				downTime: data.downTime,
+				// 比例数据: 工作时长比率，停机时长比率，故障时长比率，速度开动率，OEE，TEEP
+				workRate: data.workRate,
+				stopRate: data.stopRate,
+				downRate: data.downRate,
+				peEfficiency: data.peEfficiency,
+				timeEfficiency: data.timeEfficiency
+			}
+			// console.log('trends data: ', data)
+
+			this.showGraph = true
+
+			console.clear()
+			console.log('inject data: ', injectData)
+
+			setTimeout(() => {
+				// console.log('befoer graph: ', this.$refs.eegraph)
+				this.$refs.eegraph.init(injectData) // 注入初始数据，这些数据在组件内部用作条件，有可能会被更改
+			}, 600) // 动画是500ms
+		},
+
+		// 每页数
+		sizeChangeHandle(val) {
+			this.pageSize = val
+			this.pageIndex = 1
+			this.getDataList()
+		},
+		// 当前页
+		currentChangeHandle(val) {
+			this.pageIndex = val
+			this.getDataList()
+		},
+		// 多选
+		selectionChangeHandle(val) {
+			this.dataListSelections = val
+		},
+
+		handleOperations({ type, data }) {
+			switch (type) {
+				case 'view-trend':
+					return this.viewTrend(data)
+				// return this.addOrUpdateHandle(id, true)
+				// case 'edit':
+				// 	return this.addOrUpdateHandle(id)
+				// case 'delete':
+				// 	return this.deleteHandle(id)
+			}
+		}
+	}
+}
+</script>
+
+<style scoped>
+.slide-to-left-enter-active,
+.slide-to-left-leave-active {
+	transition: all 0.5s;
+}
+
+.slide-to-left-enter {
+	transform: translateX(10px);
+	opacity: 0;
+}
+
+.slide-to-left-leave-to {
+	transform: translateX(-10px);
+	opacity: 0;
+}
+
+.slide-to-left-leave,
+.slide-to-left-enter-to {
+	transform: translateX(0);
+}
+</style>

src/views/modules/monitoring/equipmentEfficiencyGraph.vue

@@ -0,0 +1,330 @@
+<!--
+/*
+* @Author: lb
+* @Date: 2022-07-24 13:30:00
+* @LastEditTime: 2022-07-28 09:30:00
+* @LastEditors: lb
+* @Description: 设备效率分析-echarts图
+*/
+-->
+<template>
+	<div class="graph-area">
+		<span class="close-btn" @click="close">
+			<svg xmlns="http://www.w3.org/2000/svg" style="height: 100%; width: 100%;" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+				<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+			</svg>
+		</span>
+
+		<div class="close-row">
+			<el-radio-group v-model="dataType" class="head-radio-group" size="small" @change="setLegend">
+				<el-radio-button :label="$t('eq.ratio')" />
+				<el-radio-button :label="$t('eq.time')" />
+			</el-radio-group>
+
+			<el-radio-group v-if="1" v-model="searchType" class="head-radio-group" style="margin-left: 8px;" size="small" @change="handleRadioGroupChanged">
+				<el-radio-button v-for="(opt, index) in searchRadioOptions" :key="index" :label="opt" />
+			</el-radio-group>
+		</div>
+
+		<div id="trend-graph" class="real-graph" style="width: 100%; height: 500px;" />
+	</div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+import moment from 'moment'
+import { pick } from 'lodash/object'
+import i18n from '../../../i18n'
+
+class EchartConfigs {
+	constructor() {
+		this.color = ['#e91e63', '#4caf50', '#3f51b5', '#ffc107', '#607d8b']
+		this.title = {
+			text: i18n.t('eq.timetrend'),
+			top: 0,
+			left: 'center',
+			textStyle: {
+				fontWeight: 'bold',
+				fontSize: 18,
+				lineHeight: 18
+			}
+		}
+		this.tooltip = {
+			trigger: 'axis',
+			// 将axisPointer设置得更显眼一点
+			axisPointer: {
+				type: 'shadow'
+			}
+		}
+		// legend
+		this.legend = {
+			icon: 'circle',
+			top: 24,
+			left: 'center',
+			padding: 8,
+			itemGap: 8,
+			data: [] // 动态设置
+		}
+		this.xAxis = {
+			type: 'category',
+			data: [] // 动态设置
+			// https://tushuo.baidu.com/wave/index#/manufacture/dta9pydmexfdhc0sg/999
+		}
+		this.yAxis = {
+			type: 'value'
+		}
+		this.series = [] // 动态设置
+	}
+
+	setTitle(val) {
+		this.title.text = val
+	}
+
+	setLegend(val) {
+		this.legend.data.splice(0)
+		if (Array.isArray(val)) {
+			this.legend.data = val
+		} else {
+			console.error('setLegend() 只接受数组参数')
+		}
+	}
+
+	setXAxis(val) {
+		// console.log('in setXAxis(): ', val)
+		this.xAxis.data.splice(0)
+		if (Array.isArray(val)) {
+			this.xAxis.data = val
+		} else {
+			console.error('setXAxis() 只接受数组参数')
+		}
+	}
+
+	setSeries(val) {
+		this.series.splice(0)
+		if (Array.isArray(val) && this.series.length === 0) {
+			this.series = val
+		} else {
+			console.error('setSeries() 只接受数组参数')
+		}
+	}
+}
+
+export default {
+	name: 'EquipmentEfficiencyGraph',
+	props: {},
+	data() {
+		return {
+			searchType: i18n.t('eq.nogap'),
+			searchRadioOptions: [i18n.t('eq.nogap'), i18n.t('eq.monthgap'), i18n.t('eq.weekgap'), i18n.t('eq.daygap')],
+			dataType: i18n.t('eq.time'),
+			dataRadioOptions: [i18n.t('eq.time'), i18n.t('eq.ratio')],
+			config: new EchartConfigs(),
+			chart: null,
+			rateList: [], // 对请求来的数据分流
+			timeList: [],
+			xAxis: [], // 动态设置
+			injectData: null
+		}
+	},
+	methods: {
+		async initChart() {
+			this.config.setTitle(this.injectData.equipmentName + i18n.t('eq.timetrend'))
+			await this.getList()
+			this.setLegend()
+		},
+
+		init(data) {
+			this.injectData = data
+			if (!this.chart) {
+				this.chart = echarts.init(document.getElementById('trend-graph'))
+				// this.chart.setOption(this.config)
+				this.initChart()
+			}
+		},
+		close() {
+			this.$emit('close-graph')
+		},
+
+		makeQuerys() {
+			const searchTypeMap = {
+				[i18n.t('eq.nogap')]: 1,
+				[i18n.t('eq.monthgap')]: 2,
+				[i18n.t('eq.weekgap')]: 3,
+				[i18n.t('eq.daygap')]: 4,
+				[i18n.t('eq.hourgap')]: 5
+			}
+
+			return {
+				type: searchTypeMap[this.searchType],
+				eqId: this.injectData.equipmentId,
+				startTime: this.injectData.startTime, // '2022-06-14T00:00:00'
+				endTime: this.injectData.endTime
+			}
+		},
+
+		// getOEE
+		getOEE(params) {
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/eqAnalysis/oee'),
+				method: 'post',
+				data: params
+			}).then(({ data: res }) => {
+				if (!res.data || res.code === 500) {
+					this.dataList.splice(0)
+					this.$message.error(res.msg)
+					return { data: null }
+				}
+				return res.data
+			})
+		},
+
+		getList() {
+			const params = this.makeQuerys()
+			// 发起请求
+			return this.getOEE(params).then(datalist => {
+				console.log('getOEE res:', datalist)
+				this.timeList.splice(0)
+				this.rateList.splice(0)
+				this.xAxis.splice(0)
+				if (datalist.length) {
+					// 分流
+					datalist.map(item => {
+						const time = moment(item.time)
+						if (this.searchType === i18n.t('eq.monthgap')) {
+							this.xAxis.push(`${time.year()}${i18n.t('eq.year')}${time.month() + 1}${i18n.t('eq.month')}`)
+						} else if (this.searchType === i18n.t('eq.weekgap')) {
+							this.xAxis.push(`${time.format('YYYY-MM-DD')}`)
+						} else if (this.searchType === i18n.t('eq.daygap')) {
+							this.xAxis.push(`${time.format('YY-M-D')}`)
+						} else {
+							this.xAxis.push(`${time.format('YYYY-MM-DD')}`)
+						}
+						this.timeList.push(pick(item, ['workTime', 'stopTime', 'downTime']))
+						this.rateList.push(pick(item, ['workRate', 'stopRate', 'downRate', 'peEfficiency', 'timeEfficiency', 'oee', 'teep']))
+					})
+
+					// 设置横轴
+					this.config.setXAxis(JSON.parse(JSON.stringify(this.xAxis)))
+				}
+			})
+		},
+
+		async handleRadioGroupChanged() {
+			// 获取数据且设置横轴
+			await this.getList()
+			// 设置legend和数据
+			this.setLegend()
+		},
+
+		setLegend() {
+			// 设置legend
+			const legendMap = {
+				[i18n.t('eq.ratio')]: [
+					i18n.t('eq.workdurationratio'),
+					i18n.t('eq.stopdurationratio'),
+					i18n.t('eq.downdurationratio'),
+					i18n.t('eq.speedefficiency'),
+					i18n.t('eq.timeefficiency'),
+					'OEE',
+					'TEEP'
+				],
+				[i18n.t('eq.time')]: [i18n.t('eq.worktime'), i18n.t('eq.stoptime'), i18n.t('eq.downtime')]
+			}
+			this.config.setLegend(legendMap[this.dataType])
+			this.setData()
+			// 重新绘制
+			this.renderGraph()
+		},
+
+		setData() {
+			if (this.dataType === i18n.t('eq.time')) {
+				const workTimeList = []
+				const stopTimeList = []
+				const downTimeList = []
+				this.timeList.map(item => {
+					workTimeList.push(item.workTime)
+					stopTimeList.push(item.stopTime)
+					downTimeList.push(item.downTime)
+				})
+				this.config.setSeries([
+					{ name: i18n.t('eq.worktime'), type: 'bar', data: workTimeList },
+					{ name: i18n.t('eq.stoptime'), type: 'bar', data: stopTimeList },
+					{ name: i18n.t('eq.downtime'), type: 'bar', data: downTimeList }
+				])
+			} else {
+				// 百分比
+				const workRateList = []
+				const stopRateList = []
+				const downRateList = []
+				const peEfficiencyList = []
+				const timeEfficiencyList = []
+				const oeeList = []
+				const teepList = []
+				this.rateList.map(item => {
+					workRateList.push(item.workRate)
+					stopRateList.push(item.stopRate)
+					downRateList.push(item.downRate)
+					peEfficiencyList.push(item.peEfficiency)
+					timeEfficiencyList.push(item.timeEfficiency)
+					oeeList.push(item.oee)
+					teepList.push(item.teep)
+				})
+				this.config.setSeries([
+					{ name: i18n.t('eq.workdurationratio'), type: 'bar', data: workRateList },
+					{ name: i18n.t('eq.stopdurationratio'), type: 'bar', data: stopRateList },
+					{ name: i18n.t('eq.downdurationratio'), type: 'bar', data: downRateList },
+					{ name: i18n.t('eq.speedefficiency'), type: 'bar', data: peEfficiencyList },
+					{ name: i18n.t('eq.timeefficiency'), type: 'bar', data: timeEfficiencyList },
+					{ name: 'OEE', type: 'bar', data: oeeList },
+					{ name: 'TEEP', type: 'bar', data: teepList }
+				])
+			}
+		},
+
+		// 重新绘制图形
+		renderGraph() {
+			console.log('latest config: ', JSON.stringify(this.config))
+			this.$nextTick(() => {
+				// this.chart.setOption(this.config)
+				this.chart.setOption(this.config, {
+					notMerge: true
+				})
+			})
+		}
+	}
+}
+</script>
+
+<style scoped>
+.graph-area {
+	width: 100%;
+	min-height: 200px;
+	position: relative;
+}
+
+.close-row {
+	position: relative;
+	padding: 8px 0;
+}
+
+.close-btn {
+	position: absolute;
+	z-index: 1;
+	top: 10px;
+	right: 10px;
+	display: inline-block;
+	width: 20px;
+	height: 20px;
+	cursor: pointer;
+	transition: color 0.3s linear;
+}
+
+.close-btn:hover {
+	color: #409eff;
+}
+
+.head-radio-group >>> .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+	background-color: #409eff;
+	border-color: #409eff;
+}
+</style>

src/views/modules/monitoring/equipmentException.vue

@@ -0,0 +1,204 @@
+<template>
+	<!-- 设备效率分析 -->
+	<div class="mod-config">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
+			<!-- 月份 -->
+			<el-form-item>
+				<el-date-picker key="month-picker" v-model="rawTime" type="month" :placeholder="$t('prompt.month')" format="yyyy-MM" />
+			</el-form-item>
+			<!-- 产线 -->
+			<el-form-item>
+				<el-select v-model="dataForm.productlines" :placeholder="$t('pl.title')" multiple clearable>
+					<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id" :label="productLine.name" />
+				</el-select>
+			</el-form-item>
+
+			<!-- 按钮 -->
+			<el-form-item>
+				<el-button @click="currentChangeHandle(1)">{{ $t('search') }}</el-button>
+				<!-- <el-button v-if="$hasPermission('monitoring:equipmentEffiency:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
+			</el-form-item>
+		</el-form>
+
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
+
+		<!-- <el-pagination
+			@size-change="sizeChangeHandle"
+			@current-change="currentChangeHandle"
+			:current-page="pageIndex"
+			:page-sizes="[10, 20, 50, 100]"
+			:page-size="pageSize"
+			:total="totalPage"
+			layout="total, sizes, prev, pager, next, jumper"
+		/> -->
+	</div>
+</template>
+
+<script>
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+// import TableOperateComponent from '@/components/base-table/components/operationComponent'
+import TableTextComponent from '@/components/base-table/components/detailComponent'
+import { timeFilter } from '@/utils/filters'
+import { calcMaxHeight } from '@/utils'
+import moment from 'moment'
+
+const tableConfigs = [
+	{
+		type: 'index',
+		name: i18n.t('index')
+	},
+	// { prop: 'time', name: '时间', filter: timeFilter },
+	{ prop: 'pdName', name: i18n.t('pl.name') },
+	{ prop: 'wsName', name: i18n.t('ws.title') },
+	{ prop: 'eqName', name: i18n.t('eq.title') },
+	{ prop: 'mtbf', name: i18n.t('eq.mtbf'), width: 220 },
+	{ prop: 'mttr', name: i18n.t('eq.mttr'), width: 190 },
+	{ prop: 'workTime', name: i18n.t('eq.worktimeh') },
+	{ prop: 'downTime', name: i18n.t('eq.downtimeh') },
+	{ prop: 'downCount', name: i18n.t('eq.downcount') }
+	// {
+	// 	prop: 'operations',
+	// 	name: i18n.t('handle'),
+	// 	fixed: 'right',
+	// 	width: 120,
+	// 	subcomponent: TableTextComponent,
+	// 	buttonContent: '查看详情', // 会转到“设备报警”
+	// 	emitFullData: true
+	// }
+]
+
+export default {
+	data() {
+		return {
+			/** hfxny part */
+			factoryList: [],
+			productLineList: [],
+			/** */
+			calcMaxHeight,
+			tableConfigs,
+			timeType: 'range',
+			rawTime: new Date(),
+			dataForm: {
+				type: 1,
+				productlines: [],
+				startTime: null,
+				entTime: null
+			},
+			dataList: [],
+			pageIndex: 1,
+			pageSize: 10,
+			totalPage: 0,
+			dataListLoading: false
+		}
+	},
+	components: {
+		BaseTable
+	},
+
+	activated() {
+		// this.getFactoryList()
+		this.getProductLineList()
+	},
+	watch: {},
+	methods: {
+		// 获取工厂列表
+		// getFactoryList() {
+		// 	this.$http({
+		// 		url: this.$http.adornUrl('/monitoring/factory/page'),
+		// 		method: 'get'
+		// 	}).then(({ data }) => {
+		// 		if (data && data.code === 0) {
+		// 			this.factoryList = data.data.list
+		// 			/** set default */
+		// 			if (this.factoryList.length) {
+		// 				this.dataForm.ftId = this.factoryList[0].id
+		// 			}
+		// 		} else {
+		// 			this.factoryList = []
+		// 			this.dataForm.ftId = null
+		// 		}
+		// 	})
+		// },
+		// 获取产线列表
+		getProductLineList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
+				method: 'get'
+			}).then(({ data: res }) => {
+				if (res && res.code === 0) {
+					this.productLineList = res.data
+					/** set default */
+					if (this.productLineList.length) {
+						this.dataForm.productlines = [this.productLineList[0].id]
+					}
+				} else {
+					this.productLineList = []
+					this.dataForm.productlines = []
+				}
+			})
+		},
+
+		// 获取数据列表
+		getDataList() {
+			// this.dataList = Array(10).fill(1)
+			// return
+			let startTime = this.rawTime
+				? moment(this.rawTime)
+						.set({ date: 1, hour: 0, minute: 0, second: 0, millisecond: 0 })
+						.format('YYYY-MM-DDTHH:mm:ss')
+				: ''
+			let endTime = startTime
+				? moment(startTime)
+						.add(1, 'M')
+						.format('YYYY-MM-DDTHH:mm:ss')
+				: ''
+
+			this.dataListLoading = true
+
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/eqAnalysis/mtbrAndMtbr'),
+				method: 'post',
+				data: {
+					startTime,
+					endTime,
+					productlines: this.dataForm.productlines,
+					type: 1
+				}
+			}).then(({ data: res }) => {
+				if (res.code === 500) {
+					this.dataList.splice(0)
+					this.$message.error(res.msg)
+				} else {
+					this.dataList = res.data
+				}
+			})
+		},
+		// 每页数
+		sizeChangeHandle(val) {
+			this.pageSize = val
+			this.pageIndex = 1
+			this.getDataList()
+		},
+		// 当前页
+		currentChangeHandle(val) {
+			this.pageIndex = val
+			this.getDataList()
+		},
+		// 多选
+		selectionChangeHandle(val) {
+			this.dataListSelections = val
+		},
+		handleOperations({ type, data: id }) {
+			switch (type) {
+				case 'view-detail':
+					return this.addOrUpdateHandle(id, true)
+				case 'edit':
+					return this.addOrUpdateHandle(id)
+				case 'delete':
+					return this.deleteHandle(id)
+			}
+		}
+	}
+}
+</script>

src/views/modules/monitoring/equipmentFile-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="设备ID" prop="equipmentId">
 				<el-input v-model="dataForm.equipmentId" placeholder="设备ID"></el-input>
@@ -7,8 +7,8 @@
 			<el-form-item label="文件ID" prop="fileId">
 				<el-input v-model="dataForm.fileId" placeholder="文件ID"></el-input>
 			</el-form-item>
-			<el-form-item label="描述" prop="description">
+			<el-form-item :label="$t('desc')" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
+				<el-input v-model="dataForm.description" :placeholder="$t('desc')"></el-input>
 			</el-form-item>
 			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
 				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
@@ -19,26 +19,26 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 			<el-form-item label="文件类型编号" prop="typeCode">
 				<el-input v-model="dataForm.typeCode" placeholder="文件类型编号"></el-input>
@@ -51,8 +51,8 @@
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -164,7 +164,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentFile.vue

@@ -1,42 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenfile:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenfile:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label=""> </el-table-column>
-			<el-table-column prop="equipmentId" header-align="center" align="center" label="设备ID"> </el-table-column>
-			<el-table-column prop="fileId" header-align="center" align="center" label="文件ID"> </el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column prop="typeCode" header-align="center" align="center" label="文件类型编号"> </el-table-column>
-			<el-table-column prop="fileName" header-align="center" align="center" label="文件名字"> </el-table-column>
-			<el-table-column prop="fileUrl" header-align="center" align="center" label="下载地址"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -54,35 +28,38 @@
 
 <script>
 import AddOrUpdate from './equipmentFile-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
-
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 const tableConfigs = [
 	{ prop: 'id', name: '' },
 	{ prop: 'equipmentId', name: '设备ID' },
 	{ prop: 'fileId', name: '文件ID' },
-	{ prop: 'description', name: '描述' },
+	{ prop: 'description', name: i18n.t('desc') },
-	{ prop: 'enabled', name: '启用状态:0 、停用，1、启用' },
+	{ prop: 'enabled', name: i18n.t('enabled') },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'remark', name: i18n.t('remark') },
-	{ prop: 'valid', name: '删除标志，是否有效:1 可用 0不可用' },
+	{ prop: 'valid', name: i18n.t('delMark') },
-	{ prop: 'creatorId', name: '创建人' },
+	{ prop: 'creatorId', name: i18n.t('creator') },
-	{ prop: 'creatorName', name: '创建人姓名' },
+	{ prop: 'creatorName', name: i18n.t('creatorName') },
-	{ prop: 'createTime', name: '添加时间' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'updaterId', name: '更新人' },
+	{ prop: 'updaterId', name: i18n.t('updator') },
-	{ prop: 'updaterName', name: '更新人姓名' },
+	{ prop: 'updaterName', name: i18n.t('updatorName') },
-	{ prop: 'updateTime', name: '更新时间' },
+	{ prop: 'updateTime', name: i18n.t('updateTime'), filter: timeFilter },
-	{ prop: 'version', name: '版本号' },
+	{ prop: 'version', name: i18n.t('version') },
 	{ prop: 'typeCode', name: '文件类型编号' },
 	{ prop: 'fileName', name: '文件名字' },
-	{ prop: 'fileUrl', name: '下载地址' },
+	{ prop: 'fileUrl', name: i18n.t('downloadurl') },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 export default {
 	data() {
 		return {
 			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -103,6 +80,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -154,9 +137,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -166,7 +149,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentGroup-add-or-update.vue

@@ -1,163 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="分组编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="分组编码"></el-input>
-			</el-form-item>
-			<el-form-item label="分组名字" prop="name">
-				<el-input v-model="dataForm.name" placeholder="分组名字"></el-input>
-			</el-form-item>
-			<el-form-item label="设备类型id" prop="typeId">
-				<el-input v-model="dataForm.typeId" placeholder="设备类型id"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				code: '',
-				name: '',
-				typeId: '',
-				description: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				code: [{ required: true, message: '分组编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '分组名字不能为空', trigger: 'blur' }],
-				typeId: [{ required: true, message: '设备类型id不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentGroup/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.code = data.equipmengroup.code
-							this.dataForm.name = data.equipmengroup.name
-							this.dataForm.typeId = data.equipmengroup.typeId
-							this.dataForm.description = data.equipmengroup.description
-							this.dataForm.remark = data.equipmengroup.remark
-							this.dataForm.valid = data.equipmengroup.valid
-							this.dataForm.creatorId = data.equipmengroup.creatorId
-							this.dataForm.creatorName = data.equipmengroup.creatorName
-							this.dataForm.createTime = data.equipmengroup.createTime
-							this.dataForm.updaterId = data.equipmengroup.updaterId
-							this.dataForm.updaterName = data.equipmengroup.updaterName
-							this.dataForm.updateTime = data.equipmengroup.updateTime
-							this.dataForm.version = data.equipmengroup.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentGroup/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							typeId: this.dataForm.typeId,
-							description: this.dataForm.description,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/equipmentGroup.vue

@@ -1,38 +1,24 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('eq.groupname') + ' / ' + $t('eq.groupcode')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmentgroup:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmentgroup:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
+			:page="pageIndex"
-			<el-table-column prop="code" header-align="center" align="center" label="分组编码"> </el-table-column>
+			:size="pageSize"
-			<el-table-column prop="name" header-align="center" align="center" label="分组名字"> </el-table-column>
+			:data="dataList"
-			<el-table-column prop="typeId" header-align="center" align="center" label="设备类型id"> </el-table-column>
+			:table-head-configs="tableConfigs"
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
+			:max-height="calcMaxHeight(8)"
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
+			@operate-event="handleOperations"
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
+			@refreshDataList="getDataList"
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
+		/>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -44,34 +30,41 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
 // import AddOrUpdate from './equipmentGroup-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'name', name: '分组名称' },
+		type: 'index',
-	{ prop: 'code', name: '分组编码' },
+		name: i18n.t('index')
-	{ prop: 'remark', name: '备注' },
+	},
-	{ prop: 'alarm', name: '报警', buttonContent: '查看报警', subcomponent: TableTextComponent, actionName: 'view-alarm' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'name', name: i18n.t('eq.groupname') },
+	{ prop: 'code', name: i18n.t('eq.groupcode') },
+	{ prop: 'remark', name: i18n.t('remark') },
+	{ prop: 'alarm', name: i18n.t('alarm.name'), buttonContent: i18n.t('alarm.view'), subcomponent: TableTextComponent, actionName: 'view-alarm' },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/equipmentGroup',
-	fields: [{ name: 'name', label: '分组名称' }, { name: 'code', label: '分组编码' }, 'remark'],
+	fields: [{ name: 'name', required: true, label: i18n.t('eq.groupname') }, { name: 'code', required: true, label: i18n.t('eq.groupcode') }, 'remark'],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/equipmentGroup', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/equipmentGroup', permission: 'monitoring:equipmentgroup:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/equipmentGroup', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/equipmentGroup', permission: 'monitoring:equipmentgroup:update', showOnEdit: true }
 	]
 }
 
@@ -79,6 +72,7 @@ export default {
 	data() {
 		return {
 			addOrUpdateConfigs,
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -100,6 +94,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// 获取数据列表
 		getDataList() {
 			this.addOrUpdateVisible = false
@@ -171,9 +171,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -183,7 +183,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentGroupAlarm-add-or-update.vue

@@ -1,198 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="设备分组ID，关联t_equipment_group" prop="equipmentGroupId">
-				<el-input v-model="dataForm.equipmentGroupId" placeholder="设备分组ID，关联t_equipment_group"></el-input>
-			</el-form-item>
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="报警类型 字典表关联label_value" prop="typeDictValue">
-				<el-input v-model="dataForm.typeDictValue" placeholder="报警类型 字典表关联label_value"></el-input>
-			</el-form-item>
-			<el-form-item label="报警级别 字典表关联label_value" prop="gradeDictValue">
-				<el-input v-model="dataForm.gradeDictValue" placeholder="报警级别 字典表关联label_value"></el-input>
-			</el-form-item>
-			<el-form-item label="报警内容" prop="alarmContent">
-				<el-input v-model="dataForm.alarmContent" placeholder="报警内容"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="外部编码，用于对照外部系统的编码" prop="externalCode">
-				<el-input v-model="dataForm.externalCode" placeholder="外部编码，用于对照外部系统的编码"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-			<el-form-item label="推送方式 0邮箱 1微信" prop="alarmNotify">
-				<el-input v-model="dataForm.alarmNotify" placeholder="推送方式 0邮箱 1微信"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				equipmentGroupId: '',
-				code: '',
-				typeDictValue: '',
-				gradeDictValue: '',
-				alarmContent: '',
-				description: '',
-				externalCode: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: '',
-				alarmNotify: ''
-			},
-			dataRule: {
-				equipmentGroupId: [{ required: true, message: '设备分组ID，关联t_equipment_group不能为空', trigger: 'blur' }],
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				typeDictValue: [{ required: true, message: '报警类型 字典表关联label_value不能为空', trigger: 'blur' }],
-				gradeDictValue: [{ required: true, message: '报警级别 字典表关联label_value不能为空', trigger: 'blur' }],
-				alarmContent: [{ required: true, message: '报警内容不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				externalCode: [{ required: true, message: '外部编码，用于对照外部系统的编码不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }],
-				alarmNotify: [{ required: true, message: '推送方式 0邮箱 1微信不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentGroupAlarm/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.equipmentGroupId = data.equipmengroupAlarm.equipmentGroupId
-							this.dataForm.code = data.equipmengroupAlarm.code
-							this.dataForm.typeDictValue = data.equipmengroupAlarm.typeDictValue
-							this.dataForm.gradeDictValue = data.equipmengroupAlarm.gradeDictValue
-							this.dataForm.alarmContent = data.equipmengroupAlarm.alarmContent
-							this.dataForm.description = data.equipmengroupAlarm.description
-							this.dataForm.externalCode = data.equipmengroupAlarm.externalCode
-							this.dataForm.enabled = data.equipmengroupAlarm.enabled
-							this.dataForm.remark = data.equipmengroupAlarm.remark
-							this.dataForm.valid = data.equipmengroupAlarm.valid
-							this.dataForm.creatorId = data.equipmengroupAlarm.creatorId
-							this.dataForm.creatorName = data.equipmengroupAlarm.creatorName
-							this.dataForm.createTime = data.equipmengroupAlarm.createTime
-							this.dataForm.updaterId = data.equipmengroupAlarm.updaterId
-							this.dataForm.updaterName = data.equipmengroupAlarm.updaterName
-							this.dataForm.updateTime = data.equipmengroupAlarm.updateTime
-							this.dataForm.version = data.equipmengroupAlarm.version
-							this.dataForm.alarmNotify = data.equipmengroupAlarm.alarmNotify
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentGroupAlarm/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							equipmentGroupId: this.dataForm.equipmentGroupId,
-							code: this.dataForm.code,
-							typeDictValue: this.dataForm.typeDictValue,
-							gradeDictValue: this.dataForm.gradeDictValue,
-							alarmContent: this.dataForm.alarmContent,
-							description: this.dataForm.description,
-							externalCode: this.dataForm.externalCode,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version,
-							alarmNotify: this.dataForm.alarmNotify
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/equipmentGroupAlarm.vue

@@ -1,54 +1,39 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm">
-			<el-form-item label="设备分组名称">
+			<el-form-item :label="$t('eq.groupname')">
-				<strong>{{ $route.params.groupName }}</strong></el-form-item
+				<strong>{{ $route.params.groupName || '--' }}</strong></el-form-item
 			>
 
-			<el-form-item label="设备分组编码">
+			<el-form-item :label="$t('eq.groupcode')">
-				<strong>{{ $route.params.groupCode }}</strong>
+				<strong>{{ $route.params.groupCode || '--' }}</strong>
 			</el-form-item>
 			<!-- <el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item> -->
 			<br />
 			<el-form-item>
-				<!-- <el-button @click="getDataList()">查询</el-button> -->
+				<!-- 报警编码/内容检索 -->
-				<el-button v-if="$hasPermission('monitoring:equipmentgroupalarm:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-input :placeholder="$t('alarm.code') + '/' + $t('alarm.content')" v-model="dataForm.key" clearable />
+			</el-form-item>
+			<el-form-item>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
+				<el-button v-if="$route.params.id && $hasPermission('monitoring:equipmentgroupalarm:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 				<!-- <el-button v-if="$hasPermission('monitoring:equipmentgroupalarm:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">
 					批量删除
 				</el-button> -->
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
+		<base-table
-			<el-table-column prop="id" header-align="center" align="center" label="ID"></el-table-column>
+			:page="pageIndex"
-			<el-table-column prop="equipmentGroupId" header-align="center" align="center" label="设备分组ID，关联t_equipment_group"></el-table-column>
+			:size="pageSize"
-			<el-table-column prop="code" header-align="center" align="center" label="编码"></el-table-column>
+			:data="dataList"
-			<el-table-column prop="typeDictValue" header-align="center" align="center" label="报警类型 字典表关联label_value"></el-table-column>
+			:table-head-configs="tableConfigs"
-			<el-table-column prop="gradeDictValue" header-align="center" align="center" label="报警级别 字典表关联label_value"></el-table-column>
+			:max-height="calcMaxHeight(8)"
-			<el-table-column prop="alarmContent" header-align="center" align="center" label="报警内容"></el-table-column>
+			@operate-event="handleOperations"
-			<el-table-column prop="description" header-align="center" align="center" label="描述"></el-table-column>
+			@refreshDataList="getDataList"
-			<el-table-column prop="externalCode" header-align="center" align="center" label="外部编码，用于对照外部系统的编码"></el-table-column>
+		/>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"></el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"></el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"></el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"></el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"></el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"></el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"></el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"></el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"></el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"></el-table-column>
-			<el-table-column prop="alarmNotify" header-align="center" align="center" label="推送方式 0邮箱 1微信"></el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -59,13 +44,16 @@
 			layout="total, sizes, prev, pager, next, jumper"
 		></el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter, dictFilter } from '@/utils/filters'
 // import AddOrUpdate from './equipmentGroupAlarm-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import dictListMixin from '@/mixins/dictlist-module'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
@@ -79,44 +67,37 @@ const dictEntries = {
 }
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'code', name: '报警编码' },
+		type: 'index',
-	{ prop: 'typeDictValue', name: '报警类型' },
+		name: i18n.t('index')
-	{ prop: 'gradeDictValue', name: '报警级别' },
+	},
-	{ prop: 'alarmContent', name: '报警内容' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'code', name: i18n.t('alarm.code') },
-	// { prop: 'typeDictValue', name: '报警类型 字典表关联label_value' },
+	{ prop: 'typeDictValue', name: i18n.t('alarm.type'), filter: dictFilter(dictEntries.alarmType.value) },
-	// { prop: 'gradeDictValue', name: '报警级别 字典表关联label_value' },
+	{ prop: 'gradeDictValue', name: i18n.t('alarm.level'), filter: dictFilter(dictEntries.alarmLevel.value) },
-	// { "prop": "id", "name": "ID" },
+	{ prop: 'alarmContent', name: i18n.t('alarm.content') },
-	// { "prop": "equipmentGroupId", "name": "设备分组ID，关联t_equipment_group" },
+	// { prop: 'externalCode', name: i18n.t('alarm.externalCode') },
-	// { "prop": "description", "name": "描述" },
+	{ prop: 'description', name: i18n.t('alarm.description') },
-	// { "prop": "externalCode", "name": "外部编码，用于对照外部系统的编码" },
+	{ prop: 'remark', name: i18n.t('alarm.remark') },
-	// { "prop": "enabled", "name": "启用状态:0 、停用，1、启用" },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
-	// { "prop": "remark", "name": "备注" },
-	// { "prop": "valid", "name": "删除标志，是否有效:1 可用 0不可用" },
-	// { "prop": "creatorId", "name": "创建人" },
-	// { "prop": "creatorName", "name": "创建人姓名" },
-	// { "prop": "updaterId", "name": "更新人" },
-	// { "prop": "updaterName", "name": "更新人姓名" },
-	// { "prop": "updateTime", "name": "更新时间" },
-	// { "prop": "version", "name": "版本号" },
-	// { prop: 'alarmNotify', name: '推送方式 0邮箱 1微信' },
-	// { prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/equipmentGroupAlarm',
 	fields: [
-		{ name: 'code', label: '报警编码', required: true },
+		{ name: 'code', label: i18n.t('alarm.code'), api: '/monitoring/equipmentGroupAlarm/getCode', required: true },
-		{ name: 'typeDictValue', label: '报警类型', type: 'select', options: [] },
+		{ name: 'typeDictValue', label: i18n.t('alarm.type'), type: 'select', options: [] },
-		{ name: 'gradeDictValue', label: '报警级别', type: 'select', options: [] },
+		{ name: 'gradeDictValue', label: i18n.t('alarm.level'), type: 'select', options: [] },
-		{ name: 'alarmContent', label: '报警内容', required: true }
+		{ name: 'alarmContent', label: i18n.t('alarm.content'), required: true },
+		{ name: 'description', label: i18n.t('alarm.description') },
+		{ name: 'remark', label: i18n.t('alarm.remark') }
+		// { name: 'externalCode', label: i18n.t('alarm.externalCode') }
 	],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/equipmentGroupAlarm', extraFields: { equipmentGroupId: null }, permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/equipmentGroupAlarm', extraFields: { equipmentGroupId: null }, permission: 'monitoring:equipmentgroupalarm:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/equipmentGroupAlarm', extraFields: { equipmentGroupId: null }, permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/equipmentGroupAlarm', extraFields: { equipmentGroupId: null }, permission: 'monitoring:equipmentgroupalarm:update', showOnEdit: true }
 	]
 }
 
@@ -125,6 +106,7 @@ export default {
 	data() {
 		return {
 			addOrUpdateConfigs,
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -147,6 +129,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取字典数据
 		getDictData() {
 			this.initDictList(Object.entries(dictEntries).map(([_, item]) => item.value))
@@ -165,14 +153,19 @@ export default {
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
+
+			const queryParams = {
+				page: this.pageIndex,
+				limit: this.pageSize,
+				groupId: this.$route.params.id
+			}
+
+			if (this.dataForm.key && this.dataForm.key.trim() !== '') queryParams.key = this.dataForm.key
+
 			this.$http({
 				url: this.$http.adornUrl('/monitoring/equipmentGroupAlarm/page'),
 				method: 'get',
-				params: this.$http.adornParams({
+				params: this.$http.adornParams(queryParams)
-					page: this.pageIndex,
-					limit: this.pageSize,
-					groupId: this.$route.params.id
-				})
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
 					this.dataList = data.data.list
@@ -203,7 +196,7 @@ export default {
 			switch (type) {
 				case 'edit':
 					return this.addOrUpdateHandle(id)
-				case 'delete': 
+				case 'delete':
 					return this.deleteHandle(id)
 			}
 		},
@@ -226,9 +219,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -238,7 +231,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentHistoricalParameters.vue

@@ -0,0 +1,103 @@
+<template>
+	<div class="mod-config">
+		<el-form :inline="true">
+			<el-form-item :label="'当前设备id'">
+				<strong>{{ $route.params.id }}</strong></el-form-item
+			>
+		</el-form>
+
+		<!-- <base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" /> -->
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
+	</div>
+</template>
+
+<script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+import { pick } from 'lodash/object'
+
+export default {
+	data() {
+		return {
+			calcMaxHeight,
+			tableConfigs: [],
+			dataList: [],
+			dataListLoading: false,
+			dataListSelections: []
+		}
+	},
+	components: {
+		AddOrUpdate,
+		BaseTable
+	},
+	activated() {
+		this.getDataList()
+	},
+	mouted() {
+		this.getDataList()
+	},
+	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
+		// 获取数据列表
+		getDataList() {
+			this.dataListLoading = true
+			this.$http({
+				url: this.$http.adornUrl(`/monitoring/equipmentValueMonitor/runLog/${this.$route.params.id}`),
+				method: 'get'
+			}).then(({ data: res }) => {
+				if (
+					res &&
+					res.code === 0 &&
+					res.data &&
+					res.data.length > 0 &&
+					res.data[0].nameData &&
+					res.data[0].nameData.length > 0 &&
+					res.data[0].data &&
+					res.data[0].data.length > 0
+				) {
+					this.setTableProps(res.data[0].nameData)
+					this.setTableData(res.data[0].data)
+				} else {
+					this.dataList = []
+				}
+				this.dataListLoading = false
+			})
+		},
+		setTableProps(nameData) {
+			this.tableConfigs = [
+				{
+					type: 'index',
+					name: i18n.t('index')
+				},
+				{ prop: 'time', name: '时间', filter: timeFilter },
+				{ prop: 'plcCode', name: 'PLC 编码' },
+				{ prop: 'equName', name: '设备名称' },
+				{ prop: 'equCode', name: '设备编码' },
+				// ...['数值1', '数值2', '数值3'].map(name => {
+				// 	return { prop: name, name }
+				// })
+				...Array.from(new Set(nameData.map(item => item.name))).map(name => ({ prop: name, name }))
+			]
+		},
+		setTableData(data) {
+			this.dataList = data.map(item => {
+				const rowItem = pick(item, ['time', 'plcCode', 'equName', 'equCode'])
+				if (item.data && item.data.length > 0) {
+					item.data.forEach(param => {
+						rowItem[param.dynamicName] = param.dynamicValue
+					})
+				}
+				return rowItem
+			})
+		}
+	}
+}
+</script>

src/views/modules/monitoring/equipmentPlc-add-or-update.vue

@@ -1,219 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="plc类型" prop="plcType">
-				<el-input v-model="dataForm.plcType" placeholder="plc类型"></el-input>
-			</el-form-item>
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="plc名称（ip+名称对应实时数据库表名）" prop="name">
-				<el-input v-model="dataForm.name" placeholder="plc名称（ip+名称对应实时数据库表名）"></el-input>
-			</el-form-item>
-			<el-form-item label="英文名称" prop="enName">
-				<el-input v-model="dataForm.enName" placeholder="英文名称"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="plc条码" prop="barcode">
-				<el-input v-model="dataForm.barcode" placeholder="plc条码"></el-input>
-			</el-form-item>
-			<el-form-item label="链接方式，0 tcp，1 udp等" prop="controlType">
-				<el-input v-model="dataForm.controlType" placeholder="链接方式，0 tcp，1 udp等"></el-input>
-			</el-form-item>
-			<el-form-item label="是否监控 0 代表不监控, 1 代表监控" prop="monitor">
-				<el-input v-model="dataForm.monitor" placeholder="是否监控 0 代表不监控, 1 代表监控"></el-input>
-			</el-form-item>
-			<el-form-item label="是否采集 0 代表不采集, 1 代表采集" prop="collection">
-				<el-input v-model="dataForm.collection" placeholder="是否采集 0 代表不采集, 1 代表采集"></el-input>
-			</el-form-item>
-			<el-form-item label="IP" prop="ip">
-				<el-input v-model="dataForm.ip" placeholder="IP"></el-input>
-			</el-form-item>
-			<el-form-item label="端口号" prop="port">
-				<el-input v-model="dataForm.port" placeholder="端口号"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				plcType: '',
-				code: '',
-				name: '',
-				enName: '',
-				description: '',
-				barcode: '',
-				controlType: '',
-				monitor: '',
-				collection: '',
-				ip: '',
-				port: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				plcType: [{ required: true, message: 'plc类型不能为空', trigger: 'blur' }],
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: 'plc名称（ip+名称对应实时数据库表名）不能为空', trigger: 'blur' }],
-				enName: [{ required: true, message: '英文名称不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				barcode: [{ required: true, message: 'plc条码不能为空', trigger: 'blur' }],
-				controlType: [{ required: true, message: '链接方式，0 tcp，1 udp等不能为空', trigger: 'blur' }],
-				monitor: [{ required: true, message: '是否监控 0 代表不监控, 1 代表监控不能为空', trigger: 'blur' }],
-				collection: [{ required: true, message: '是否采集 0 代表不采集, 1 代表采集不能为空', trigger: 'blur' }],
-				ip: [{ required: true, message: 'IP不能为空', trigger: 'blur' }],
-				port: [{ required: true, message: '端口号不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentPlc/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.plcType = data.equipmenplc.plcType
-							this.dataForm.code = data.equipmenplc.code
-							this.dataForm.name = data.equipmenplc.name
-							this.dataForm.enName = data.equipmenplc.enName
-							this.dataForm.description = data.equipmenplc.description
-							this.dataForm.barcode = data.equipmenplc.barcode
-							this.dataForm.controlType = data.equipmenplc.controlType
-							this.dataForm.monitor = data.equipmenplc.monitor
-							this.dataForm.collection = data.equipmenplc.collection
-							this.dataForm.ip = data.equipmenplc.ip
-							this.dataForm.port = data.equipmenplc.port
-							this.dataForm.enabled = data.equipmenplc.enabled
-							this.dataForm.remark = data.equipmenplc.remark
-							this.dataForm.valid = data.equipmenplc.valid
-							this.dataForm.creatorId = data.equipmenplc.creatorId
-							this.dataForm.creatorName = data.equipmenplc.creatorName
-							this.dataForm.createTime = data.equipmenplc.createTime
-							this.dataForm.updaterId = data.equipmenplc.updaterId
-							this.dataForm.updaterName = data.equipmenplc.updaterName
-							this.dataForm.updateTime = data.equipmenplc.updateTime
-							this.dataForm.version = data.equipmenplc.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentPlc/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							plcType: this.dataForm.plcType,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							enName: this.dataForm.enName,
-							description: this.dataForm.description,
-							barcode: this.dataForm.barcode,
-							controlType: this.dataForm.controlType,
-							monitor: this.dataForm.monitor,
-							collection: this.dataForm.collection,
-							ip: this.dataForm.ip,
-							port: this.dataForm.port,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/equipmentPlc.vue

@@ -1,16 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('name') + ' / ' + $t('code')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmentplc:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmentplc:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -22,29 +22,32 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 // import AddOrUpdate from './equipmentPlc-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
-import TableTextComponent from '@/components/base-table/components/detailComponent'
+// import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ type: 'index', name: '序号' },
+	{ type: 'index', width: 100, name: i18n.t('index') },
-	{ prop: 'code', name: '编码' },
+	{ prop: 'code', name: i18n.t('code') },
-	{ prop: 'name', name: '名称' },
+	{ prop: 'name', name: i18n.t('name') },
-	{ prop: 'enName', name: '英文名称' },
+	{ prop: 'enName', name: i18n.t('enname') },
-	{ prop: 'description', name: '描述' },
+	{ prop: 'description', name: i18n.t('desc') },
-	{ prop: 'barcode', name: 'plc条码' },
+	{ prop: 'barcode', name: i18n.t('eq.plcbarcode') },
-	{ prop: 'collection', name: '是否采集', filter: val => ({ 0: '不采集', 1: '采集' }[val]) },
+	{ prop: 'collection', name: i18n.t('collectOrNot'), filter: val => ({ 0: i18n.t('notCollect'), 1: i18n.t('collect') }[val]) },
 	{ prop: 'ip', name: 'IP' },
-	{ prop: 'port', name: '端口号' },
+	{ prop: 'port', name: i18n.t('eq.port') },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'remark', name: i18n.t('remark') },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
@@ -53,47 +56,35 @@ const addOrUpdateConfigs = {
 	fields: [
 		{ name: 'name', required: true },
 		{ name: 'code', required: true },
-		{ name: 'enName', label: '英文名称' },
+		{ name: 'enName', label: i18n.t('enname') },
 		{
 			name: 'collection',
-			label: '是否采集',
+			label: i18n.t('collectOrNot'),
 			required: true,
 			type: 'select',
 			options: [
-				{ label: '采集', value: 1 },
+				{ label: i18n.t('collect'), value: 1 },
-				{ label: '不采集', value: 0 }
+				{ label: i18n.t('notCollect'), value: 0 }
 			]
 		},
 		{ name: 'ip', label: 'IP', required: true, placeholder: '0.0.0.0' },
-		{ name: 'port', label: '端口', placeholder: '443' },
+		{ name: 'port', label: i18n.t('eq.port'), placeholder: '443' },
 		'description',
 		'remark',
-		{ name: 'barcode', label: 'plc条码', span: 24 }
+		{ name: 'barcode', label: i18n.t('eq.plcbarcode'), span: 24 }
 	],
 	operations: [
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/equipmentPlc', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/equipmentPlc', permission: 'monitoring:equipmentplc:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/equipmentPlc', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/equipmentPlc', permission: 'monitoring:equipmentplc:update', showOnEdit: true }
 	]
-	// subtable: {
-	// 	// for i18n
-	// 	title: '动态属性',
-	// 	url: '/monitoring/productArrt',
-	// 	relatedField: 'productId',
-	// 	tableConfigs: [
-	// 		{ type: 'index', name: '序号' },
-	// 		{ prop: 'createTime', name: '添加时间', filter: val => (val ? moment(val).format('YYYY-MM-DD hh:mm:ss') : '-') },
-	// 		{ prop: 'name', name: '属性名', formField: true, rules: [{ required: true, message: '必填', trigger: 'blur' }] },
-	// 		{ prop: 'code', name: '属性值', formField: true },
-	// 		{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
-	// 	]
-	// }
 }
 
 export default {
 	data() {
 		return {
 			tableConfigs,
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			dataForm: {
 				key: ''
@@ -115,10 +106,16 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		//handleOperations
 		handleOperations({ type, data: id }) {
 			switch (type) {
-				case 'edit': 
+				case 'edit':
 					return this.addOrUpdateHandle(id)
 				case 'delete':
 					return this.deleteHandle(id)
@@ -175,9 +172,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -187,7 +184,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentPlcConnect-add-or-update.vue

@@ -1,156 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="plc表iD" prop="plcId">
-				<el-input v-model="dataForm.plcId" placeholder="plc表iD"></el-input>
-			</el-form-item>
-			<el-form-item label="设备表id" prop="equipmentId">
-				<el-input v-model="dataForm.equipmentId" placeholder="设备表id"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				plcId: '',
-				equipmentId: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				plcId: [{ required: true, message: 'plc表iD不能为空', trigger: 'blur' }],
-				equipmentId: [{ required: true, message: '设备表id不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentPlcConnect/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.plcId = data.equipmenplcConnect.plcId
-							this.dataForm.equipmentId = data.equipmenplcConnect.equipmentId
-							this.dataForm.enabled = data.equipmenplcConnect.enabled
-							this.dataForm.remark = data.equipmenplcConnect.remark
-							this.dataForm.valid = data.equipmenplcConnect.valid
-							this.dataForm.creatorId = data.equipmenplcConnect.creatorId
-							this.dataForm.creatorName = data.equipmenplcConnect.creatorName
-							this.dataForm.createTime = data.equipmenplcConnect.createTime
-							this.dataForm.updaterId = data.equipmenplcConnect.updaterId
-							this.dataForm.updaterName = data.equipmenplcConnect.updaterName
-							this.dataForm.updateTime = data.equipmenplcConnect.updateTime
-							this.dataForm.version = data.equipmenplcConnect.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentPlcConnect/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							plcId: this.dataForm.plcId,
-							equipmentId: this.dataForm.equipmentId,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/equipmentPlcConnect.vue

@@ -1,16 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmentplcconnect:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmentplcconnect:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
 
 		<el-pagination
 			@size-change="sizeChangeHandle"
@@ -23,13 +23,16 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+// import { timeFilter } from '@/utils/filters'
 // import AddOrUpdate from './equipmentPlcConnect-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
@@ -37,15 +40,15 @@ import { dictFilter } from '@/utils/filters'
 // import axios from '@/utils/request.js'
 
 const tableConfigs = [
-	{ type: 'index', name: '序号' },
+	{ type: 'index', width: 100, name: i18n.t('index') },
-	{ prop: 'lineName', name: '产线' },
+	{ prop: 'lineName', name: i18n.t('pl.title') },
-	{ prop: 'sectionName', name: '工段' },
+	{ prop: 'sectionName', name: i18n.t('ws.title') },
-	{ prop: 'equName', name: '设备' },
+	{ prop: 'equName', name: i18n.t('equipment') },
-	{ prop: 'equCode', name: '设备编码' },
+	{ prop: 'equCode', name: i18n.t('eq.code') },
-	{ prop: 'plcCode', name: 'PLC编码' },
+	{ prop: 'plcCode', name: i18n.t('eq.plccode') },
-	{ prop: 'plcName', name: 'PLC名称' },
+	{ prop: 'plcName', name: i18n.t('eq.plcname') },
 	{ prop: 'plcIp', name: 'PLC IP' },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const UnitDictTypeId = '1557173812109242370'
@@ -57,61 +60,55 @@ const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/equipmentPlcConnect',
 	fields: [
-		{ name: 'equipmentId', label: '设备', required: true, type: 'select', options: [] },
+		{ name: 'equipmentId', label: i18n.t('equipment'), required: true, type: 'select', options: [] },
-		{ name: 'plcId', label: 'PLC名称', required: true, type: 'select', options: [] }
+		{ name: 'plcId', label: i18n.t('eq.plcname'), required: true, type: 'select', options: [] }
 	],
 	operations: [
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/equipmentPlcConnect', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/equipmentPlcConnect', permission: 'monitoring:equipmentplcconnect:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/equipmentPlcConnect', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/equipmentPlcConnect', permission: 'monitoring:equipmentplcconnect:update', showOnEdit: true }
 	],
 	subtable: {
-		title: 'PLC采集参数',
+		title: i18n.t('params.plctitle'),
 		url: '/monitoring/equipmentPlcParam',
 		relatedField: 'plcConId',
 		tableConfigs: [
-			{ type: 'index', name: '序号' },
+			{ type: 'index', width: 100, name: i18n.t('index') },
-			// { prop: 'plcConId', name: 'plc连接表ID' },
+			{ prop: 'paramCode', name: i18n.t('params.code'), formField: true, rules: [{ required: true, message: i18n.t('required'), trigger: 'blur' }] },
-			{ prop: 'paramCode', name: '参数编码', formField: true, rules: [{ required: true, message: '必填', trigger: 'blur' }] },
+			{ prop: 'paramName', name: i18n.t('params.name'), formField: true, rules: [{ required: true, message: i18n.t('required'), trigger: 'blur' }] },
-			{ prop: 'paramName', name: '参数名称', formField: true, rules: [{ required: true, message: '必填', trigger: 'blur' }] },
+			{ prop: 'paramAddress', name: i18n.t('paramUrl'), formField: true },
-			{ prop: 'paramAddress', name: '参数地址', formField: true },
+			{ prop: 'unitDictValue', name: i18n.t('unit'), filter: dictFilter(UnitDictTypeId), formField: true, formType: 'select', formOptions: getUnitList() },
-			{ prop: 'unitDictValue', name: '单位', filter: dictFilter(UnitDictTypeId), formField: true, formType: 'select', formOptions: getUnitList() },
+			{ prop: 'minValue', name: i18n.t('min'), formField: true },
-			{ prop: 'minValue', name: '最小值', formField: true },
+			{ prop: 'maxValue', name: i18n.t('max'), formField: true },
-			{ prop: 'maxValue', name: '最大值', formField: true },
+			{ prop: 'defaultValue', name: i18n.t('params.paramStdValue'), formField: true },
-			{ prop: 'defaultValue', name: '参数设定标准值', formField: true },
+			{ prop: 'description', name: i18n.t('desc'), formField: true },
-			{ prop: 'description', name: '描述', formField: true },
 			{
 				prop: 'enabled',
-				name: '启用状态',
+				name: i18n.t('enabled'),
-				filter: val => ['停用', '启用'][+val],
+				filter: val => [i18n.t('disable'), i18n.t('enable')][+val],
-				// filter: val => ({0:'停用', 1:'启用'}[+val]),
+				// filter: val => ({0:i18n.t('disable'), 1:i18n.t('enable')}[+val]),
-				rules: [{ required: true, message: '必填', trigger: 'blur' }],
+				rules: [{ required: true, message: i18n.t('required'), trigger: 'blur' }],
 				formField: true,
 				formType: 'select',
 				formOptions: [
-					{ value: 0, label: '停用' },
+					{ value: 0, label: i18n.t('disable') },
-					{ value: 1, label: '启用' }
+					{ value: 1, label: i18n.t('enable') }
 				]
 			},
-			{ prop: 'remark', name: '备注', formField: true },
+			{ prop: 'remark', name: i18n.t('remark'), formField: true },
-			// { prop: 'createTime', name: '添加时间' },
 			{
 				prop: 'collection',
-				name: '是否采集',
+				name: i18n.t('collectOrNot'),
-				filter: val => ['不采集', '采集'][+val],
+				filter: val => [i18n.t('notCollect'), i18n.t('collect')][+val],
-				rules: [{ required: true, message: '必填', trigger: 'blur' }],
+				rules: [{ required: true, message: i18n.t('required'), trigger: 'blur' }],
 				formField: true,
 				formType: 'select',
 				formOptions: [
-					{ value: 0, label: '不采集' },
+					{ value: 0, label: i18n.t('notCollect') },
-					{ value: 1, label: '采集' }
+					{ value: 1, label: i18n.t('collect') }
 				]
 			},
-			// { prop: 'collectionCycle', name: '采集周期（s） 暂不使用' },
+			{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
-			// { prop: 'reportingCycle', name: '上报周期（s） 暂不使用' },
-			// { prop: 'reportingMethod', name: '上报方式 暂不使用' },
-			// { prop: 'reportingCode', name: '上报编码 暂不使用' },
-			{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 		]
 	}
 }
@@ -120,6 +117,7 @@ export default {
 	data() {
 		return {
 			addOrUpdateConfigs,
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -143,6 +141,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 设备列表
 		getEqList() {
 			this.$http({
@@ -232,9 +236,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -244,7 +248,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentPlcParam-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="plc连接表ID" prop="plcConId">
 				<el-input v-model="dataForm.plcConId" placeholder="plc连接表ID"></el-input>
@@ -31,8 +31,8 @@
 			<el-form-item label="参数设定标准值" prop="defaultValue">
 				<el-input v-model="dataForm.defaultValue" placeholder="参数设定标准值"></el-input>
 			</el-form-item>
-			<el-form-item label="描述" prop="description">
+			<el-form-item :label="$t('desc')" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
+				<el-input v-model="dataForm.description" :placeholder="$t('desc')"></el-input>
 			</el-form-item>
 			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
 				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
@@ -43,26 +43,26 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 			<el-form-item label="0 代表不采集, 1 代表采集" prop="collection">
 				<el-input v-model="dataForm.collection" placeholder="0 代表不采集, 1 代表采集"></el-input>
@@ -81,8 +81,8 @@
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -234,7 +234,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentPlcParam.vue

@@ -1,51 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenplcparam:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenplcparam:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="plcConId" header-align="center" align="center" label="plc连接表ID"> </el-table-column>
-			<el-table-column prop="type" header-align="center" align="center" label="类型：status、data、constant"> </el-table-column>
-			<el-table-column prop="paramCode" header-align="center" align="center" label="参数编码"> </el-table-column>
-			<el-table-column prop="paramName" header-align="center" align="center" label="参数名称"> </el-table-column>
-			<el-table-column prop="paramAddress" header-align="center" align="center" label="参数地址，对应实时数据库表的列名"> </el-table-column>
-			<el-table-column prop="valueType" header-align="center" align="center" label="参数值类型：int、long、boolean、string、list 暂不使用"> </el-table-column>
-			<el-table-column prop="unitDictValue" header-align="center" align="center" label="单位 关联数据字典表label_value"> </el-table-column>
-			<el-table-column prop="minValue" header-align="center" align="center" label="最小值"> </el-table-column>
-			<el-table-column prop="maxValue" header-align="center" align="center" label="最大值"> </el-table-column>
-			<el-table-column prop="defaultValue" header-align="center" align="center" label="参数设定标准值"> </el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column prop="collection" header-align="center" align="center" label="0 代表不采集, 1 代表采集"> </el-table-column>
-			<el-table-column prop="collectionCycle" header-align="center" align="center" label="采集周期（s） 暂不使用"> </el-table-column>
-			<el-table-column prop="reportingCycle" header-align="center" align="center" label="上报周期（s） 暂不使用"> </el-table-column>
-			<el-table-column prop="reportingMethod" header-align="center" align="center" label="上报方式 暂不使用"> </el-table-column>
-			<el-table-column prop="reportingCode" header-align="center" align="center" label="上报编码 暂不使用"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -62,37 +27,38 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+// import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './equipmentPlcParam-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
-import TableOperateComponent from '@/components/base-table/components/operationComponent'
+// import TableOperateComponent from '@/components/base-table/components/operationComponent'
-import TableTextComponent from '@/components/base-table/components/detailComponent'
+// import TableTextComponent from '@/components/base-table/components/detailComponent'
+import { dictFilter } from '@/utils/filters'
+
+const UnitDictTypeId = '1557173812109242370'
 
 const tableConfigs = [
-	{ type: 'index', name: '序号' },
+	{ type: 'index', width: 100, name: i18n.t('index') },
-	{ prop: 'plcConId', name: 'plc连接表ID' },
+	{ prop: 'plcConId', name: i18n.t('params.plcid') },
-	{ prop: 'paramCode', name: '参数编码' },
+	{ prop: 'paramCode', name: i18n.t('params.code') },
-	{ prop: 'paramName', name: '参数名称' },
+	{ prop: 'paramName', name: i18n.t('params.name') },
-	{ prop: 'paramAddress', name: '参数地址' },
+	{ prop: 'paramAddress', name: i18n.t('paramUrl') },
-	{ prop: 'unitDictValue', name: '单位' },
+	{ prop: 'unitDictValue', name: i18n.t('unit'), filter: dictFilter(UnitDictTypeId) },
-	{ prop: 'minValue', name: '最小值' },
+	{ prop: 'minValue', name: i18n.t('min') },
-	{ prop: 'maxValue', name: '最大值' },
+	{ prop: 'maxValue', name: i18n.t('max') },
-	{ prop: 'defaultValue', name: '参数设定标准值' },
+	{ prop: 'defaultValue', name: i18n.t('params.paramStdValue') },
-	{ prop: 'description', name: '描述' },
+	{ prop: 'description', name: i18n.t('desc') },
-	{ prop: 'enabled', name: '启用状态:0 、停用，1、启用' },
+	{ prop: 'enabled', name: i18n.t('enabled'), filter: val => [i18n.t('disable'), i18n.t('enable')][+val] },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'remark', name: i18n.t('remark') },
-	// { prop: 'createTime', name: '添加时间' },
+	{ prop: 'collection', name: i18n.t('collectOrNot'), filter: val => [i18n.t('notCollect'), i18n.t('collect')][+val] }
-	{ prop: 'collection', name: '0 代表不采集, 1 代表采集' },
-	// { prop: 'collectionCycle', name: '采集周期（s） 暂不使用' },
-	// { prop: 'reportingCycle', name: '上报周期（s） 暂不使用' },
-	// { prop: 'reportingMethod', name: '上报方式 暂不使用' },
-	// { prop: 'reportingCode', name: '上报编码 暂不使用' },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 export default {
 	data() {
 		return {
 			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -113,6 +79,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -164,9 +136,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -176,7 +148,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentQuantity-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="设备外部编码" prop="externalCode">
 				<el-input v-model="dataForm.externalCode" placeholder="设备外部编码"></el-input>
@@ -28,34 +28,34 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 			<el-form-item label="生产数量的记录时间" prop="recordTime">
 				<el-input v-model="dataForm.recordTime" placeholder="生产数量的记录时间"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -90,9 +90,9 @@ export default {
 				equipmentName: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
 				inQuantity: [{ required: true, message: '进入设备的数量不能为空', trigger: 'blur' }],
 				outQuantity: [{ required: true, message: '离开设备的数量，若plc只记录一个生产数量，也写入该字段不能为空', trigger: 'blur' }],
-				okQuantity: [{ required: true, message: '不能为空', trigger: 'blur' }],
+				okQuantity: [{ required: true, message: i18n.t('cannotempty'), trigger: 'blur' }],
 				nokQuantity: [{ required: true, message: '设备上报的报废数量不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '不能为空', trigger: 'blur' }],
+				description: [{ required: true, message: i18n.t('cannotempty'), trigger: 'blur' }],
 				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
 				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
 				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
@@ -171,7 +171,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentQuantity.vue

@@ -1,43 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenquantity:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenquantity:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="id"> </el-table-column>
-			<el-table-column prop="externalCode" header-align="center" align="center" label="设备外部编码"> </el-table-column>
-			<el-table-column prop="equipmentName" header-align="center" align="center" label="设备名称"> </el-table-column>
-			<el-table-column prop="inQuantity" header-align="center" align="center" label="进入设备的数量"> </el-table-column>
-			<el-table-column prop="outQuantity" header-align="center" align="center" label="离开设备的数量，若plc只记录一个生产数量，也写入该字段"> </el-table-column>
-			<el-table-column prop="okQuantity" header-align="center" align="center" label=""> </el-table-column>
-			<el-table-column prop="nokQuantity" header-align="center" align="center" label="设备上报的报废数量"> </el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label=""> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column prop="recordTime" header-align="center" align="center" label="生产数量的记录时间"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-			<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -54,39 +27,44 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './equipmentQuantity-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-  { "prop": "id", "name": "id" },
+	{ prop: 'id', name: 'id' },
-  { "prop": "externalCode", "name": "设备外部编码" },
+	{ prop: 'externalCode', name: '设备外部编码' },
-  { "prop": "equipmentName", "name": "设备名称" },
+	{ prop: 'equipmentName', name: i18n.t('eq.name') },
-  { "prop": "inQuantity", "name": "进入设备的数量" },
+	{ prop: 'inQuantity', name: '进入设备的数量' },
-  {
+	{
-    "prop": "outQuantity",
+		prop: 'outQuantity',
-    "name": "离开设备的数量，若plc只记录一个生产数量，也写入该字段"
+		name: '离开设备的数量，若plc只记录一个生产数量，也写入该字段'
-  },
+	},
-  { "prop": "okQuantity", "name": "" },
+	{ prop: 'okQuantity', name: '' },
-  { "prop": "nokQuantity", "name": "设备上报的报废数量" },
+	{ prop: 'nokQuantity', name: '设备上报的报废数量' },
-  { "prop": "description", "name": "" },
+	{ prop: 'description', name: '' },
-  { "prop": "remark", "name": "备注" },
+	{ prop: 'remark', name: i18n.t('remark') },
-  { "prop": "valid", "name": "删除标志，是否有效:1 可用 0不可用" },
+	{ prop: 'valid', name: i18n.t('delMark') },
-  { "prop": "creatorId", "name": "创建人" },
+	{ prop: 'creatorId', name: i18n.t('creator') },
-  { "prop": "creatorName", "name": "创建人姓名" },
+	{ prop: 'creatorName', name: i18n.t('creatorName') },
-  { "prop": "createTime", "name": "添加时间" },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-  { "prop": "updaterId", "name": "更新人" },
+	{ prop: 'updaterId', name: i18n.t('updator') },
-  { "prop": "updaterName", "name": "更新人姓名" },
+	{ prop: 'updaterName', name: i18n.t('updatorName') },
-  { "prop": "updateTime", "name": "更新时间" },
+	{ prop: 'updateTime', name: i18n.t('updateTime'), filter: timeFilter },
-  { "prop": "version", "name": "版本号" },
+	{ prop: 'version', name: i18n.t('version') },
-  { "prop": "recordTime", "name": "生产数量的记录时间" },		{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'recordTime', name: '生产数量的记录时间' },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
-
 export default {
 	data() {
-		return {tableConfigs,
+		return {
+			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -100,12 +78,19 @@ export default {
 		}
 	},
 	components: {
-		AddOrUpdate,BaseTable
+		AddOrUpdate,
+		BaseTable
 	},
 	activated() {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -157,9 +142,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -169,7 +154,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentStatusLog-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="设备外部代码" prop="externalCode">
 				<el-input v-model="dataForm.externalCode" placeholder="设备外部代码"></el-input>
@@ -28,31 +28,31 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -164,7 +164,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentStatusLog.vue

@@ -1,41 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenstatuslog:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenstatuslog:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="id"> </el-table-column>
-			<el-table-column prop="externalCode" header-align="center" align="center" label="设备外部代码"> </el-table-column>
-			<el-table-column prop="plcId" header-align="center" align="center" label="plc id"> </el-table-column>
-			<el-table-column prop="plc" header-align="center" align="center" label="plc"> </el-table-column>
-			<el-table-column prop="equipmentId" header-align="center" align="center" label="设备id"> </el-table-column>
-			<el-table-column prop="equipmentName" header-align="center" align="center" label="设备名称"> </el-table-column>
-			<el-table-column prop="status" header-align="center" align="center" label="状态，0正常 1计划停机 2故障"> </el-table-column>
-			<el-table-column prop="logTime" header-align="center" align="center" label="记录时间"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-			<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -52,35 +27,40 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './equipmentStatusLog-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-  { "prop": "id", "name": "id" },
+	{ prop: 'id', name: 'id' },
-  { "prop": "externalCode", "name": "设备外部代码" },
+	{ prop: 'externalCode', name: '设备外部代码' },
-  { "prop": "plcId", "name": "plc id" },
+	{ prop: 'plcId', name: 'plc id' },
-  { "prop": "plc", "name": "plc" },
+	{ prop: 'plc', name: 'plc' },
-  { "prop": "equipmentId", "name": "设备id" },
+	{ prop: 'equipmentId', name: '设备id' },
-  { "prop": "equipmentName", "name": "设备名称" },
+	{ prop: 'equipmentName', name: i18n.t('eq.name') },
-  { "prop": "status", "name": "状态，0正常 1计划停机 2故障" },
+	{ prop: 'status', name: '状态，0正常 1计划停机 2故障' },
-  { "prop": "logTime", "name": "记录时间" },
+	{ prop: 'logTime', name: i18n.t('recordTime') },
-  { "prop": "remark", "name": "备注" },
+	{ prop: 'remark', name: i18n.t('remark') },
-  { "prop": "valid", "name": "删除标志，是否有效:1 可用 0不可用" },
+	{ prop: 'valid', name: i18n.t('delMark') },
-  { "prop": "creatorId", "name": "创建人" },
+	{ prop: 'creatorId', name: i18n.t('creator') },
-  { "prop": "creatorName", "name": "创建人姓名" },
+	{ prop: 'creatorName', name: i18n.t('creatorName') },
-  { "prop": "createTime", "name": "添加时间" },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-  { "prop": "updaterId", "name": "更新人" },
+	{ prop: 'updaterId', name: i18n.t('updator') },
-  { "prop": "updaterName", "name": "更新人姓名" },
+	{ prop: 'updaterName', name: i18n.t('updatorName') },
-  { "prop": "updateTime", "name": "更新时间" },
+	{ prop: 'updateTime', name: i18n.t('updateTime'), filter: timeFilter },
-  { "prop": "version", "name": "版本号" },		{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'version', name: i18n.t('version') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
-
 export default {
 	data() {
-		return {tableConfigs,
+		return {
+			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -94,12 +74,19 @@ export default {
 		}
 	},
 	components: {
-		AddOrUpdate,BaseTable
+		AddOrUpdate,
+		BaseTable
 	},
 	activated() {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -151,9 +138,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -163,7 +150,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentTimesequence.vue

@@ -0,0 +1,547 @@
+<template>
+	<!-- 设备效率分析 -->
+	<div class="mod-config">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+			<!-- 产线 -->
+			<el-form-item>
+				<el-select v-model="dataForm.productlines" :placeholder="'产线'" @change="handleProductLineChange" clearable>
+					<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id"
+						:label="productLine.name" />
+				</el-select>
+			</el-form-item>
+			<!-- 工序 -->
+			<el-form-item>
+				<!-- <el-select v-model="dataForm.factoryId" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-select> -->
+				<el-select v-model="dataForm.wsId" :placeholder="'工序'" clearable>
+					<el-option v-for="ws in wsList" :key="ws.id" :value="ws.id" :label="ws.name" />
+				</el-select>
+			</el-form-item>
+			<!-- 日期选择 -->
+			<el-form-item>
+				<el-date-picker key="date-picker" v-model="rawTime" type="date" :placeholder="'请选择日期'" format="yyyy-MM-dd" />
+			</el-form-item>
+			<!-- 按钮 -->
+			<el-form-item>
+				<el-button @click="getDataList()">{{ $t('search') }}</el-button>
+				<!-- <el-button v-if="$hasPermission('monitoring:equipmentEffiency:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
+			</el-form-item>
+			<el-form-item>
+				<el-button type="success" @click="addEq()">{{ '添加设备' }}</el-button>
+			</el-form-item>
+		</el-form>
+
+		<div class="time-chart" style="margin-top: 10px;">
+			<div v-show="equipmentCount > 0" id="time-chart__inner" ref="time-chart__inner" class="time-chart__inner"
+				style="min-height: 50vh;" :style="{ height: autoHeight + 'px', width: '100%' }" />
+			<div v-show="equipmentCount === 0">请先查询数据</div>
+			<!-- <div v-show="equipmentCount === 0">{{ $t('module.basicData.visual.hints.searchFirst') }}</div> -->
+		</div>
+
+		<el-dialog :visible.sync="dialogVisible" :title="'添加设备'" width="30%">
+			<el-select v-model="eqId" style="width: 100%" placeholder="请选择设备" clearable>
+				<el-option v-for="eq in dialogEqList" :key="eq.id" :label="eq.name" :value="eq.id" />
+			</el-select>
+			<div slot="footer">
+				<el-button @click="dialogVisible = false">{{ '取消' }}</el-button>
+				<el-button type="primary" @click="dialogConfirm">{{ '确定' }}</el-button>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+// import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+import { calcMaxHeight } from '@/utils'
+import moment from 'moment'
+// import TableOperateComponent from '@/components/base-table/components/operationComponent'
+// import TableTextComponent from '@/components/base-table/components/detailComponent'
+// import { timeFilter } from '@/utils/filters'
+
+function renderItem(params, api) {
+	var categoryIndex = api.value(0)
+	var start = api.coord([api.value(1), categoryIndex])
+	var end = api.coord([api.value(2), categoryIndex])
+	var height = 32
+
+	return {
+		type: 'rect',
+		shape: echarts.graphic.clipRectByRect(
+			{
+				x: start[0],
+				y: start[1] - height / 2,
+				width: end[0] - start[0],
+				height: height
+			},
+			{
+				x: params.coordSys.x,
+				y: params.coordSys.y,
+				width: params.coordSys.width,
+				height: params.coordSys.height
+			}
+		),
+		style: api.style()
+	}
+}
+
+class ChartOption {
+	constructor() {
+		this.color = ['#4caf50', '#ffb300', '#e53935']
+		this.legend = {
+			data: [
+				// i18n.t('module.basicData.visual.echartLegends.working'),
+				'正常',
+				'停机',
+				'故障'
+			],
+			bottom: '0%',
+			selectedMode: false,
+			textStyle: {
+				color: '#000'
+			}
+		}
+		this.tooltip = {
+			formatter: function (params) {
+				return moment(params.value[1]).format('YYYY-MM-DD HH:mm:ss') + ' - ' + moment(params.value[2]).format('YYYY-MM-DD HH:mm:ss') + ' : ' + params.name
+			}
+		}
+		this.title = {
+			// text: i18n.t('module.basicData.visual.echartTitles.eqStatus'),
+			text: '设备状态时序图',
+			left: 'center'
+		}
+		this.xAxis = {
+			type: 'time',
+			// min: +new Date().setHours(0, 0, 0, 0),
+			splitNumber: 24,
+			interval: 3600 * 1000,
+			axisTick: {
+				show: true,
+				alignWithLabel: true
+			},
+			splitLine: {
+				show: true
+			},
+			axisLine: {
+				show: true
+			},
+			axisLabel: {
+				formatter: function (val) {
+					const time = new Date(val)
+					const hour = time.getHours()
+					const minute = time.getMinutes()
+					const hours = hour >= 10 ? hour + '' : '0' + hour
+					const minutes = minute >= 10 ? minute + '' : '0' + minute
+					return hours + ':' + minutes
+				}
+			}
+		}
+		this.yAxis = {
+			// data: Object.keys(eqData).map(item => eqData[item].name)
+			data: []
+		}
+		this.series = [
+			{ name: /** i18n.t('module.basicData.visual.echartLegends.working') */ '正常', type: 'bar', data: [] },
+			{ name: '停机', type: 'bar', data: [] },
+			{ name: '故障', type: 'bar', data: [] },
+			{
+				type: 'custom',
+				renderItem: renderItem,
+				itemStyle: {
+					opacity: 0.8
+				},
+				encode: {
+					x: [1, 2],
+					y: 0
+				},
+				data: []
+			}
+		]
+	}
+
+	setTitle(title) {
+		this.title.text = title
+	}
+
+	// date: 服务器返回来的日期时间数据
+	setXAxis(date) {
+		// this.xAxis.min = +new Date(date).setHours(0)
+		this.xAxis.min = +new Date(date).setHours(0, 0, 0, 0)
+		this.xAxis.max = this.xAxis.min + 3600 * 1000 * 24
+	}
+
+	setYAxis(data) {
+		this.yAxis.data = data
+	}
+
+	setData(data) {
+		this.series[3].data = data
+	}
+}
+
+export default {
+	data() {
+		return {
+			/** hfxny part */
+			wsList: [],
+			productLineList: [],
+			chart: null,
+			chartOption: new ChartOption(),
+			equipments: {},
+			state: ['正常', '停机', '故障'],
+			colors: ['#4caf50', '#ffb300', '#e53935'],
+			// queryBuffer: {},
+			// tableConfigs,
+			calcMaxHeight,
+			timeType: 'range',
+			currentLine: null,
+			rawTime: new Date(),
+			dataForm: {
+				wsId: null,
+				productlines: null,
+				startTime: null,
+				entTime: null
+			},
+			dataList: [],
+			pageIndex: 1,
+			pageSize: 10,
+			totalPage: 0,
+			dataListLoading: false,
+			/** dialog */
+			dialogVisible: false,
+			eqId: null,
+			dialogEqList: []
+		}
+	},
+	components: {
+		BaseTable
+	},
+	computed: {
+		autoHeight: function () {
+			return Object.keys(this.equipments).length * 100 || 500
+		},
+		equipmentCount: function () {
+			return Object.keys(this.equipments).length
+		}
+	},
+	created() {
+		this.getEqList()
+	},
+	mounted() {
+		this.$nextTick(() => {
+			this.initChart()
+		})
+	},
+	activated() {
+		this.getProductLineList().then(() => {
+			this.getWorksetionList()
+		})
+	},
+	updated() {
+		if (this.chart) this.chart.resize()
+	},
+	watch: {
+		timeType() {
+			// 防止切换日期类型时报错
+			this.rawTime = null
+		}
+	},
+	methods: {
+		initChart() {
+			if (!this.chart) {
+				this.chart = echarts.init(this.$refs['time-chart__inner'])
+			}
+		},
+		// 获取产线列表
+		getProductLineList() {
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
+				method: 'get'
+			}).then(({ data: res }) => {
+				if (res && res.code === 0) {
+					this.productLineList = res.data
+					/** set default */
+					if (this.productLineList.length) {
+						this.dataForm.productlines = this.productLineList[0].id
+					}
+				} else {
+					this.productLineList = []
+				}
+			})
+		},
+
+		// 获取工序列表
+		getWorksetionList() {
+			// 分页列表才有根据产线过滤功能
+			this.$http({
+				// url: this.$http.adornUrl('/monitoring/workshopSection/list'),
+				url: this.$http.adornUrl('/monitoring/workshopSection/page'),
+				method: 'get',
+				params: this.$http.adornParams({
+					limit: 99999,
+					page: 1,
+					lineId: this.dataForm.productlines ?? ''
+				})
+			}).then(({ data: res }) => {
+				if (res && res.code === 0) {
+					this.wsList = res.data.list
+					/** set default */
+					if (this.wsList.length) {
+						this.dataForm.wsId = this.wsList[0].id
+					} else {
+						this.dataForm.wsId = null
+					}
+				} else {
+					this.wsList.splice(0)
+				}
+			})
+		},
+
+		// 把服务器数据按照设备分组
+		transformDataToEquipments(dataList) {
+			console.log('transformDataToEquipments() datalist: ', dataList)
+			const equipments = {}
+			dataList.map(item => {
+				if (equipments[item.eqId]) {
+					// 如果设备已存在
+					// equipments[item.eqId].name = item.eqName
+					equipments[item.eqId].status.push({
+						startTime: +new Date(item.startTime),
+						endTime: +new Date(item.endTime),
+						status: this.state[item.status] // 0 正常、1 停机、2 故障
+					})
+				} else {
+					equipments[item.eqId] = {
+						name: item.eqName,
+						status: [
+							{
+								startTime: +new Date(item.startTime),
+								endTime: +new Date(item.endTime),
+								status: this.state[item.status] // 0 正常、1 停机、2 故障
+							}
+						]
+					}
+				}
+			})
+			console.log('created equipments --- ', equipments)
+			return equipments
+		},
+
+		// 把分组好的设备数据转换为echarts需要的series数据
+		transformEquipmentsToSeries(equipments) {
+			const seriesData = []
+			Object.entries(equipments).map(([key, item], index) => {
+				item.status.forEach(status => {
+					seriesData.push({
+						name: status.status,
+						value: [index, status.startTime, status.endTime],
+						itemStyle: {
+							normal: {
+								color: status.status === '正常' ? '#4caf50' : status.status === '停机' ? '#ffb300' : status.status === '故障' ? '#e53935' : null
+							}
+						}
+					})
+				})
+			})
+			return seriesData
+		},
+
+		// 获取数据列表
+		getDataList() {
+			let startTime = this.rawTime
+				? moment(this.rawTime)
+					.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
+					.format('YYYY-MM-DDTHH:mm:ss')
+				: ''
+			let endTime = startTime
+				? moment(startTime)
+					.add(1, 'd')
+					.format('YYYY-MM-DDTHH:mm:ss')
+				: ''
+
+			// this.dataListLoading = true
+			const condition = {
+				startTime,
+				endTime,
+				productlines: [this.dataForm.productlines],
+				wsId: this.dataForm.wsId
+			}
+
+			/** fetch data */
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/eqAnalysis/timeAndStatus'),
+				method: 'post',
+				data: condition
+			}).then(({ data: res }) => {
+				if (res.code === 500) {
+					this.dataList.splice(0)
+					this.equipments = {} // 关闭 echarts 的显示
+					this.$message.error(res.msg)
+				} else {
+					/** handle actual data */
+					this.dataList = res.data
+
+					/** test data */
+					// this.dataList = [
+					// 	{
+					// 		eqId: 'eq-001',
+					// 		eqName: 'A1预热机',
+					// 		startTime: '2022-05-04T00:30:34',
+					// 		endTime: '2022-05-04T08:30:34',
+					// 		status: 0
+					// 	},
+					// 	{
+					// 		eqId: 'eq-001',
+					// 		eqName: 'A1预热机',
+					// 		startTime: '2022-05-04T08:30:34',
+					// 		endTime: '2022-05-04T09:30:34',
+					// 		status: 1
+					// 	},
+					// 	{
+					// 		eqId: 'eq-001',
+					// 		eqName: 'A1预热机',
+					// 		startTime: '2022-05-04T09:30:34',
+					// 		endTime: '2022-05-04T11:30:34',
+					// 		status: 2
+					// 	},
+					// 	{
+					// 		eqId: 'eq-001',
+					// 		eqName: 'A1预热机',
+					// 		startTime: '2022-05-04T11:30:34',
+					// 		endTime: '2022-05-04T13:30:34',
+					// 		status: 1
+					// 	}
+					// ]
+
+					this.equipments = this.transformDataToEquipments(this.dataList)
+					this.chartOption.setYAxis(Object.keys(this.equipments).map(eId => this.equipments[eId].name))
+					console.log('(((set x axis))): ', this.dataList[0].startTime)
+					this.chartOption.setXAxis(this.dataList[0].startTime)
+					this.chartOption.setData(this.transformEquipmentsToSeries(this.equipments))
+
+					this.$nextTick(() => {
+						this.renderChart()
+					})
+				}
+			})
+		},
+
+		handleProductLineChange(val) {
+			this.getWorksetionList()
+		},
+
+		// 渲染 echarts
+		renderChart() {
+			console.log('>>> chart configs: ', this.chartOption)
+			this.chart.setOption(this.chartOption)
+		},
+
+		// 获取对话框里的设备列表
+		getEqList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipment/page'),
+				method: 'get',
+				params: this.$http.adornParams({
+					page: 1,
+					limit: 99999
+				})
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.dialogEqList = data.data.list
+				} else {
+					this.dialogEqList.splice(0)
+				}
+			})
+		},
+
+		// 添加设备
+		addEq() {
+			if (this.equipmentCount) {
+				this.dialogVisible = true
+			} else {
+				this.$message.warning('请先查询数据')
+			}
+		},
+
+		// 确认添加设备
+		dialogConfirm() {
+			let startTime = this.rawTime
+				? moment(this.rawTime)
+					.set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
+					.format('YYYY-MM-DDTHH:mm:ss')
+				: ''
+			let endTime = startTime
+				? moment(startTime)
+					.add(1, 'd')
+					.format('YYYY-MM-DDTHH:mm:ss')
+				: ''
+
+			const condition = {
+				startTime,
+				endTime,
+				productlines: [this.dataForm.productlines],
+				wsId: this.dataForm.wsId,
+				eqId: this.eqId
+			}
+
+			/** fetch data */
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/eqAnalysis/timeAndStatus'),
+				method: 'post',
+				data: condition
+			}).then(({ data: res }) => {
+				if (res.code === 500) {
+					this.$message.error(res.msg)
+				} else {
+					/** handle new equipment */
+					const newEqStatusList = res.data
+					console.log('添加设备', res)
+					const newEq = this.transformDataToEquipments(newEqStatusList)
+					this.$set(this.equipments, Object.keys(newEq)[0], newEq[Object.keys(newEq)[0]])
+					this.chartOption.setYAxis(Object.keys(this.equipments).map(item => this.equipments[item].name))
+					this.chartOption.setData(this.transformEquipmentsToSeries(this.equipments))
+
+					this.$message.success('新设备数据获取成功')
+					this.$nextTick(() => {
+						this.dialogVisible = false
+						this.renderChart()
+					})
+				}
+			})
+		},
+
+		// 每页数
+		sizeChangeHandle(val) {
+			this.pageSize = val
+			this.pageIndex = 1
+			this.getDataList()
+		},
+		// 当前页
+		currentChangeHandle(val) {
+			this.pageIndex = val
+			this.getDataList()
+		},
+		// 多选
+		selectionChangeHandle(val) {
+			this.dataListSelections = val
+		},
+		handleOperations({ type, data: id }) {
+			switch (type) {
+				case 'view-detail':
+					return this.addOrUpdateHandle(id, true)
+				case 'edit':
+					return this.addOrUpdateHandle(id)
+				case 'delete':
+					return this.deleteHandle(id)
+			}
+		}
+	}
+}
+</script>
+
+<style scoped>
+/* .time-chart__inner {
+	transition: all 300ms ease-out;
+} */
+</style>

src/views/modules/monitoring/equipmentType-add-or-update.vue

@@ -1,177 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="名称"></el-input>
-			</el-form-item>
-			<el-form-item label="父类ID" prop="parentId">
-				<el-input v-model="dataForm.parentId" placeholder="父类ID"></el-input>
-			</el-form-item>
-			<el-form-item label="父类名称" prop="parentName">
-				<el-input v-model="dataForm.parentName" placeholder="父类名称"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				code: '',
-				name: '',
-				parentId: '',
-				parentName: '',
-				description: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
-				parentId: [{ required: true, message: '父类ID不能为空', trigger: 'blur' }],
-				parentName: [{ required: true, message: '父类名称不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentType/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.code = data.equipmentype.code
-							this.dataForm.name = data.equipmentype.name
-							this.dataForm.parentId = data.equipmentype.parentId
-							this.dataForm.parentName = data.equipmentype.parentName
-							this.dataForm.description = data.equipmentype.description
-							this.dataForm.enabled = data.equipmentype.enabled
-							this.dataForm.remark = data.equipmentype.remark
-							this.dataForm.valid = data.equipmentype.valid
-							this.dataForm.creatorId = data.equipmentype.creatorId
-							this.dataForm.creatorName = data.equipmentype.creatorName
-							this.dataForm.createTime = data.equipmentype.createTime
-							this.dataForm.updaterId = data.equipmentype.updaterId
-							this.dataForm.updaterName = data.equipmentype.updaterName
-							this.dataForm.updateTime = data.equipmentype.updateTime
-							this.dataForm.version = data.equipmentype.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/equipmentType/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							parentId: this.dataForm.parentId,
-							parentName: this.dataForm.parentName,
-							description: this.dataForm.description,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/equipmentType.vue

@@ -1,40 +1,24 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('eq.type')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenttype:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenttype:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
+			:page="pageIndex"
-			<el-table-column prop="code" header-align="center" align="center" label="编码"> </el-table-column>
+			:size="pageSize"
-			<el-table-column prop="name" header-align="center" align="center" label="名称"> </el-table-column>
+			:data="dataList"
-			<el-table-column prop="parentId" header-align="center" align="center" label="父类ID"> </el-table-column>
+			:table-head-configs="tableConfigs"
-			<el-table-column prop="parentName" header-align="center" align="center" label="父类名称"> </el-table-column>
+			:max-height="calcMaxHeight(8)"
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
+			@operate-event="handleOperations"
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
+			@refreshDataList="getDataList"
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
+		/>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -46,50 +30,58 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
 // import AddOrUpdate from './equipmentType-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'name', name: '类型名称' },
+		type: 'index',
-	{ prop: 'code', name: '类型编码' },
+		name: i18n.t('index')
-	{ prop: 'remark', name: '备注' },
+	},
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
+	{ prop: 'name', name: i18n.t('eq.type') },
+	{ prop: 'code', name: i18n.t('eq.typecode') },
+	{ prop: 'remark', name: i18n.t('remark') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/equipmentType',
 	fields: [
-		{ name: 'name', label: '设备类型名称' },
+		{ name: 'name', required: true, label: i18n.t('eq.type') },
-		{ name: 'code', label: '设备类型编码', api: '/monitoring/equipmentType/getCode' },
+		{ name: 'code', required: true, label: i18n.t('eq.typecode'), api: '/monitoring/equipmentType/getCode' },
-		{ name: 'parentId', label: '父类', type: 'cascader', props: { label: 'name', value: 'id', checkStrictly: true, emitPath: false }, options: [] },
+		{ name: 'parentId', label: i18n.t('eq.parent'), type: 'cascader', props: { label: 'name', value: 'id', checkStrictly: true, emitPath: false }, options: [] },
 		'remark'
 	],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/equipmentType', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/equipmentType', permission: 'monitoring:equipmenttype:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/equipmentType', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/equipmentType', permission: 'monitoring:equipmenttype:update', showOnEdit: true }
 	],
 	extraComponents: [
 		{
 			name: 'files',
 			fieldType: 'array',
-			label: '上传资料',
+			label: i18n.t('upload.title'),
 			component: () => import('@/components/base-upload'),
-			props: { // 上传组件需要的 props
+			props: {
-				url: "/monitoring/attachment/uploadFileFormData",
+				// 上传组件需要的 props
-				extraParams: { typeCode: "EquipmentTypeFile" },
+				url: '/monitoring/attachment/uploadFileFormData',
-				buttonContent: '点击上传',
+				extraParams: { typeCode: 'EquipmentTypeFile' },
-				tip: '上传文件大小不要超过 2mb (2048kb)'
+				buttonContent: i18n.t('upload.button'),
+				tip: i18n.t('hints.upload2m')
 			}
 		}
 	]
@@ -99,6 +91,7 @@ export default {
 	data() {
 		return {
 			addOrUpdateConfigs,
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -121,6 +114,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// 获取设备类型树形数据
 		getTreeEquipmentType() {
 			this.$http({
@@ -196,9 +195,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -208,7 +207,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentTypeFile-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="设备类型ID" prop="equipmentTypeId">
 				<el-input v-model="dataForm.equipmentTypeId" placeholder="设备类型ID"></el-input>
@@ -16,8 +16,8 @@
 			<el-form-item label="下载地址" prop="fileUrl">
 				<el-input v-model="dataForm.fileUrl" placeholder="下载地址"></el-input>
 			</el-form-item>
-			<el-form-item label="描述" prop="description">
+			<el-form-item :label="$t('desc')" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
+				<el-input v-model="dataForm.description" :placeholder="$t('desc')"></el-input>
 			</el-form-item>
 			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
 				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
@@ -28,31 +28,31 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -164,7 +164,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/equipmentTypeFile.vue

@@ -1,42 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmentypefile:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmentypefile:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="equipmentTypeId" header-align="center" align="center" label="设备类型ID"> </el-table-column>
-			<el-table-column prop="fileId" header-align="center" align="center" label="文件ID"> </el-table-column>
-			<el-table-column prop="typeCode" header-align="center" align="center" label="文件类型编码"> </el-table-column>
-			<el-table-column prop="fileName" header-align="center" align="center" label="文件名称"> </el-table-column>
-			<el-table-column prop="fileUrl" header-align="center" align="center" label="下载地址"> </el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-			<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -53,35 +27,40 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './equipmentTypeFile-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-  { "prop": "id", "name": "ID" },
+	{ prop: 'id', name: 'ID' },
-  { "prop": "equipmentTypeId", "name": "设备类型ID" },
+	{ prop: 'equipmentTypeId', name: '设备类型ID' },
-  { "prop": "fileId", "name": "文件ID" },
+	{ prop: 'fileId', name: '文件ID' },
-  { "prop": "typeCode", "name": "文件类型编码" },
+	{ prop: 'typeCode', name: i18n.t('file.typeCode') },
-  { "prop": "fileName", "name": "文件名称" },
+	{ prop: 'fileName', name: i18n.t('file.name') },
-  { "prop": "fileUrl", "name": "下载地址" },
+	{ prop: 'fileUrl', name: i18n.t('downloadurl') },
-  { "prop": "description", "name": "描述" },
+	{ prop: 'description', name: i18n.t('desc') },
-  { "prop": "enabled", "name": "启用状态:0 、停用，1、启用" },
+	{ prop: 'enabled', name: i18n.t('enabled') },
-  { "prop": "remark", "name": "备注" },
+	{ prop: 'remark', name: i18n.t('remark') },
-  { "prop": "valid", "name": "删除标志，是否有效:1 可用 0不可用" },
+	{ prop: 'valid', name: i18n.t('delMark') },
-  { "prop": "creatorId", "name": "创建人" },
+	{ prop: 'creatorId', name: i18n.t('creator') },
-  { "prop": "creatorName", "name": "创建人姓名" },
+	{ prop: 'creatorName', name: i18n.t('creatorName') },
-  { "prop": "createTime", "name": "添加时间" },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-  { "prop": "updaterId", "name": "更新人" },
+	{ prop: 'updaterId', name: i18n.t('updator') },
-  { "prop": "updaterName", "name": "更新人姓名" },
+	{ prop: 'updaterName', name: i18n.t('updatorName') },
-  { "prop": "updateTime", "name": "更新时间" },
+	{ prop: 'updateTime', name: i18n.t('updateTime'), filter: timeFilter },
-  { "prop": "version", "name": "版本号" },		{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'version', name: i18n.t('version') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
-
 export default {
 	data() {
-		return {tableConfigs,
+		return {
+			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -95,12 +74,19 @@ export default {
 		}
 	},
 	components: {
-		AddOrUpdate,BaseTable
+		AddOrUpdate,
+		BaseTable
 	},
 	activated() {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -152,9 +138,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -164,7 +150,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/equipmentattr.vue

@@ -1,38 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipmenattr:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:equipmenattr:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="equipmentId" header-align="center" align="center" label="设备ID"> </el-table-column>
-			<el-table-column prop="attrName" header-align="center" align="center" label="属性名称"> </el-table-column>
-			<el-table-column prop="attrValue" header-align="center" align="center" label="属性值"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -49,32 +27,38 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './equipmentAttr-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
-import TableTextComponent from '@/components/base-table/components/detailComponent'
+// import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'equipmentId', name: '设备ID' },
+		type: 'index',
-	{ prop: 'attrName', name: '属性名' },
+		name: i18n.t('index')
-	{ prop: 'attrValue', name: '属性值' },
+	},
-	// { "prop": "id", "name": "ID" },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	// { "prop": "remark", "name": "备注" },
+	{ prop: 'equipmentId', name: i18n.t('eq.id') },
-	// { "prop": "valid", "name": "删除标志，是否有效:1 可用 0不可用" },
+	{ prop: 'attrName', name: i18n.t('attrName') },
-	// { "prop": "creatorId", "name": "创建人" },
+	{ prop: 'attrValue', name: i18n.t('attrValue') },
-	// { "prop": "creatorName", "name": "创建人姓名" },
+	{
-	// { "prop": "updaterId", "name": "更新人" },
+		prop: 'operations',
-	// { "prop": "updaterName", "name": "更新人姓名" },
+		name: i18n.t('handle'),
-	// { "prop": "updateTime", "name": "更新时间" },
+		fixed: 'right',
-	// { prop: 'version', name: '版本号' },
+		width: 180,
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+		subcomponent: TableOperateComponent,
+		options: ['edit', 'delete']
+	}
 ]
 
 export default {
 	data() {
 		return {
 			tableConfigs,
+			calcMaxHeight,
 			dataForm: {
 				key: ''
 			},
@@ -95,6 +79,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -146,9 +136,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -158,7 +148,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/factory-add-or-update.vue

@@ -1,177 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="工厂编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="工厂编码"></el-input>
-			</el-form-item>
-			<el-form-item label="工厂名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="工厂名称"></el-input>
-			</el-form-item>
-			<el-form-item label="地址" prop="address">
-				<el-input v-model="dataForm.address" placeholder="地址"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-			<el-form-item label="外部系统编码" prop="externalCode">
-				<el-input v-model="dataForm.externalCode" placeholder="外部系统编码"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				code: '',
-				name: '',
-				address: '',
-				description: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: '',
-				externalCode: ''
-			},
-			dataRule: {
-				code: [{ required: true, message: '工厂编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '工厂名称不能为空', trigger: 'blur' }],
-				address: [{ required: true, message: '地址不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }],
-				externalCode: [{ required: true, message: '外部系统编码不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/factory/{this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.code = data.factory.code
-							this.dataForm.name = data.factory.name
-							this.dataForm.address = data.factory.address
-							this.dataForm.description = data.factory.description
-							this.dataForm.enabled = data.factory.enabled
-							this.dataForm.remark = data.factory.remark
-							this.dataForm.valid = data.factory.valid
-							this.dataForm.creatorId = data.factory.creatorId
-							this.dataForm.creatorName = data.factory.creatorName
-							this.dataForm.createTime = data.factory.createTime
-							this.dataForm.updaterId = data.factory.updaterId
-							this.dataForm.updaterName = data.factory.updaterName
-							this.dataForm.updateTime = data.factory.updateTime
-							this.dataForm.version = data.factory.version
-							this.dataForm.externalCode = data.factory.externalCode
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/factory/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							address: this.dataForm.address,
-							description: this.dataForm.description,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version,
-							externalCode: this.dataForm.externalCode
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/factory.vue

@@ -1,40 +1,24 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('factory.name') + ' / ' + $t('factory.code')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:factory:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:factory:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table
-			<el-table-column prop="id" header-align="center" align="center" label="id"> </el-table-column>
+			:page="pageIndex"
-			<el-table-column prop="code" header-align="center" align="center" label="工厂编码"> </el-table-column>
+			:size="pageSize"
-			<el-table-column prop="name" header-align="center" align="center" label="工厂名称"> </el-table-column>
+			:data="dataList"
-			<el-table-column prop="address" header-align="center" align="center" label="地址"> </el-table-column>
+			:table-head-configs="tableConfigs"
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
+			:max-height="calcMaxHeight(8)"
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
+			@operate-event="handleOperations"
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
+			@refreshDataList="getDataList"
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
+		/>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column prop="externalCode" header-align="center" align="center" label="外部系统编码"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -46,53 +30,62 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 // import AddOrUpdate from './factory-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
-import TableTextComponent from '@/components/base-table/components/detailComponent'
+// import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'name', name: '工厂名称' },
+		type: 'index',
-	{ prop: 'code', name: '工厂编码' },
+		name: i18n.t('index')
-	{ prop: 'address', name: '地址' },
+	},
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'name', name: i18n.t('factory.name') },
+	{ prop: 'code', name: i18n.t('factory.code') },
+	{ prop: 'address', name: i18n.t('addr') },
+	{ prop: 'remark', name: i18n.t('remark') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/factory',
 	fields: [
-		'name',
+		{ name: 'name', required: true },
 		{
 			name: 'code',
+			required: true,
 			api: '/monitoring/factory/getCode'
 		},
 		{
 			name: 'address',
-			label: '地址',
+			label: i18n.t('addr'),
-			placeholder: '请输入地址'
+			placeholder: i18n.t('hints.addr')
 		},
 		'remark'
 	],
 	operations: [
 		{ name: 'reset', url: true, showAlways: true },
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/factory', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/factory', permission: 'monitoring:factory:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/factory', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/factory', permission: 'monitoring:factory:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			tableConfigs,
 			dataForm: {
@@ -115,6 +108,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// 获取数据列表
 		getDataList() {
 			this.addOrUpdateVisible = false
@@ -130,7 +129,8 @@ export default {
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
 					this.dataList = data.data.list
-					this.totalPage = data.data.totalCount
+					this.totalPage = data.data.total
+					console.log('total page: ', this.totalPage)
 				} else {
 					this.dataList = []
 					this.totalPage = 0
@@ -175,9 +175,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -187,7 +187,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/icons-dialog.vue

@@ -0,0 +1,594 @@
+<template>
+	<el-dialog :visible.sync="visible" :title="'Icons'">
+		<div style="background: #efefef; max-height: 500px; overflow: hidden scroll;">
+			<el-row :gutter="10">
+				<el-col v-for="icon in icons" :key="icon" :span="3" class="col-hover" style="padding: 8px; text-align: center; cursor: pointer;" @click.native="handleCopy(icon)">
+					<svg class="icon-svg aui-navbar__icon-menu" style="height: 24px; width: 24px;" aria-hidden="true">
+						<use v-bind:xlink:href="`#${icon}`"></use>
+					</svg>
+				</el-col>
+			</el-row>
+		</div>
+
+		<div slot="footer">
+			<el-button @click="close()">Close</el-button>
+		</div>
+	</el-dialog>
+</template>
+
+<script>
+export default {
+	name: 'IconsDialog',
+	data() {
+		return {
+			icons: [],
+			visible: false
+		}
+	},
+	methods: {
+		init() {
+			this.loadIcons()
+			this.visible = true
+		},
+		loadIcons() {
+			this.icons = [
+				'icon-check-circle',
+				'icon-CI',
+				'icon-Dollar',
+				'icon-compass',
+				'icon-close-circle',
+				'icon-frown',
+				'icon-info-circle',
+				'icon-left-circle',
+				'icon-down-circle',
+				'icon-EURO',
+				'icon-copyright',
+				'icon-minus-circle',
+				'icon-meh',
+				'icon-plus-circle',
+				'icon-play-circle',
+				'icon-question-circle',
+				'icon-Pound',
+				'icon-right-circle',
+				'icon-smile',
+				'icon-trademark',
+				'icon-time-circle',
+				'icon-timeout',
+				'icon-earth',
+				'icon-YUAN',
+				'icon-up-circle',
+				'icon-warning-circle',
+				'icon-sync',
+				'icon-transaction',
+				'icon-undo',
+				'icon-redo',
+				'icon-reload',
+				'icon-reloadtime',
+				'icon-message',
+				'icon-dashboard',
+				'icon-issuesclose',
+				'icon-poweroff',
+				'icon-logout',
+				'icon-login',
+				'icon-piechart',
+				'icon-setting',
+				'icon-eye',
+				'icon-location',
+				'icon-edit-square',
+				'icon-export',
+				'icon-save',
+				'icon-Import',
+				'icon-appstore',
+				'icon-close-square',
+				'icon-down-square',
+				'icon-layout',
+				'icon-left-square',
+				'icon-play-square',
+				'icon-control',
+				'icon-codelibrary',
+				'icon-detail',
+				'icon-minus-square',
+				'icon-plus-square',
+				'icon-right-square',
+				'icon-project',
+				'icon-wallet',
+				'icon-up-square',
+				'icon-calculator',
+				'icon-interation',
+				'icon-check-square',
+				'icon-border',
+				'icon-border-outer',
+				'icon-border-top',
+				'icon-border-bottom',
+				'icon-border-left',
+				'icon-border-right',
+				'icon-border-inner',
+				'icon-border-verticle',
+				'icon-border-horizontal',
+				'icon-radius-bottomleft',
+				'icon-radius-bottomright',
+				'icon-radius-upleft',
+				'icon-radius-upright',
+				'icon-radius-setting',
+				'icon-adduser',
+				'icon-deleteteam',
+				'icon-deleteuser',
+				'icon-addteam',
+				'icon-user',
+				'icon-team',
+				'icon-areachart',
+				'icon-linechart',
+				'icon-barchart',
+				'icon-pointmap',
+				'icon-container',
+				'icon-database',
+				'icon-sever',
+				'icon-mobile',
+				'icon-tablet',
+				'icon-redenvelope',
+				'icon-book',
+				'icon-filedone',
+				'icon-reconciliation',
+				'icon-file-exception',
+				'icon-filesync',
+				'icon-filesearch',
+				'icon-solution',
+				'icon-fileprotect',
+				'icon-file-add',
+				'icon-file-excel',
+				'icon-file-exclamation',
+				'icon-file-pdf',
+				'icon-file-image',
+				'icon-file-markdown',
+				'icon-file-unknown',
+				'icon-file-ppt',
+				'icon-file-word',
+				'icon-file',
+				'icon-file-zip',
+				'icon-file-text',
+				'icon-file-copy',
+				'icon-snippets',
+				'icon-audit',
+				'icon-diff',
+				'icon-Batchfolding',
+				'icon-securityscan',
+				'icon-propertysafety',
+				'icon-safetycertificate',
+				'icon-insurance',
+				'icon-alert',
+				'icon-delete',
+				'icon-hourglass',
+				'icon-bulb',
+				'icon-experiment',
+				'icon-bell',
+				'icon-trophy',
+				'icon-rest',
+				'icon-USB',
+				'icon-skin',
+				'icon-home',
+				'icon-bank',
+				'icon-filter',
+				'icon-funnelplot',
+				'icon-like',
+				'icon-unlike',
+				'icon-unlock',
+				'icon-lock',
+				'icon-customerservice',
+				'icon-flag',
+				'icon-moneycollect',
+				'icon-medicinebox',
+				'icon-shop',
+				'icon-rocket',
+				'icon-shopping',
+				'icon-folder',
+				'icon-folder-open',
+				'icon-folder-add',
+				'icon-deploymentunit',
+				'icon-accountbook',
+				'icon-contacts',
+				'icon-carryout',
+				'icon-calendar-check',
+				'icon-calendar',
+				'icon-scan',
+				'icon-select',
+				'icon-boxplot',
+				'icon-build',
+				'icon-sliders',
+				'icon-laptop',
+				'icon-barcode',
+				'icon-camera',
+				'icon-cluster',
+				'icon-gateway',
+				'icon-car',
+				'icon-printer',
+				'icon-read',
+				'icon-cloud-server',
+				'icon-cloud-upload',
+				'icon-cloud',
+				'icon-cloud-download',
+				'icon-cloud-sync',
+				'icon-video',
+				'icon-notification',
+				'icon-sound',
+				'icon-radarchart',
+				'icon-qrcode',
+				'icon-fund',
+				'icon-image',
+				'icon-mail',
+				'icon-table',
+				'icon-idcard',
+				'icon-creditcard',
+				'icon-heart',
+				'icon-block',
+				'icon-error',
+				'icon-star',
+				'icon-gold',
+				'icon-heatmap',
+				'icon-wifi',
+				'icon-attachment',
+				'icon-edit',
+				'icon-key',
+				'icon-api',
+				'icon-disconnect',
+				'icon-highlight',
+				'icon-monitor',
+				'icon-link',
+				'icon-man',
+				'icon-percentage',
+				'icon-search',
+				'icon-pushpin',
+				'icon-phone',
+				'icon-shake',
+				'icon-tag',
+				'icon-wrench',
+				'icon-woman',
+				'icon-tags',
+				'icon-scissor',
+				'icon-mr',
+				'icon-share',
+				'icon-branches',
+				'icon-fork',
+				'icon-shrink',
+				'icon-arrawsalt',
+				'icon-verticalright',
+				'icon-verticalleft',
+				'icon-right',
+				'icon-left',
+				'icon-up',
+				'icon-down',
+				'icon-fullscreen',
+				'icon-fullscreen-exit',
+				'icon-doubleleft',
+				'icon-doubleright',
+				'icon-arrowright',
+				'icon-arrowup',
+				'icon-arrowleft',
+				'icon-arrowdown',
+				'icon-upload',
+				'icon-colum-height',
+				'icon-vertical-align-botto',
+				'icon-vertical-align-middl',
+				'icon-totop',
+				'icon-vertical-align-top',
+				'icon-download',
+				'icon-sort-descending',
+				'icon-sort-ascending',
+				'icon-fall',
+				'icon-swap',
+				'icon-stock',
+				'icon-rise',
+				'icon-indent',
+				'icon-outdent',
+				'icon-menu',
+				'icon-unorderedlist',
+				'icon-orderedlist',
+				'icon-align-right',
+				'icon-align-center',
+				'icon-align-left',
+				'icon-pic-center',
+				'icon-pic-right',
+				'icon-pic-left',
+				'icon-bold',
+				'icon-font-colors',
+				'icon-exclaimination',
+				'icon-font-size',
+				'icon-infomation',
+				'icon-line-height',
+				'icon-strikethrough',
+				'icon-underline',
+				'icon-number',
+				'icon-italic',
+				'icon-code',
+				'icon-column-width',
+				'icon-check',
+				'icon-ellipsis',
+				'icon-dash',
+				'icon-close',
+				'icon-enter',
+				'icon-line',
+				'icon-minus',
+				'icon-question',
+				'icon-plus',
+				'icon-rollback',
+				'icon-small-dash',
+				'icon-pause',
+				'icon-bg-colors',
+				'icon-crown',
+				'icon-drag',
+				'icon-desktop',
+				'icon-gift',
+				'icon-stop',
+				'icon-fire',
+				'icon-thunderbolt',
+				'icon-check-circle-fill',
+				'icon-left-circle-fill',
+				'icon-down-circle-fill',
+				'icon-minus-circle-fill',
+				'icon-close-circle-fill',
+				'icon-info-circle-fill',
+				'icon-up-circle-fill',
+				'icon-right-circle-fill',
+				'icon-plus-circle-fill',
+				'icon-question-circle-fill',
+				'icon-EURO-circle-fill',
+				'icon-frown-fill',
+				'icon-copyright-circle-fil',
+				'icon-CI-circle-fill',
+				'icon-compass-fill',
+				'icon-Dollar-circle-fill',
+				'icon-poweroff-circle-fill',
+				'icon-meh-fill',
+				'icon-play-circle-fill',
+				'icon-Pound-circle-fill',
+				'icon-smile-fill',
+				'icon-stop-fill',
+				'icon-warning-circle-fill',
+				'icon-time-circle-fill',
+				'icon-trademark-circle-fil',
+				'icon-YUAN-circle-fill',
+				'icon-heart-fill',
+				'icon-piechart-circle-fil',
+				'icon-dashboard-fill',
+				'icon-message-fill',
+				'icon-check-square-fill',
+				'icon-down-square-fill',
+				'icon-minus-square-fill',
+				'icon-close-square-fill',
+				'icon-codelibrary-fill',
+				'icon-left-square-fill',
+				'icon-play-square-fill',
+				'icon-up-square-fill',
+				'icon-right-square-fill',
+				'icon-plus-square-fill',
+				'icon-accountbook-fill',
+				'icon-carryout-fill',
+				'icon-calendar-fill',
+				'icon-calculator-fill',
+				'icon-interation-fill',
+				'icon-project-fill',
+				'icon-detail-fill',
+				'icon-save-fill',
+				'icon-wallet-fill',
+				'icon-control-fill',
+				'icon-layout-fill',
+				'icon-appstore-fill',
+				'icon-mobile-fill',
+				'icon-tablet-fill',
+				'icon-book-fill',
+				'icon-redenvelope-fill',
+				'icon-safetycertificate-f',
+				'icon-propertysafety-fill',
+				'icon-insurance-fill',
+				'icon-securityscan-fill',
+				'icon-file-exclamation-fil',
+				'icon-file-add-fill',
+				'icon-file-fill',
+				'icon-file-excel-fill',
+				'icon-file-markdown-fill',
+				'icon-file-text-fill',
+				'icon-file-ppt-fill',
+				'icon-file-unknown-fill',
+				'icon-file-word-fill',
+				'icon-file-zip-fill',
+				'icon-file-pdf-fill',
+				'icon-file-image-fill',
+				'icon-diff-fill',
+				'icon-file-copy-fill',
+				'icon-snippets-fill',
+				'icon-batchfolding-fill',
+				'icon-reconciliation-fill',
+				'icon-folder-add-fill',
+				'icon-folder-fill',
+				'icon-folder-open-fill',
+				'icon-database-fill',
+				'icon-container-fill',
+				'icon-sever-fill',
+				'icon-calendar-check-fill',
+				'icon-image-fill',
+				'icon-idcard-fill',
+				'icon-creditcard-fill',
+				'icon-fund-fill',
+				'icon-read-fill',
+				'icon-contacts-fill',
+				'icon-delete-fill',
+				'icon-notification-fill',
+				'icon-flag-fill',
+				'icon-moneycollect-fill',
+				'icon-medicinebox-fill',
+				'icon-rest-fill',
+				'icon-shopping-fill',
+				'icon-skin-fill',
+				'icon-video-fill',
+				'icon-sound-fill',
+				'icon-bulb-fill',
+				'icon-bell-fill',
+				'icon-filter-fill',
+				'icon-fire-fill',
+				'icon-funnelplot-fill',
+				'icon-gift-fill',
+				'icon-hourglass-fill',
+				'icon-home-fill',
+				'icon-trophy-fill',
+				'icon-location-fill',
+				'icon-cloud-fill',
+				'icon-customerservice-fill',
+				'icon-experiment-fill',
+				'icon-eye-fill',
+				'icon-like-fill',
+				'icon-lock-fill',
+				'icon-unlike-fill',
+				'icon-star-fill',
+				'icon-unlock-fill',
+				'icon-alert-fill',
+				'icon-api-fill',
+				'icon-highlight-fill',
+				'icon-phone-fill',
+				'icon-edit-fill',
+				'icon-pushpin-fill',
+				'icon-rocket-fill',
+				'icon-thunderbolt-fill',
+				'icon-tag-fill',
+				'icon-wrench-fill',
+				'icon-tags-fill',
+				'icon-bank-fill',
+				'icon-camera-fill',
+				'icon-error-fill',
+				'icon-crown-fill',
+				'icon-mail-fill',
+				'icon-car-fill',
+				'icon-printer-fill',
+				'icon-shop-fill',
+				'icon-setting-fill',
+				'icon-USB-fill',
+				'icon-golden-fill',
+				'icon-build-fill',
+				'icon-boxplot-fill',
+				'icon-sliders-fill',
+				'icon-alibaba',
+				'icon-alibabacloud',
+				'icon-antdesign',
+				'icon-ant-cloud',
+				'icon-behance',
+				'icon-googleplus',
+				'icon-medium',
+				'icon-google',
+				'icon-IE',
+				'icon-amazon',
+				'icon-slack',
+				'icon-alipay',
+				'icon-taobao',
+				'icon-zhihu',
+				'icon-HTML',
+				'icon-linkedin',
+				'icon-yahoo',
+				'icon-facebook',
+				'icon-skype',
+				'icon-CodeSandbox',
+				'icon-chrome',
+				'icon-codepen',
+				'icon-aliwangwang',
+				'icon-apple',
+				'icon-android',
+				'icon-sketch',
+				'icon-Gitlab',
+				'icon-dribbble',
+				'icon-instagram',
+				'icon-reddit',
+				'icon-windows',
+				'icon-yuque',
+				'icon-Youtube',
+				'icon-Gitlab-fill',
+				'icon-dropbox',
+				'icon-dingtalk',
+				'icon-android-fill',
+				'icon-apple-fill',
+				'icon-HTML-fill',
+				'icon-windows-fill',
+				'icon-QQ',
+				'icon-twitter',
+				'icon-skype-fill',
+				'icon-weibo',
+				'icon-yuque-fill',
+				'icon-Youtube-fill',
+				'icon-yahoo-fill',
+				'icon-wechat-fill',
+				'icon-chrome-fill',
+				'icon-alipay-circle-fill',
+				'icon-aliwangwang-fill',
+				'icon-behance-circle-fill',
+				'icon-amazon-circle-fill',
+				'icon-codepen-circle-fill',
+				'icon-CodeSandbox-circle-f',
+				'icon-dropbox-circle-fill',
+				'icon-github-fill',
+				'icon-dribbble-circle-fill',
+				'icon-googleplus-circle-f',
+				'icon-medium-circle-fill',
+				'icon-QQ-circle-fill',
+				'icon-IE-circle-fill',
+				'icon-google-circle-fill',
+				'icon-dingtalk-circle-fill',
+				'icon-sketch-circle-fill',
+				'icon-slack-circle-fill',
+				'icon-twitter-circle-fill',
+				'icon-taobao-circle-fill',
+				'icon-weibo-circle-fill',
+				'icon-zhihu-circle-fill',
+				'icon-reddit-circle-fill',
+				'icon-alipay-square-fill',
+				'icon-dingtalk-square-fill',
+				'icon-CodeSandbox-square-f',
+				'icon-behance-square-fill',
+				'icon-amazon-square-fill',
+				'icon-codepen-square-fill',
+				'icon-dribbble-square-fill',
+				'icon-dropbox-square-fill',
+				'icon-facebook-fill',
+				'icon-googleplus-square-f',
+				'icon-google-square-fill',
+				'icon-instagram-fill',
+				'icon-IE-square-fill',
+				'icon-medium-square-fill',
+				'icon-linkedin-fill',
+				'icon-QQ-square-fill',
+				'icon-reddit-square-fill',
+				'icon-twitter-square-fill',
+				'icon-sketch-square-fill',
+				'icon-slack-square-fill',
+				'icon-taobao-square-fill',
+				'icon-weibo-square-fill',
+				'icon-zhihu-square-fill',
+				'icon-zoomout',
+				'icon-apartment',
+				'icon-audio',
+				'icon-audio-fill',
+				'icon-robot',
+				'icon-zoomin'
+			]
+		},
+		handleCopy(v) {
+			if (navigator.clipboard) {
+				/** 如果支持剪切板api */
+				navigator.clipboard
+					.writeText(`<svg class="icon-svg aui-navbar__icon-menu" style="height: 24px; width: 24px;" aria-hidden="true"><use xlink:href="#${v}"></use></svg>`)
+					.then(() => {
+						this.$message.success('已复制')
+					})
+			} else {
+				this.$message.info('请打开 Console 手动复制.')
+				console.log(`<svg class="icon-svg aui-navbar__icon-menu" style="height: 24px; width: 24px;" aria-hidden="true"><use xlink:href="#${v}"></use></svg>`)
+			}
+		},
+		close() {
+			this.visible = false
+			this.$emit('destory-me')
+		}
+	}
+}
+</script>
+
+<style scoped>
+.col-hover:hover {
+	background: #ddd;
+}
+</style>

src/views/modules/monitoring/product-add-or-update.vue

@@ -1,205 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="名称"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="外部编码，用于对照外部系统的编码" prop="externalCode">
-				<el-input v-model="dataForm.externalCode" placeholder="外部编码，用于对照外部系统的编码"></el-input>
-			</el-form-item>
-			<el-form-item label="规格" prop="specifications">
-				<el-input v-model="dataForm.specifications" placeholder="规格"></el-input>
-			</el-form-item>
-			<el-form-item label="单位value，对应到数据字典label_value" prop="unitDictValue">
-				<el-input v-model="dataForm.unitDictValue" placeholder="单位value，对应到数据字典label_value"></el-input>
-			</el-form-item>
-			<el-form-item label="一单位的面积（平方米）" prop="area">
-				<el-input v-model="dataForm.area" placeholder="一单位的面积（平方米）"></el-input>
-			</el-form-item>
-			<el-form-item label="加工一单位产品需要的时间" prop="processTime">
-				<el-input v-model="dataForm.processTime" placeholder="加工一单位产品需要的时间"></el-input>
-			</el-form-item>
-			<el-form-item label="产品类型value，对应到数据字典label_value" prop="typeDictValue">
-				<el-input v-model="dataForm.typeDictValue" placeholder="产品类型value，对应到数据字典label_value"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				code: '',
-				name: '',
-				description: '',
-				externalCode: '',
-				specifications: '',
-				unitDictValue: '',
-				area: '',
-				processTime: '',
-				typeDictValue: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				externalCode: [{ required: true, message: '外部编码，用于对照外部系统的编码不能为空', trigger: 'blur' }],
-				specifications: [{ required: true, message: '规格不能为空', trigger: 'blur' }],
-				unitDictValue: [{ required: true, message: '单位value，对应到数据字典label_value不能为空', trigger: 'blur' }],
-				area: [{ required: true, message: '一单位的面积（平方米）不能为空', trigger: 'blur' }],
-				processTime: [{ required: true, message: '加工一单位产品需要的时间不能为空', trigger: 'blur' }],
-				typeDictValue: [{ required: true, message: '产品类型value，对应到数据字典label_value不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/product/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.code = data.data.code
-							this.dataForm.name = data.data.name
-							this.dataForm.description = data.data.description
-							this.dataForm.externalCode = data.data.externalCode
-							this.dataForm.specifications = data.data.specifications
-							this.dataForm.unitDictValue = data.data.unitDictValue
-							this.dataForm.area = data.data.area
-							this.dataForm.processTime = data.data.processTime
-							this.dataForm.typeDictValue = data.data.typeDictValue
-							this.dataForm.enabled = data.data.enabled
-							this.dataForm.remark = data.data.remark
-							this.dataForm.valid = data.data.valid
-							this.dataForm.creatorId = data.data.creatorId
-							this.dataForm.creatorName = data.data.creatorName
-							this.dataForm.createTime = data.data.createTime
-							this.dataForm.updaterId = data.data.updaterId
-							this.dataForm.updaterName = data.data.updaterName
-							this.dataForm.updateTime = data.data.updateTime
-							this.dataForm.version = data.data.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/product/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							description: this.dataForm.description,
-							externalCode: this.dataForm.externalCode,
-							specifications: this.dataForm.specifications,
-							unitDictValue: this.dataForm.unitDictValue,
-							area: this.dataForm.area,
-							processTime: this.dataForm.processTime,
-							typeDictValue: this.dataForm.typeDictValue,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/product.vue

@@ -1,47 +1,26 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('prod.name') + ' / ' + $t('prod.code')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
 				<!-- <el-button @click="addOrEdit()">测试</el-button> -->
-				<!-- <el-button v-if="$hasPermission('monitoring:product:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button> -->
+				<!-- <el-button v-if="$hasPermission('monitoring:product:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
-				<el-button v-if="$hasPermission('monitoring:product:save')" type="primary" @click="addOrEdit()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:product:save')" type="primary" @click="addOrEdit()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
-			<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
-			<el-table-column prop="id" header-align="center" align="center" label="ID"></el-table-column>
-			<el-table-column prop="code" header-align="center" align="center" label="编码"></el-table-column>
-			<el-table-column prop="name" header-align="center" align="center" label="名称"></el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label="描述"></el-table-column>
-			<el-table-column prop="externalCode" header-align="center" align="center" label="外部编码，用于对照外部系统的编码"></el-table-column>
-			<el-table-column prop="specifications" header-align="center" align="center" label="规格"></el-table-column>
-			<el-table-column prop="unitDictValue" header-align="center" align="center" label="单位value，对应到数据字典label_value"></el-table-column>
-			<el-table-column prop="area" header-align="center" align="center" label="一单位的面积（平方米）"></el-table-column>
-			<el-table-column prop="processTime" header-align="center" align="center" label="加工一单位产品需要的时间"></el-table-column>
-			<el-table-column prop="typeDictValue" header-align="center" align="center" label="产品类型value，对应到数据字典label_value"></el-table-column>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"></el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"></el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"></el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"></el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"></el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"></el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"></el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"></el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"></el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"></el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table
+			:page="pageIndex"
+			:size="pageSize"
+			:data="dataList"
+			:table-head-configs="tableConfigs"
+			:max-height="calcMaxHeight(8)"
+			@operate-event="handleOperations"
+			@refreshDataList="getDataList"
+		/>
 
 		<el-pagination
 			@size-change="sizeChangeHandle"
@@ -54,13 +33,15 @@
 		></el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
 		<!-- <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> -->
-
+		<base-dialog v-if="showbasedialog" ref="basedialog" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
-		<base-dialog v-if="showbasedialog" ref="basedialog" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="showbasedialog = false" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 // import AddOrUpdate from './product-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
@@ -72,28 +53,36 @@ import { dictFilter } from '@/utils/filters'
 const UnitDictTypeId = '1557173812109242370'
 const ProductTypeDictTypeId = '1557179530308616193'
 const tableConfigs = [
-	{ type: 'index', name: '序号' },
+	{ type: 'index', width: 100, name: i18n.t('index') },
-	{ prop: 'createTime', name: '添加时间', filter: val => (val ? moment(val).format('YYYY-MM-DD hh:mm:ss') : '-') },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'name', name: '产品名称' },
+	{ prop: 'name', name: i18n.t('prod.name') },
-	{ prop: 'code', name: '产品编码' },
+	{ prop: 'code', name: i18n.t('prod.code') },
-	{ prop: 'specifications', name: '规格' },
+	{ prop: 'specifications', name: i18n.t('prod.spec') },
-	{ prop: 'unitDictValue', name: '单位', filter: dictFilter(UnitDictTypeId) },
+	{ prop: 'unitDictValue', name: i18n.t('unit'), filter: dictFilter(UnitDictTypeId) },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['viewAttr', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	// { prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'viewAttr', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog', // dialog | drawer | page
 	infoUrl: '/monitoring/product',
 	fields: [
-		'name',
+		// 'name',
+		{
+			name: 'name',
+			required: true
+			// label: i18n.t('pl.name')
+		},
 		{
 			name: 'code',
+			required: true,
+			// label: i18n.t('pl.code'),
 			api: '/monitoring/product/getCode'
 		},
 		{
 			name: 'processTime',
-			label: '加工时间',
+			label: i18n.t('prod.processTime'),
-			placeholder: '请输入加工时间',
+			placeholder: i18n.t('prod.processTimeHints'),
 			type: 'number',
 			required: true,
 			rules: [
@@ -101,13 +90,13 @@ const addOrUpdateConfigs = {
 					type: 'number',
 					trigger: 'blur',
 					transform: val => Number(val),
-					message: '必须输入数字'
+					message: i18n.t('hints.number')
 				}
 			]
 		},
 		{
 			name: 'typeDictValue',
-			label: '产品类型', // 对于非常见属性，最好自己指定label
+			label: i18n.t('prod.type'), // 对于非常见属性，最好自己指定label
 			type: 'select',
 			options: [
 				// 动态获取
@@ -115,7 +104,7 @@ const addOrUpdateConfigs = {
 		},
 		{
 			name: 'unitDictValue',
-			label: '单位',
+			label: i18n.t('unit'),
 			type: 'select',
 			// placeholder: '请选择单位',
 			options: [
@@ -124,29 +113,29 @@ const addOrUpdateConfigs = {
 		},
 		{
 			name: 'area',
-			label: '单位平方数',
+			label: i18n.t('prod.area'),
 			type: 'number',
-			rules: [{ type: 'number', transform: val => Number(val), message: '请输入数字', trigger: 'blur' }]
+			rules: [{ type: 'number', transform: val => Number(val), message: i18n.t('hints.number'), trigger: 'blur' }]
 		},
 		'specifications',
 		'remark'
 	],
 	operations: [
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/product', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/product', permission: 'monitoring:product:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/product', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/product', permission: 'monitoring:product:update', showOnEdit: true }
 	],
 	subtable: {
 		// for i18n
-		title: '动态属性',
+		title: i18n.t('prod.attr'),
 		url: '/monitoring/productArrt',
 		relatedField: 'productId',
 		tableConfigs: [
-			{ type: 'index', name: '序号' },
+			{ type: 'index', width: 100, name: i18n.t('index') },
-			{ prop: 'createTime', name: '添加时间', filter: val => (val ? moment(val).format('YYYY-MM-DD hh:mm:ss') : '-') },
+			{ prop: 'createTime', name: i18n.t('createTime'), filter: val => (val ? moment(val).format('YYYY-MM-DD hh:mm:ss') : '-') },
-			{ prop: 'name', name: '属性名', formField: true, rules: [{ required: true, message: '必填', trigger: 'blur' }] },
+			{ prop: 'name', name: i18n.t('attrName'), formField: true, rules: [{ required: true, message: i18n.t('required'), trigger: 'blur' }] },
-			{ prop: 'code', name: '属性值', formField: true },
+			{ prop: 'code', name: i18n.t('attrValue'), formField: true },
-			{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+			{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 		]
 	}
 }
@@ -155,6 +144,7 @@ export default {
 	mixins: [dictListMixin],
 	data() {
 		return {
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -191,7 +181,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
-		//
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.showbasedialog = false
+			}, /** after dialog animated */ 200)
+		},
 		addOrEdit(id) {
 			this.showbasedialog = true
 			this.$nextTick(() => {
@@ -247,6 +242,8 @@ export default {
 		// 表格操作事件管理
 		handleOperations({ type, data }) {
 			switch (type) {
+				case 'edit': // <== 对照 tableConfig
+					return this.addOrEdit(data)
 				case 'viewAttr': // <== 对照 tableConfig
 					return this.addOrEdit(data)
 				case 'delete':
@@ -262,9 +259,9 @@ export default {
 				  this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -277,7 +274,7 @@ export default {
 					.then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/productArrt-add-or-update.vue

@@ -1,184 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="名称"></el-input>
-			</el-form-item>
-			<el-form-item label="产品id,关联产品表" prop="productId">
-				<el-input v-model="dataForm.productId" placeholder="产品id,关联产品表"></el-input>
-			</el-form-item>
-			<el-form-item label="属性值" prop="value">
-				<el-input v-model="dataForm.value" placeholder="属性值"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="外部编码，用于对照外部系统的编码" prop="externalCode">
-				<el-input v-model="dataForm.externalCode" placeholder="外部编码，用于对照外部系统的编码"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				code: '',
-				name: '',
-				productId: '',
-				value: '',
-				description: '',
-				externalCode: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
-				productId: [{ required: true, message: '产品id,关联产品表不能为空', trigger: 'blur' }],
-				value: [{ required: true, message: '属性值不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				externalCode: [{ required: true, message: '外部编码，用于对照外部系统的编码不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/productArrt/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.code = data.producarrt.code
-							this.dataForm.name = data.producarrt.name
-							this.dataForm.productId = data.producarrt.productId
-							this.dataForm.value = data.producarrt.value
-							this.dataForm.description = data.producarrt.description
-							this.dataForm.externalCode = data.producarrt.externalCode
-							this.dataForm.enabled = data.producarrt.enabled
-							this.dataForm.remark = data.producarrt.remark
-							this.dataForm.valid = data.producarrt.valid
-							this.dataForm.creatorId = data.producarrt.creatorId
-							this.dataForm.creatorName = data.producarrt.creatorName
-							this.dataForm.createTime = data.producarrt.createTime
-							this.dataForm.updaterId = data.producarrt.updaterId
-							this.dataForm.updaterName = data.producarrt.updaterName
-							this.dataForm.updateTime = data.producarrt.updateTime
-							this.dataForm.version = data.producarrt.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/productArrt/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							productId: this.dataForm.productId,
-							value: this.dataForm.value,
-							description: this.dataForm.description,
-							externalCode: this.dataForm.externalCode,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/productArrt.vue

@@ -1,41 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:productarrt:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:productarrt:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="code" header-align="center" align="center" label="编码"> </el-table-column>
-			<el-table-column prop="name" header-align="center" align="center" label="名称"> </el-table-column>
-			<el-table-column prop="productId" header-align="center" align="center" label="产品id,关联产品表"> </el-table-column>
-			<el-table-column prop="value" header-align="center" align="center" label="属性值"> </el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
-			<el-table-column prop="externalCode" header-align="center" align="center" label="外部编码，用于对照外部系统的编码"> </el-table-column>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -47,25 +22,28 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" :configs="addOrUpdateConfigs" ref="addOrUpdate" @refreshDataList="getDataList" @destroy-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" :configs="addOrUpdateConfigs" ref="addOrUpdate" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 // import AddOrUpdate from './productArrt-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'name', name: '属性名称' },
+	{ prop: 'name', name: i18n.t('attrName') },
-	{ prop: 'code', name: '属性编码' },
+	{ prop: 'code', name: i18n.t('prod.attrcode') },
-	{ prop: 'productId', name: '产品id' },
+	{ prop: 'productId', name: i18n.t('prod.id') },
-	{ prop: 'value', name: '属性值' },
+	{ prop: 'value', name: i18n.t('attrValue') },
-	{ prop: 'description', name: '描述' },
+	{ prop: 'description', name: i18n.t('desc') },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
@@ -74,41 +52,42 @@ const addOrUpdateConfigs = {
 	fields: [
 		{
 			name: 'name',
-			label: '属性名称',
+			label: i18n.t('attrName'),
-			placeholder: '请输入属性名称'
+			placeholder: i18n.t('prod.attrnameHints')
 		},
 		{
 			name: 'code',
-			label: '属性编码',
+			label: i18n.t('prod.attrcode'),
-			placeholder: '请输入属性编码'
+			placeholder: i18n.t('prod.attrcodeHints')
 		},
 		{
 			name: 'productId',
-			label: '关联产品',
+			label: i18n.t('prod.relatedPid'),
 			type: 'select',
 			options: []
 		},
 		{
 			name: 'value',
-			label: '属性值',
+			label: i18n.t('attrValue'),
-			placeholder: '请输入属性值'
+			placeholder: i18n.t('prod.attrvalueHints')
 		},
 		{
 			name: 'description',
-			label: '描述',
+			label: i18n.t('desc'),
-			placeholder: '请输入描述'
+			placeholder: i18n.t('prod.descHints')
 		}
 	],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/productArrt', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/productArrt', permission: 'monitoring:productarrt:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/productArrt', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/productArrt', permission: 'monitoring:productarrt:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			tableConfigs,
 			dataForm: {
@@ -132,6 +111,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// 获取产品列表
 		getProductList() {
 			this.$http({
@@ -213,9 +198,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -225,7 +210,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/productionLine.vue

@@ -1,42 +1,24 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('pl.name')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:productionline:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:productionline:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table
-			<el-table-column prop="id" header-align="center" align="center" label="id"> </el-table-column>
+			:page="pageIndex"
-			<el-table-column prop="factoryId" header-align="center" align="center" label="工厂表ID"> </el-table-column>
+			:size="pageSize"
-			<el-table-column prop="code" header-align="center" align="center" label="编码"> </el-table-column>
+			:data="dataList"
-			<el-table-column prop="name" header-align="center" align="center" label="名称"> </el-table-column>
+			:table-head-configs="tableConfigs"
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
+			:max-height="calcMaxHeight(8)"
-			<el-table-column prop="status" header-align="center" align="center" label="产线状态"> </el-table-column>
+			@operate-event="handleOperations"
-			<el-table-column prop="tvalue" header-align="center" align="center" label="每小时下片数量"> </el-table-column>
+			@refreshDataList="getDataList"
-			<el-table-column prop="externalCode" header-align="center" align="center" label="外部系统编码"> </el-table-column>
+		/>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -48,61 +30,71 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'factoryName', name: '工厂' },
+		type: 'index',
-	{ prop: 'name', name: '产线名称' },
+		name: i18n.t('index')
-	{ prop: 'code', name: '产线编码' },
+	},
-	{ prop: 'status', name: '产线状态' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'description', name: '描述' },
+	{ prop: 'factoryName', name: i18n.t('factory.title') },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'name', name: i18n.t('pl.name') },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'code', name: i18n.t('pl.code') },
+	{ prop: 'status', name: i18n.t('pl.status'), filter: val => (val === 0 || val === 1 || val === 2) && ['停止', '运行', '未知'][val] },
+	{ prop: 'description', name: i18n.t('desc') },
+	{ prop: 'remark', name: i18n.t('remark') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/productionLine',
 	fields: [
-		'name',
+		// 'name',
-		{ name: 'code', api: '/monitoring/productionLine/getCode' },
+		{ name: 'name', label: i18n.t('pl.name'), required: true },
+		{ name: 'code', label: i18n.t('pl.code'), required: true, api: '/monitoring/productionLine/getCode' },
 		{
 			name: 'factoryId',
-			label: '工厂',
+			required: true,
+			label: i18n.t('factory.title'),
 			type: 'select',
-			placeholder: '请选择所属工厂',
+			placeholder: i18n.t('pl.factoryHints'),
 			options: []
 		},
 		{
 			name: 'tvalue',
-			label: '产线TT值(每小时下片数量)',
+			label: i18n.t('pl.tvalue'),
-			placeholder: '请输入合理数值',
+			placeholder: i18n.t('hints.number'),
 			type: 'number', // TODO: 可改进为自动应用 number 验证，此时还必须添加下述规则：
 			required: true,
-			rules: [{ type: 'number', transform: val => Number(val), trigger: 'blur', message: '请输入数字类型' }]
+			rules: [{ type: 'number', transform: val => Number(val), trigger: 'blur', message: i18n.t('hints.number') }]
 		},
 		'description',
 		'remark'
 	],
 	operations: [
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/productionLine', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/productionLine', permission: 'monitoring:productionline:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/productionLine', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/productionLine', permission: 'monitoring:productionline:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			tableConfigs,
 			dataForm: {
@@ -127,6 +119,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// 获取工厂列表
 		getFactoryList() {
 			this.$http.get(this.$http.adornUrl('/monitoring/factory/list')).then(({ data: res }) => {
@@ -203,9 +201,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -215,7 +213,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/productionLineRecSch-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="产线id" prop="productionLineId">
 				<el-input v-model="dataForm.productionLineId" placeholder="产线id"></el-input>
@@ -24,8 +24,8 @@
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -101,7 +101,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/productionLineRecSch.vue

@@ -1,32 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:productionlinerecsch:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:productionlinerecsch:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="productionLineId" header-align="center" align="center" label="产线id"> </el-table-column>
-			<el-table-column prop="inputNum" header-align="center" align="center" label="上一次记录时间至该条记录时间端内上片数量"> </el-table-column>
-			<el-table-column prop="outputNum" header-align="center" align="center" label="上一次记录时间至该条记录时间端内下片数量"> </el-table-column>
-			<el-table-column prop="recordTime" header-align="center" align="center" label="记录时间"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="sumInputNum" header-align="center" align="center" label="该记录时间点的累计上片数量"> </el-table-column>
-			<el-table-column prop="sumOutputNum" header-align="center" align="center" label="该记录时间点的累计下片数量"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -43,26 +27,30 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './productionLineRecSch-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
 	{ prop: 'id', name: 'ID' },
-	{ prop: 'productionLineId', name: '产线id' },
+	{ prop: 'productionLineId', name: i18n.t('pl.id') },
 	{ prop: 'inputNum', name: '上一次记录时间至该条记录时间端内上片数量' },
 	{ prop: 'outputNum', name: '上一次记录时间至该条记录时间端内下片数量' },
-	{ prop: 'recordTime', name: '记录时间' },
+	{ prop: 'recordTime', name: i18n.t('recordTime') },
-	{ prop: 'valid', name: '删除标志，是否有效:1 可用 0不可用' },
+	{ prop: 'valid', name: i18n.t('delMark') },
 	{ prop: 'sumInputNum', name: '该记录时间点的累计上片数量' },
 	{ prop: 'sumOutputNum', name: '该记录时间点的累计下片数量' },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -84,6 +72,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -135,9 +129,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -147,7 +141,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/productionline-add-or-update.vue

@@ -1,191 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="工厂表ID" prop="factoryId">
-				<el-input v-model="dataForm.factoryId" placeholder="工厂表ID"></el-input>
-			</el-form-item>
-			<el-form-item label="编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
-			</el-form-item>
-			<el-form-item label="名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="名称"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="产线状态" prop="status">
-				<el-input v-model="dataForm.status" placeholder="产线状态"></el-input>
-			</el-form-item>
-			<el-form-item label="每小时下片数量" prop="tvalue">
-				<el-input v-model="dataForm.tvalue" placeholder="每小时下片数量"></el-input>
-			</el-form-item>
-			<el-form-item label="外部系统编码" prop="externalCode">
-				<el-input v-model="dataForm.externalCode" placeholder="外部系统编码"></el-input>
-			</el-form-item>
-			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
-				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				factoryId: '',
-				code: '',
-				name: '',
-				description: '',
-				status: '',
-				tvalue: '',
-				externalCode: '',
-				enabled: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				factoryId: [{ required: true, message: '工厂表ID不能为空', trigger: 'blur' }],
-				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
-				description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				status: [{ required: true, message: '产线状态不能为空', trigger: 'blur' }],
-				tvalue: [{ required: true, message: '每小时下片数量不能为空', trigger: 'blur' }],
-				externalCode: [{ required: true, message: '外部系统编码不能为空', trigger: 'blur' }],
-				enabled: [{ required: true, message: '启用状态:0 、停用，1、启用不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/productionLine/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.factoryId = data.productionLine.factoryId
-							this.dataForm.code = data.productionLine.code
-							this.dataForm.name = data.productionLine.name
-							this.dataForm.description = data.productionLine.description
-							this.dataForm.status = data.productionLine.status
-							this.dataForm.tvalue = data.productionLine.tvalue
-							this.dataForm.externalCode = data.productionLine.externalCode
-							this.dataForm.enabled = data.productionLine.enabled
-							this.dataForm.remark = data.productionLine.remark
-							this.dataForm.valid = data.productionLine.valid
-							this.dataForm.creatorId = data.productionLine.creatorId
-							this.dataForm.creatorName = data.productionLine.creatorName
-							this.dataForm.createTime = data.productionLine.createTime
-							this.dataForm.updaterId = data.productionLine.updaterId
-							this.dataForm.updaterName = data.productionLine.updaterName
-							this.dataForm.updateTime = data.productionLine.updateTime
-							this.dataForm.version = data.productionLine.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/productionLine/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							factoryId: this.dataForm.factoryId,
-							code: this.dataForm.code,
-							name: this.dataForm.name,
-							description: this.dataForm.description,
-							status: this.dataForm.status,
-							tvalue: this.dataForm.tvalue,
-							externalCode: this.dataForm.externalCode,
-							enabled: this.dataForm.enabled,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/qualityInspectionBoxBtn.vue

@@ -0,0 +1,368 @@
+<template>
+	<div class="mod-config">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
+			<!-- <el-form-item> -->
+			<!-- <el-input v-model="dataForm.key" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-input>
+			</el-form-item> -->
+			<el-form-item>
+				<el-button @click="currentChangeHandle(1)">{{ $t('search') }}</el-button>
+				<el-button v-if="$hasPermission('monitoring:qualityInspectionBoxBtn:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
+				<!-- <el-button v-if="$hasPermission('monitoring:equipment:export')" @click="exportHandle()">{{ $t('export') }}</el-button> -->
+			</el-form-item>
+		</el-form>
+
+		<base-table
+			:page="pageIndex"
+			:size="pageSize"
+			:data="dataList"
+			:table-head-configs="tableConfigs"
+			:max-height="calcMaxHeight(8)"
+			@operate-event="handleOperations"
+			@refreshDataList="getDataList"
+		/>
+		<el-pagination
+			@size-change="sizeChangeHandle"
+			@current-change="currentChangeHandle"
+			:current-page="pageIndex"
+			:page-sizes="[10, 20, 50, 100]"
+			:page-size="pageSize"
+			:total="totalPage"
+			layout="total, sizes, prev, pager, next, jumper"
+		></el-pagination>
+		<!-- 弹窗, 新增 / 修改 -->
+		<add-or-update
+			v-if="addOrUpdateVisible"
+			ref="addOrUpdate"
+			:configs="addOrUpdateConfigs"
+			@refreshDataList="getDataList"
+			@select-change="handleDialogSelectChange"
+			@destory-dialog="handleDestroyDialog"
+		/>
+	</div>
+</template>
+
+<script>
+import i18n from '@/i18n'
+import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+// import AddOrUpdate from './equipment-add-or-update'
+import BaseTable from '@/components/base-table'
+import TableOperateComponent from '@/components/base-table/components/operationComponent'
+// import TableTextComponent from '@/components/base-table/components/detailComponent'
+// import CKEditor from 'ckeditor4-vue'
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+// import Cookies from 'js-cookie'
+
+const tableConfigs = [
+	{
+		type: 'index',
+		name: i18n.t('index')
+	},
+	{
+		prop: 'createTime',
+		name: i18n.t('createTime'),
+		filter: timeFilter
+	},
+	{ prop: 'inspectionDetContent', name: i18n.t('andeng.inspectContent') }, // name: '检测内容' },
+	{ prop: 'keyValue', name: i18n.t('andeng.btnVal') }, // name: '按钮值' },
+	{ prop: 'model', name: i18n.t('andeng.btnBoxModel') }, // name: '按钮盒模式' },
+
+	{
+		prop: 'operations',
+		name: i18n.t('handle'),
+		fixed: 'right',
+		width: 180,
+		subcomponent: TableOperateComponent,
+		options: ['edit', 'delete']
+	}
+]
+
+const addOrUpdateConfigs = {
+	type: 'dialog',
+	infoUrl: '/monitoring/qualityInspectionBoxBtn',
+	fields: [
+		// { name: 'productionId', label: i18n.t('eq.name'), required: true },
+		{ name: 'productionId', label: i18n.t('pl.title'), required: true, type: 'select', options: [], relatedField: 'sectionId' },
+		{ name: 'sectionId', label: i18n.t('ws.title'), required: true, type: 'select', options: [] },
+		{ name: 'model', label: i18n.t('andeng.btnBoxModel') },
+		{
+			name: 'keyValue',
+			label: i18n.t('andeng.btnVal'),
+			required: true,
+			rules: [{ type: 'integer', trigger: 'blur', message: i18n.t('hints.integer'), transform: val => Number(val) }]
+		},
+		{
+			name: 'inspectionDetContent',
+			label: i18n.t('andeng.inspectContent')
+		}
+	],
+	operations: [
+		{ name: 'cancel', showAlways: true },
+		{
+			name: 'save',
+			url: '/monitoring/qualityInspectionBoxBtn',
+			permission: 'monitoring:qualityInspectionBoxBtn:save',
+			showOnEdit: false
+		},
+		{
+			name: 'update',
+			url: '/monitoring/qualityInspectionBoxBtn',
+			permission: 'monitoring:qualityInspectionBoxBtn:update',
+			showOnEdit: true
+		}
+	]
+}
+
+export default {
+	data() {
+		return {
+			calcMaxHeight,
+			tableConfigs,
+			addOrUpdateConfigs,
+			dataForm: {
+				key: ''
+			},
+			dataList: [],
+			pageIndex: 1,
+			pageSize: 10,
+			totalPage: 0,
+			dataListLoading: false,
+			dataListSelections: [],
+			addOrUpdateVisible: false
+		}
+	},
+	components: {
+		AddOrUpdate,
+		BaseTable
+	},
+	activated() {
+		this.getDataList()
+		this.getPlList()
+		this.getWsList()
+	},
+	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
+		// 获取产线列表，用于刷新工段列表
+		getPlList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
+				method: 'get'
+			}).then(({ data: res }) => {
+				const plConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'productionId')
+				plConfig.options =
+					res.data?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
+			})
+		},
+		// 获取工段列表
+		getWsList(id) {
+			let params = {
+				page: 1,
+				limit: 999
+			}
+			if (id) {
+				params.lineId = id
+			}
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/workshopSection/page'),
+				method: 'get',
+				params: this.$http.adornParams(params)
+			}).then(({ data: res }) => {
+				const wsConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'sectionId')
+				wsConfig.options =
+					res.data?.list?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
+			})
+		},
+		// 获取设备类型列表
+		getTypeList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipmentType/page'),
+				method: 'get',
+				params: this.$http.adornParams({
+					// page: this.pageIndex,
+					// limit: this.pageSize,
+					// key: this.dataForm.key
+				})
+			}).then(({ data }) => {
+				const eqTypeConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'equipmentTypeId')
+				eqTypeConfig.options =
+					data.data?.list?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
+			})
+		},
+		// 获取设备分组列表
+		getGroupList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipmentGroup/page'),
+				method: 'get',
+				params: this.$http.adornParams({
+					// page: this.pageIndex,
+					// limit: this.pageSize,
+					// key: this.dataForm.key
+				})
+			}).then(({ data }) => {
+				const groupConfig = this.addOrUpdateConfigs.fields.find(item => item.name === 'groupId')
+				groupConfig.options =
+					data.data?.list?.map(item => ({
+						value: item.id,
+						label: item.name
+					})) || []
+			})
+		},
+		// 获取数据列表
+		getDataList() {
+			this.dataListLoading = true
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/qualityInspectionBoxBtn/page'),
+				method: 'get',
+				params: this.$http.adornParams({
+					page: this.pageIndex,
+					limit: this.pageSize
+					// key: this.dataForm.key
+				})
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.dataList = data.data.list
+					// this.dataList = new Array(20).fill('1')
+					// console.log('data list', this.dataList)
+					this.totalPage = data.data.total
+				} else {
+					this.dataList = []
+					this.totalPage = 0
+				}
+				this.dataListLoading = false
+			})
+		},
+		// 每页数
+		sizeChangeHandle(val) {
+			this.pageSize = val
+			this.pageIndex = 1
+			this.getDataList()
+		},
+		// 当前页
+		currentChangeHandle(val) {
+			this.pageIndex = val
+			this.getDataList()
+		},
+		// 多选
+		selectionChangeHandle(val) {
+			this.dataListSelections = val
+		},
+		// 对话框里的某个选择改变了
+		handleDialogSelectChange({ name, id }) {
+			switch (name) {
+				case 'productionId':
+					this.getWsList(id)
+			}
+		},
+		handleOperations({ type, data: id }) {
+			switch (type) {
+				case 'view-detail':
+					// const { name, code } = this.dataList.find(item => item.id === id)
+					// this.$router.push({
+					// 	name: 'monitoring-equipmentAdd',
+					// 	params: {
+					// 		isdetail: true,
+					// 		equipmentId: id
+					// 	}
+					// })
+					// break
+					return this.addOrUpdateHandle(id, true)
+				case 'edit':
+					return this.addOrUpdateHandle(id)
+				case 'delete':
+					return this.deleteHandle(id)
+			}
+		},
+		exportHandle() {
+			// this.$http.get(this.$http.adornUrl('/monitoring/equipment/export')).then(({ data: res }) => {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/equipment/export'),
+				method: 'get',
+				responseType: 'blob'
+			}).then(res => {
+				let fileName = 'equipment-list.xls'
+				if (res.headers['content-disposition']) {
+					const contentDisposition = res.headers['content-disposition']
+					fileName = contentDisposition.slice(contentDisposition.indexOf('filename=') + 9)
+				}
+
+				fileName = decodeURIComponent(fileName)
+
+				const blob = new Blob([res.data])
+
+				if ('download' in document.createElement('a')) {
+					const alink = document.createElement('a')
+					alink.download = fileName
+					alink.style.display = 'none'
+					alink.target = '_blank'
+					alink.href = URL.createObjectURL(blob)
+					document.body.appendChild(alink)
+					alink.click()
+					URL.revokeObjectURL(alink.href)
+					document.body.removeChild(alink)
+				} else {
+					navigator.msSaveBlob(blob, fileName)
+				}
+			})
+		},
+		// 新增 / 修改
+		addOrUpdateHandle(id, isdetail = false) {
+			this.addOrUpdateVisible = true
+			this.$nextTick(() => {
+				this.$refs.addOrUpdate.init(id, isdetail)
+			})
+			// this.$router.push({
+			// 	name: 'monitoring-equipmentAdd',
+			// 	params: {
+			// 		equipmentId: id
+			// 	}
+			// })
+		},
+		// 删除
+		deleteHandle(id) {
+			var ids = id
+				? [id]
+				: this.dataListSelections.map(item => {
+						return item.id
+				  })
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
+				confirmButtonText: i18n.t('confirm'),
+				cancelButtonText: i18n.t('cancel'),
+				type: 'warning'
+			}).then(() => {
+				this.$http({
+					url: this.$http.adornUrl('/monitoring/qualityInspectionBoxBtn'),
+					method: 'delete',
+					data: this.$http.adornData(ids, false, 'raw')
+				}).then(({ data }) => {
+					if (data && data.code === 0) {
+						this.$message({
+							message: i18n.t('prompt.success'),
+							type: 'success',
+							duration: 1500,
+							onClose: () => {
+								this.getDataList()
+							}
+						})
+					} else {
+						this.$message.error(data.msg)
+					}
+				})
+			})
+		}
+	}
+}
+</script>

src/views/modules/monitoring/qualityInspectionCurrent.vue

@@ -7,24 +7,24 @@
 					type="daterange"
 					v-model="datetime"
 					value-format="yyyy-MM-ddTHH:mm:ss"
-					start-placeholder="开始时间"
+					:start-placeholder="$t('startTime')"
-					end-placeholder="结束时间"
+					:end-placeholder="$t('endTime')"
-					range-separator="至"
+					:range-separator="$t('to')"
 					:default-time="['00:00:00', '23:59:59']"
 					:picker-options="quickOptions"
 					clearable
 				/>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="getDataList()">{{ $t('query') }}</el-button>
-				<!-- <el-button v-if="$hasPermission('monitoring:qualityinspectionrecord:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button> -->
+				<!-- <el-button v-if="$hasPermission('monitoring:qualityinspectionrecord:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
 			</el-form-item>
 		</el-form>
 
 		<div class="quality-inspection-current base-container">
 			<el-row>
 				<el-col>
-					<small-title :size="'md'">上下片及检测总数统计</small-title>
+					<small-title :size="'md'">{{ $t('inspect.ioTotal') }}</small-title>
 					<el-row style="margin-top: 12px;">
 						<base-table :data="dataListStatic" :table-head-configs="tableConfigStatic" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 					</el-row>
@@ -34,12 +34,12 @@
 			<el-row style="margin-top: 28px;">
 				<el-col>
 					<el-row>
-						<small-title :size="'md'">各产线检测类型统计</small-title>
+						<small-title :size="'md'">{{ $t('inspect.plTotal') }}</small-title>
 					</el-row>
 					<el-row style="margin-top: 8px;">
 						<el-radio-group v-model="dataType" size="medium" @change="handleDataTypeChange">
-							<el-radio-button label="表格"></el-radio-button>
+							<el-radio-button :label="$t('table2')"></el-radio-button>
-							<el-radio-button label="图形"></el-radio-button>
+							<el-radio-button :label="$t('graph')"></el-radio-button>
 						</el-radio-group>
 					</el-row>
 					<el-row style="margin-top: 12px;">
@@ -60,24 +60,28 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import moment from 'moment'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import SmallTitle from '@/components/small-title'
 import * as echarts from 'echarts'
 
 const tableConfigStatic = [
-	{ type: 'index', name: '序号' },
+	{ type: 'index', width: 100, name: i18n.t('index') },
-	{ name: '上片总数', prop: 'sumUp' },
+	{ name: i18n.t('pl.title'), prop: 'lineName' },
-	{ name: '下片总数', prop: 'sumDown' },
+	{ name: i18n.t('inspect.inTotal'), prop: 'sumUp' },
-	{ name: '检测总数', prop: 'sumCheck' },
+	{ name: i18n.t('inspect.outTotal'), prop: 'sumDown' },
-	{ name: '比例', prop: 'scrapRatio', filter: val => (val || val === 0 ? `${val}%` : '-') }
+	{ name: i18n.t('inspect.checkTotal'), prop: 'sumCheck' },
+	{ name: i18n.t('inspect.rate'), prop: 'scrapRatio', filter: val => (val || val === 0 ? `${val}%` : '-') }
 ]
 const tableConfigDynamic = [
-	{ type: 'index', name: '序号' },
+	{ type: 'index', width: 100, name: i18n.t('index') },
-	{ name: '检测类型', prop: 'inspectionContent' },
+	{ name: i18n.t('inspect.det'), prop: 'inspectionContent' },
 	/** dynamic */
-	{ name: '检测类型总数', prop: '' },
+	{ name: i18n.t('inspect.typetotal'), prop: '' },
-	{ name: '比例', prop: '' }
+	{ name: i18n.t('inspect.rate'), prop: '' }
 ]
 
 const FakeChart = {
@@ -98,19 +102,34 @@ const FakeChart = {
 	},
 	data() {
 		return {
+			calcMaxHeight,
 			chart: null,
 			defaultOpts: {
+				grid: {
+					left: '5%',
+					right: '12%',
+					top: '20%',
+					bottom: '10%'
+				},
 				title: {
-					text: '检测类型统计数据'
+					text: i18n.t('inspect.typeCount')
 				},
 				tooltip: {},
 				legend: {
 					orient: 'vertical',
+					type: 'scroll',
 					top: 10,
-					right: 20,
+					right: 0,
-					data: [
+					width: '12%',
-						/** dynamic */
+					/** 修复文本太长时显示问题 */
-					]
+					formatter: function(name) {
+						return echarts.format.truncateText(name, 120, '14px Microsoft Yahei', '...')
+					},
+					tooltip: {
+						show: true
+					},
+					/** end */
+					data: []
 				},
 				xAxis: {
 					data: [
@@ -188,7 +207,7 @@ const FakeChart = {
 	}
 }
 
-const dict = ['表格', '图形']
+const dict = [i18n.t('table2'), i18n.t('graph')]
 export default {
 	name: 'QualityInspectionCurrent',
 	components: { BaseTable, SmallTitle, FakeChart },
@@ -205,7 +224,7 @@ export default {
 			quickOptions: {
 				shortcuts: [
 					{
-						text: '今天',
+						text: i18n.t('today'),
 						onClick(picker) {
 							const baseTime = moment().set({ hour: 0, minute: 0, second: 0, millisecond: 0 })
 							const startTime = baseTime.format('yyyy-MM-DDTHH:mm:ss')
@@ -216,11 +235,25 @@ export default {
 				]
 			},
 			echartCategories: null,
-			echartCheckTypes: []
+			echartCheckTypes: [],
+			interval: null
 		}
 	},
 	mounted() {
 		this.getDataList()
+
+		this.interval = setInterval(() => {
+			this.$message.info(i18n.t('refresh'))
+			this.dataListStatic.splice(0)
+			this.dataListDynamic.splice(0)
+			this.getDataList()
+		}, 1000 * 5 * 60)
+	},
+	deactivated() {
+		if (this.interval) {
+			clearInterval(this.interval)
+			this.interval = null
+		}
 	},
 	methods: {
 		handleOperations() {},
@@ -229,7 +262,7 @@ export default {
 		},
 		getDataList() {
 			this.showGraph = false
-			this.dataType = '表格'
+			this.dataType = i18n.t('table2')
 			this.echartCategories = null
 			this.echartCheckTypes.splice(0)
 			/** 设置默认日期 */
@@ -246,12 +279,12 @@ export default {
 
 			/** [1] 获取上下片数据 */
 			this.fetchList('sx', startTime, endTime).then(({ data: res }) => {
-				console.log('sx: ', res)
+				// console.log('sx: ', res)
 				this.dataListStatic = res.data || []
 			})
 			/** [2] 获取产线检测类型 */
 			this.fetchList('pl', startTime, endTime).then(({ data: res }) => {
-				console.log('pl: ', res)
+				// console.log('pl: ', res)
 				/** TODO: 解析 nameData */
 				this.parseTableProps(res.data.nameData)
 
@@ -276,11 +309,11 @@ export default {
 			}
 
 			this.tableConfigDynamic = [
-				{ type: 'index', name: '序号' },
+				{ type: 'index', width: 100, name: i18n.t('index') },
-				{ name: '检测类型', prop: 'inspectionContent' },
+				{ name: i18n.t('inspect.det'), prop: 'inspectionContent' },
 				...subProps,
-				{ name: '检测类型总数', prop: 'sumInput' },
+				{ name: i18n.t('inspect.typetotal'), prop: 'sumInput' },
-				{ name: '比例', prop: 'scrapRatio', filter: val => (val || val === 0 ? `${val}%` : '-') }
+				{ name: i18n.t('inspect.rate'), prop: 'scrapRatio', filter: val => (val || val === 0 ? `${val}%` : '-') }
 			]
 
 			/** echarts related */

src/views/modules/monitoring/qualityInspectionDet.vue

@@ -1,37 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('inspect.det')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:qualityinspectiondet:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:qualityinspectiondet:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="typeId" header-align="center" align="center" label="检测类型id"> </el-table-column>
-			<el-table-column prop="content" header-align="center" align="center" label="检测内容"> </el-table-column>
-			<el-table-column prop="code" header-align="center" align="center" label="检测编码"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -43,45 +22,53 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
 // import AddOrUpdate from './qualityInspectionDet-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'typeName', name: '检测类型' },
+		type: 'index',
-	{ prop: 'content', name: '检测内容' },
+		name: i18n.t('index')
-	{ prop: 'code', name: '检测编码' },
+	},
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'typeName', name: i18n.t('inspect.type') },
+	{ prop: 'content', name: i18n.t('inspect.det') },
+	{ prop: 'code', name: i18n.t('inspect.code') },
+	{ prop: 'remark', name: i18n.t('remark') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/qualityInspectionDet',
 	fields: [
-		{ name: 'typeId', label: '检测类型', type: 'select', options: [] },
+		{ name: 'typeId', label: i18n.t('inspect.type'), required: true, type: 'select', options: [] },
-		{ name: 'content', label: '检测内容' },
+		{ name: 'content', label: i18n.t('inspect.det'), required: true },
-		{ name: 'code', label: '内容编码', api: '/monitoring/qualityInspectionDet/getCode' },
+		{ name: 'code', label: i18n.t('inspect.code'), api: '/monitoring/qualityInspectionDet/getCode' },
 		'remark'
 	],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/qualityInspectionDet', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/qualityInspectionDet', permission: 'monitoring:qualityinspectiondet:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/qualityInspectionDet', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/qualityInspectionDet', permission: 'monitoring:qualityinspectiondet:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			tableConfigs,
 			dataForm: {
@@ -105,6 +92,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取产检测类型列表
 		getInspectionTypeList() {
 			this.$http({
@@ -186,9 +179,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -198,7 +191,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/qualityInspectionRecord.vue

@@ -1,16 +1,29 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-select v-model="dataForm.lineId" :placeholder="$t('pl.title')" clearable filterable>
+					<el-option v-for="pl in plList" :key="pl.value" :value="pl.value" :label="pl.label" />
+				</el-select>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-input v-model="dataForm.key" :placeholder="$t('inspect.det')" clearable></el-input>
-				<el-button v-if="$hasPermission('monitoring:qualityinspectionrecord:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+			</el-form-item>
+			<el-form-item>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
+				<el-button v-if="$hasPermission('monitoring:qualityinspectionrecord:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table
+			:page="pageIndex"
+			:size="pageSize"
+			:data="dataList"
+			:table-head-configs="tableConfigs"
+			:max-height="calcMaxHeight(8)"
+			@operate-event="handleOperations"
+			@refreshDataList="getDataList"
+		/>
 
 		<el-pagination
 			@size-change="sizeChangeHandle"
@@ -29,74 +42,83 @@
 			ref="addOrUpdate"
 			:configs="addOrUpdateConfigs"
 			@refreshDataList="getDataList"
-			@destory-dialog="addOrUpdateVisible = false"
+			@destory-dialog="handleDestroyDialog"
 			@select-change="handleSelectChange"
 		/>
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
 // import AddOrUpdate from './qualityInspectionRecord-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
+		type: 'index',
+		name: i18n.t('index')
+	},
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
 	{
 		prop: 'inspectionDetContent',
-		name: '检测内容'
+		name: i18n.t('inspect.det')
-		// "name": "检测内容（设备推送消息时，可能无对应id，只填这个字段）"
 	},
-	{ prop: 'checkTime', name: '检测时间' },
+	{ prop: 'checkTime', name: i18n.t('inspect.time'), filter: timeFilter },
-	{ prop: 'productionId', name: '产线id' },
+	{ prop: 'productionName', name: i18n.t('pl.title') },
-	{ prop: 'sectionId', name: '工段id' },
+	{ prop: 'sectionName', name: i18n.t('ws.title') },
-	{ prop: 'checkPerson', name: '检测人员' },
+	// { prop: 'productionId', name: i18n.t('pl.id') },
-	// { prop: 'checkPerson', name: '检测人员，可以多个' },
+	// { prop: 'sectionId', name: i18n.t('ws.id') },
-	{ prop: 'source', name: '来源', filter: val => ({ 1: '手动', 2: '自动' }[val]) },
+	{ prop: 'checkPerson', name: i18n.t('inspect.people') },
-	// { prop: 'source', name: '来源 1，手动（默认） 2，自动' },
+	{ prop: 'source', name: i18n.t('source'), filter: val => ({ 1: i18n.t('manual'), 2: i18n.t('auto') }[val]) },
-	{ prop: 'explainText', name: '描述' },
+	{ prop: 'explainText', name: i18n.t('desc') },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'remark', name: i18n.t('remark') },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/qualityInspectionRecord',
 	fields: [
-		{ name: 'checkTime', label: '检测时间', type: 'date', props: { style: 'width: 100%', type: 'datetime' }, placeholder: '请选择检测时间' },
+		{ name: 'checkTime', required: true, label: i18n.t('inspect.time'), type: 'date', props: { style: 'width: 100%', type: 'datetime' }, placeholder: i18n.t('hints.checktime') },
-		{ name: 'productionId', label: '产线', type: 'select', options: [] },
+		{ name: 'productionId', required: true, label: i18n.t('pl.title'), type: 'select', options: [] },
-		{ name: 'sectionId', label: '工段', type: 'select', options: [] },
+		{ name: 'sectionId', required: true, label: i18n.t('ws.title'), type: 'select', options: [] },
 		{
 			name: 'source',
-			label: '来源',
+			label: i18n.t('source'),
 			type: 'select',
 			options: [
-				{ value: 1, label: '手动', default: true },
+				{ value: 1, label: i18n.t('manual'), default: true },
-				{ value: 2, label: '自动' }
+				{ value: 2, label: i18n.t('auto') }
 			]
 		},
-		{ name: 'inspectionDetId', label: '检测内容', type: 'select', options: [] },
+		{ name: 'inspectionDetId', required: true, label: i18n.t('inspect.det'), type: 'select', options: [] },
-		{ name: 'checkPerson', label: '检测人员' },
+		{ name: 'checkPerson', label: i18n.t('inspect.people') },
-		{ name: 'explainText', label: '描述' },
+		{ name: 'explainText', label: i18n.t('desc') },
 		'remark'
 	],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/qualityInspectionRecord', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/qualityInspectionRecord', permission: 'monitoring:qualityinspectionrecord:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/qualityInspectionRecord', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/qualityInspectionRecord', permission: 'monitoring:qualityinspectionrecord:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			tableConfigs,
 			dataForm: {
-				key: ''
+				key: '',
+				lineId: ''
 			},
+			plList: [],
 			dataList: [],
 			pageIndex: 1,
 			pageSize: 10,
@@ -117,6 +139,12 @@ export default {
 		this.getProductLines()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// handle
 		async handleSelectChange({ name, id }) {
 			if (name === 'productionId') {
@@ -145,18 +173,14 @@ export default {
 		// 获取产线
 		getProductLines() {
 			this.$http({
-				url: this.$http.adornUrl('/monitoring/productionLine/page'),
+				url: this.$http.adornUrl('/monitoring/productionLine/list'),
-				method: 'get',
+				method: 'get'
-				params: this.$http.adornParams({
-					// 	page: this.pageIndex,
-					// 	limit: this.pageSize,
-					// 	key: this.dataForm.key
-				})
 			}).then(({ data: res }) => {
 				const plOpt = this.addOrUpdateConfigs.fields.find(item => item.name === 'productionId')
 				if (plOpt) {
-					plOpt.options = res.data.list.map(item => ({ value: item.id, label: item.name })) || []
+					plOpt.options = res.data.map(item => ({ value: item.id, label: item.name })) || []
 				}
+				this.plList = res.data.map(item => ({ value: item.id, label: item.name })) || []
 			})
 		},
 		// 获取工段
@@ -175,9 +199,9 @@ export default {
 			}).then(({ data: res }) => {
 				if (this.addOrUpdateVisible) {
 					if (res.data.total === 0) {
-						this.$message.error('该产线没有工段')
+						this.$message.error(i18n.t('errors.nosection'))
 					} else {
-						this.$message.success(`该产线有 ${res.data.total} 条工段`)
+						this.$message.success(i18n.t('errors.numsection', { num: res.data.total }))
 					}
 				}
 				const wsOpt = this.addOrUpdateConfigs.fields.find(item => item.name === 'sectionId')
@@ -190,14 +214,22 @@ export default {
 		getDataList() {
 			this.addOrUpdateVisible = false
 			this.dataListLoading = true
+
+			const queryParams = {
+				page: this.pageIndex,
+				limit: this.pageSize
+			}
+
+			if (this.dataForm.key) {
+				queryParams['key'] = this.dataForm.key
+			}
+			if (this.dataForm.lineId) {
+				queryParams['lineId'] = this.dataForm.lineId
+			}
 			this.$http({
 				url: this.$http.adornUrl('/monitoring/qualityInspectionRecord/page'),
 				method: 'get',
-				params: this.$http.adornParams({
+				params: this.$http.adornParams(queryParams)
-					page: this.pageIndex,
-					limit: this.pageSize,
-					key: this.dataForm.key
-				})
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
 					this.dataList = data.data.list
@@ -246,9 +278,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -258,7 +290,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/qualityInspectionType.vue

@@ -1,36 +1,24 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('inspect.typename')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:qualityinspectiontype:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:qualityinspectiontype:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
+			:page="pageIndex"
-			<el-table-column prop="name" header-align="center" align="center" label="检测类型名称"> </el-table-column>
+			:size="pageSize"
-			<el-table-column prop="code" header-align="center" align="center" label="检测类型编码"> </el-table-column>
+			:data="dataList"
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
+			:table-head-configs="tableConfigs"
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
+			:max-height="calcMaxHeight(8)"
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
+			@operate-event="handleOperations"
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
+			@refreshDataList="getDataList"
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
+		/>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -42,43 +30,50 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
 // import AddOrUpdate from './qualityInspectionType-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
-
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'name', name: '检测类型名称' },
+		type: 'index',
-	{ prop: 'code', name: '检测类型编码' },
+		name: i18n.t('index')
-	{ prop: 'remark', name: '备注' },
+	},
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
+	{ prop: 'name', name: i18n.t('inspect.typename') },
+	{ prop: 'code', name: i18n.t('inspect.typecode') },
+	{ prop: 'remark', name: i18n.t('remark') },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/qualityInspectionType',
 	fields: [
-		{ name: 'name', label: '检测类型' },
+		{ name: 'name', label: i18n.t('inspect.type'), required: true },
-		{ name: 'code', label: '检测类型编码', api: '/monitoring/qualityInspectionType/getCode' },
+		{ name: 'code', label: i18n.t('inspect.typecode'), api: '/monitoring/qualityInspectionType/getCode' },
 		'remark'
 	],
 	operations: [
 		{ name: 'cancel', showAlways: true },
-		{ name: 'save', url: '/monitoring/qualityInspectionType', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/qualityInspectionType', permission: 'monitoring:qualityinspectiontype:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/qualityInspectionType', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/qualityInspectionType', permission: 'monitoring:qualityinspectiontype:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			addOrUpdateConfigs,
 			tableConfigs,
 			dataForm: {
@@ -101,6 +96,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible = false
+			}, /** after dialog animated */ 200)
+		},
 		// 获取数据列表
 		getDataList() {
 			this.addOrUpdateVisible = false
@@ -161,9 +162,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -173,7 +174,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/qualityinspectiondet-add-or-update.vue

@@ -1,157 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="检测类型id" prop="typeId">
-				<el-input v-model="dataForm.typeId" placeholder="检测类型id"></el-input>
-			</el-form-item>
-			<el-form-item label="检测内容" prop="content">
-				<el-input v-model="dataForm.content" placeholder="检测内容"></el-input>
-			</el-form-item>
-			<el-form-item label="检测编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="检测编码"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				typeId: '',
-				content: '',
-				code: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				typeId: [{ required: true, message: '检测类型id不能为空', trigger: 'blur' }],
-				content: [{ required: true, message: '检测内容不能为空', trigger: 'blur' }],
-				code: [{ required: true, message: '检测编码不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/qualityInspectionDet/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.typeId = data.qualityInspectionDet.typeId
-							this.dataForm.content = data.qualityInspectionDet.content
-							this.dataForm.code = data.qualityInspectionDet.code
-							this.dataForm.remark = data.qualityInspectionDet.remark
-							this.dataForm.valid = data.qualityInspectionDet.valid
-							this.dataForm.creatorId = data.qualityInspectionDet.creatorId
-							this.dataForm.creatorName = data.qualityInspectionDet.creatorName
-							this.dataForm.createTime = data.qualityInspectionDet.createTime
-							this.dataForm.updaterId = data.qualityInspectionDet.updaterId
-							this.dataForm.updaterName = data.qualityInspectionDet.updaterName
-							this.dataForm.updateTime = data.qualityInspectionDet.updateTime
-							this.dataForm.version = data.qualityInspectionDet.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/qualityInspectionDet/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						headers: { 'Content-Type': 'application/json' },
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							typeId: this.dataForm.typeId,
-							content: this.dataForm.content,
-							code: this.dataForm.code,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/qualityinspectionrecord-add-or-update.vue

@@ -1,191 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="检测内容id" prop="inspectionDetId">
-				<el-input v-model="dataForm.inspectionDetId" placeholder="检测内容id"></el-input>
-			</el-form-item>
-			<el-form-item label="检测内容（设备推送消息时，可能无对应id，只填这个字段）" prop="inspectionDetContent">
-				<el-input v-model="dataForm.inspectionDetContent" placeholder="检测内容（设备推送消息时，可能无对应id，只填这个字段）"></el-input>
-			</el-form-item>
-			<el-form-item label="产线id" prop="productionId">
-				<el-input v-model="dataForm.productionId" placeholder="产线id"></el-input>
-			</el-form-item>
-			<el-form-item label="工段id" prop="sectionId">
-				<el-input v-model="dataForm.sectionId" placeholder="工段id"></el-input>
-			</el-form-item>
-			<el-form-item label="检测人员，可以多个" prop="checkPerson">
-				<el-input v-model="dataForm.checkPerson" placeholder="检测人员，可以多个"></el-input>
-			</el-form-item>
-			<el-form-item label="检测时间" prop="checkTime">
-				<el-input v-model="dataForm.checkTime" placeholder="检测时间"></el-input>
-			</el-form-item>
-			<el-form-item label="来源 1，手动（默认） 2，自动" prop="source">
-				<el-input v-model="dataForm.source" placeholder="来源 1，手动（默认） 2，自动"></el-input>
-			</el-form-item>
-			<el-form-item label="描述" prop="explainText">
-				<el-input v-model="dataForm.explainText" placeholder="描述"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				inspectionDetId: '',
-				inspectionDetContent: '',
-				productionId: '',
-				sectionId: '',
-				checkPerson: '',
-				checkTime: '',
-				source: '',
-				explainText: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				inspectionDetId: [{ required: true, message: '检测内容id不能为空', trigger: 'blur' }],
-				inspectionDetContent: [{ required: true, message: '检测内容（设备推送消息时，可能无对应id，只填这个字段）不能为空', trigger: 'blur' }],
-				productionId: [{ required: true, message: '产线id不能为空', trigger: 'blur' }],
-				sectionId: [{ required: true, message: '工段id不能为空', trigger: 'blur' }],
-				checkPerson: [{ required: true, message: '检测人员，可以多个不能为空', trigger: 'blur' }],
-				checkTime: [{ required: true, message: '检测时间不能为空', trigger: 'blur' }],
-				source: [{ required: true, message: '来源 1，手动（默认） 2，自动不能为空', trigger: 'blur' }],
-				explainText: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/qualityInspectionRecord/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.inspectionDetId = data.qualityInspectionRecord.inspectionDetId
-							this.dataForm.inspectionDetContent = data.qualityInspectionRecord.inspectionDetContent
-							this.dataForm.productionId = data.qualityInspectionRecord.productionId
-							this.dataForm.sectionId = data.qualityInspectionRecord.sectionId
-							this.dataForm.checkPerson = data.qualityInspectionRecord.checkPerson
-							this.dataForm.checkTime = data.qualityInspectionRecord.checkTime
-							this.dataForm.source = data.qualityInspectionRecord.source
-							this.dataForm.explainText = data.qualityInspectionRecord.explainText
-							this.dataForm.remark = data.qualityInspectionRecord.remark
-							this.dataForm.valid = data.qualityInspectionRecord.valid
-							this.dataForm.creatorId = data.qualityInspectionRecord.creatorId
-							this.dataForm.creatorName = data.qualityInspectionRecord.creatorName
-							this.dataForm.createTime = data.qualityInspectionRecord.createTime
-							this.dataForm.updaterId = data.qualityInspectionRecord.updaterId
-							this.dataForm.updaterName = data.qualityInspectionRecord.updaterName
-							this.dataForm.updateTime = data.qualityInspectionRecord.updateTime
-							this.dataForm.version = data.qualityInspectionRecord.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/qualityInspectionRecord/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							inspectionDetId: this.dataForm.inspectionDetId,
-							inspectionDetContent: this.dataForm.inspectionDetContent,
-							productionId: this.dataForm.productionId,
-							sectionId: this.dataForm.sectionId,
-							checkPerson: this.dataForm.checkPerson,
-							checkTime: this.dataForm.checkTime,
-							source: this.dataForm.source,
-							explainText: this.dataForm.explainText,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/qualityinspectiontype-add-or-update.vue

@@ -1,149 +0,0 @@
-<template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
-		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
-			<el-form-item label="检测类型名称" prop="name">
-				<el-input v-model="dataForm.name" placeholder="检测类型名称"></el-input>
-			</el-form-item>
-			<el-form-item label="检测类型编码" prop="code">
-				<el-input v-model="dataForm.code" placeholder="检测类型编码"></el-input>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
-			</el-form-item>
-			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
-				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
-			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="创建时间" prop="createTime">
-				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
-			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
-			</el-form-item>
-			<el-form-item label="版本号" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
-			</el-form-item>
-		</el-form>
-		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
-		</span>
-	</el-dialog>
-</template>
-
-<script>
-export default {
-	data() {
-		return {
-			visible: false,
-			dataForm: {
-				id: 0,
-				name: '',
-				code: '',
-				remark: '',
-				valid: '',
-				creatorId: '',
-				creatorName: '',
-				createTime: '',
-				updaterId: '',
-				updaterName: '',
-				updateTime: '',
-				version: ''
-			},
-			dataRule: {
-				name: [{ required: true, message: '检测类型名称不能为空', trigger: 'blur' }],
-				code: [{ required: true, message: '检测类型编码不能为空', trigger: 'blur' }],
-				remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
-				valid: [{ required: true, message: '删除标志，是否有效:1 可用 0不可用不能为空', trigger: 'blur' }],
-				creatorId: [{ required: true, message: '创建人不能为空', trigger: 'blur' }],
-				creatorName: [{ required: true, message: '创建人姓名不能为空', trigger: 'blur' }],
-				createTime: [{ required: true, message: '创建时间不能为空', trigger: 'blur' }],
-				updaterId: [{ required: true, message: '更新人不能为空', trigger: 'blur' }],
-				updaterName: [{ required: true, message: '更新人姓名不能为空', trigger: 'blur' }],
-				updateTime: [{ required: true, message: '更新时间不能为空', trigger: 'blur' }],
-				version: [{ required: true, message: '版本号不能为空', trigger: 'blur' }]
-			}
-		}
-	},
-	methods: {
-		init(id) {
-			this.dataForm.id = id || 0
-			this.visible = true
-			this.$nextTick(() => {
-				this.$refs['dataForm'].resetFields()
-				if (this.dataForm.id) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/qualityInspectionType/${this.dataForm.id}`),
-						method: 'get',
-						params: this.$http.adornParams()
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.dataForm.name = data.qualityInspectionType.name
-							this.dataForm.code = data.qualityInspectionType.code
-							this.dataForm.remark = data.qualityInspectionType.remark
-							this.dataForm.valid = data.qualityInspectionType.valid
-							this.dataForm.creatorId = data.qualityInspectionType.creatorId
-							this.dataForm.creatorName = data.qualityInspectionType.creatorName
-							this.dataForm.createTime = data.qualityInspectionType.createTime
-							this.dataForm.updaterId = data.qualityInspectionType.updaterId
-							this.dataForm.updaterName = data.qualityInspectionType.updaterName
-							this.dataForm.updateTime = data.qualityInspectionType.updateTime
-							this.dataForm.version = data.qualityInspectionType.version
-						}
-					})
-				}
-			})
-		},
-		// 表单提交
-		dataFormSubmit() {
-			this.$refs['dataForm'].validate(valid => {
-				if (valid) {
-					this.$http({
-						url: this.$http.adornUrl(`/monitoring/qualityInspectionType/${!this.dataForm.id ? '' : this.dataForm.id}`),
-						method: this.dataForm.id ? 'put' : 'post',
-						data: this.$http.adornData({
-							id: this.dataForm.id || undefined,
-							name: this.dataForm.name,
-							code: this.dataForm.code,
-							remark: this.dataForm.remark,
-							valid: this.dataForm.valid,
-							creatorId: this.dataForm.creatorId,
-							creatorName: this.dataForm.creatorName,
-							createTime: this.dataForm.createTime,
-							updaterId: this.dataForm.updaterId,
-							updaterName: this.dataForm.updaterName,
-							updateTime: this.dataForm.updateTime,
-							version: this.dataForm.version
-						})
-					}).then(({ data }) => {
-						if (data && data.code === 0) {
-							this.$message({
-								message: '操作成功',
-								type: 'success',
-								duration: 1500,
-								onClose: () => {
-									this.visible = false
-									this.$emit('refreshDataList')
-								}
-							})
-						} else {
-							this.$message.error(data.msg)
-						}
-					})
-				}
-			})
-		}
-	}
-}
-</script>

src/views/modules/monitoring/realtimeEquipment.vue

@@ -0,0 +1,208 @@
+<!--
+ * @Author: lb
+ * @Date: 2022-06-22 14:00:17
+ * @LastEditors: lb
+ * @LastEditTime: 2022-06-22 14:00:17
+ * @Description: 设备生产实时数据
+-->
+<template>
+	<div>
+		<div class="app-container">
+			<small-title :size="'md'">{{ $t('realtime.eq') }}</small-title>
+			<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" :span-method="spanMethod" />
+		</div>
+	</div>
+</template>
+
+<script>
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+import SmallTitle from '@/components/small-title'
+import moment from 'moment'
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+export default {
+	name: 'RealtimeDataOfEquipment',
+	components: { BaseTable, SmallTitle },
+	data() {
+		return {
+			calcMaxHeight,
+			loadTable: false,
+			tableProps: [{ label: 'default', prop: 'default' }],
+			stepOneArray: [],
+			tableData: [],
+			testData: null,
+			equipmentCount: {}, // 每个产线的设备数量记录
+			dynamicPropSet: false, // 是否设置过动态prop
+			listLoading: false,
+			rowNum: 0,
+			intervalId: null
+		}
+	},
+	created() {
+		this.clearData()
+		this.fetchList().then(({ data: res }) => {
+			this.testData = res.data.filter(item => !!item.equDet)
+			this.handleData()
+		})
+		this.intervalId = setInterval(() => {
+			this.$message({
+				message: this.$t('realtime.refresh'),
+				type: 'warning',
+				duration: 1500,
+				onClose: () => {
+					this.clearData()
+					this.fetchList().then(({ data: res }) => {
+						this.testData = res.data.filter(item => !!item.equDet)
+						this.handleData()
+					})
+				}
+			})
+		}, 1000 * 60 * 5)
+	},
+	// beforeDestroy() {
+	// 	console.log('before destroyed...')
+	// 	if (this.intervalId) clearInterval(this.intervalId)
+	// },
+	deactivated() {
+		if (this.intervalId) clearInterval(this.intervalId)
+	},
+	methods: {
+		clearData() {
+			this.tableData.splice(0)
+			this.tableProps.splice(0)
+			this.stepOneArray.splice(0)
+			this.dynamicPropSet = false
+			this.rowNum = 0
+			this.testData = null
+			this.loadTable = false
+			this.equipmentCount = {}
+			this.setStaticTableProps()
+		},
+
+		handleData() {
+			this.expandDataStepOne()
+			this.expandDataStepTwo()
+			this.loadTable = true
+		},
+
+		fetchList() {
+			// 获取设备实时数据
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/productionMonitoring/equipmentProductionRealTimeData'),
+				method: 'post'
+			})
+		},
+
+		expandDataStepOne() {
+			// console.log('testdata: ', this.testData)
+			this.stepOneArray = this.testData.map(item => {
+				if (item.equDet) {
+					item.equDet.forEach((equipment, index) => {
+						equipment.lineName = item.lineName
+					})
+				}
+				return item.equDet
+			})
+		},
+
+		expandDataStepTwo() {
+			// 扩展服务器返回的数据第二阶段
+			this.rowNum = 0
+
+			this.stepOneArray.forEach(line => {
+				let avaliableEquipmentCount = 0
+
+				line.forEach(equipment => {
+					const newItem = {
+						equId: equipment.equId,
+						lineName: equipment.lineName,
+						equName: equipment.equName,
+						externalCode: equipment.externalCode,
+						totalProduction: equipment.totalProduction ?? '-'
+					}
+
+					if (equipment.det) {
+						avaliableEquipmentCount += 1
+						equipment.det.forEach(obj => {
+							if (!this.dynamicPropSet) {
+								if (obj.recordTime) {
+									// 如果 obj.recordTime 是有效的
+									this.tableProps.push({
+										label: moment(obj.recordTime).format('YYYY-MM-DD HH:mm:ss'),
+										children: [
+											{ prop: obj.recordTime + '-inputNum', label: i18n.t('realtime.in') },
+											{ prop: obj.recordTime + '-outputNum', label: i18n.t('realtime.out') },
+											{ prop: obj.recordTime + '-scrapNum', label: i18n.t('realtime.data') },
+											{ prop: obj.recordTime + '-scrapRate', label: i18n.t('realtime.rate'), filter: val => (val !== '-' ? `${val.toFixed(2)}%` : '-') }
+										]
+									})
+								}
+							}
+
+							Object.defineProperty(newItem, obj.recordTime + '-inputNum', {
+								value: obj.inputNum ?? '-',
+								enumerable: true,
+								writable: true
+							})
+							Object.defineProperty(newItem, obj.recordTime + '-outputNum', {
+								value: obj.outputNum ?? '-',
+								enumerable: true,
+								writable: true
+							})
+							Object.defineProperty(newItem, obj.recordTime + '-scrapNum', {
+								value: obj.scrapNum ?? '-',
+								enumerable: true,
+								writable: true
+							})
+							Object.defineProperty(newItem, obj.recordTime + '-scrapRate', {
+								value: obj.scrapRate ?? '-',
+								enumerable: true,
+								writable: true
+							})
+							Object.defineProperty(newItem, 'recordTime', {
+								value: obj.recordTime,
+								enumerable: true,
+								writable: true
+							})
+						})
+
+						if (!this.dynamicPropSet) this.dynamicPropSet = true
+						this.tableData.push(newItem)
+					}
+				})
+				this.$set(this.equipmentCount, [this.rowNum], avaliableEquipmentCount)
+				this.rowNum += avaliableEquipmentCount
+			})
+		},
+
+		setStaticTableProps() {
+			// Step1: 设置静态的 table props
+			const staticTableProps = [
+				{ prop: 'lineName', label: i18n.t('pl.title'), fixed: true },
+				{ prop: 'equName', label: i18n.t('equipment'), fixed: true },
+				{ prop: 'totalProduction', label: i18n.t('realtime.total'), fixed: true }
+			]
+			this.tableProps = staticTableProps
+		},
+
+		spanMethod({ row, column, rowIndex, columnIndex }) {
+			// 设置合并行列的方式
+			if (columnIndex === 0) {
+				if (this.equipmentCount[rowIndex]) {
+					// 如果找到需要合并的行号
+					return {
+						rowspan: this.equipmentCount[rowIndex],
+						colspan: 1
+					}
+				} else {
+					return {
+						rowspan: 0,
+						colspan: 0
+					}
+				}
+			}
+		}
+	}
+}
+</script>

src/views/modules/monitoring/realtimeProductLine.vue

@@ -0,0 +1,165 @@
+<!--
+ * @Author: lb
+ * @Date: 2022-06-22 14:00:17
+ * @LastEditors: lb
+ * @LastEditTime: 2022-06-22 14:00:17
+ * @Description: 产线生产实时数据
+-->
+<template>
+	<div>
+		<div class="app-container">
+			<small-title :size="'md'">{{ $t('realtime.pl') }}</small-title>
+			<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" />
+		</div>
+	</div>
+</template>
+
+<script>
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+import SmallTitle from '@/components/small-title'
+import moment from 'moment'
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+export default {
+	name: 'RealtimeDataOfLine',
+	components: { BaseTable, SmallTitle },
+	data() {
+		return {
+			calcMaxHeight,
+			loadTable: false,
+			dynamicPropSet: false,
+			tableProps: [{ label: 'default', prop: 'default' }],
+			tableData: [],
+			testData: null,
+			listLoading: false,
+			intervalId: null
+		}
+	},
+
+	mounted() {
+		this.clearData()
+		this.fetchList().then(({ data: res }) => {
+			// console.log('fetchlist:', res)
+			this.testData = res
+			this.handleData()
+		})
+
+		this.intervalId = setInterval(() => {
+			this.$message({
+				message: this.$t('realtime.refresh'),
+				type: 'warning',
+				onClose: () => {
+					this.clearData()
+					this.fetchList().then(({ data: res }) => {
+						this.testData = res
+						this.handleData()
+					})
+				}
+			})
+		}, 1000 * 60 * 5)
+	},
+
+	deactivated() {
+		if (this.intervalId) clearInterval(this.intervalId)
+	},
+
+	methods: {
+		fetchList() {
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/productionMonitoring/lineProductionRealTimeData'),
+				method: 'post'
+			})
+		},
+
+		clearData() {
+			this.dynamicPropSet = false
+			this.loadTable = false
+			this.testData = null
+			this.tableData.splice(0)
+			this.tableProps.splice(0)
+			this.setStaticTableProps()
+		},
+
+		handleData() {
+			this.expandDataStepOne()
+			// this.expandDataStepTwo()
+			if (this.tableData.length > 0) this.loadTable = true
+			else {
+				this.$message({
+					message: i18n.t('errors.nodata'),
+					type: 'info',
+					duration: 2000
+				})
+			}
+		},
+
+		expandDataStepOne() {
+			// 扩展服务器返回的数据第一阶段
+			// console.log('create new one')
+			this.tableData = this.testData.data.map(item => {
+				const newItem = {
+					lineName: item.lineName,
+					orderName: item.orderName,
+					productSize: item.productSize ?? '-'
+				}
+
+				if (item.det) {
+					item.det.forEach(obj => {
+						// Step2: 设置动态props
+						if (!this.dynamicPropSet) {
+							this.tableProps.push({
+								label: moment(obj.recordTime).format('YYYY-MM-DD HH:mm:ss'),
+								children: [
+									{ prop: obj.recordTime + '-inputNum', label: i18n.t('realtime.in') },
+									{ prop: obj.recordTime + '-outputNum', label: i18n.t('realtime.out') },
+									// { prop: obj.recordTime + '-passArea', label: i18n.t('realtime.goodrate') },
+									// { prop: obj.recordTime + '-scrapNum', label: i18n.t('realtime.num') },
+									// { prop: obj.recordTime + '-scrapRate', label: i18n.t('realtime.rate') }
+								]
+							})
+						}
+
+						Object.defineProperty(newItem, obj.recordTime + '-inputNum', {
+							value: obj.inputNum ?? '-',
+							enumerable: true,
+							writable: true
+						})
+						Object.defineProperty(newItem, obj.recordTime + '-outputNum', {
+							value: obj.outputNum ?? '-',
+							enumerable: true,
+							writable: true
+						})
+						Object.defineProperty(newItem, obj.recordTime + '-scrapNum', {
+							value: obj.scrapNum ?? '-',
+							enumerable: true,
+							writable: true
+						})
+
+						const scrapRate = obj.scrapRate ?? '-'
+						Object.defineProperty(newItem, obj.recordTime + '-scrapRate', {
+							value: scrapRate === '-' ? '-' : scrapRate * 100 + '%',
+							enumerable: true,
+							writable: true
+						})
+						Object.defineProperty(newItem, obj.recordTime + '-passArea', {
+							value: obj.passArea ?? '-',
+							enumerable: true,
+							writable: true
+						})
+					})
+
+					this.dynamicPropSet = true
+					return newItem
+				}
+			})
+		},
+
+		setStaticTableProps() {
+			// Step1: 设置静态的 table props
+			const staticTableProps = [{ prop: 'lineName', label: i18n.t('pl.title'), fixed: true }]
+			this.tableProps = staticTableProps
+		}
+	}
+}
+</script>

src/views/modules/monitoring/realtimeQualityInspection.vue

@@ -0,0 +1,152 @@
+<template>
+	<div>
+		<div class="app-container">
+			<small-title :size="'md'">{{ $t('realtime.inspect') }}</small-title>
+			<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" />
+		</div>
+	</div>
+</template>
+
+<script>
+// @ts-nocheck
+/* eslint-disable */
+import i18n from '@/i18n'
+import BaseTable from '@/components/base-table'
+import SmallTitle from '@/components/small-title'
+import moment from 'moment'
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
+
+// tslint: disable
+export default {
+	name: 'RealtimeDataOfTeam',
+	components: { BaseTable, SmallTitle },
+	data() {
+		return {
+			calcMaxHeight,
+			loadTable: false,
+			// dynamicPropSet: false,
+			tableProps: [{ label: 'default', prop: 'default' }],
+			tableData: [],
+			testData: null,
+			listLoading: false,
+			intervalId: null
+		}
+	},
+
+	mounted() {
+		this.clearData()
+
+		this.fetchList().then(({ data: res }) => {
+			this.testData = res
+			this.handleData()
+		})
+
+		this.intervalId = setInterval(() => {
+			this.$message({
+				message: this.$t('realtime.refresh'),
+				type: 'warning',
+				onClose: () => {
+					this.clearData()
+					this.fetchList().then(({ data: res }) => {
+						this.testData = res
+						this.handleData()
+					})
+				}
+			})
+		}, 1000 * 60 * 5)
+	},
+
+	deactivated() {
+		if (this.intervalId) clearInterval(this.intervalId)
+	},
+
+	methods: {
+		fetchList() {
+			// 获取质量数据
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/productionMonitoring/qualityInspectionRealTimeData'),
+				method: 'post'
+			})
+		},
+
+		clearData() {
+			this.loadTable = false
+			this.testData = null
+			this.tableData.splice(0)
+			this.tableProps.splice(0)
+		},
+
+		handleData() {
+			// console.log('testData ===> ', this.testData)
+			this.initProps()
+			// console.log('props ===> ', this.tableProps)
+			this.initData()
+			// console.log('datas ===> ', this.tableData)
+			this.loadTable = true
+		},
+
+		handleRow(data) {
+			// data: { data:[], checkType: '' }
+			const item = {}
+			item.checkType = data.checkType
+
+			data.data.forEach(timepoint => {
+				if (timepoint.children && timepoint.children.length) {
+					timepoint.children.forEach(line => {
+						// item[timepoint.dynamicValue + line.dynamicName] = line.dynamicValue
+						item[timepoint.dynamicName + line.dynamicName] = line.dynamicValue
+					})
+				}
+			})
+
+			return item
+		},
+
+		initData() {
+			this.tableData = this.testData.data.data.map(row => this.handleRow(row))
+		},
+
+		initProps() {
+			this.tableProps = this.handlePropsEntry(this.testData.data.nameData)
+		},
+
+		handlePropsEntry(nameData) {
+			const dynamicPropNames = []
+			const timeMap = {}
+
+			const parentNode = nameData.filter(item => item.tree === 1)
+			const childNode = nameData.filter(item => item.tree === 2)
+
+			const handleChild = function(prop) {
+				const time = parentNode.find(item => item.id === prop.parentId).name
+				// 填充 timeMap
+				timeMap[time] = timeMap[time] ? timeMap[time] : {}
+				timeMap[time][prop.name] = true
+			}
+
+			childNode.forEach(item => {
+				handleChild(item)
+			})
+
+			// 对键值排序（时间排序）
+			const sortedTime = Object.keys(timeMap).sort((a, b) => {
+				if (moment(a).isBefore(b)) return -1
+				else return 1
+			})
+
+			// 保存为 props
+			for (const key of sortedTime) {
+				// const prop = { label: key, children: [] }
+				const prop = { label: moment(key).format('YYYY-MM-DD HH:mm:ss'), children: [] }
+				for (const subKey in timeMap[key]) {
+					prop.children.push({ label: subKey, prop: key + subKey })
+				}
+				dynamicPropNames.push(prop)
+			}
+
+			return [{ prop: 'checkType', label: i18n.t('inspect.type'), isFixed: true }, ...dynamicPropNames]
+		}
+	}
+}
+</script>

src/views/modules/monitoring/reportCategory.vue

@@ -1,16 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.name" :placeholder="$t('categoryName')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:reportsheetcategory:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:reportsheetcategory:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" />
 
 		<el-pagination
 			@size-change="sizeChangeHandle"
@@ -23,49 +23,48 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
 // import AddOrUpdate from './reportSheetCategory-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 // import TableTextComponent from '@/components/base-table/components/detailComponent'
-
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 const tableConfigs = [
-	{ prop: 'createTime', name: '添加时间' },
+	{
-	{ prop: 'name', name: '分类名称' },
+		type: 'index',
-	// { prop: 'code', name: '分类编码' },
+		name: i18n.t('index')
-	// 'description',
+	},
-	// 'remark',
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'operations', name: '操作', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+	{ prop: 'name', name: i18n.t('categoryName') },
+	{ prop: 'operations', name: i18n.t('handle'), width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
 	infoUrl: '/monitoring/reportSheetCategory',
-	fields: [
+	fields: [{ name: 'name', label: i18n.t('categoryName'), required: true, span: 24 }],
-		{ name: 'name', label: '分类名称', required: true, span: 24 },
-		// { name: 'code', label: '分类编码', required: true },
-		// { name: 'description', label: '描述' },
-		// { name: 'remark', label: '备注' }
-	],
 	operations: [
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/reportSheetCategory', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/reportSheetCategory', permission: 'monitoring:reportsheetcategory:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/reportSheetCategory', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/reportSheetCategory', permission: 'monitoring:reportsheetcategory:update', showOnEdit: true }
 	]
 }
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			tableConfigs,
 			addOrUpdateConfigs,
 			dataForm: {
-				key: ''
+				name: ''
 			},
 			dataList: [],
 			pageIndex: 1,
@@ -84,6 +83,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		handleOperations({ type, data: id }) {
 			switch (type) {
 				case 'edit':
@@ -101,7 +106,7 @@ export default {
 				params: this.$http.adornParams({
 					page: this.pageIndex,
 					limit: this.pageSize,
-					key: this.dataForm.key
+					name: this.dataForm.name
 				})
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
@@ -143,9 +148,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -155,7 +160,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/reportDesign.vue

@@ -11,8 +11,10 @@ export default {
 		return {
 			loading: true,
 			// url: process.env.VUE_APP_REPORT_DESIGN_URL
-			url: window.SITE_CONFIG['apiURL'] + '/yd-monitor/ureport/designer'
+			// url: window.SITE_CONFIG['apiURL'] + this.$http.adornUrl('/ureport/designer')
 			// url: this.$http.adornUrl('/ureport/designer')
+			// url: (process.env.NODE_ENV === 'production' ? '/api' : '/yd-monitor') + '/ureport/designer'
+			url: '/api/ureport/designer'
 		}
 	},
 	mounted() {
@@ -22,9 +24,7 @@ export default {
 		this.url += name ? '?_u=db:' + this.$route.query.name : ''
 		const ifream = document.getElementById('zgboke')
 
-    console.log('url: ', this.url)
 		ifream.onload = function() {
-			console.log('加载完成')
 			vm.loading = false
 		}
 	},

src/views/modules/monitoring/reportDetail.vue

@@ -1,16 +1,17 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.name" :placeholder="$t('report.name')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('')" type="primary" @click="addOrUpdateHandle()">新增(跳到设计)</el-button>
+				<!-- <el-button v-if="$hasPermission('')" type="primary" @click="addOrUpdateHandle()">新增(跳到设计)</el-button> -->
+				<el-button v-if="$hasPermission('monitoring:reportsheet:save')" type="primary" @click="handleAdd()">{{ $t('add') }}</el-button>
 			</el-form-item>
 		</el-form>
 
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
+		<base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="500" @operate-event="handleOperations" @refreshDataList="getDataList" />
 
 		<el-pagination
 			@size-change="sizeChangeHandle"
@@ -23,13 +24,16 @@
 		>
 		</el-pagination>
 		<!-- 弹窗, 新增 / 修改 -->
-		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="addOrUpdateVisible = false" />
+		<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" :configs="addOrUpdateConfigs" @refreshDataList="getDataList" @destory-dialog="handleDestroyDialog" />
 	</div>
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 // import AddOrUpdate from './equipmentPlcConnect-add-or-update'
 import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import axios from '@/utils/request'
@@ -44,87 +48,46 @@ const CategoryList = {
 		}
 	},
 	data() {
-		return {
+		return { calcMaxHeight, pickedId: null }
-			pickedId: null
-		}
 	},
 	mounted() {
+		console.log(this.injectData)
 		this.pickedId = this.injectData[this.injectData.head.prop]
-		console.log('picked id : ', this.pickedId)
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		handleChange(id) {
 			this.pickedId = id
-			this.$emit('emit-data', { id })
+			this.$emit('emit-data', {
+				type: 'change-category',
+				data: { id: this.injectData.id, fileName: this.injectData.fileName, name: this.injectData.name, url: this.injectData.url, categoryId: id }
+			})
 		}
 	},
 	render: function(h) {
 		const childOptions = []
 		this.injectData.head.options?.forEach(item => {
-      console.log('item', item)
+			console.log('item', item.value)
-			childOptions.push(h('el-option', { props: { label: item.label, value: item.value } }, null)) // TODO：<=== 去他妈的
+			childOptions.push(h('el-option', { props: { label: item.label, value: item.value } }, null))
 		})
-		return h('el-select', { on: { change: this.handleChange } }, childOptions)
+		return h('el-select', { props: { value: this.pickedId }, on: { change: this.handleChange } }, childOptions)
 	}
 }
 
 const addOrUpdateConfigs = {
 	type: 'dialog',
-	infoUrl: '/monitoring/equipmentPlcConnect',
+	infoUrl: '/monitoring/reportSheet',
-	fields: [
+	fields: [{ name: 'fileName', label: i18n.t('report.name'), required: true, span: 24 }],
-		{ name: 'equipmentId', label: '设备', required: true, type: 'select', options: [] },
-		{ name: 'plcId', label: 'PLC名称', required: true, type: 'select', options: [] }
-	],
 	operations: [
 		{ name: 'cancel', url: true, showAlways: true },
-		{ name: 'save', url: '/monitoring/equipmentPlcConnect', permission: '', showOnEdit: false },
+		{ name: 'save', url: '/monitoring/reportSheet', permission: 'monitoring:reportsheet:save', showOnEdit: false },
-		{ name: 'update', url: '/monitoring/equipmentPlcConnect', permission: '', showOnEdit: true }
+		{ name: 'update', url: '/monitoring/reportSheet', permission: 'monitoring:reportsheet:update', showOnEdit: true }
-	],
+	]
-	subtable: {
-		title: 'PLC采集参数',
-		url: '/monitoring/equipmentPlcParam',
-		relatedField: 'plcConId',
-		tableConfigs: [
-			{ type: 'index', name: '序号' },
-			// { prop: 'plcConId', name: 'plc连接表ID' },
-			{ prop: 'paramCode', name: '参数编码', formField: true, rules: [{ required: true, message: '必填', trigger: 'blur' }] },
-			{ prop: 'paramName', name: '参数名称', formField: true, rules: [{ required: true, message: '必填', trigger: 'blur' }] },
-			{ prop: 'paramAddress', name: '参数地址', formField: true },
-			{ prop: 'description', name: '描述', formField: true },
-			{
-				prop: 'enabled',
-				name: '启用状态',
-				filter: val => ['停用', '启用'][+val],
-				// filter: val => ({0:'停用', 1:'启用'}[+val]),
-				rules: [{ required: true, message: '必填', trigger: 'blur' }],
-				formField: true,
-				formType: 'select',
-				formOptions: [
-					{ value: 0, label: '停用' },
-					{ value: 1, label: '启用' }
-				]
-			},
-			{ prop: 'remark', name: '备注', formField: true },
-			// { prop: 'createTime', name: '添加时间' },
-			{
-				prop: 'collection',
-				name: '是否采集',
-				filter: val => ['不采集', '采集'][+val],
-				rules: [{ required: true, message: '必填', trigger: 'blur' }],
-				formField: true,
-				formType: 'select',
-				formOptions: [
-					{ value: 0, label: '不采集' },
-					{ value: 1, label: '采集' }
-				]
-			},
-			// { prop: 'collectionCycle', name: '采集周期（s） 暂不使用' },
-			// { prop: 'reportingCycle', name: '上报周期（s） 暂不使用' },
-			// { prop: 'reportingMethod', name: '上报方式 暂不使用' },
-			// { prop: 'reportingCode', name: '上报编码 暂不使用' },
-			{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
-		]
-	}
 }
 
 export default {
@@ -133,7 +96,7 @@ export default {
 			addOrUpdateConfigs,
 			tableConfigs: [],
 			dataForm: {
-				key: ''
+				name: ''
 			},
 			dataList: [],
 			pageIndex: 1,
@@ -149,46 +112,95 @@ export default {
 		BaseTable
 	},
 	activated() {
+		this.dataList.splice(0)
 		this.getAllCategories()
 		this.getDataList()
 	},
-	computed: {
+	computed: {},
-		trueTableConfigs() {}
-	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		getAllCategories() {
 			axios.get(axios.adornUrl('/monitoring/reportSheetCategory/page')).then(({ data: res }) => {
 				if (res.data && res.data.list) {
 					const categories = res.data.list.map(item => ({ label: item.name, value: item.id }))
-					console.log('categories', categories)
 					this.tableConfigs = [
-						{ type: 'index', name: '序号' },
+						{ type: 'index', width: 100, name: i18n.t('index') },
-						{ prop: 'fileName', name: '报表名称' },
+						{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter, width: 200 },
-						{ prop: 'category', name: '报表分类', subcomponent: CategoryList, options: categories },
+						{ prop: 'fileName', name: i18n.t('report.name') },
-						{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
+						{ prop: 'category', name: i18n.t('report.type'), subcomponent: CategoryList, options: categories },
+						{
+							prop: 'operations',
+							name: i18n.t('handle'),
+							fixed: 'right',
+							// width: 180,
+							subcomponent: TableOperateComponent,
+							options: [{ name: 'preview', emitField: 'fileName' }, { name: 'design', emitField: 'name' }, 'edit', 'delete']
+						}
 					]
 				}
 			})
 		},
-		handleOperations({ type, data: id }) {
+		handleOperations({ type, data }) {
+			console.log('operation data: ', data)
+			let id = data
 			switch (type) {
+				case 'change-category':
+					return this.updateCategory(data)
 				case 'edit':
 					return this.addOrUpdateHandle(id)
 				case 'delete':
 					return this.deleteHandle(id)
+				case 'design':
+					return this.$router.push({
+						name: 'monitoring-reportDesign',
+						query: {
+							// data 的数据是 emitField 的值
+							name: data
+						}
+					})
+				case 'preview':
+					return this.$router.push({
+						name: 'monitoring-reportPreview',
+						query: {
+							name: data
+						}
+					})
 			}
 		},
+		updateCategory({ id, fileName, categoryId }) {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/reportSheet'),
+				method: 'put',
+				data: {
+					id,
+					fileName,
+					category: categoryId
+				}
+			}).then(({ data: res }) => {
+				this.$message.success(i18n.t('success'))
+			})
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
+
+			const queries = {
+				page: this.pageIndex,
+				limit: this.pageSize,
+				name: this.dataForm.name
+			}
+			if (this.$route.query.category) {
+				queries['category'] = this.$route.query.category
+			}
 			this.$http({
 				url: this.$http.adornUrl('/monitoring/reportSheet/page'),
 				method: 'get',
-				params: this.$http.adornParams({
+				params: this.$http.adornParams(queries)
-					page: this.pageIndex,
-					limit: this.pageSize,
-					key: this.dataForm.key
-				})
 			}).then(({ data }) => {
 				if (data && data.code === 0) {
 					this.dataList = data.data.list
@@ -215,8 +227,14 @@ export default {
 		selectionChangeHandle(val) {
 			this.dataListSelections = val
 		},
-		// 新增 / 修改
+		// 新增 - 跳转到设计
+		handleAdd() {
+			this.$router.push({
+				name: 'monitoring-reportDesign'
+			})
+		},
 		addOrUpdateHandle(id) {
+			console.log('edit:', id)
 			this.addOrUpdateVisible = true
 			this.$nextTick(() => {
 				this.$refs.addOrUpdate.init(id)
@@ -229,9 +247,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -241,7 +259,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/reportList.vue

@@ -5,7 +5,7 @@
 				<div class="sort-item-box">
 					<div class="sort-item-box-top">
 						<!-- <p>{{ $t('module.report.reportSort.all') }}</p> -->
-						<p>全部</p>
+						<p>{{ $t('all') }}</p>
 					</div>
 					<div class="sort-item-box-bottom">{{ allNum }} {{ allNum > 1 ? 'Reports' : 'Report' }}</div>
 				</div>
@@ -25,13 +25,7 @@
 <script>
 export default {
 	data() {
-		return {
+		return { dataList: [], pageIndex: 1, pageSize: 10, totalPage: 0, allNum: 0 }
-			dataList: [],
-			pageIndex: 1,
-			pageSize: 10,
-			totalPage: 0,
-			allNum: 0
-		}
 	},
 	created() {
 		this.getDataList()
@@ -44,12 +38,12 @@ export default {
 				method: 'get',
 				params: {}
 			}).then(({ data: res }) => {
-        this.allNum = 0
+				this.allNum = 0
 				if (res.data) {
 					this.dataList = res.data
-          res.data.forEach(item => {
+					res.data.forEach(item => {
-            this.allNum += item.quantity 
+						this.allNum += item.quantity
-          })
+					})
 				} else this.dataList.splice(0)
 			})
 		},
@@ -58,7 +52,7 @@ export default {
 			this.$router.push({
 				name: 'monitoring-reportDetail',
 				query: {
-					sortId: id
+					category: id
 				}
 			})
 		}

src/views/modules/monitoring/reportPreview.vue

@@ -7,20 +7,24 @@
 -->
 <template>
 	<div v-loading="loading" :class="$style.container">
-		<h1 >{{ $route.query.name }}</h1>
+		<small-title :size="'md'" style="margin-bottom: 10px">{{ $t('report.name') + ': ' + $route.query.name }}</small-title>
 
 		<iframe id="reportView" :class="$style.mainIframe" name="mainIframe" :src="url" frameborder="0" scrolling="auto" />
 	</div>
 </template>
 <script>
+import SmallTitle from '@/components/small-title'
+
 export default {
-	components: {},
+	components: { SmallTitle },
 	props: {},
 	data() {
 		return {
 			loading: true,
 			// url: process.env.VUE_APP_REPORT_VIEW_URL
-			url: window.SITE_CONFIG['apiURL'] + '/yd-monitor/ureport/preview'
+			// url: window.SITE_CONFIG['apiURL'] + this.$http.adornUrl('/ureport/preview')
+			// url: (process.env.NODE_ENV === 'production' ? '/api' : '/yd-monitor') + '/ureport/preview'
+			url: '/api/ureport/preview'
 		}
 	},
 	mounted() {
@@ -50,7 +54,6 @@ export default {
 		}
 		const ifream = document.getElementById('reportView')
 		ifream.onload = function() {
-			console.log('加载完成')
 			vm.loading = false
 		}
 	},

src/views/modules/monitoring/reportSheet-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="分类：关联report_sheet_category" prop="category">
 				<el-input v-model="dataForm.category" placeholder="分类：关联report_sheet_category"></el-input>
@@ -16,8 +16,8 @@
 			<el-form-item label="链接地址" prop="url">
 				<el-input v-model="dataForm.url" placeholder="链接地址"></el-input>
 			</el-form-item>
-			<el-form-item label="描述" prop="description">
+			<el-form-item :label="$t('desc')" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
+				<el-input v-model="dataForm.description" :placeholder="$t('desc')"></el-input>
 			</el-form-item>
 			<el-form-item label="启用状态:0 、停用，1、启用" prop="enabled">
 				<el-input v-model="dataForm.enabled" placeholder="启用状态:0 、停用，1、启用"></el-input>
@@ -28,34 +28,34 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 			<el-form-item label="报表内容" prop="content">
 				<el-input v-model="dataForm.content" placeholder="报表内容"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -171,7 +171,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {

src/views/modules/monitoring/reportSheet.vue

@@ -1,43 +1,16 @@
 <template>
 	<div class="mod-config">
-		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+		<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)">
 			<el-form-item>
-				<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
+				<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
 			</el-form-item>
 			<el-form-item>
-				<el-button @click="getDataList()">查询</el-button>
+				<el-button @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:reporsheet:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+				<el-button v-if="$hasPermission('monitoring:reporsheet:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
-				
 			</el-form-item>
 		</el-form>
-		<!-- <el-table :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
+
-			<el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column>
+		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
-			<el-table-column prop="id" header-align="center" align="center" label="ID"> </el-table-column>
-			<el-table-column prop="category" header-align="center" align="center" label="分类：关联report_sheet_category"> </el-table-column>
-			<el-table-column prop="code" header-align="center" align="center" label="编码"> </el-table-column>
-			<el-table-column prop="name" header-align="center" align="center" label="名称"> </el-table-column>
-			<el-table-column prop="fileName" header-align="center" align="center" label="文件名称"> </el-table-column>
-			<el-table-column prop="url" header-align="center" align="center" label="链接地址"> </el-table-column>
-			<el-table-column prop="description" header-align="center" align="center" label="描述"> </el-table-column>
-			<el-table-column prop="enabled" header-align="center" align="center" label="启用状态:0 、停用，1、启用"> </el-table-column>
-			<el-table-column prop="remark" header-align="center" align="center" label="备注"> </el-table-column>
-			<el-table-column prop="valid" header-align="center" align="center" label="删除标志，是否有效:1 可用 0不可用"> </el-table-column>
-			<el-table-column prop="creatorId" header-align="center" align="center" label="创建人"> </el-table-column>
-			<el-table-column prop="creatorName" header-align="center" align="center" label="创建人姓名"> </el-table-column>
-			<el-table-column prop="createTime" header-align="center" align="center" label="创建时间"> </el-table-column>
-			<el-table-column prop="updaterId" header-align="center" align="center" label="更新人"> </el-table-column>
-			<el-table-column prop="updaterName" header-align="center" align="center" label="更新人姓名"> </el-table-column>
-			<el-table-column prop="updateTime" header-align="center" align="center" label="更新时间"> </el-table-column>
-			<el-table-column prop="version" header-align="center" align="center" label="版本号"> </el-table-column>
-			<el-table-column prop="content" header-align="center" align="center" label="报表内容"> </el-table-column>
-			<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
-				<template slot-scope="scope">
-					<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
-					<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table> -->
-		<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="500" />
 		<el-pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
@@ -54,37 +27,31 @@
 </template>
 
 <script>
+import { calcMaxHeight } from '@/utils'
+import { timeFilter } from '@/utils/filters'
 import AddOrUpdate from './reportSheet-add-or-update'
+import i18n from '@/i18n'
 import BaseTable from '@/components/base-table'
 import TableOperateComponent from '@/components/base-table/components/operationComponent'
 import TableTextComponent from '@/components/base-table/components/detailComponent'
 
 const tableConfigs = [
-	{ prop: 'createTime', name: '创建时间' },
+	{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
-	{ prop: 'name', name: '报表名称' },
+	{ prop: 'name', name: i18n.t('report.name') },
-	{ prop: 'code', name: '报表编码' },
+	{ prop: 'code', name: i18n.t('report.code') },
-	{ prop: 'category', name: '报表分类' },
+	{ prop: 'category', name: i18n.t('report.type') },
-	// { prop: 'id', name: 'ID' },
+	{ prop: 'fileName', name: i18n.t('file.name') },
-	// { prop: 'category', name: '分类：关联report_sheet_category' },
+	{ prop: 'url', name: i18n.t('report.lnk') },
-	{ prop: 'fileName', name: '文件名称' },
+	{ prop: 'description', name: i18n.t('desc') },
-	{ prop: 'url', name: '链接地址' },
+	{ prop: 'remark', name: i18n.t('remark') },
-	{ prop: 'description', name: '描述' },
+	{ prop: 'content', name: i18n.t('report.det') },
-	{ prop: 'remark', name: '备注' },
+	{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
-	{ prop: 'content', name: '报表内容' },
-	// { prop: 'enabled', name: '启用状态:0 、停用，1、启用' },
-	// { prop: 'valid', name: '删除标志，是否有效:1 可用 0不可用' },
-	// { prop: 'creatorId', name: '创建人' },
-	// { prop: 'creatorName', name: '创建人姓名' },
-	// { prop: 'updaterId', name: '更新人' },
-	// { prop: 'updaterName', name: '更新人姓名' },
-	// { prop: 'updateTime', name: '更新时间' },
-	// { prop: 'version', name: '版本号' },
-	{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 ]
 
 export default {
 	data() {
 		return {
+			calcMaxHeight,
 			tableConfigs,
 			dataForm: {
 				key: ''
@@ -106,6 +73,12 @@ export default {
 		this.getDataList()
 	},
 	methods: {
+		// destroy dialog
+		handleDestroyDialog() {
+			setTimeout(() => {
+				this.addOrUpdateVisible= false
+			}, /** after dialog animated */ 200);
+		},
 		// 获取数据列表
 		getDataList() {
 			this.dataListLoading = true
@@ -157,9 +130,9 @@ export default {
 				: this.dataListSelections.map(item => {
 						return item.id
 				  })
-			this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+			this.$confirm(`${ i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() }) }`, i18n.t('prompt.title'), {
-				confirmButtonText: '确定',
+				confirmButtonText: i18n.t('confirm'),
-				cancelButtonText: '取消',
+				cancelButtonText: i18n.t('cancel'),
 				type: 'warning'
 			}).then(() => {
 				this.$http({
@@ -169,7 +142,7 @@ export default {
 				}).then(({ data }) => {
 					if (data && data.code === 0) {
 						this.$message({
-							message: '操作成功',
+							message: i18n.t('prompt.success'),
 							type: 'success',
 							duration: 1500,
 							onClose: () => {

src/views/modules/monitoring/reportSheetCategory-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
+	<el-dialog :title="!dataForm.id ? i18n.t('add') : i18n.t('update')" :close-on-click-modal="false" :visible.sync="visible">
 		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 			<el-form-item label="编码" prop="code">
 				<el-input v-model="dataForm.code" placeholder="编码"></el-input>
@@ -7,8 +7,8 @@
 			<el-form-item label="名称" prop="name">
 				<el-input v-model="dataForm.name" placeholder="名称"></el-input>
 			</el-form-item>
-			<el-form-item label="描述" prop="description">
+			<el-form-item :label="$t('desc')" prop="description">
-				<el-input v-model="dataForm.description" placeholder="描述"></el-input>
+				<el-input v-model="dataForm.description" :placeholder="$t('desc')"></el-input>
 			</el-form-item>
 			<el-form-item label="外部编码，用于对照外部系统的编码" prop="externalCode">
 				<el-input v-model="dataForm.externalCode" placeholder="外部编码，用于对照外部系统的编码"></el-input>
@@ -22,31 +22,31 @@
 			<el-form-item label="删除标志，是否有效:1 可用 0不可用" prop="valid">
 				<el-input v-model="dataForm.valid" placeholder="删除标志，是否有效:1 可用 0不可用"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人" prop="creatorId">
+			<el-form-item :label="$t('creator')" prop="creatorId">
-				<el-input v-model="dataForm.creatorId" placeholder="创建人"></el-input>
+				<el-input v-model="dataForm.creatorId" :placeholder="$t('creator')"></el-input>
 			</el-form-item>
-			<el-form-item label="创建人姓名" prop="creatorName">
+			<el-form-item :label="$t('creatorName')" prop="creatorName">
-				<el-input v-model="dataForm.creatorName" placeholder="创建人姓名"></el-input>
+				<el-input v-model="dataForm.creatorName" :placeholder="$t('creatorName')"></el-input>
 			</el-form-item>
 			<el-form-item label="创建时间" prop="createTime">
 				<el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人" prop="updaterId">
+			<el-form-item :label="$t('updator')" prop="updaterId">
-				<el-input v-model="dataForm.updaterId" placeholder="更新人"></el-input>
+				<el-input v-model="dataForm.updaterId" :placeholder="$t('updator')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新人姓名" prop="updaterName">
+			<el-form-item :label="$t('updatorName')" prop="updaterName">
-				<el-input v-model="dataForm.updaterName" placeholder="更新人姓名"></el-input>
+				<el-input v-model="dataForm.updaterName" :placeholder="$t('updatorName')"></el-input>
 			</el-form-item>
-			<el-form-item label="更新时间" prop="updateTime">
+			<el-form-item :label="$t('updateTime')" prop="updateTime">
-				<el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
+				<el-input v-model="dataForm.updateTime" :placeholder="$t('updateTime')"></el-input>
 			</el-form-item>
-			<el-form-item label="版本号" prop="version">
+			<el-form-item :label="$t('version')" prop="version">
-				<el-input v-model="dataForm.version" placeholder="版本号"></el-input>
+				<el-input v-model="dataForm.version" :placeholder="$t('version')"></el-input>
 			</el-form-item>
 		</el-form>
 		<span slot="footer" class="dialog-footer">
-			<el-button @click="visible = false">取消</el-button>
+			<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">{{ $t('confirm') }}</el-button>
 		</span>
 	</el-dialog>
 </template>
@@ -150,7 +150,7 @@ export default {
 					}).then(({ data }) => {
 						if (data && data.code === 0) {
 							this.$message({
-								message: '操作成功',
+								message: i18n.t('prompt.success'),
 								type: 'success',
 								duration: 1500,
 								onClose: () => {