Merge branch 'test' into dy

bug
Merge pull request 'zjl' (#32 ) from zjl into test
2023-09-22 16:54:40 +08:00 · 2023-09-22 16:54:16 +08:00 · 2023-09-22 11:09:34 +08:00 · 2023-09-22 11:08:58 +08:00 · 2023-09-22 11:06:43 +08:00 · 2023-09-22 10:54:56 +08:00
58 changed files with 2875 additions and 1017 deletions
--- a/src/api/base/groupTeamScheduling.js
+++ b/src/api/base/groupTeamScheduling.js
@ -19,9 +19,10 @@ export function createOrUpdateList(data) {
 }

 // 自动排班，填充上月已有的排班
-export function autoSet() {
+export function autoSet(query) {
  return request({
    url: '/base/group-team-scheduling/autoSet',
-    method: 'get'
+    method: 'get',
+    params: query
  })
 }
--- a/src/assets/images/factory-icon.png
+++ b/src/assets/images/factory-icon.png
--- a/src/assets/images/no-data-bg.png
+++ b/src/assets/images/no-data-bg.png
--- a/src/assets/images/tree-icon-1.png
+++ b/src/assets/images/tree-icon-1.png
--- a/src/assets/images/tree-icon-2.png
+++ b/src/assets/images/tree-icon-2.png
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@ -6,11 +6,12 @@
@import './btn.scss';

 body {
-  height: 100%;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+	height: 100%;
+	-moz-osx-font-smoothing: grayscale;
+	-webkit-font-smoothing: antialiased;
+	text-rendering: optimizeLegibility;
+	font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
+		Microsoft YaHei, Arial, sans-serif;
 }

 // label {
@ -27,170 +28,195 @@ body {
 }

 html {
-  height: 100%;
-  box-sizing: border-box;
+	height: 100%;
+	box-sizing: border-box;
 }

 #app {
-  height: 100%;
+	height: 100%;
 }

 *,
 *:before,
 *:after {
-  box-sizing: inherit;
+	box-sizing: inherit;
 }

 .no-padding {
-  padding: 0px !important;
+	padding: 0px !important;
 }

 .padding-content {
-  padding: 4px 0;
+	padding: 4px 0;
 }

 a:focus,
 a:active {
-  outline: none;
+	outline: none;
 }

 a,
 a:focus,
 a:hover {
-  cursor: pointer;
-  color: inherit;
-  text-decoration: none;
+	cursor: pointer;
+	color: inherit;
+	text-decoration: none;
 }

 div:focus {
-  outline: none;
+	outline: none;
 }

 .fr {
-  float: right;
+	float: right;
 }

 .fl {
-  float: left;
+	float: left;
 }

 .pr-5 {
-  padding-right: 5px;
+	padding-right: 5px;
 }

 .pl-5 {
-  padding-left: 5px;
+	padding-left: 5px;
 }

 .block {
-  display: block;
+	display: block;
 }

 .pointer {
-  cursor: pointer;
+	cursor: pointer;
 }

 .inlineBlock {
-  display: block;
+	display: block;
 }

 .clearfix {
-  &:after {
-    visibility: hidden;
-    display: block;
-    font-size: 0;
-    content: " ";
-    clear: both;
-    height: 0;
-  }
+	&:after {
+		visibility: hidden;
+		display: block;
+		font-size: 0;
+		content: ' ';
+		clear: both;
+		height: 0;
+	}
 }

 aside {
-  background: #eef1f6;
-  padding: 8px 24px;
-  margin-bottom: 20px;
-  border-radius: 2px;
-  display: block;
-  line-height: 32px;
-  font-size: 16px;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  color: #2c3e50;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
+	background: #eef1f6;
+	padding: 8px 24px;
+	margin-bottom: 20px;
+	border-radius: 2px;
+	display: block;
+	line-height: 32px;
+	font-size: 16px;
+	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
+		Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+	color: #2c3e50;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;

-  a {
-    color: #337ab7;
-    cursor: pointer;
+	a {
+		color: #337ab7;
+		cursor: pointer;

-    &:hover {
-      color: rgb(32, 160, 255);
-    }
-  }
+		&:hover {
+			color: rgb(32, 160, 255);
+		}
+	}
 }

 //main-container全局样式
 .app-container {
-  padding: 16px;
+	padding: 16px;
 }

 .components-container {
-  margin: 30px 50px;
-  position: relative;
+	margin: 30px 50px;
+	position: relative;
 }

 .text-center {
-  text-align: center
+	text-align: center;
 }

 .sub-navbar {
-  height: 50px;
-  line-height: 50px;
-  position: relative;
-  width: 100%;
-  text-align: right;
-  padding-right: 20px;
-  transition: 600ms ease position;
-  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
+	height: 50px;
+	line-height: 50px;
+	position: relative;
+	width: 100%;
+	text-align: right;
+	padding-right: 20px;
+	transition: 600ms ease position;
+	background: linear-gradient(
+		90deg,
+		rgba(32, 182, 249, 1) 0%,
+		rgba(32, 182, 249, 1) 0%,
+		rgba(33, 120, 241, 1) 100%,
+		rgba(33, 120, 241, 1) 100%
+	);

-  .subtitle {
-    font-size: 20px;
-    color: #fff;
-  }
+	.subtitle {
+		font-size: 20px;
+		color: #fff;
+	}

-  &.draft {
-    background: #d0d0d0;
-  }
+	&.draft {
+		background: #d0d0d0;
+	}

-  &.deleted {
-    background: #d0d0d0;
-  }
+	&.deleted {
+		background: #d0d0d0;
+	}
 }

 .link-type,
 .link-type:focus {
-  color: #337ab7;
-  cursor: pointer;
+	color: #337ab7;
+	cursor: pointer;

-  &:hover {
-    color: rgb(32, 160, 255);
-  }
+	&:hover {
+		color: rgb(32, 160, 255);
+	}
 }

 .filter-container {
-  padding-bottom: 10px;
+	padding-bottom: 10px;

-  .filter-item {
-    display: inline-block;
-    vertical-align: middle;
-    margin-bottom: 10px;
-  }
+	.filter-item {
+		display: inline-block;
+		vertical-align: middle;
+		margin-bottom: 10px;
+	}
 }

 //refine vue-multiselect plugin
 .multiselect {
-  line-height: 16px;
+	line-height: 16px;
 }

 .multiselect--active {
-  z-index: 1000 !important;
+	z-index: 1000 !important;
+}
+
+.no-data-bg {
+	height: 240px;
+	background: url(../images/no-data-bg.png) 50% 100% / contain
+		no-repeat;
+	position: relative;
+
+	&::after {
+		content: '暂无数据';
+		position: absolute;
+		bottom: 12px;
+		left: 50%;
+		transform: translateX(-50%);
+		color: #ccc;
+		font-size: 18px;
+		letter-spacing: 1px;
+	}
 }
--- a/src/assets/styles/ruoyi.scss
+++ b/src/assets/styles/ruoyi.scss
@ -5,110 +5,123 @@

 /** 基础通用 **/
 .pt5 {
-  padding-top: 5px;
+	padding-top: 5px;
 }
 .pr5 {
-  padding-right: 5px;
+	padding-right: 5px;
 }
 .pb5 {
-  padding-bottom: 5px;
+	padding-bottom: 5px;
 }
 .mt5 {
-  margin-top: 5px;
+	margin-top: 5px;
 }
 .mr5 {
-  margin-right: 5px;
+	margin-right: 5px;
 }
 .mb5 {
-  margin-bottom: 5px;
+	margin-bottom: 5px;
 }
 .mb8 {
-  margin-bottom: 8px;
+	margin-bottom: 8px;
 }
 .ml5 {
-  margin-left: 5px;
+	margin-left: 5px;
 }
 .mt10 {
-  margin-top: 10px;
+	margin-top: 10px;
 }
 .mr10 {
-  margin-right: 10px;
+	margin-right: 10px;
 }
 .mb10 {
-  margin-bottom: 10px;
+	margin-bottom: 10px;
 }
 .ml10 {
-  margin-left: 10px;
+	margin-left: 10px;
 }
 .mt20 {
-  margin-top: 20px;
+	margin-top: 20px;
 }
 .mr20 {
-  margin-right: 20px;
+	margin-right: 20px;
 }
 .mb20 {
-  margin-bottom: 20px;
+	margin-bottom: 20px;
 }
 .ml20 {
-  margin-left: 20px;
+	margin-left: 20px;
 }

-.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
-  font-family: inherit;
-  font-weight: 500;
-  line-height: 1.1;
-  color: inherit;
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	font-family: inherit;
+	font-weight: 500;
+	line-height: 1.1;
+	color: inherit;
 }

-.el-message-box__status + .el-message-box__message{
-  word-break: break-word;
+.el-message-box__status + .el-message-box__message {
+	word-break: break-word;
 }

 .el-dialog:not(.is-fullscreen) {
-  margin-top: 6vh !important;
+	// margin-top: 6vh !important;
+	margin-top: 12vh !important;
 }

 .el-dialog__wrapper.scrollbar .el-dialog .el-dialog__body {
-  overflow: auto;
-  overflow-x: hidden;
-  max-height: 70vh;
-  padding: 10px 20px 0;
+	overflow: auto;
+	overflow-x: hidden;
+	max-height: 70vh;
+	padding: 10px 20px 0;
 }

-.el-dialog{
-  display: flex;
-  flex-direction: column;
-  max-width: calc(100% - 30px);
-  max-height: calc(100% - 70px);
-  .el-dialog__body {
-    overflow: auto;
-  }
+.el-dialog {
+	display: flex;
+	flex-direction: column;
+	max-width: calc(100% - 30px);
+	max-height: calc(100% - 70px);
+	.el-dialog__body {
+		overflow: auto;
+	}
 }

 .el-table {
-  .el-table__header-wrapper, .el-table__fixed-header-wrapper {
-    th {
-      word-break: break-word;
-      background-color: #f8f8f9;
-      color: #515a6e;
-      height: 40px;
-      font-size: 13px;
-    }
-  }
-  .el-table__body-wrapper {
-    .el-button [class*="el-icon-"] + span {
-      margin-left: 1px;
-    }
-  }
+	.el-table__header-wrapper,
+	.el-table__fixed-header-wrapper {
+		th {
+			word-break: break-word;
+			background-color: #f8f8f9;
+			color: #515a6e;
+			height: 40px;
+			font-size: 13px;
+		}
+	}
+	.el-table__body-wrapper {
+		.el-button [class*='el-icon-'] + span {
+			margin-left: 1px;
+		}
+	}
 }

 /** 表单布局 **/
 .form-header {
-  font-size:15px;
-  color:#6379bb;
-  border-bottom:1px solid #ddd;
-  margin:8px 10px 25px 10px;
-  padding-bottom:5px
+	font-size: 15px;
+	color: #6379bb;
+	border-bottom: 1px solid #ddd;
+	margin: 8px 10px 25px 10px;
+	padding-bottom: 5px;
 }

 /** 表格布局 **/
@ -122,169 +135,171 @@

 /* tree border */
 .tree-border {
-  margin-top: 5px;
-  border: 1px solid #e5e6e7;
-  background: #FFFFFF none;
-  border-radius:4px;
+	margin-top: 5px;
+	border: 1px solid #e5e6e7;
+	background: #ffffff none;
+	border-radius: 4px;
 }

 .pagination-container .el-pagination {
-  right: 0;
-  position: absolute;
+	right: 0;
+	position: absolute;
 }

-@media ( max-width : 768px) {
-  .pagination-container .el-pagination > .el-pagination__jump {
-    display: none !important;
-  }
-  .pagination-container .el-pagination > .el-pagination__sizes {
-    display: none !important;
-  }
+@media (max-width: 768px) {
+	.pagination-container .el-pagination > .el-pagination__jump {
+		display: none !important;
+	}
+	.pagination-container .el-pagination > .el-pagination__sizes {
+		display: none !important;
+	}
 }

 .el-table .fixed-width .el-button--mini {
-  padding-left: 0;
-  padding-right: 0;
-  width: inherit;
+	padding-left: 0;
+	padding-right: 0;
+	width: inherit;
 }

 /** 表格更多操作下拉样式 */
-.el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine {
-  cursor: pointer;
-  margin-left: 5px;
+.el-table .el-dropdown-link,
+.el-table .el-dropdown-selfdefine {
+	cursor: pointer;
+	margin-left: 5px;
 }

-.el-table .el-dropdown, .el-icon-arrow-down {
-  font-size: 12px;
+.el-table .el-dropdown,
+.el-icon-arrow-down {
+	font-size: 12px;
 }

 .el-tree-node__content > .el-checkbox {
-  margin-right: 8px;
+	margin-right: 8px;
 }

 .list-group-striped > .list-group-item {
-  border-left: 0;
-  border-right: 0;
-  border-radius: 0;
-  padding-left: 0;
-  padding-right: 0;
+	border-left: 0;
+	border-right: 0;
+	border-radius: 0;
+	padding-left: 0;
+	padding-right: 0;

-  &:not(:last-child) {
-    border-bottom: 1px solid #e7eaec;
-  }
+	&:not(:last-child) {
+		border-bottom: 1px solid #e7eaec;
+	}
 }

 .list-group {
-  padding-left: 0px;
-  list-style: none;
+	padding-left: 0px;
+	list-style: none;
 }

 .list-group-item {
-  // border-bottom: 1px solid #e7eaec;
-  // border-top: 1px solid #e7eaec;
-  margin-bottom: -1px;
-  padding: 11px 0px;
-  font-size: 13px;
+	// border-bottom: 1px solid #e7eaec;
+	// border-top: 1px solid #e7eaec;
+	margin-bottom: -1px;
+	padding: 11px 0px;
+	font-size: 13px;
 }

 .pull-right {
-  float: right !important;
+	float: right !important;
 }

 .el-card__header {
-  padding: 14px 15px 7px;
-  min-height: 40px;
+	padding: 14px 15px 7px;
+	min-height: 40px;
 }

 .el-card__body {
-  padding: 15px 20px 20px 20px;
+	padding: 15px 20px 20px 20px;
 }

 .card-box {
-  padding-right: 15px;
-  padding-left: 15px;
-  margin-bottom: 10px;
+	padding-right: 15px;
+	padding-left: 15px;
+	margin-bottom: 10px;
 }

 /* button color */
 .el-button--cyan.is-active,
 .el-button--cyan:active {
-  background: #20B2AA;
-  border-color: #20B2AA;
-  color: #FFFFFF;
+	background: #20b2aa;
+	border-color: #20b2aa;
+	color: #ffffff;
 }

 .el-button--cyan:focus,
 .el-button--cyan:hover {
-  background: #48D1CC;
-  border-color: #48D1CC;
-  color: #FFFFFF;
+	background: #48d1cc;
+	border-color: #48d1cc;
+	color: #ffffff;
 }

 .el-button--cyan {
-  background-color: #20B2AA;
-  border-color: #20B2AA;
-  color: #FFFFFF;
+	background-color: #20b2aa;
+	border-color: #20b2aa;
+	color: #ffffff;
 }

 /* text color */
 .text-navy {
-  color: #1ab394;
+	color: #1ab394;
 }

 .text-primary {
-  color: inherit;
+	color: inherit;
 }

 .text-success {
-  color: #1c84c6;
+	color: #1c84c6;
 }

 .text-info {
-  color: #23c6c8;
+	color: #23c6c8;
 }

 .text-warning {
-  color: #f8ac59;
+	color: #f8ac59;
 }

 .text-danger {
-  color: #ed5565;
+	color: #ed5565;
 }

 .text-muted {
-  color: #888888;
+	color: #888888;
 }

 /* image */
 .img-circle {
-  border-radius: 50%;
+	border-radius: 50%;
 }

 .img-lg {
-  width: 120px;
-  height: 120px;
+	width: 120px;
+	height: 120px;
 }

 .avatar-upload-preview {
-  position: absolute;
-  top: 50%;
-  transform: translate(50%, -50%);
-  width: 200px;
-  height: 200px;
-  border-radius: 50%;
-  box-shadow: 0 0 4px #ccc;
-  overflow: hidden;
+	position: absolute;
+	top: 50%;
+	transform: translate(50%, -50%);
+	width: 200px;
+	height: 200px;
+	border-radius: 50%;
+	box-shadow: 0 0 4px #ccc;
+	overflow: hidden;
 }

 /* 拖拽列样式 */
-.sortable-ghost{
-  opacity: .8;
-  color: #fff!important;
-  background: #42b983!important;
+.sortable-ghost {
+	opacity: 0.8;
+	color: #fff !important;
+	background: #42b983 !important;
 }

 .top-right-btn {
-  position: relative;
-  float: right;
+	position: relative;
+	float: right;
 }
--- a/src/utils/dynamicProps.js
+++ b/src/utils/dynamicProps.js
@ -1,3 +1,5 @@
+import moment from 'moment';
+
 /**
 * 用于动态表结构的 tableProps 生成
 * @param {*} nameData
@ -16,10 +18,9 @@ export function handleNameData(nameData) {
 function step1(tree1) {
 	return Array.from(new Set(tree1.map((item) => item.name)))
 		.sort()
-		.map((item) => ({
-			prop: item,
-			label: item,
-			align: 'center',
+		.map((time) => ({
+			prop: time,
+			label: moment(time).format('YYYY-MM-DD HH:mm:ss'),
 			children: [],
 		}));
 }
@ -33,7 +34,6 @@ function step2(firstTierProps, tree2) {
 			parent.children.push({
 				label: nd.name,
 				prop: `${parent.prop}-${nd.name}`,
-				align: 'center',
 			});
 		}
 	});
--- a/src/views/base/equipmentBindGroup/index.vue
+++ b/src/views/base/equipmentBindGroup/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -85,12 +86,11 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'equipmentName', label: '设备', align: 'center' },
-				{ prop: 'groupName', label: '分组', align: 'center' },
+				{ prop: 'equipmentName', label: '设备' },
+				{ prop: 'groupName', label: '分组' },
 				{
 					_action: 'equipment-bind-group-show-alert',
 					label: '分组报警',
-					align: 'center',
 					subcomponent: {
 						props: ['injectData'],
 						render: function (h) {
@ -98,7 +98,7 @@ export default {
 							return h(
 								'el-button',
 								{
-									props: { type: 'text', size: 'mini' },
+									props: { type: 'text' },
 									on: {
 										click: function () {
 											console.log('inejctdata', _this.injectData);
@ -162,6 +162,9 @@ export default {
 						label: '设备',
 						url: '/base/equipment/page?pageNo=1&pageSize=100',
 						prop: 'equipmentId',
+						bind: {
+							filterable: true,
+						},
 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
@ -173,6 +176,9 @@ export default {
 						// depends: '__product_line', // 依赖产线获取数据
 						// depends: 'productionLineId',
 						prop: 'groupId',
+						bind: {
+							filterable: true,
+						},
 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
@ -223,7 +229,7 @@ export default {
 		/** 查询列表 */
 		getList() {
 			this.loading = true;
-			_// 执行查询
+			_; // 执行查询
 			getEquipmentBindGroupPage(this.queryParams).then((response) => {
 				this.list = response.data.list;
 				this.total = response.data.total;
--- a/src/views/base/equipmentBindSection/index.vue
+++ b/src/views/base/equipmentBindSection/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -83,28 +84,26 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'productionLine', label: '产线名称', align: 'center' },
-				{ prop: 'workshopSection', label: '工段名称', align: 'center' },
-				{ prop: 'equipment', label: '设备名称', align: 'center' },
-				{ prop: 'sort', label: '工段中排序', align: 'center' },
+				{ prop: 'productionLine', label: '产线名称' },
+				{ prop: 'workshopSection', label: '工段名称' },
+				{ prop: 'equipment', label: '设备名称' },
+				{ prop: 'sort', label: '工段中排序' },
 				{
 					prop: 'lineDataType',
 					label: '产线数据类型',
-					align: 'center',
 					filter: (val) =>
 						val != null ? ['无类型', '进口计数', '出口计数'][val] : '-',
 				},
 				{
 					prop: 'sectionDataType',
 					label: '工段数据类型',
-					align: 'center',
 					filter: (val) =>
 						val != null ? ['无类型', '进口计数', '出口计数'][val] : '-',
 				},
 				// {
 				// 	action: 'show-alert',
 				// 	label: '报警',
-				// 	align: 'center',
+				// 	,
 				// 	subcomponent: {
 				// 		props: ['injectData'],
 				// 		render: function (h) {
--- a/src/views/base/equipmentGroup/index.vue
+++ b/src/views/base/equipmentGroup/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -84,13 +85,12 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'name', label: '设备分组名称', align: 'center' },
-				{ prop: 'code', label: '检测分组编码', align: 'center' },
-				{ prop: 'remark', label: '备注', align: 'center' },
+				{ prop: 'name', label: '设备分组名称' },
+				{ prop: 'code', label: '设备分组编码' },
+				{ prop: 'remark', label: '备注' },
 				{
 					_action: 'equipment-group-show-alert',
 					label: '报警',
-					align: 'center',
 					subcomponent: {
 						props: ['injectData'],
 						render: function (h) {
@ -98,7 +98,7 @@ export default {
 							return h(
 								'el-button',
 								{
-									props: { type: 'text', size: 'mini' },
+									props: { type: 'text' },
 									on: {
 										click: function () {
 											console.log('inejctdata', _this.injectData);
@ -127,7 +127,7 @@ export default {
 					type: 'input',
 					label: '分组编码',
 					placeholder: '请输入设备分组编码',
-					param: 'codes',
+					param: 'code',
 				},
 				{
 					type: 'button',
@ -172,6 +172,7 @@ export default {
 						label: '分组编码',
 						prop: 'code',
 						url: '/base/equipment-group/getCode',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
 				[
@ -302,11 +303,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm(
-					'是否确认删除设备分组（用于同类型不同厂家的设备区分）编号为"' +
-						id +
-						'"的数据项?'
-				)
+				.confirm('是否确认删除设备分组 "' + row.name + '"?')
 				.then(function () {
 					return deleteEquipmentGroup(id);
 				})
--- a/src/views/base/equipmentGroupAlarm/dialogForm.vue
+++ b/src/views/base/equipmentGroupAlarm/dialogForm.vue
@ -0,0 +1,177 @@
+<!-- 
+    filename: dialogForm.vue
+    author: liubin
+    date: 2023-09-11 15:55:13
+    description: DialogForm for equipmentBindSection only
+-->
+
+<template>
+	<el-form
+		ref="form"
+		:model="dataForm"
+		label-width="100px"
+		v-loading="formLoading">
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-form-item
+					label="报警编码"
+					prop="code"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-input
+						v-model="dataForm.code"
+						@change="$emit('update', dataForm)"
+						placeholder="请输入工段排序" />
+				</el-form-item>
+				<!-- 				
+				<el-form-item
+					label="报警编码"
+					prop="code"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-select
+						v-model="dataForm.code"
+						placeholder="请选择产线"
+						@change="handleProductlineChange">
+						<el-option
+							v-for="opt in productionLineList"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+				</el-form-item> -->
+			</el-col>
+
+			<el-col :span="12">
+				<el-form-item
+					label="报警类型"
+					prop="type"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-select
+						v-model="dataForm.type"
+						placeholder="请选择报警类型"
+						@change="$emit('update', dataForm)">
+						<el-option
+							v-for="opt in [
+								{ label: '布尔型', value: 2 },
+								{ label: '字符型', value: 1 },
+							]"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-form-item
+					label="报警级别"
+					prop="grade"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-select
+						v-model="dataForm.grade"
+						placeholder="请选择报警级别"
+						@change="$emit('update', dataForm)">
+						<el-option
+							v-for="opt in getDictDatas(DICT_TYPE.EQU_ALARM_LEVEL)"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+				</el-form-item>
+			</el-col>
+
+			<el-col :span="12">
+				<el-form-item
+					v-if="+dataForm.type == 1"
+					label="设备报警编码"
+					prop="alarmCode">
+					<el-input
+						v-model="dataForm.alarmCode"
+						@change="$emit('update', dataForm)"
+						placeholder="请输入设备报警编码" />
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-form-item
+					label="参数列名"
+					prop="plcParamName"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-input
+						v-model="dataForm.plcParamName"
+						placeholder="请输入参数列名"
+						@change="$emit('update', dataForm)"></el-input>
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item
+					label="报警内容"
+					prop="alarmContent"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-input
+						v-model="dataForm.alarmContent"
+						placeholder="请输入报警内容"
+						@change="$emit('update', dataForm)"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+	</el-form>
+</template>
+
+<script>
+export default {
+	name: 'DialogForm',
+	model: {
+		prop: 'dataForm',
+		event: 'update',
+	},
+	emits: ['update'],
+	components: {},
+	props: {
+		dataForm: {
+			type: Object,
+			default: () => ({}),
+		},
+	},
+	data() {
+		return {
+			formLoading: true,
+		};
+	},
+	mounted() {
+		this.getCode('/base/equipment-group-alarm/getCode').then((code) => {
+			this.formLoading = false;
+			this.$emit('update', {
+				...this.dataForm,
+				code,
+			});
+		});
+	},
+	methods: {
+		/** 模拟透传 ref  */
+		validate(cb) {
+			return this.$refs.form.validate(cb);
+		},
+		resetFields(args) {
+			return this.$refs.form.resetFields(args);
+		},
+		async handleProductlineChange(id) {
+			await this.getWorksectionList(id);
+			this.dataForm.workshopSectionId = null;
+			this.$emit('update', this.dataForm);
+		},
+		async getCode(url) {
+			const response = await this.$axios(url);
+			return response.data;
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.el-date-editor,
+.el-select {
+	width: 100%;
+}
+</style>
--- a/src/views/base/equipmentGroupAlarm/index.vue
+++ b/src/views/base/equipmentGroupAlarm/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -37,7 +38,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 		</base-dialog>
 	</div>
 </template>
@ -54,10 +55,11 @@ import {
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import moment from 'moment';
 import { publicFormatter } from '@/utils/dict';
+import DialogForm from './dialogForm.vue';

 export default {
 	name: 'EquipmentGroupAlarm',
-	components: {},
+	components: { DialogForm },
 	mixins: [basicPageMixin],
 	data() {
 		return {
@ -84,22 +86,27 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'code', label: '报警编码', align: 'center' },
-				{ prop: 'type', label: '报警类型', align: 'center' },
+				{  width: 240, prop: 'code', label: '报警编码' },
+				{
+					prop: 'type',
+					label: '报警类型',
+					filter: (val) =>
+						val != null ? ['-', '字符型', '布尔型', '-'][val] : '-',
+				},
 				{
 					prop: 'grade',
 					label: '报警级别',
-					align: 'center',
 					filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL),
 				},
-				{ prop: 'alarmCode', label: '设备报警编码', align: 'center' },
-				{ prop: 'plcParamName', label: '参数列名', align: 'center' },
-				{ prop: 'alarmContent', label: '报警内容', align: 'center' },
+				{ prop: 'alarmCode', label: '设备报警编码' },
+				{ prop: 'plcParamName', label: '参数列名' },
+				{ prop: 'alarmContent', label: '报警内容' },
 			],
 			searchBarFormConfig: [
 				{
 					type: 'input',
 					label: '设备分组编码',
+					width: '220',
 					placeholder: '/',
 					param: 'equipmentGroupCode',
 					defaultSelect: null,
@ -181,14 +188,14 @@ export default {
 			},
 			// 表单参数
 			form: {
-				id: undefined,
-				equipmentGroupId: undefined,
-				code: undefined,
-				type: undefined,
-				grade: undefined,
-				alarmCode: undefined,
-				alarmContent: undefined,
-				plcParamName: undefined,
+				id: null,
+				equipmentGroupId: null,
+				code: null,
+				type: null,
+				grade: null,
+				alarmCode: null,
+				alarmContent: null,
+				plcParamName: null,
 			},
 			// // 表单校验
 			// rules: {
@ -249,14 +256,14 @@ export default {
 		/** 表单重置 */
 		reset() {
 			this.form = {
-				id: undefined,
-				equipmentGroupId: undefined,
-				code: undefined,
-				type: undefined,
-				grade: undefined,
-				alarmCode: undefined,
-				alarmContent: undefined,
-				plcParamName: undefined,
+				id: null,
+				equipmentGroupId: null,
+				code: null,
+				type: null,
+				grade: null,
+				alarmCode: null,
+				alarmContent: null,
+				plcParamName: null,
 			};
 			this.resetForm('form');
 		},
@ -321,7 +328,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除设备分组报警明细编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除该报警?')
 				.then(function () {
 					return deleteEquipmentGroupAlarm(id);
 				})
--- a/src/views/base/equipmentPlc/index.vue
+++ b/src/views/base/equipmentPlc/index.vue
@ -12,6 +12,7 @@
 			:page="queryParams.pageNo"
 			:limit="queryParams.pageSize"
 			:table-data="list"
+			ref="pageTable"
 			@emitFun="handleEmitFun">
 			<method-btn
 				v-if="tableBtn.length"
@ -58,9 +59,12 @@ const switchBtn = {
 	name: 'SwitchBtn',
 	props: ['injectData'],
 	data() {
-		return {
-			active: +this.injectData[this.injectData.prop] == 1 ? true : false,
-		};
+		return {};
+	},
+	computed: {
+		active() {
+			return +this.injectData[this.injectData.prop] == 1 ? true : false;
+		},
 	},
 	methods: {},
 	render: function (h) {
@ -72,8 +76,6 @@ const switchBtn = {
 				},
 				on: {
 					change: (newVal) => {
-						this.active = !this.active;
-						console.log('changed emit', newVal);
 						this.$emit('emitData', {
 							action: 'update-collect',
 							payload: {
@ -95,6 +97,7 @@ export default {
 	components: {},
 	data() {
 		return {
+			tableKey: Math.random(),
 			searchBarKeys: ['name', 'plcTableName'],
 			tableBtn: [
 				this.$auth.hasPermi('base:equipment-plc:update')
@ -118,17 +121,16 @@ export default {
 				// 	width: 180,
 				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				// },
-				{ prop: 'code', label: '编码', align: 'center' },
-				{ prop: 'plcTableName', label: '关联表名', align: 'center' },
-				{ prop: 'name', label: '标识名称', align: 'center' },
-				{ prop: 'enName', label: '英文名称', align: 'center' },
+				{ prop: 'code', label: '编码' },
+				{ prop: 'plcTableName', label: '关联表名' },
+				{ prop: 'name', label: '标识名称' },
+				{ prop: 'enName', label: '英文名称' },
 				{
 					prop: 'collection',
 					label: '是否采集',
-					align: 'center',
 					subcomponent: switchBtn,
 				},
-				{ prop: 'description', label: '描述', align: 'center' },
+				{ prop: 'description', label: '描述' },
 			],
 			searchBarFormConfig: [
 				{
@ -185,6 +187,7 @@ export default {
 						label: '编码',
 						prop: 'code',
 						url: '/base/equipment-group/getCode',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
 				[
@ -192,7 +195,7 @@ export default {
 						input: true,
 						label: '标识',
 						prop: 'name',
-						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 						// bind: {
 						// 	disabled: true, // some condition, like detail mode...
 						// }
@ -246,7 +249,7 @@ export default {
 		handleEmitFun({ action, payload }) {
 			switch (action) {
 				case 'update-collect':
-          this.reset();
+					this.reset();
 					const tempForm = {};
 					Object.keys(this.form).forEach((key) => {
 						tempForm[key] = payload[key];
@ -267,6 +270,7 @@ export default {
 				this.list = response.data.list;
 				this.total = response.data.total;
 				this.loading = false;
+				// this.tableKey = Math.random(); // method 1
 			});
 		},
 		/** 取消按钮 */
--- a/src/views/base/equipmentPlcConnect/index.vue
+++ b/src/views/base/equipmentPlcConnect/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -61,7 +62,7 @@ export default {
 	components: {},
 	data() {
 		return {
-			searchBarKeys: ['name', 'plcTableName'],
+			searchBarKeys: ['equipmentId', 'plcId'],
 			// tableBtn: [
 			// 	this.$auth.hasPermi('base:equipment-plc:update')
 			// 		? {
@ -98,18 +99,17 @@ export default {
 				// 	width: 180,
 				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				// },
-				{ prop: 'productionLine', label: '产线', align: 'center' },
-				{ prop: 'workshopSection', label: '工段', align: 'center' },
-				{ prop: 'equipmentName', label: '设备名', align: 'center' },
-				{ prop: 'equipmentCode', label: '设备编码', align: 'center' },
-				{ prop: 'plcCode', label: '关联表编码', align: 'center' },
-				{ prop: 'plcTableName', label: '关联表名', align: 'center' },
-				{ prop: 'plcName', label: '标识名称', align: 'center' },
-				{ prop: 'bindingParameters', label: '绑定参数数量', align: 'center' },
+				{ prop: 'productionLine', label: '产线' },
+				{ prop: 'workshopSection', label: '工段' },
+				{ prop: 'equipmentName', label: '设备名' },
+				{ prop: 'equipmentCode', label: '设备编码' },
+				{ prop: 'plcCode', label: '关联表编码' },
+				{ prop: 'plcTableName', label: '关联表名' },
+				{ prop: 'plcName', label: '标识名称' },
+				{ prop: 'bindingParameters', label: '绑定参数数量' },
 				{
 					_action: 'params-bind',
 					label: '查看绑定',
-					align: 'center',
 					subcomponent: {
 						props: ['injectData'],
 						render: function (h) {
@ -136,16 +136,18 @@ export default {
 			],
 			searchBarFormConfig: [
 				{
-					type: 'input',
+					type: 'select',
 					label: '设备名',
-					placeholder: '请输入设备名',
+					placeholder: '请选择设备',
 					param: 'equipmentId',
+					selectOptions: [],
 				},
 				{
-					type: 'input',
-					label: '编码',
-					placeholder: '请输入编码',
+					type: 'select',
+					label: 'PLC编码',
+					placeholder: '请选择编码',
 					param: 'plcId',
+					selectOptions: [],
 				},
 				{
 					type: 'button',
@ -179,6 +181,7 @@ export default {
 						select: true,
 						label: '关联表名',
 						prop: 'plcId',
+						labelKey: `plcTableName`,
 						url: '/base/equipment-plc/listAll',
 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
@ -207,8 +210,44 @@ export default {
 	},
 	created() {
 		this.getList();
+		this.initSearchOptions();
 	},
 	methods: {
+		async getEquipmentOptions() {
+			const res = await this.$axios({
+				url: '/base/equipment/listAll',
+				method: 'get',
+			});
+			return res.data;
+		},
+
+		async getPlcOptions() {
+			const res = await this.$axios({
+				url: '/base/equipment-plc/listAll',
+				method: 'get',
+			});
+			return res.data;
+		},
+
+		/** 初始化查询条件 */
+		async initSearchOptions() {
+			Promise.all([this.getEquipmentOptions(), this.getPlcOptions()]).then(
+				([eqList, plcList]) => {
+					this.searchBarFormConfig[0].selectOptions = eqList.map((item) => {
+						return {
+							name: item.name,
+							id: item.id,
+						};
+					});
+					this.searchBarFormConfig[1].selectOptions = plcList.map((item) => {
+						return {
+							name: item.name,
+							id: item.id,
+						};
+					});
+				}
+			);
+		},
 		/** 覆盖 handleEmitFun 的默认实现 */
 		handleEmitFun({ action, payload }) {
 			switch (action) {
--- a/src/views/base/equipmentPlcParam/index.vue
+++ b/src/views/base/equipmentPlcParam/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -68,29 +69,27 @@ export default {
 				// 	width: 180,
 				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				// },
-				{ prop: 'plcParamName', label: '参数列名', align: 'center' },
-				{ prop: 'name', label: '参数名称', align: 'center' },
+				{ prop: 'plcParamName', label: '参数列名' },
+				{ prop: 'name', label: '参数名称' },
 				{
 					prop: 'unit',
 					label: '单位',
-					align: 'center',
 					filter: publicFormatter('unit_dict'),
 				},
 				{
 					prop: 'collection',
 					label: '是否采集',
-					align: 'center',
 					filter: (val) => (val != null ? ['否', '是'][val] : '-'),
 				},
-				{ prop: 'minValue', label: '最小值', align: 'center' },
-				{ prop: 'maxValue', label: '最大值', align: 'center' },
-				{ prop: 'defaultValue', label: '标准值', align: 'center' },
-				{ prop: 'description', label: '描述', align: 'center' },
-				{ prop: 'remark', label: '备注', align: 'center' },
+				{ prop: 'minValue', label: '最小值' },
+				{ prop: 'maxValue', label: '最大值' },
+				{ prop: 'defaultValue', label: '标准值' },
+				{ prop: 'description', label: '描述' },
+				{ prop: 'remark', label: '备注' },
 				// {
 				// 	_action: 'params-bind',
 				// 	label: '查看绑定',
-				// 	align: 'center',
+				// 	,
 				// 	subcomponent: {
 				// 		props: ['injectData'],
 				// 		render: function (h) {
@ -157,7 +156,7 @@ export default {
 							{
 								type: 'number',
 								message: '请输入正确的数字',
-								trigger: 'blur',
+								trigger: 'change',
 								transform: (val) => Number(val),
 							},
 						],
@ -167,10 +166,13 @@ export default {
 						label: '最大值',
 						prop: 'maxValue',
 						rules: [
+							{
+								required: false,
+							},
 							{
 								type: 'number',
 								message: '请输入正确的数字',
-								trigger: 'blur',
+								trigger: 'change',
 								transform: (val) => Number(val),
 							},
 						],
@ -349,8 +351,8 @@ export default {
 				plcParamName: undefined,
 				name: undefined,
 				unit: undefined,
-				minValue: undefined,
-				maxValue: undefined,
+				minValue: null,
+				maxValue: null,
 				defaultValue: undefined,
 				collection: undefined,
 				description: undefined,
--- a/src/views/core/base/equipment/index.vue
+++ b/src/views/core/base/equipment/index.vue
@ -16,6 +16,7 @@
 			<method-btn
 				v-if="tableBtn.length"
 				slot="handleBtn"
+				:width="120"
 				label="操作"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
@ -147,15 +148,14 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'name', label: '设备名称', align: 'center' },
-				{ prop: 'code', label: '检测编码', align: 'center' },
-				{ prop: 'equipmentType', label: '设备类型', align: 'center' },
-				{ prop: 'enName', label: '英文名称', align: 'center' },
-				{ prop: 'abbr', label: '缩写', align: 'center' },
+				{ prop: 'name', label: '设备名称' },
+				{ width: 256, prop: 'code', label: '检测编码' },
+				{ prop: 'equipmentType', label: '设备类型' },
+				{ prop: 'enName', label: '英文名称' },
+				{ prop: 'abbr', label: '缩写' },
 				{
 					action: 'show-detail',
 					label: '详情',
-					align: 'center',
 					subcomponent: {
 						props: ['injectData'],
 						render: function (h) {
@ -377,8 +377,8 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'name', label: '属性名称', align: 'center' },
-				{ prop: 'value', label: '属性值', align: 'center' },
+				{ prop: 'name', label: '属性名称' },
+				{ prop: 'value', label: '属性值' },
 			],
 			// 是否显示弹出层
 			open: false,
@ -478,7 +478,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除设备编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除设备名称为"' + row.name + '"的数据项?')
 				.then(function () {
 					return deleteEquipment(id);
 				})
--- a/src/views/core/base/equipmentType/index.vue
+++ b/src/views/core/base/equipmentType/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -85,9 +86,9 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'name', label: '设备类型名称', align: 'center' },
-				{ prop: 'code', label: '检测类型编码', align: 'center' },
-				{ prop: 'remark', label: '备注', align: 'center' },
+				{ prop: 'name', label: '设备类型名称',  },
+				{ prop: 'code', label: '检测类型编码',  },
+				{ prop: 'remark', label: '备注',  },
 			],
 			searchBarFormConfig: [
 				{
--- a/src/views/core/base/productionLine/add-or-updata.vue
+++ b/src/views/core/base/productionLine/add-or-updata.vue
@ -1,8 +1,8 @@
 <!--
 * @Author: zwq
 * @Date: 2023-08-01 13:52:10
- * @LastEditors: zwq
- * @LastEditTime: 2023-08-01 16:59:35
+ * @LastEditors: DY
+ * @LastEditTime: 2023-09-21 15:45:07
 * @Description:
 -->
 <template>
@ -39,6 +39,12 @@
 		<el-form-item label="产线TT值(h)" prop="tvalue">
 			<el-input v-model="dataForm.tvalue" clearable placeholder="请输入每小时下片数量" />
 		</el-form-item>
+		<el-form-item label="额外编码" prop="externalCode">
+			<el-input
+				v-model="dataForm.externalCode"
+				clearable
+				placeholder="请输入额外编码" />
+		</el-form-item>
 		<el-form-item label="描述" prop="description">
 			<el-input
 				v-model="dataForm.description"
@ -82,6 +88,7 @@ export default {
 				name: undefined,
 				tvalue: undefined,
 				factoryId: undefined,
+				externalCode: undefined,
 				remark: undefined,
 				description: undefined,
 			},
--- a/src/views/core/base/workshopSection/add-or-updata.vue
+++ b/src/views/core/base/workshopSection/add-or-updata.vue
@ -1,8 +1,8 @@
 <!--
 * @Author: zwq
 * @Date: 2023-08-01 13:52:10
- * @LastEditors: zwq
- * @LastEditTime: 2023-08-01 16:58:44
+ * @LastEditors: DY
+ * @LastEditTime: 2023-09-21 10:48:54
 * @Description:
 -->
 <template>
@ -37,7 +37,7 @@
      </el-select>
    </el-form-item>
 		<el-form-item label="排序" prop="sort">
-			<el-input-number v-model="dataForm.sort" :min="1" clearable placeholder="请输入排序" />
+			<el-input-number v-model="dataForm.sort" :min="1" :max="100" clearable placeholder="请输入排序" />
 		</el-form-item>
 		<el-form-item label="备注" prop="remark">
 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
--- a/src/views/core/mixins/basic-page.js
+++ b/src/views/core/mixins/basic-page.js
@ -1,8 +1,8 @@
 /*
 * @Author: zwq
 * @Date: 2022-08-24 11:19:43
- * @LastEditors: zwq
- * @LastEditTime: 2023-08-02 10:56:37
+ * @LastEditors: DY
+ * @LastEditTime: 2023-09-21 16:02:07
 * @Description:
 */
 export default {
@ -38,7 +38,7 @@ export default {
      this.dataListLoading = true;
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
        this.tableData = response.data.list;
-        this.total = response.data.total;
+        this.listQuery.total = response.data.total;
        this.dataListLoading = false;
      });
    },
--- a/src/views/core/monitoring/data24/index.vue
+++ b/src/views/core/monitoring/data24/index.vue
@ -10,9 +10,9 @@
 			:formConfigs="[{ label: '设备近24小时产线生产数据', type: 'title' }]"
 			ref="search-bar" />
 		<el-skeleton v-if="initing" :rows="6" animated />
+		<!-- :span-method="mergeColumnHandler" -->
 		<base-table
 			v-else
-			:span-method="mergeColumnHandler"
 			:table-props="tableProps"
 			:table-data="tableData"
 			@emitFun="handleEmitFun"></base-table>
@ -62,7 +62,7 @@ export default {
 			for (const times of timeArray) {
 				if (times !== '投入数量' && times !== '产出数量' && times !== '报废数量' && times !== '产出面积') {
 					const subprop = {
-						label: times,
+						label: times.slice(0, 10) + ' ' + times.slice(11),
 						align: 'center',
 						children: [
 							{ prop: times + '_in', label: '投入数量', align: 'center' },
@ -117,8 +117,8 @@ export default {
 				tempData['spec'] = ele.spec
 				this.tableData.push(tempData)
 				console.log('看看数据', this.tableData, tempData)
-				const { sectionName } = tempData
-				sectionArr.push(sectionName)
+				const { proLineName } = tempData
+				sectionArr.push(proLineName)
 			})
 			this.setRowSpan(sectionArr)
 			console.log('工段名称列表', sectionArr)
--- a/src/views/core/monitoring/sectionStatistics/index.vue
+++ b/src/views/core/monitoring/sectionStatistics/index.vue
@ -1,15 +1,15 @@
 <!--
 * @Author: Do not edit
 * @Date: 2023-08-29 14:59:29
- * @LastEditTime: 2023-09-16 17:41:53
+ * @LastEditTime: 2023-09-22 15:13:48
 * @LastEditors: DY
 * @Description: 
 -->
 <template>
 	<div class="app-container">
+		<!-- :isFold="true" 控制展开 -->
 		<search-bar
 			:formConfigs="formConfig"
-			:isFold="true"
 			ref="searchBarForm"
 			@headBtnClick="buttonClick" />
 		<base-table
@ -36,7 +36,7 @@
 			@pagination="getDataList" />
 		<div ref="pdf" v-show="false">
 			<el-table :data="selectedList" stripe border style="width: 100%">
-				<el-table-column prop="reportType" label="产线类型" />
+				<el-table-column prop="reportType" label="报表类型" />
 				<el-table-column prop="reportStartTime" label="统计开始时间" />
 				<el-table-column prop="reportEndTime" label="统计结束时间" />
 				<el-table-column prop="proLineName" label="产线名称" />
@ -73,7 +73,7 @@ import FileSaver from 'file-saver'
 const tableProps = [
 	{
 		prop: 'reportType',
-		label: '产线类型'
+		label: '报表类型'
 	},
 	{
 		prop: 'reportStartTime',
@ -270,8 +270,8 @@ export default {
 					this.listQuery.lineId = val.line ? val.line : undefined;
 					this.listQuery.sectionId = val.section ? val.section : undefined;
 					this.listQuery.reportType = val.reportType ? val.reportType : undefined;
-					this.listQuery.reportStartTime = [new Date(val.timeVal[0]).getTime()];
-					this.listQuery.reportEndTime = [new Date(val.timeVal[1]).getTime()];
+					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined;
+					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined;
 					this.getDataList();
 					break;
 				case 'export':
--- a/src/views/core/monitoring/sectionStatisticsSearch/index.vue
+++ b/src/views/core/monitoring/sectionStatisticsSearch/index.vue
@ -76,6 +76,7 @@ export default {
        startTime: undefined,
        endTime: undefined,
      },
+			dataListLoading: false,
      optionArrUrl: [getProductionLinePage, getWorkshopSectionPage],
 			formConfig: [
 				{
--- a/src/views/energy/analysis/contrastAnalysis/components/searchArea.vue
+++ b/src/views/energy/analysis/contrastAnalysis/components/searchArea.vue
@ -443,7 +443,7 @@ export default {
    background-color: #0B58FF;
    border-radius: 1px;
    margin-right: 8px;
-    margin-top: 10px;
+    margin-top: 12px;
  }
 }
 </style>
--- a/src/views/energy/analysis/qoqAnalysis/components/searchArea.vue
+++ b/src/views/energy/analysis/qoqAnalysis/components/searchArea.vue
@ -8,6 +8,7 @@
        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
        popper-class="cascaderParent"
        size="small"
+        style="width: 250px;"
        clearable></el-cascader>
    </el-form-item>
    <el-form-item label="时间维度">
@ -157,7 +158,31 @@ export default {
      this.$emit('submit', this.queryParams)
    },
    exportData() {
-      this.$emit('exportD')
+      let name
+      if (this.queryParams.objId) {
+        name = this.getObjName(this.objList, this.queryParams.objId)
+      } else {
+        this.$modal.msgWarning("对象不能为空")
+        return false
+      }
+      this.$emit('exportD', {name: name})
+    },
+    // 递归取对象name
+    getObjName(list, id) {
+      let _this = this
+      for (let i = 0; i < list.length; i++) {
+        let a = list[i]
+        if (a.id === id) {
+          return a.name
+        } else {
+          if (a.children && a.children.length > 0) {
+            let res = _this.getObjName(a.children, id)
+            if (res) {
+              return res
+            }
+          }
+        }
+      }
    },
    transformTime(timeStamp) {// 本月最后一天
      let year = moment(timeStamp).format('YYYY')
--- a/src/views/energy/analysis/qoqAnalysis/index.vue
+++ b/src/views/energy/analysis/qoqAnalysis/index.vue
@ -83,9 +83,10 @@ export default {
      }
      this.chartData = this.list
    },
-    exportData() {
+    exportData(val) {
      if (this.list.length > 0) {
        var wb = XLSX.utils.table_to_book(document.querySelector(".qoq-out-table"))
+        let fileName = val.name + "环比分析.xlsx"
        var wbout = XLSX.write(wb, {
            bookType: "xlsx",
            bookSST: true,
@ -94,7 +95,7 @@ export default {
        try {
            FileSaver.saveAs(
            new Blob([wbout], { type: "application/octet-stream" }),
-            "环比分析.xlsx"
+            fileName
            )
        } catch (e) {
            if (typeof console !== "undefined") console.log(e, wbout);
--- a/src/views/energy/analysis/trendAnalysis/components/searchArea.vue
+++ b/src/views/energy/analysis/trendAnalysis/components/searchArea.vue
@ -407,7 +407,7 @@ export default {
    background-color: #0B58FF;
    border-radius: 1px;
    margin-right: 8px;
-    margin-top: 10px;
+    margin-top: 12px;
  }
 }
 </style>
--- a/src/views/energy/base/energyQuantityRealtime/index.vue
+++ b/src/views/energy/base/energyQuantityRealtime/index.vue
@ -13,7 +13,9 @@
      :limit="queryParams.pageSize"
      :table-props="tableProps"
      :table-data="list"
+      :selectWidth="55"
      :max-height="tableH"
+      @selection-change="selectChange"
    />
    <pagination
      :page.sync="queryParams.pageNo"
@ -25,9 +27,11 @@
 </template>

 <script>
-import { getEnergyQuantityRealtimePage, exportEnergyQuantityRealtimeExcel } from "@/api/base/energyQuantityRealtime";
-import { getEnergyTypeListAll } from "@/api/base/energyType";
+import { getEnergyQuantityRealtimePage, exportEnergyQuantityRealtimeExcel } from "@/api/base/energyQuantityRealtime"
+import { getEnergyTypeListAll } from "@/api/base/energyType"
 // import { publicFormatter } from '@/utils/dict'
+import FileSaver from "file-saver"
+import * as XLSX from 'xlsx/xlsx.mjs'
 const tableProps = [
  {
    prop: 'objName',
@ -113,7 +117,8 @@ export default {
        startTime: null,
        endTime: null
      },
-      energyTypeList: []
+      energyTypeList: [],
+      exportList: []
    };
  },
  created() {
@ -134,12 +139,13 @@ export default {
          this.getList()
          break
        default:
-          this.$modal.confirm('是否确认导出').then(() => {
-              return exportEnergyQuantityRealtimeExcel({...this.queryParams});
-            }).then(response => {
-              console.log(response)
-              this.$download.excel(response, '能源抄表.xls');
-            }).catch(() => {})
+          this.exportTable()
+          // this.$modal.confirm('是否确认导出').then(() => {
+          //     return exportEnergyQuantityRealtimeExcel({...this.queryParams});
+          //   }).then(response => {
+          //     console.log(response)
+          //     this.$download.excel(response, '能源抄表.xls');
+          //   }).catch(() => {})
      }
    },
    /** 查询列表 */
@ -147,6 +153,7 @@ export default {
      getEnergyQuantityRealtimePage(this.queryParams).then(response => {
        this.list = response.data.list || []
        this.total = response.data.total;
+        this.exportList = []
      });
    },
    getTypeList() {
@ -154,6 +161,48 @@ export default {
        this.formConfig[0].selectOptions = res.data || []
        this.energyTypeList = res.data || []
      })
+    },
+    selectChange(val) {
+      console.log(val)
+      this.exportList = val
+    },
+    // 勾选导出
+    exportTable() {
+      if (this.exportList.length > 0) {
+        let body = this.exportList.map((x) => [
+          x.objName,
+          x.objRemark,
+          x.energyTypeName,
+          x.startValue,
+          x.endValue,
+          x.diffValue,
+          x.amount
+        ])
+        let header = []
+        this.tableProps.map((y) => {
+          header.push(y.label)
+        })
+        body.unshift(header)
+        console.log(body)
+        const filename = '能源抄表.xlsx'
+        const ws_name = 'Sheet1'
+        const wb = XLSX.utils.book_new()
+        const ws = XLSX.utils.aoa_to_sheet(body)
+        XLSX.utils.book_append_sheet(wb, ws, ws_name)
+        let wbout = XLSX.write(wb, {
+          bookType: 'xlsx',
+          bookSST: false,
+          type: 'array'
+        })
+        FileSaver.saveAs(
+          new Blob([wbout], {
+            type: 'application/octet-stream'
+          }),
+          filename
+        )
+      } else {
+        this.$modal.msgWarning('请勾选需要导出的数据')
+      }
    }
  }
 };
--- a/src/views/energy/monitoring/energyLimit/components/energyLimitAdd.vue
+++ b/src/views/energy/monitoring/energyLimit/components/energyLimitAdd.vue
@ -1,5 +1,5 @@
 <template>
-  <el-form ref="form" :rules="rules" label-width="100px" :model="form">
+  <el-form ref="form" :rules="rules" label-width="110px" :model="form">
    <el-form-item label="监控对象" prop="objectId">
      <el-cascader
        style='width: 100%;'
@ -11,7 +11,7 @@
        clearable></el-cascader>
    </el-form-item>
    <el-form-item label="能源类型" prop="energyTypeId">
-      <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;">
+      <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;" @change="toggleType">
        <el-option
          v-for="item in this.energyTypeList"
          :key="item.id"
@ -26,7 +26,7 @@
        <el-option label="详细" :value= "2" ></el-option>
      </el-select>
    </el-form-item>
-    <el-form-item label="监控详细参数" prop="plcParamId" v-if="form.type === 2">
+    <el-form-item label="监控详细参数" prop="type" v-if="form.type === 2">
      <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;" @change="selectDetail">
        <el-option
          v-for="item in detailList"
@ -99,7 +99,7 @@ export default {
          if (res.code === 0) {
            this.form = res.data
            this.form.plcParamId = res.data.plcParamId || ''
-            this.form.limitType = this.form.limitType + ''
+            this.form.limitType = this.form.limitType ? this.form.limitType + '' : ''
            this.objIds = this.changeDetSelect(this.form.objectId, this.objList)
            if (this.form.type === 2) {
              this.getDetailList()
@ -128,7 +128,15 @@ export default {
      console.log(this.form)
      this.form.plcParamId = ''
      if (val === 2) {
+        if (this.form.objectId && this.form.energyTypeId) {
+          this.getDetailList()
+        }
+      }
+    },
+    toggleType() {
+      if (this.form.energyTypeId && this.form.type) {
        this.getDetailList()
+        this.form.plcParamId = ''
      }
    },
    // 递归处理分类回显问题
@ -158,6 +166,10 @@ export default {
    selectObj(val) {
      this.form.objectId = val[val.length-1]
      this.form.objectType = val.length-1
+      if (this.form.energyTypeId && this.form.type) {
+        this.getDetailList()
+        this.form.plcParamId = ''
+      }
    },
    selectDetail() {
      this.$forceUpdate()
--- a/src/views/energy/monitoring/energyLimit/index.vue
+++ b/src/views/energy/monitoring/energyLimit/index.vue
@ -65,7 +65,8 @@ const tableProps = [
  },
  {
    prop: 'type',
-    label: '监控模式'
+    label: '监控模式',
+    filter: (val) => (val != null ? ['合并', '详细'][val-1] : '-'),
  },
  {
    prop: 'plcParamName',
--- a/src/views/energy/monitoring/energyOverlimitLog/index.vue
+++ b/src/views/energy/monitoring/energyOverlimitLog/index.vue
@ -46,7 +46,7 @@ const tableProps = [
    label: '监控模式'
  },
  {
-    prop: 'plcParamId',
+    prop: 'paramName',
    label: '监控参数'
  },
  {
--- a/src/views/energy/monitoring/energyReportSearch/index.vue
+++ b/src/views/energy/monitoring/energyReportSearch/index.vue
@ -116,7 +116,7 @@ export default {
      energyTypeList: []
    };
  },
-  created() {
+  mounted() {
    window.addEventListener('resize', () => {
      this.tableH = this.tableHeight(260)
      this.isFold = this.searchBarWidth('energyReportSearchBox', 1180)
@ -130,11 +130,24 @@ export default {
    this.queryParams.endTime = this.formConfig[2].defaultSelect[1]
    this.getList()
    this.getTypeList()
-  },
-  mounted() {
    this.isFold = this.searchBarWidth('energyReportSearchBox', 1180)
  },
+  watch: {
+    $route: 'initData'
+  },
  methods: {
+    initData(to) {
+      if (to.name === 'EnergyReportSearch') {
+        if (this.$route.params.startTime && this.$route.params.endTime) {
+          this.formConfig[2].defaultSelect = [this.$route.params.startTime, this.$route.params.endTime]
+        } else {
+          this.formConfig[2].defaultSelect = [Date.now() - 7*24*3600000, Date.now()]
+        }
+        this.queryParams.startTime = this.formConfig[2].defaultSelect[0]
+        this.queryParams.endTime = this.formConfig[2].defaultSelect[1]
+        this.getList()
+      }
+    },
    getTypeList() {
      getEnergyTypeListAll().then((res) => {
        this.formConfig[1].selectOptions = res.data || []
--- a/src/views/equipment/analysis/efficiency/components/pieChart.vue
+++ b/src/views/equipment/analysis/efficiency/components/pieChart.vue
@ -6,7 +6,34 @@
 -->

 <template>
-	<div class="pie-chart" :data-eqname="value.equipmentName || 'Default'"></div>
+	<div class="chart-grid-item" style="">
+		<div
+			class="pie-chart"
+			ref="pieChart"
+			:data-eqname="value.equipmentName || 'Default'"></div>
+		<div class="data-view">
+			<div class="data-view__item">
+				<!-- <div class="data-view__item__value">111</div> -->
+				<div class="data-view__item__value">{{ textData.workTime }}</div>
+				<div class="data-view__item__title blue">工作时长</div>
+			</div>
+			<div class="data-view__item">
+				<!-- <div class="data-view__item__value">22</div> -->
+				<div class="data-view__item__value">{{ textData.stopTime }}</div>
+				<div class="data-view__item__title green">停机时长</div>
+			</div>
+			<div class="data-view__item">
+				<!-- <div class="data-view__item__value">10</div> -->
+				<div class="data-view__item__value">{{ textData.downTime }}</div>
+				<div class="data-view__item__title purple">故障时长</div>
+			</div>
+			<div class="data-view__item">
+				<!-- <div class="data-view__item__value">100%</div> -->
+				<div class="data-view__item__value">{{ textData.peEfficiency }}</div>
+				<div class="data-view__item__title yellow">速度开动率</div>
+			</div>
+		</div>
+	</div>
 </template>

 <script>
@ -19,7 +46,27 @@ export default {
 	data() {
 		return {
 			chart: null,
+			textData: {
+				workTime: '',
+				downTime: '',
+				stopTime: '',
+				peEfficiency: '',
+			},
 			config: {
+				title: {
+					text: '产线1', //<=========
+					top: '35%',
+					left: '49%',
+					textAlign: 'center',
+					textStyle: {
+						fontSize: 18,
+					},
+					subtext: '设备', //<=========
+					subtextStyle: {
+						fontSize: 14,
+					},
+				},
+				color: ['#3da8fd', '#8ef0ab', '#6b5cfd', '#FFC72A', 'transparent'],
 				grid: {
 					top: 0,
 					left: 0,
@ -30,6 +77,7 @@ export default {
 					trigger: 'item',
 				},
 				legend: {
+					show: false,
 					top: '0%',
 					left: 'center',
 					textStyle: {
@ -39,34 +87,70 @@ export default {
 					itemHeight: 10,
 				},
 				series: [
+					// 嵌套环形图
 					{
-						name: this.value.equipmentName || 'Default',
+						// 外环
+						name: '',
 						type: 'pie',
-						radius: ['40%', '75%'],
-						avoidLabelOverlap: false,
+						radius: ['75%', '90%'],
+						center: ['50%', '45%'],
 						label: {
 							show: false,
-							position: 'center',
 						},
-						data: ['workTime', 'stopTime', 'downTime'].map((v, index) => ({
-							name: ['工作时长', '停机时长', '故障时长'][index],
-							value: this.value[v],
-						})),
-						// data: [
-						// 	{ value: 1048, name: 'Search Engine' },
-						// 	{ value: 735, name: 'Direct' },
-						// 	{ value: 580, name: 'Email' },
-						// 	{ value: 484, name: 'Union Ads' },
-						// 	{ value: 300, name: 'Video Ads' },
-						// ],
+						data: [
+							//<=========
+							{ name: '工作时长', value: 1048 },
+							{ name: '停机时长', value: 735 },
+							{ name: '故障时长', value: 580 },
+						],
 					},
+					{
+						// 内环
+						name: '',
+						type: 'pie',
+						center: ['50%', '45%'],
+						radius: ['60%', '75%'],
+						itemStyle: {
+							borderRadius: 10,
+						},
+						label: {
+							show: false,
+						},
+						data: [
+							//<=========
+							{ name: '总', value: 3000 },
+							{ name: '', value: 1400 },
+						],
+					},
+					// {
+					// 	name: this.value.equipmentName || 'Default',
+					// 	type: 'pie',
+					// 	radius: ['40%', '75%'],
+					// 	avoidLabelOverlap: false,
+					// 	label: {
+					// 		show: false,
+					// 		position: 'center',
+					// 	},
+					// 	data: ['workTime', 'stopTime', 'downTime'].map((v, index) => ({
+					// 		name: ['工作时长', '停机时长', '故障时长'][index],
+					// 		value: this.value[v],
+					// 	})),
+					// 	// data: [
+					// 	// 	{ value: 1048, name: 'Search Engine' },
+					// 	// 	{ value: 735, name: 'Direct' },
+					// 	// 	{ value: 580, name: 'Email' },
+					// 	// 	{ value: 484, name: 'Union Ads' },
+					// 	// 	{ value: 300, name: 'Video Ads' },
+					// 	// ],
+					// },
 				],
 			},
 		};
 	},
 	mounted() {
+		console.log('value', this.value);
 		if (!this.chart) {
-			this.chart = echarts.init(this.$el);
+			this.chart = echarts.init(this.$refs.pieChart);
 			this.$nextTick(() => {
 				this.chart.setOption(this.config);
 			});
@ -75,24 +159,120 @@ export default {
 	beforeDestroy() {
 		if (this.chart) this.chart.dispose();
 	},
-	methods: {},
+	watch: {
+		value: {
+			handler(val) {
+				this.updateConfig(val);
+				if (this.chart) this.chart.setOption(this.config);
+			},
+			deep: true,
+			immediate: true,
+		},
+	},
+	methods: {
+		updateConfig(item) {
+			const {
+				lineName, // 产线
+				equipmentName, // 设备
+				downTime, // 故障时长(h)
+				stopTime, // 停机时长(h)
+				workTime, // 工作时长(h)
+				peEfficiency, // 速度开动率
+				timeEfficiency, // 时间开动率
+				//===============//
+				sectionName,
+				workRate,
+				stopRate,
+				downRate,
+				realProcSpeed,
+				designProcSpeed,
+				oee,
+				teep,
+				downCount,
+				mtbf,
+				mttr,
+			} = item;
+			this.config.title.text = lineName;
+			this.config.title.subtext = equipmentName;
+			this.config.series[0].data = [
+				{ name: '工作时长', value: workTime },
+				{ name: '停机时长', value: stopTime },
+				{ name: '故障时长', value: downTime },
+			];
+			this.config.series[1].data = [
+				{ name: '速度开动率', value: peEfficiency },
+				{ name: '', value: Math.ceil(peEfficiency) - peEfficiency },
+			];
+			//
+			this.textData = {
+				workTime: +workTime.toFixed(2),
+				stopTime: +stopTime.toFixed(2),
+				downTime: +downTime.toFixed(2),
+				peEfficiency: +peEfficiency.toFixed(2),
+			};
+		},
+	},
 };
 </script>

 <style scoped lang="scss">
-.pie-chart {
+.chart-grid-item {
+	padding: 12px;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
+.pie-chart {
+	height: 1px;
+	width: 100%;
+	flex: 1;
 	padding: 12px;
-	min-height: 320px;
-	background: #f1f1f1;
 	position: relative;
 }

-.pie-chart::before {
-	content: attr(data-eqname);
+.data-view {
+	display: flex;
+	justify-content: center;
+}
+
+.data-view__item {
+	display: flex;
+	flex-direction: column;
+	text-align: center;
+	align-items: center;
+	user-select: none;
+	padding: 0 6px;
+}
+
+.data-view__item:not(:last-child) {
+	border-right: 1px solid #f1f1f1;
+}
+
+.data-view__item__value {
 	font-size: 16px;
-	line-height: 1;
-	position: absolute;
-	top: -16px;
-	left: 0;
+	line-height: 24px;
+}
+
+.data-view__item__title {
+	font-size: 8px;
+	line-height: 14px;
+}
+
+.blue {
+	color: #3da8fd;
+}
+
+.green {
+	color: #8ef0ab;
+}
+
+.purple {
+	color: #6b5cfd;
+}
+
+.yellow {
+	color: #ffc72a;
 }
 </style>
--- a/src/views/equipment/analysis/efficiency/index.vue
+++ b/src/views/equipment/analysis/efficiency/index.vue
@ -13,46 +13,64 @@
 			ref="search-bar"
 			@headBtnClick="handleSearchBarBtnClick" />

-		<!-- 列表 -->
-		<base-table
-			class="base-table__margin"
-			:table-props="tableProps"
-			:table-data="list"
-			@emitFun="handleEmitFun">
-			<!-- :page="queryParams.pageNo"
-			:limit="queryParams.pageSize" -->
-			<!-- <method-btn
-				v-if="tableBtn.length"
-				slot="handleBtn"
-				label="操作"
-				:method-list="tableBtn"
-				@clickBtn="handleTableBtnClick" /> -->
-		</base-table>
+		<el-row>
+			<el-col class="custom-tabs">
+				<el-tabs
+					v-model="activeName"
+					:stretch="true"
+					@tab-click="handleTabClick">
+					<el-tab-pane :label="'\u2002数据列表\u2002'" name="table">
+						<!-- 列表 -->
+						<base-table
+							class="base-table__margin"
+							:table-props="tableProps"
+							:page="1"
+							:limit="10"
+							:table-data="list"
+							@emitFun="handleEmitFun"></base-table>
+					</el-tab-pane>
+					<el-tab-pane :label="'\u3000可视化\u3000'" name="graph">
+						<div
+							v-if="activeName == 'graph'"
+							class="graph"
+							style="display: flex; flex-direction: column; position: relative">
+							<div class="blue-title">各设备加工数量</div>
+							<div class="legend">
+								<div class="legend-item">
+									<span class="icon blue"></span>
+									<span class="text">工作时长</span>
+								</div>
+								<div class="legend-item">
+									<span class="icon green"></span>
+									<span class="text">停机时长</span>
+								</div>
+								<div class="legend-item">
+									<span class="icon purple"></span>
+									<span class="text">故障时长</span>
+								</div>
+								<div class="legend-item">
+									<span class="icon yellow"></span>
+									<span class="text">速度开动率</span>
+								</div>
+							</div>
+							<div class="graph-grid">
+								<div class="bg-grid grid-line">
+									<div class="grid-item" v-for="item in list.length" :key="item"></div>
+								</div>

-		<!-- 分页组件 -->
-		<!-- <pagination
-			v-show="total > 0"
-			:total="total"
-			:page.sync="queryParams.pageNo"
-			:limit.sync="queryParams.pageSize"
-			@pagination="getList" /> -->
-
-		<!-- 对话框(添加 / 修改) -->
-		<base-dialog
-			:dialogTitle="visualizationOpen ? '设备可视化' : '查看趋势'"
-			:dialogVisible="open"
-			:width="visualizationOpen ? '80%' : '700px'"
-			@closed="closed"
-			@close="cancel"
-			@cancel="cancel"
-			@confirm="submitForm">
-			<div class="visualization" v-if="visualizationOpen">
-				<pie-chart v-for="item in list" :key="item.id" :value="item" />
-			</div>
-			<div v-if="trendOpen">
-				<h1>查看趋势</h1>
-			</div>
-		</base-dialog>
+								<div class="bg-grid grid-charts">
+									<pie-chart
+										v-for="item in list"
+										:key="item.id"
+										:value="item" />
+									<!-- <pie-chart v-for="item in 5" :key="item" :value="item" /> -->
+								</div>
+							</div>
+						</div>
+					</el-tab-pane>
+				</el-tabs>
+			</el-col>
+		</el-row>
 	</div>
 </template>

@ -68,6 +86,7 @@ export default {
 	props: {},
 	data() {
 		return {
+			activeName: 'table',
 			open: false,
 			visualizationOpen: false,
 			trendOpen: false,
@ -86,84 +105,72 @@ export default {
 			// 		: undefined,
 			// ].filter((v) => v),
 			tableProps: [
-				{ prop: 'factoryName', label: '工厂', align: 'center' },
-				{ prop: 'lineName', label: '产线', align: 'center' },
-				{ prop: 'sectionName', label: '工段', align: 'center' },
-				{ prop: 'equipmentName', label: '设备', align: 'center' },
+				{ prop: 'factoryName', label: '工厂' },
+				{ prop: 'lineName', label: '产线' },
+				{ prop: 'sectionName', label: '工段' },
+				{ prop: 'equipmentName', label: '设备' },
 				{
 					label: '有效时间',
-					align: 'center',
 					children: [
 						{
 							width: 128,
 							prop: 'workTime',
 							label: '工作时长',
-							align: 'center',
 						},
 						{
 							width: 128,
 							prop: 'workRate',
 							label: '百分比',
-							align: 'center',
 							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
 					],
 				},
 				{
 					label: '关机时间',
-					align: 'center',
 					children: [
 						{
 							width: 128,
 							prop: 'stopTime',
 							label: '停机时长',
-							align: 'center',
 						},
-						{ width: 128, prop: 'stopRate', label: '百分比', align: 'center' },
+						{ width: 128, prop: 'stopRate', label: '百分比' },
 					],
 				},
 				{
 					label: '中断损失',
-					align: 'center',
 					children: [
 						{
 							width: 128,
 							prop: 'downTime',
 							label: '故障时长',
-							align: 'center',
 							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
-						{ width: 128, prop: 'downRate', label: '百分比', align: 'center' },
+						{ width: 128, prop: 'downRate', label: '百分比' },
 						{
 							width: 128,
 							prop: 'timeEfficiency',
 							label: '时间开动率',
-							align: 'center',
 							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
 					],
 				},
 				{
 					label: '速度损失',
-					align: 'center',
 					children: [
 						{
 							width: 128,
 							prop: 'realProcSpeed',
 							label: '实际加工速度',
-							align: 'center',
 						},
 						{
 							width: 128,
 							prop: 'designProcSpeed',
 							label: '理论加工速度',
-							align: 'center',
 						},
 						{
 							width: 128,
 							prop: 'peEfficiency',
 							label: '速度开动率',
-							align: 'center',
 							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
 					],
@ -171,19 +178,17 @@ export default {
 				{
 					prop: 'oee',
 					label: 'OEE',
-					align: 'center',
 					filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 				},
 				{
 					prop: 'teep',
 					label: 'TEEP',
-					align: 'center',
 					filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 				},
 				// {
 				// 	_action: 'view-trend',
 				// 	label: '趋势',
-				// 	align: 'center',
+				// 	,
 				// 	subcomponent: {
 				// 		props: ['injectData'],
 				// 		render: function (h) {
@ -240,7 +245,7 @@ export default {
 							parent: 'dateFilterType',
 							// 时间段选择
 							type: 'datePicker',
-							label: '时间段',
+							// label: '时间段',
 							dateType: 'daterange',
 							format: 'yyyy-MM-dd',
 							valueFormat: 'yyyy-MM-dd HH:mm:ss',
@ -254,7 +259,7 @@ export default {
 							parent: 'dateFilterType',
 							// 日期选择
 							type: 'datePicker',
-							label: '日期',
+							// label: '日期',
 							dateType: 'date',
 							placeholder: '选择日期',
 							format: 'yyyy-MM-dd',
@ -269,16 +274,16 @@ export default {
 					name: 'search',
 					color: 'primary',
 				},
-				{
-					type: 'separate',
-				},
-				{
-					type: 'button',
-					btnName: '设备可视化',
-					name: 'visualization',
-					plain: true,
-					color: 'success',
-				},
+				// {
+				// 	type: 'separate',
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: '设备可视化',
+				// 	name: 'visualization',
+				// 	plain: true,
+				// 	color: 'success',
+				// },
 				// {
 				// 	type: 'button',
 				// 	btnName: 'OEE',
@ -364,7 +369,6 @@ export default {
 				params: this.queryParams,
 			});
 			if (code == 0) {
-				console.log('data', data);
 				this.list = data;
 			}
 		},
@ -407,6 +411,8 @@ export default {
 		},

 		submitForm() {},
+
+		handleTabClick() {},
 	},
 };
 </script>
@ -416,4 +422,141 @@ export default {
 	display: grid;
 	grid-template-columns: repeat(3, minmax(240px, 1fr));
 }
+
+:deep(.custom-tabs) {
+	.el-tabs__header {
+		margin-bottom: 8px;
+		display: inline-block;
+		transform: translateY(-12px);
+	}
+
+	.el-tabs__item {
+		padding-left: 0 !important;
+		padding-right: 0 !important;
+		line-height: 36px !important;
+		height: 36px;
+	}
+}
+
+.blue-title {
+	position: relative;
+	padding: 4px 0;
+	padding-left: 12px;
+	font-size: 14px;
+
+	&::before {
+		content: '';
+		position: absolute;
+		left: 0;
+		top: 6px;
+		height: 16px;
+		width: 4px;
+		border-radius: 1px;
+		background: #0b58ff;
+	}
+}
+
+.graph-grid {
+	margin-top: 8px;
+	padding: 12px;
+	position: relative;
+	border-radius: 12px;
+	border: 1px solid #ccc;
+	// background: #0003;
+}
+.bg-grid {
+	display: grid;
+	place-content: center;
+	grid-template-columns: repeat(4, minmax(280px, 1fr));
+	grid-auto-columns: 280px;
+	grid-auto-rows: 290px;
+	overflow: hidden;
+	position: relative;
+}
+
+.grid-line::after {
+	content: '';
+	position: absolute;
+	top: -1px;
+	left: -1px;
+	width: calc(100% + 2px);
+	height: calc(100% + 2px);
+	display: inline-block;
+	border: 8px solid #fff;
+}
+
+.grid-charts {
+	position: absolute;
+	width: calc(100% - 24px);
+	top: 12px;
+	left: 12px;
+}
+
+.grid-item {
+	border: 1px solid #ccc;
+}
+
+.grid-item:not(:first-child) {
+	border-left: 0;
+	border-top: 0;
+}
+
+.legend {
+	position: absolute;
+	top: 8px;
+	right: 12px;
+	display: flex;
+}
+
+.legend .legend-item {
+	display: flex;
+	align-items: center;
+	margin-left: 12px;
+}
+
+.legend .legend-item .icon {
+	width: 10px;
+	height: 10px;
+	border-radius: 1px;
+	margin-right: 4px;
+	margin-top: 1px;
+}
+
+.legend .legend-item .text {
+	color: #8c8c8c;
+}
+
+.blue {
+	background-color: #3da8fd;
+}
+
+.green {
+	background-color: #8ef0ab;
+}
+
+.purple {
+	background-color: #6b5cfd;
+}
+
+.yellow {
+	background-color: #ffc72a;
+}
+
+@media screen and (max-width: 1390px) {
+	.bg-grid {
+		grid-template-columns: repeat(3, minmax(280px, 1fr));
+	}
+}
+
+@media screen and (max-width: 1190px) {
+	.bg-grid {
+		grid-template-columns: repeat(2, minmax(280px, 1fr));
+	}
+}
+
+@media screen and (max-width: 640px) {
+	.bg-grid {
+		grid-template-columns: repeat(1, minmax(280px, 1fr));
+	}
+}
 </style>
--- a/src/views/equipment/analysis/exception/index.vue
+++ b/src/views/equipment/analysis/exception/index.vue
@ -50,39 +50,47 @@ export default {
 	data() {
 		return {
 			searchBarKeys: ['name', 'code'],
+			// tableBtn: [
+			// 	this.$auth.hasPermi('base:equipment-group:update')
+			// 		? {
+			// 				type: 'edit',
+			// 				btnName: '修改',
+			// 		  }
+			// 		: undefined,
+			// 	this.$auth.hasPermi('base:equipment-group:delete')
+			// 		? {
+			// 				type: 'delete',
+			// 				btnName: '删除',
+			// 		  }
+			// 		: undefined,
+			// ].filter((v) => v),
 			tableBtn: [
-				this.$auth.hasPermi('base:equipment-group:update')
-					? {
-							type: 'edit',
-							btnName: '修改',
-					  }
-					: undefined,
-				this.$auth.hasPermi('base:equipment-group:delete')
-					? {
-							type: 'delete',
-							btnName: '删除',
-					  }
-					: undefined,
-			].filter((v) => v),
-			tableProps: [
-				{ prop: 'lineName', label: '产线', align: 'center' },
-				{ prop: 'sectionName', label: '工段', align: 'center' },
-				{ prop: 'equipmentName', label: '设备', align: 'center' },
 				{
-					width: 188,
+					type: 'edit',
+					btnName: '修改',
+				},
+				{
+					type: 'delete',
+					btnName: '删除',
+				},
+			],
+			tableProps: [
+				{ prop: 'lineName', label: '产线' },
+				{ prop: 'sectionName', label: '工段' },
+				{ prop: 'equipmentName', label: '设备' },
+				{
+					width: 240,
 					prop: 'mtbf',
 					label: '平均故障间隔时间[MTBF](h)',
-					align: 'center',
 				},
 				{
-					width: 180,
+					width: 240,
 					prop: 'mttr',
 					label: '平均维修时间[MTTR](h)',
-					align: 'center',
 				},
-				{ prop: 'workTime', label: '工作时长(h)', align: 'center' },
-				{ prop: 'downTime', label: '故障时长(h)', align: 'center' },
-				{ prop: 'downCount', label: '故障次数', align: 'center' },
+				{ width: 128, prop: 'workTime', label: '工作时长(h)' },
+				{ width: 128, prop: 'downTime', label: '故障时长(h)' },
+				{ prop: 'downCount', label: '故障次数' },
 			],
 			searchBarFormConfig: [
 				{
@ -113,6 +121,8 @@ export default {
 			],
 			// 查询参数
 			queryParams: {
+				pageNo: 1,
+				pageSize: 10,
 				lineId: null,
 				factoryId: null,
 				recordTime: null,
@ -162,15 +172,13 @@ export default {
 						this.queryParams.recordTime = [
 							moment()
 								.month(btn.month - 1)
-								.format('YYYY-MM')+'-01 00:00:00',
-							moment()
-								.month(btn.month)
-								.format('YYYY-MM')+'-01 00:00:00',
+								.format('YYYY-MM') + '-01 00:00:00',
+							moment().month(btn.month).format('YYYY-MM') + '-01 00:00:00',
 						];
 					} else {
 						this.queryParams.recordTime = null;
 					}
-                    this.queryParams.lineId = btn.lineId || null;
+					this.queryParams.lineId = btn.lineId || null;
 					this.handleQuery();
 					break;
 			}
--- a/src/views/equipment/analysis/quality/components/lineChart.vue
+++ b/src/views/equipment/analysis/quality/components/lineChart.vue
@ -15,27 +15,143 @@ import * as echarts from 'echarts';
 export default {
 	name: 'LineChart',
 	components: {},
-	props: ['config'],
+	props: ['config', 'list'],
 	data() {
 		return {
 			chart: null,
 		};
 	},
-	computed: {},
+	// watch: {
+	// 	list: {
+	// 		handler(listdata) {
+	// 			if (listdata && listdata.length) {
+	// 				console.log('[linechart] list changed', listdata);
+	// 				const option = this.handleList(listdata);
+	// 				this.setOption(option);
+	// 			}
+	// 		},
+	// 		immediate: true,
+	// 	},
+	// },
+	computed: {
+		option() {
+			const opt = [];
+			this.list.map((eq) => {
+				/** [设备名, ok数量, 不ok数量] */
+				opt.push([eq.equipmentName, eq.okQuantity, eq.nokQuantity]);
+			});
+			return {
+				color: ['#288AFF', '#8EF0AB'],
+				tooltip: {
+					trigger: 'axis',
+					axisPointer: {
+						type: 'shadow',
+					},
+				},
+				legend: {
+					itemWidth: 12,
+					itemHeight: 12,
+					right: 0
+				},
+				grid: {
+					left: '1%',
+					right: '1%',
+					top: '8%',
+					bottom: '3%',
+					containLabel: true,
+				},
+				// xAxis: [
+				// 	{
+				// 		type: 'category',
+				// 		data: ['设备1', '设备2', '设备3', '设备4', '设备5'],
+				// 	},
+				// ],
+				// yAxis: [
+				// 	{
+				// 		type: 'value',
+				// 		splitLine: {
+				// 			lineStyle: {
+				// 				color: '#0001',
+				// 			},
+				// 		},
+				// 	},
+				// ],
+				xAxis: {
+					type: 'category',
+					axisTick: { show: false },
+					data: opt.map((item) => item[0]),
+				},
+				yAxis: {
+					type: 'value',
+					splitLine: {
+						lineStyle: {
+							color: '#0001',
+						},
+					},
+				},
+				series: [
+					{
+						name: '合格数量',
+						type: 'bar',
+						barWidth: 20,
+						stack: 's',
+						data: opt.map((item) => item[1]),
+					},
+					{
+						name: '不合格数量',
+						type: 'bar',
+						barWidth: 20,
+						stack: 's',
+						data: opt.map((item) => item[2]),
+					},
+				],
+			};
+		},
+	},
 	mounted() {
+		console.log('[linechart] mounted');
 		this.init();
 	},
 	beforeDestroy() {
 		if (this.chart) {
 			this.chart.dispose();
 		}
+		console.log('[linechart] destroyed');
 	},
 	methods: {
 		init() {
-			console.log('thsi el', this.$el);
 			if (!this.chart) this.chart = echarts.init(this.$el);
-			this.chart.setOption(this.config);
+			console.log('[linechart] initialized', this.$el);
+			this.$nextTick(() => {
+				this.setOption();
+			});
 		},
+
+		setOption() {
+			if (this.chart) this.chart.setOption(this.option);
+			console.log('[linechart] option settled');
+		},
+
+		// handleList(list) {
+		// 	/** 清空数据 */
+		// 	this.option.series[0].data.splice(0);
+		// 	this.option.series[1].data.splice(0);
+		// 	this.option.xAxis.data.splice(0);
+
+		// 	list.map((eq) => {
+		// 		this.option.xAxis.data.push(eq.equipmentName);
+		// 		this.option.series[0].data.push(eq.nokQuantity);
+		// 		this.option.series[1].data.push(eq.okQuantity);
+		// 	});
+
+		// 	this.setOption();
+
+		// 	// const pureList = list.map((eq) => ({
+		// 	// 	name: eq.equipmentName,
+		// 	// 	ok: eq.okQuantity,
+		// 	// 	nok: eq.nokQuantity,
+		// 	// }));
+		// },
 	},
 };
 </script>
@ -43,7 +159,7 @@ export default {
 <style scoped lang="scss">
 .line-chart {
 	padding: 0 12px;
-	background: #e1e1e1;
-	min-height: 320px;
+	height: 1px;
+	flex: 1;
 }
 </style>
--- a/src/views/equipment/analysis/quality/index.vue
+++ b/src/views/equipment/analysis/quality/index.vue
@ -13,28 +13,35 @@
 			ref="search-bar"
 			@headBtnClick="handleSearchBarBtnClick" />

-		<!-- 列表 -->
-		<base-table
-			:table-props="tableProps"
-			:page="queryParams.pageNo"
-			:limit="queryParams.pageSize"
-			:table-data="list"
-			@emitFun="handleEmitFun"></base-table>
-
-		<!-- 图形分析 dialog -->
-		<!-- <base-dialog
-			dialogTitle="图形视角"
-			:dialogVisible="dialogVisible"
-			width="60%"
-			@close="dialogClose"
-			@cancel="dialogClose"
-			@confirm="dialogClose">
-			<LineChart v-if="dialogVisible" :config="lineChartConfig" />
-		</base-dialog> -->
+		<el-row>
+			<el-col class="custom-tabs">
+				<el-tabs
+					v-model="activeName"
+					:stretch="true"
+					@tab-click="handleTabClick">
+					<el-tab-pane :label="'数据列表'" name="table">
+						<!-- 列表 -->
+						<base-table
+							:table-props="tableProps"
+							:page="queryParams.pageNo"
+							:limit="queryParams.pageSize"
+							:table-data="list"
+							@emitFun="handleEmitFun"></base-table>
+					</el-tab-pane>
+					<el-tab-pane :label="'\u3000柱状图\u3000'" name="graph">
+						<div v-if="activeName == 'graph'" class="graph" style="height: 40vh; display: flex; flex-direction: column;">
+							<div class="blue-title">各设备加工数量</div>
+							<LineChart :list="list" />
+						</div>
+					</el-tab-pane>
+				</el-tabs>
+			</el-col>
+		</el-row>
 	</div>
 </template>

 <script>
+import moment from 'moment';
 import LineChart from './components/lineChart.vue';

 export default {
@ -42,12 +49,14 @@ export default {
 	components: { LineChart },
 	props: {},
 	data() {
+		const now = new Date();
+		const [y, m, d] = [now.getFullYear(), now.getMonth(), now.getDate()];
 		return {
 			dialogVisible: false,
 			urls: {
 				page: '/analysis/equipment-analysis/quality',
 			},
-			mode: 'table', // defaults to 'table'
+			activeName: 'table', // defaults to 'table'
 			searchBarFormConfig: [
 				// 产品
 				{
@ -72,13 +81,30 @@ export default {
 					dateType: 'daterange', // datetimerange
 					// format: 'yyyy-MM-dd HH:mm:ss',
 					format: 'yyyy-MM-dd',
-					valueFormat: 'yyyy-MM-dd HH:mm:ss',
 					// valueFormat: 'timestamp',
+					valueFormat: 'yyyy-MM-dd HH:mm:ss',
 					rangeSeparator: '-',
 					startPlaceholder: '开始日期',
 					endPlaceholder: '结束日期',
-					defaultTime: ['00:00:00', '23:59:59'],
 					param: 'recordTime',
+					defaultSelect: [
+						new Date(y, m, d)
+							.toLocaleString()
+							.split('/')
+							.map((item, index) => {
+								if (index == 1 || index == 2) return item.padStart(2, '0');
+								return item;
+							})
+							.join('-'),
+						new Date(y, m, d, 23, 59, 59)
+							.toLocaleString()
+							.split('/')
+							.map((item, index) => {
+								if (index == 1 || index == 2) return item.padStart(2, '0');
+								return item;
+							})
+							.join('-'),
+					],
 				},
 				{
 					type: 'button',
@ -86,9 +112,9 @@ export default {
 					name: 'search',
 					color: 'primary',
 				},
-				{
-					type: 'separate',
-				},
+				// {
+				// 	type: 'separate',
+				// },
 				// {
 				// 	type: 'button',
 				// 	btnName: '列表数据',
@ -111,43 +137,36 @@ export default {
 					// width: 160,
 					prop: 'sectionName',
 					label: '工段',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'equipmentName',
 					label: '设备名称',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'products',
 					label: '产品名称',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'inQuantity',
 					label: '进片数量',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'outQuantity',
 					label: '出片数量',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'nokQuantity',
 					label: '破损/不合格数',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'passRate',
 					label: '合格率',
-					align: 'center',
 				},
 			],
 			lineChartConfig: {
@ -161,14 +180,14 @@ export default {
 					top: 0,
 					left: 0,
 					padding: 5,
-                    icon: 'roundRect',
-                    itemWidth: 12,
-                    itemHeight: 12,
-                    itemGap: 20,
+					icon: 'roundRect',
+					itemWidth: 12,
+					itemHeight: 12,
+					itemGap: 20,
 					textStyle: {
-                        fontSize: 14,
-                        lineHeight: 14
-                    },
+						fontSize: 14,
+						lineHeight: 14,
+					},
 				},
 				xAxis: {
 					type: 'category',
@ -176,13 +195,13 @@ export default {
 				},
 				yAxis: {
 					type: 'value',
-                    name: '合格率',
-                    nameLocation: 'end',
-                    nameTextStyle: {
-                        fontSize: 14,
-                        align: 'right'
-                    },
-                    nameGap: 26
+					name: '合格率',
+					nameLocation: 'end',
+					nameTextStyle: {
+						fontSize: 14,
+						align: 'right',
+					},
+					nameGap: 26,
 				},
 				series: [
 					{
@ -229,6 +248,11 @@ export default {
 		this.getList();
 	},
 	methods: {
+		handleTabClick(tab, event) {
+			// console.log('tab event', tab, event);
+			// tab is el-tab vue component.
+		},
+
 		async fillLineOptions() {
 			const { data } = await this.$axios({
 				url: '/base/production-line/listAll',
@ -340,4 +364,38 @@ export default {
 		}
 	}
 }
+
+:deep(.custom-tabs) {
+	.el-tabs__header {
+		margin-bottom: 8px;
+		display: inline-block;
+		transform: translateY(-12px);
+	}
+
+	.el-tabs__item {
+		padding-left: 0 !important;
+		padding-right: 0 !important;
+		line-height: 36px !important;
+		height: 36px;
+	}
+}
+
+.blue-title {
+	position: relative;
+	padding: 4px 0;
+	padding-left: 12px;
+	font-size: 14px;
+
+	&::before {
+		content: "";
+		position: absolute;
+		left: 0;
+		top: 6px;
+		height: 16px;
+		width: 4px;
+		border-radius: 1px;
+		background: #0b58ff;
+	}
+}
+
 </style>
--- a/src/views/equipment/timing-diagram/output/components/lineChart.vue
+++ b/src/views/equipment/timing-diagram/output/components/lineChart.vue
@ -21,7 +21,14 @@ export default {
 			chart: null,
 		};
 	},
-	computed: {},
+	watch: {
+		config: {
+			handler(value) {
+				if (value != null) this.setOption(value);
+			},
+			deep: true,
+		},
+	},
 	mounted() {
 		this.init();
 	},
@ -32,9 +39,11 @@ export default {
 	},
 	methods: {
 		init() {
-			console.log('thsi el', this.$el);
 			if (!this.chart) this.chart = echarts.init(this.$el);
-			this.chart.setOption(this.config);
+			this.setOption(this.config);
+		},
+		setOption(option) {
+			if (this.chart) this.chart.setOption(option);
 		},
 	},
 };
--- a/src/views/equipment/timing-diagram/output/index.vue
+++ b/src/views/equipment/timing-diagram/output/index.vue
@ -6,25 +6,44 @@
 -->

 <template>
-	<div class="app-container">
-		<h1>设备产量时序图</h1>
-		<!-- 搜索工作栏 -->
-		<SearchBar
-			:formConfigs="searchBarFormConfig"
-			ref="search-bar"
-			@headBtnClick="handleSearchBarBtnClick" />
+	<div
+		class="production-timegraph-container"
+		style="background: #f2f4f9; flex: 1">
+		<el-row
+			class=""
+			style="
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 16px 16px 0;
+				border-radius: 8px;
+			">
+			<div class="blue-title">生产节拍时序图</div>
+			<!-- <h1>设备状态时序图</h1> -->
+			<!-- 搜索工作栏 -->
+			<SearchBar
+				:formConfigs="searchBarFormConfig"
+				ref="search-bar"
+				:remove-blue="true"
+				@headBtnClick="handleSearchBarBtnClick" />
+		</el-row>

-		<div class="main-area">
-			<div class="graphs" v-if="graphList.length">
-				<div class="graph" v-for="(eq, index) in graphList" :key="eq.key">
-					<h2 class="graph-title">{{ eq.key }}</h2>
-					<LineChart
-						:key="eq.key + '__linechart'"
-						:config="getRealConfig(index)" />
+		<el-row
+			class=""
+			style="
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 16px 16px 24px;
+				border-radius: 8px;
+			">
+			<div class="blue-title">设备产量时序图</div>
+
+			<div class="main-area">
+				<div class="graphs" v-if="graphList.length">
+					<LineChart :config="templateConfig" />
 				</div>
+				<div class="no-data-bg" v-else></div>
 			</div>
-			<h2 v-else>请添加设备</h2>
-		</div>
+		</el-row>

 		<!-- 对话框(添加 / 修改) -->
 		<base-dialog
@ -58,6 +77,7 @@ export default {
 	props: {},
 	data() {
 		return {
+			accumulators: new Map(),
 			searchBarFormConfig: [
 				{
 					type: 'select',
@ -77,15 +97,16 @@ export default {
 				{
 					type: 'datePicker',
 					label: '时间段',
-					dateType: 'daterange', // datetimerange
+					dateType: 'date', // datetimerange
 					// format: 'yyyy-MM-dd HH:mm:ss',
 					format: 'yyyy-MM-dd',
 					valueFormat: 'yyyy-MM-dd HH:mm:ss',
 					// valueFormat: 'timestamp',
-					rangeSeparator: '-',
-					startPlaceholder: '开始日期',
-					endPlaceholder: '结束日期',
-					defaultTime: ['00:00:00', '23:59:59'],
+					// rangeSeparator: '-',
+					// startPlaceholder: '开始日期',
+					// endPlaceholder: '结束日期',
+					// defaultTime: ['00:00:00', '23:59:59'],
+					placeholder: '选择日期',
 					param: 'recordTime',
 				},
 				{
@ -99,9 +120,9 @@ export default {
 				},
 				{
 					type: 'button',
-					btnName: '设备对比',
+					btnName: '添加对比',
 					name: 'compare',
-					color: 'warning',
+					color: 'primary',
 					plain: true,
 				},
 			],
@ -115,30 +136,47 @@ export default {
 			eqList: [],
 			graphList: [],
 			templateConfig: {
+				color: ['#283D68', '#FFB61F', '#4481FF', '#5AD8A6', '#E97466'],
 				grid: {
-					top: 88,
-					left: 56,
-					right: 56,
-					bottom: 56,
+					top: 48,
+					left: 48,
+					right: 24,
+					bottom: 24,
 				},
 				legend: {
 					top: 0,
-					left: 0,
-					padding: 5,
-					icon: 'roundRect',
-					itemWidth: 12,
-					itemHeight: 12,
+					right: 12,
+					padding: 6,
+					itemWidth: 16,
+					itemHeight: 8,
 					itemGap: 20,
 					textStyle: {
-						fontSize: 14,
-						lineHeight: 14,
+						fontSize: 12,
+						lineHeight: 12,
+						color: '#0007',
 					},
 				},
+				tooltip: {
+					show: true,
+					trigger: 'axis',
+				},
 				xAxis: {
 					type: 'category',
-					data: Array(24)
-						.fill(1)
-						.map((item, index) => `${index}:00`),
+					boundaryGap: true,
+					axisTick: {
+						// show: false,
+						alignWithLabel: true,
+						lineStyle: {
+							color: '#0003',
+						},
+					},
+					axisLabel: {
+						color: '#0007',
+					},
+					data: [],
+					// data: Array(24)
+					// 	.fill(1)
+					// 	.map((item, index) => `${index}:00`),
 				},
 				yAxis: {
 					type: 'value',
@ -146,19 +184,41 @@ export default {
 					nameLocation: 'end',
 					nameTextStyle: {
 						fontSize: 14,
-						align: 'right',
+						align: 'center',
 					},
 					nameGap: 26,
+					max: function (value) {
+						return value.max + Math.floor(value.max / 5);
+					},
 				},
 				series: [
-					{
-						name: '产线1',
-						data: Array(24)
-							.fill(1)
-							.map(() => Math.random() * 100),
-						type: 'line',
-						smooth: true,
-					},
+					// {
+					// 	name: '产线1',
+					// 	data: Array(24)
+					// 		.fill(1)
+					// 		.map(() => Math.random() * 100),
+					// 	type: 'line',
+					// 	symbol: 'circle',
+					// 	// smooth: true,
+					// },
+					// {
+					// 	name: '产线2',
+					// 	data: Array(24)
+					// 		.fill(1)
+					// 		.map(() => Math.random() * 100),
+					// 	type: 'line',
+					// 	symbol: 'circle',
+					// 	// smooth: true,
+					// },
+					// {
+					// 	name: '产线3',
+					// 	data: Array(24)
+					// 		.fill(1)
+					// 		.map(() => Math.random() * 100),
+					// 	type: 'line',
+					// 	symbol: 'circle',
+					// 	// smooth: true,
+					// },
 				],
 			},
 		};
@ -176,7 +236,12 @@ export default {
 					this.queryParams.lineId = payload.lineId || null;
 					this.queryParams.sectionId = payload.sectionId || null;
 					this.queryParams.equipmentId = payload.equipmentId || null;
-					this.queryParams.recordTime = payload.recordTime || null;
+					this.queryParams.recordTime = payload.recordTime
+						? [
+								payload.recordTime,
+								payload.recordTime.replace('00:00:00', '23:59:59'),
+						  ]
+						: null;
 					this.getList();
 					break;
 				case 'compare':
@ -230,10 +295,41 @@ export default {
 				// ];
 				// eq2.key = 'SS2';
 				// this.graphList = [eq1, eq2];
-				console.log('graph list', this.graphList);
+
+				this.graphList.forEach(this.setSeries);
+			} else {
+				this.graphList = [];
+				this.graphList.forEach(this.setSeries);
 			}
 		},

+		setSeries(eqArr) {
+			if (eqArr.length == 0) {
+				this.templateConfig.series = [];
+				return;
+			}
+
+			let isInit = false;
+			if (this.accumulators.has(eqArr.key) == false) {
+				this.accumulators.set(eqArr.key, 0);
+				isInit = true;
+			}
+
+			let accumulator = this.accumulators.get(eqArr.key);
+			if ((accumulator && !isInit) || (accumulator == 0 && isInit == false)) {
+				accumulator++;
+				this.accumulators.set(eqArr.key, accumulator);
+			}
+
+			this.templateConfig.series.push({
+				name: eqArr.key + (accumulator == 0 ? '' : '-' + accumulator),
+				// name: Math.random(),
+				type: 'line',
+				symbol: 'circle',
+				data: this.getEquipmentQuantity(eqArr),
+			});
+		},
+
 		/** 获得设备产量 */
 		getEquipmentQuantity(equipmentArr) {
 			return equipmentArr.map((item) => item.totalQuantity);
@ -246,19 +342,6 @@ export default {
 			);
 		},

-		getRealConfig(index) {
-			// if (!this.graphList || this.graphList.length == 0) return;
-			const config = JSON.parse(JSON.stringify(this.templateConfig));
-			// config.legend.data = this.graphList[index].key;
-			config.series[0].name = this.graphList[index]?.key;
-			// console.log("this.graphList?.[index]", this.graphList?.[index]);
-			config.series[0].data = this.getEquipmentQuantity(
-				this.graphList?.[index] || []
-			);
-			config.xAxis.data = this.getTimeinfo(this.graphList?.[index] || []);
-			return config;
-		},
-
 		/** 准备设备数据 */
 		async initEquipment() {
 			const { code, data } = await this.$axios({
@ -313,18 +396,42 @@ export default {
 				method: 'get',
 				params: this.queryParams,
 			});
+
+			this.queryParams.equipmentId = null; // 清空一下
 			if (code == 0) {
 				const newEqlist = this.objectToArray(data);
 				if (!newEqlist || newEqlist.length == 0) {
 					this.$message.error('该设备没有产量数据');
 					return;
 				}
-				this.graphList.push(newEqlist[0]);
+				this.graphList.push(...newEqlist);
+				newEqlist.forEach(this.setSeries);
 			}
 			this.open = false;
-		}
+		},
 	},
 };
 </script>

-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.blue-title {
+	position: relative;
+	padding: 4px 0;
+	padding-left: 12px;
+	font-size: 14px;
+	color: #606266;
+	font-weight: 700;
+	margin-bottom: 12px;
+
+	&::before {
+		content: '';
+		position: absolute;
+		left: 0;
+		top: 6px;
+		height: 16px;
+		width: 4px;
+		border-radius: 1px;
+		background: #0b58ff;
+	}
+}
+</style>
--- a/src/views/equipment/timing-diagram/status/index.vue
+++ b/src/views/equipment/timing-diagram/status/index.vue
@ -6,29 +6,51 @@
 -->

 <template>
-	<div class="app-container">
-		<h1>设备状态时序图</h1>
-		<!-- 搜索工作栏 -->
-		<SearchBar
-			:formConfigs="searchBarFormConfig"
-			ref="search-bar"
-			@headBtnClick="handleSearchBarBtnClick" />
+	<div class="status-timegraph-container" style="background: #f2f4f9; flex: 1">
+		<el-row
+			class=""
+			style="
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 16px 16px 0;
+				border-radius: 8px;
+			">
+			<div class="blue-title">生产节拍时序图</div>
+			<!-- <h1>设备状态时序图</h1> -->
+			<!-- 搜索工作栏 -->
+			<SearchBar
+				:formConfigs="searchBarFormConfig"
+				ref="search-bar"
+				:remove-blue="true"
+				@headBtnClick="handleSearchBarBtnClick" />
+		</el-row>

-		<div class="main-area">
-			<div class="legend-row">
-				<div class="legend">
-					<div class="icon running"></div>
-					<div>运行中</div>
-				</div>
-				<!-- <div class="legend">
+		<el-row
+			class=""
+			style="
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 16px 16px 32px;
+				border-radius: 8px;
+			">
+			<el-row :gutter="20">
+				<el-col :span="6">
+					<div class="blue-title">设备状态时序图</div>
+				</el-col>
+				<el-col :span="18" class="legend-row">
+					<div class="legend">
+						<div class="icon running"></div>
+						<div>运行中</div>
+					</div>
+					<!-- <div class="legend">
 					<div class="icon waiting"></div>
 					<div>待机</div>
 				</div> -->
-				<div class="legend">
-					<div class="icon fault"></div>
-					<div>故障</div>
-				</div>
-				<!-- <div class="legend">
+					<div class="legend">
+						<div class="icon fault"></div>
+						<div>故障</div>
+					</div>
+					<!-- <div class="legend">
 					<div class="icon lack"></div>
 					<div>缺料</div>
 				</div>
@ -36,83 +58,51 @@
 					<div class="icon full"></div>
 					<div>满料</div>
 				</div> -->
-				<div class="legend">
-					<div class="icon stop"></div>
-					<div>计划停机</div>
+					<div class="legend">
+						<div class="icon stop"></div>
+						<div>计划停机</div>
+					</div>
+				</el-col>
+			</el-row>
+			<div class="main-area">
+				<div class="graphs" v-if="graphList.length">
+					<div class="graph" v-for="eq in graphList" :key="eq.key">
+						<h2 class="graph-title">{{ eq.key }}</h2>
+
+						<div class="graph-content">
+							<el-popover
+								trigger="hover"
+								v-for="blc in eq"
+								:key="blc.startTime"
+								:title="
+									blc.status == 0
+										? '运行'
+										: blc.status == 2
+										? '故障'
+										: '计划停机'
+								"
+								placement="top"
+								:content="new Date(blc.startTime).toLocaleTimeString()">
+								<div
+									slot="reference"
+									:key="blc.startTime + '__div'"
+									class="graph-item-fixed tick"
+									:class="{
+										running: blc.status == 0,
+										fault: blc.status == 2,
+										stop: blc.status == 1,
+									}"
+									:style="{ height: '32px', width: blc.duration * 2 + 'px' }"
+									:data-time="
+										new Date(blc.startTime).toLocaleTimeString()
+									"></div>
+							</el-popover>
+						</div>
+					</div>
 				</div>
+				<h2 v-else>请添加设备</h2>
 			</div>
-			<div class="graphs" v-if="graphList.length">
-				<!-- <div class="graph">
-					<h2 class="graph-title">设备1</h2>
-					<div class="graph-item running tick" data-time="00:00"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item lack tick" data-time="03:00"></div>
-					<div class="graph-item full tick" data-time="04:00"></div>
-					<div class="graph-item waiting tick" data-time="05:00"></div>
-					<div class="graph-item running tick" data-time="06:00"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item fault tick" data-time="08:00"></div>
-					<div class="graph-item waiting tick" data-time="09:00"></div>
-					<div class="graph-item running tick" data-time="10:00"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item lack tick" data-time="13:00"></div>
-					<div class="graph-item full tick" data-time="14:00"></div>
-					<div class="graph-item running tick" data-time="15:00"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item fault tick" data-time="18:00"></div>
-					<div class="graph-item running tick" data-time="19:00"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item running"></div>
-					<div class="graph-item stop tick" data-time="23:00"></div>
-				</div> -->
-				<div class="graph" v-for="eq in graphList" :key="eq.key">
-					<h2 class="graph-title">{{ eq.key }}</h2>
-					<div
-						v-for="blc in eq"
-						:key="blc.startTime"
-						class="graph-item-fixed tick"
-						:class="{
-							running: blc.status == 0,
-							fault: blc.status == 2,
-							stop: blc.status == 1,
-						}"
-						:style="{ width: blc.duration * 2 + 'px' }"
-						:data-time="new Date(blc.startTime).toLocaleTimeString()"></div>
-				</div>
-				<!-- <div class="graph">
-					<h2 class="graph-title">设备3</h2>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-					<div class="graph-item"></div>
-				</div> -->
-			</div>
-			<h2 v-else>请添加设备</h2>
-		</div>
+		</el-row>

 		<!-- 对话框(添加 / 修改) -->
 		<base-dialog
@ -185,9 +175,9 @@ export default {
 				},
 				{
 					type: 'button',
-					btnName: '设备对比',
+					btnName: '添加对比',
 					name: 'compare',
-					color: 'warning',
+					color: 'primary',
 					plain: true,
 				},
 			],
@ -344,26 +334,52 @@ export default {

 <style scoped lang="scss">
 .graph {
-	border: 1px solid #ccc;
-	padding: 12px 12px 28px 12px;
-	margin: 64px 0;
+	// border: 1px solid #ccc;
+	// padding: 12px 12px 28px 12px;
+	// margin: 64px 0;
 	position: relative;
 	display: flex;
 }

 .graph-title {
-	position: absolute;
-	top: -64px;
-	left: -1px;
-	padding: 8px 18px;
-	background: #ccc;
-	font-size: 18px;
+	// position: absolute;
+	// top: -64px;
+	// left: -1px;
+	// padding: 8px 18px;
+	padding: 0 12px;
+	font-size: 14px;
 	line-height: 1;
 }

+.graph-content {
+	display: flex;
+	flex: 1;
+	padding: 22px 12px;
+	border: 1px solid #ccc;
+	border-bottom-width: 2px;
+	border-top: none;
+	position: relative;
+}
+
+.graph-content::after,
+.graph-content::before {
+	content: '';
+	position: absolute;
+	width: 3px;
+	height: 80%;
+	background: #fff;
+	right: -1px;
+	top: 0;
+}
+
+.graph-content::before {
+	right: unset;
+	left: -1px;
+}
+
 .graph-item,
 .graph-item-fixed {
-	height: 88px;
+	// height: 88px;
 	// width: 24px;
 	flex: 1;
 	// border: 1px solid #ccc;
@ -405,32 +421,40 @@ export default {
 }

 .running {
-	background-color: #84f04e;
+	background-color: #5ad8a6;
+	// background-color: #84f04e;
 }

 .waiting {
-	background-color: #409eff;
+	background-color: #5ad8a6;
+	// background-color: #409eff;
 }

 .fault {
-	background-color: #ea5b5b;
+	// background-color: #ea5b5b;
+	background-color: #fc9c91;
 }

 .full {
-	background-color: #e6a23c;
+	// background-color: #e6a23c;
+	background-color: #598fff;
 }

 .lack {
-	background-color: #a69c8d;
+	// background-color: #a69c8d;
+	background-color: #7585a2;
 }

 .stop {
-	background-color: #000c;
+	background-color: #000;
 }

 .legend-row {
-	margin: 12px 0;
+	margin: 6px 0;
+	padding-right: 12px;
 	display: flex;
+	justify-content: flex-end;
+
 	> .legend:not(:last-child) {
 		margin-right: 12px;
 	}
@ -441,9 +465,32 @@ export default {
 	}

 	.icon {
-		width: 16px;
+		width: 8px;
+		height: 8px;
+		border-radius: 2px;
+		margin-right: 4px;
+		margin-top: 1px;
+	}
+}
+
+.blue-title {
+	position: relative;
+	padding: 4px 0;
+	padding-left: 12px;
+	font-size: 14px;
+	color: #606266;
+	font-weight: 700;
+	margin-bottom: 12px;
+
+	&::before {
+		content: '';
+		position: absolute;
+		left: 0;
+		top: 6px;
 		height: 16px;
-		margin-right: 8px;
+		width: 4px;
+		border-radius: 1px;
+		background: #0b58ff;
 	}
 }
 </style>
--- a/src/views/group/base/groupTeamScheduling/index.vue
+++ b/src/views/group/base/groupTeamScheduling/index.vue
@ -243,7 +243,11 @@ export default {
        this.list = tempData
      } else {
        // 次月1号没有值,接口排班
-        autoSet().then(res => {
+        // console.log(moment(this.startDay).format("YYYY-MM-DD"))
+        autoSet({
+          year: this.year,
+          month: moment(this.startDay).month() + 1
+        }).then(res => {
          this.list = res.data || {}
        })
      }
--- a/src/views/monitoring/equipmentAlarmLog/index.vue
+++ b/src/views/monitoring/equipmentAlarmLog/index.vue
@ -16,6 +16,7 @@
 			<method-btn
 				v-if="tableBtn.length"
 				slot="handleBtn"
+				:width="120"
 				label="操作"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
@ -81,13 +82,12 @@ export default {
 					: undefined,
 			].filter((v) => v),
 			tableProps: [
-				{ width: 128, prop: 'productionLine', label: '产线', align: 'center' },
-				{ width: 128, prop: 'workshopSection', label: '工段', align: 'center' },
-				{ width: 128, prop: 'equipment', label: '设备名称', align: 'center' },
+				{ width: 128, prop: 'productionLine', label: '产线' },
+				{ width: 128, prop: 'workshopSection', label: '工段' },
+				{ width: 128, prop: 'equipment', label: '设备名称' },
 				{
 					prop: 'alarmGrade',
 					label: '报警级别',
-					align: 'center',
 					filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL),
 				},
 				{
@ -96,11 +96,11 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'alarmContent', label: '报警内容', align: 'center' },
+				{ prop: 'alarmContent', label: '报警内容' },
 				// {
 				// 	_action: 'equipment-group-show-alert',
 				// 	label: '报警',
-				// 	align: 'center',
+				// 	,
 				// 	subcomponent: {
 				// 		props: ['injectData'],
 				// 		render: function (h) {
@ -166,7 +166,7 @@ export default {
 		this.getList();
 	},
 	methods: {
-    /** 重写 basicPageMixin 里的 handleSearchBarBtnClick */
+		/** 重写 basicPageMixin 里的 handleSearchBarBtnClick */
 		handleSearchBarBtnClick(btn) {
 			// 仅查询一种情况
 			this.queryParams.createTime = btn.createTime;
--- a/src/views/monitoring/equipmentFullParams/index.vue
+++ b/src/views/monitoring/equipmentFullParams/index.vue
@ -35,7 +35,9 @@
 					" />
 			</div>
 		</div>
-		<div v-else style="margin-top: 20px; color: #c7c7c7; text-align: center;">暂无数据</div>
+		<div v-else style="margin-top: 20px; color: #c7c7c7; text-align: center">
+			暂无数据
+		</div>
 	</div>
 </template>

@ -139,19 +141,16 @@ export default {
 					width: 48,
 					prop: 'index',
 					label: '序号',
-					align: 'center',
 				},
 				{
 					width: 160,
 					prop: 'time',
 					label: '时间',
-					align: 'center',
 				},
 				{
 					width: 200,
 					prop: 'plcCode',
 					label: 'PLC编码',
-					align: 'center',
 				},
 			];
 			const firstLineData = {
@ -162,7 +161,6 @@ export default {
 			otherList.forEach((item) => {
 				props.push({
 					label: item.name,
-					align: 'center',
 					prop: item.name,
 					width: 128,
 				});
--- a/src/views/monitoring/equipmentProcessAmount/graph.vue
+++ b/src/views/monitoring/equipmentProcessAmount/graph.vue
@ -17,15 +17,16 @@ import * as echarts from 'echarts';
 export default {
 	name: 'LineChartInEquipmentProcessAmount',
 	components: {},
-	props: ['equipmentList'],
+	props: ['equipmentList', 'render'],
 	data() {
 		return {
 			chart: null,
 			option: {
+				color: ['#288AFF'],
 				grid: {
 					top: 64,
 					left: 56,
-					right: 24,
+					right: 64,
 					bottom: 56,
 				},
 				title: {
@ -64,6 +65,10 @@ export default {
 							color: '#ccc',
 						},
 					},
+					name: '数量',
+					nameTextStyle: {
+						fontSize: 14,
+					},
 				},
 				series: [
 					{
@ -85,16 +90,19 @@ export default {
 			},
 		};
 	},
-	mounted() {
-		// console.log('this.eq list', this.equipmentList);
-		if (!this.chart) this.chart = echarts.init(this.$refs.chart);
-
-		this.$nextTick(() => {
-			this.chart.setOption(this.updateConfig(this.option));
-		});
+	watch: {
+		render: {
+			handler: function (newVal, oldVal) {
+				if (!this.chart) this.chart = echarts.init(this.$refs.chart);
+				this.$nextTick(() => {
+					if (this.chart) this.chart.setOption(this.updateConfig(this.option));
+				});
+			},
+			deep: true,
+		},
 	},
 	beforeDestroy() {
-		this.chart.dispose();
+		if (this.chart) this.chart.dispose();
 	},
 	methods: {
 		updateConfig(config) {
@ -122,5 +130,6 @@ export default {
 .chart {
 	height: 100%;
 	width: 100%;
+	// background: lightcoral;
 }
 </style>
--- a/src/views/monitoring/equipmentProcessAmount/index.vue
+++ b/src/views/monitoring/equipmentProcessAmount/index.vue
@ -9,15 +9,52 @@
 	<div style="flex: 1; display: flex; background: #f2f4f9">
 		<div
 			class="app-container"
-			style="margin-right: 12px; border-radius: 8px; background: #fff">
-			<!-- side bar  -->
+			style="
+				margin-right: 12px;
+				border-radius: 8px;
+				background: #fff;
+				padding: 0;
+			">
 			<div
-				class="side-bar__left"
-				style="width: 240px; padding: 12px; height: 100%">
+				class="factory-list__selector"
+				style="margin: 12px"
+				title="点击切换工厂"
+				@mouseenter="factoryListOpen = true"
+				@mouseleave="factoryListOpen = false">
+				{{ currentFactory?.label || '工厂名称' }}
+				<div class="factory-list__wrapper" :class="{ open: factoryListOpen }">
+					<ul
+						class="factory-list"
+						v-if="sidebarContent.length"
+						@click.prevent="factoryChangeHandler">
+						<li
+							v-for="fc in sidebarContent"
+							:key="fc.id"
+							:data-value="fc.id"
+							class="factory-list__item"
+							:class="{ 'is-current': fc.id == currentFactory?.id }">
+							{{ fc.label }}
+						</li>
+					</ul>
+					<div v-else style="color: #0008; width: 128px; text-align: center">
+						- 无 -
+					</div>
+				</div>
+			</div>
+			<!-- side bar  -->
+			<div class="side-bar__left" style="width: 240px; height: 100%">
 				<el-tree
-					:data="sidebarContent"
+					class="custom-tree-class"
+					:data="currentFactory?.children"
 					:props="treeProps"
-					@node-click="handleSidebarItemClick" />
+					:empty-text="' - 暂无数据 - '"
+					icon-class="custom-icon-class"
+					@node-click="handleSidebarItemClick">
+					<!-- <div class="custom-tree-node" slot-scope="{ node, data }">
+						<span class="icon"></span>
+						<span>{{ node.label }}</span>
+					</div> -->
+				</el-tree>
 			</div>
 		</div>
 		<div
@ -30,28 +67,48 @@
 					ref="search-bar"
 					@headBtnClick="handleSearchBarBtnClick" />

-				<transition appear name="vvv" mode="out-in">
-					<base-table
-						v-if="mode == 'table'"
-						:table-props="tableProps"
-						:page="1"
-						:limit="999"
-						:table-data="list"
-						@emitFun="handleEmitFun">
-						<!-- <method-btn
+				<el-row>
+					<el-col class="custom-tabs">
+						<el-tabs v-model="activeName" @tab-click="handleTabClick">
+							<el-tab-pane :label="'\u2002数据列表\u2002'" name="table">
+								<base-table
+									v-if="mode == 'table'"
+									:table-props="tableProps"
+									:page="1"
+									:limit="999"
+									:table-data="list"
+									@emitFun="handleEmitFun">
+									<!-- <method-btn
 							v-if="tableBtn.length"
 						slot="handleBtn"
 						label="操作"
 						:method-list="tableBtn"
 						@clickBtn="handleTableBtnClick" /> -->
-					</base-table>
+								</base-table>
+							</el-tab-pane>
+							<el-tab-pane :label="'\u3000柱状图\u3000'" name="graph">
+								<div class="graph" style="height: 56vh">
+									<!-- graph  -->
+									<Graph
+										v-if="list.length"
+										:equipment-list="list"
+										:render="renderKey" />
+									<div
+										v-if="list.length == 0"
+										style="
+											color: #c7c7c7;
+											text-align: center;
+											margin-top: 20px;
+										">
+										没有设备
+									</div>
+								</div>
+							</el-tab-pane>
+						</el-tabs>
+					</el-col>
+				</el-row>

-					<div class="graph" style="height: 56vh;" v-else>
-						<!-- graph  -->
-						<Graph v-if="list.length" :equipment-list="list" />
-						<div v-else style="color: #c7c7c7; text-align: center; margin-top: 20px;">没有设备</div>
-					</div>
-				</transition>
+				<!-- <transition appear name="vvv" mode="out-in"></transition> -->
 			</div>
 		</div>
 	</div>
@ -66,6 +123,17 @@ export default {
 	props: {},
 	data() {
 		return {
+			renderKey: Math.random(),
+			factoryListOpen: false,
+			currentFactory: null,
+			factoryList: [
+				{ name: '1', value: 1 },
+				{ name: '2', value: 2 },
+				{ name: '3', value: 3 },
+				{ name: '4', value: 4 },
+				{ name: '5', value: 5 },
+				{ name: '6', value: 6 },
+			],
 			sidebarContent: [
 				// {
 				// 	id: 'fc1',
@ -152,6 +220,7 @@ export default {
 				// 	],
 				// },
 			],
+			activeName: 'table',
 			searchBarFormConfig: [
 				{
 					type: 'datePicker',
@ -172,23 +241,23 @@ export default {
 					name: 'search',
 					color: 'primary',
 				},
-				{
-					type: 'separate',
-				},
-				{
-					type: 'button',
-					btnName: '表格',
-					name: 'table',
-					plain: true,
-					color: 'success',
-				},
-				{
-					type: 'button',
-					btnName: '图表',
-					name: 'graph',
-					plain: true,
-					color: 'warning',
-				},
+				// {
+				// 	type: 'separate',
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: '表格',
+				// 	name: 'table',
+				// 	plain: true,
+				// 	color: 'success',
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: '图表',
+				// 	name: 'graph',
+				// 	plain: true,
+				// 	color: 'warning',
+				// },
 				// {
 				// 	type: this.$auth.hasPermi('base:equipment-group:export') ? 'button' : '',
 				// 	btnName: '导出',
@ -197,11 +266,11 @@ export default {
 				// },
 			],
 			tableProps: [
-				{ prop: 'lineName', label: '产线', align: 'center' },
-				{ prop: 'sectionName', label: '工段', align: 'center' },
-				{ prop: 'externalCode', label: '设备编码', align: 'center' },
-				{ prop: 'equipmentName', label: '设备名称', align: 'center' },
-				{ prop: 'totalQuantity', label: '加工数量', align: 'center' },
+				{ prop: 'lineName', label: '产线' },
+				{ prop: 'sectionName', label: '工段' },
+				{ prop: 'externalCode', label: '设备编码' },
+				{ prop: 'equipmentName', label: '设备名称' },
+				{ prop: 'totalQuantity', label: '加工数量' },
 			],
 			mode: 'table', // table | graph
 			queryParams: {
@ -230,20 +299,20 @@ export default {
 				this.$set(factory, 'label', factory.name);
 				this.$set(factory, 'type', '工厂');
 				delete factory.name;
-				factory.children = factory.lines;
-				delete factory.lines;
+				// factory.children = factory.lines;
+				// delete factory.lines;
 				factory.children?.forEach((line) => {
 					this.$set(line, 'label', line.name);
 					this.$set(line, 'type', '产线');
 					delete line.name;
-					line.children = line.sections;
-					delete line.sections;
+					// line.children = line.sections;
+					// delete line.sections;
 					line.children?.forEach((ws) => {
 						this.$set(ws, 'label', ws.name);
 						this.$set(ws, 'type', '工段');
 						delete ws.name;
-						ws.children = ws.equipments;
-						delete ws.equipments;
+						// ws.children = ws.equipments;
+						// delete ws.equipments;
 						ws.children?.forEach((eq) => {
 							this.$set(eq, 'label', eq.name);
 							this.$set(eq, 'type', '设备');
@ -258,10 +327,22 @@ export default {
 			const { data } = await this.$axios('/base/factory/getTree');
 			this.sidebarContent = data;
 			this.buildTree(data);
+			console.log('tree', this.sidebarContent);
+		},
+
+		handleTabClick(tab, event) {
+			if (tab.name == 'graph') this.renderKey = Math.random();
+		},
+
+		factoryChangeHandler(event) {
+			this.factoryListOpen = false;
+			const fcId = event.target.dataset.value;
+			this.handleSidebarItemClick({ id: fcId, type: '工厂' });
+			this.currentFactory = this.sidebarContent.find((item) => item.id == fcId);
 		},

 		handleSidebarItemClick({ label, id, type }) {
-			console.log('lable clicked!', label, id, type);
+			console.log('label clicked!', label, id, type);
 			switch (type) {
 				case '设备':
 					this.queryParams.equipmentId = id;
@ -317,8 +398,10 @@ export default {

 <style scoped>
 .side-bar__left >>> .is-current {
+	padding: 0;
 	color: #111;
-	background: #f2f4f7;
+	/* background: #f2f4f7; */
+	background: #e3efff !important;
 }

 .vvv-enter,
@ -338,4 +421,149 @@ export default {
 	/* transform: translateY(0) scaleY(1); */
 	transform: translateY(0);
 }
+
+.custom-tabs >>> .el-tabs__header {
+	margin-bottom: 8px;
+	display: inline-block;
+	transform: translateY(-12px);
+}
+.custom-tabs >>> .el-tabs__item {
+	padding-left: 0px !important;
+	padding-right: 0px !important;
+	line-height: 36px !important;
+	height: 36px;
+}
+
+.factory-list__selector {
+	position: relative;
+	height: 36px;
+	font-size: 16px;
+	line-height: 36px;
+	padding-left: 28px;
+	background: url(../../../assets/images/factory-icon.png) 0 / 10% no-repeat;
+}
+
+.factory-list__selector:hover {
+	cursor: pointer;
+	color: #0008;
+}
+
+.factory-list__selector::after {
+	/* content: ''; */
+	position: absolute;
+	top: 16px;
+	right: 12px;
+	display: inline-block;
+	width: 8px;
+	height: 8px;
+	/* background: #5c5c5c; */
+	border-color: #000;
+	border-width: 4px;
+	border-style: solid;
+	border-top-color: transparent;
+	border-right-color: transparent;
+	border-bottom-color: transparent;
+}
+.factory-list__selector:hover::after {
+	/* cursor: pointer; */
+	border-left-color: #0008;
+}
+
+.factory-list__wrapper {
+	visibility: hidden;
+	position: absolute;
+	background: #fff;
+	box-shadow: 0 0 32px 10px #0002;
+	border-radius: 8px;
+	top: 36px;
+	left: 90px;
+	/* max-width: 128px; */
+	height: auto;
+	width: auto;
+	white-space: nowrap;
+	overflow: hidden;
+	/* transition: all 0.3s ease-out; */
+	z-index: 1000;
+}
+
+.factory-list__wrapper.open {
+	visibility: visible;
+}
+
+ul,
+li {
+	margin: 0;
+	padding: 0;
+	list-style: none;
+}
+
+.factory-list {
+	color: #0008;
+	max-height: 240px;
+	overflow-y: auto;
+}
+
+.factory-list__item {
+	font-size: 16px;
+	line-height: 1;
+	padding: 8px 64px 8px 16px;
+	/* min-width: 64px; */
+	position: relative;
+}
+
+.factory-list__item:hover,
+.factory-list__item.is-current {
+	background: #e3efff;
+	color: #0b58ff;
+}
+
+.factory-list__item.is-current::after {
+	content: '√';
+	position: absolute;
+	top: 8px;
+	right: 16px;
+	font-weight: bold;
+}
+
+.custom-tree-class >>> .el-tree-node__content {
+	height: auto !important;
+	padding: 8px 12px !important;
+}
+.custom-tree-class >>> .el-tree-node__content:hover {
+	background: #e3efff;
+}
+
+.custom-tree-class >>> .el-tree-node__children .el-tree-node__content {
+	padding: 8px 18px !important;
+}
+
+.custom-tree-class
+	>>> .el-tree-node__children
+	.el-tree-node__children
+	.el-tree-node__content {
+	padding: 8px 24px !important;
+}
+</style>
+
+<style>
+.custom-icon-class {
+	margin-right: 8px;
+	width: 20px;
+	height: 24px;
+	background: url('../../../assets/images/tree-icon-1.png') 100% / contain
+		no-repeat;
+}
+
+.custom-icon-class.el-tree-node__expand-icon.expanded {
+	transform: unset;
+}
+
+.el-tree-node__children .custom-icon-class {
+	background: url('../../../assets/images/tree-icon-2.png') 100% / contain
+		no-repeat;
+}
+
+.el-tree-node__children .el-tree-node__children .custom-icon-class {
+	background: unset;
+}
 </style>
--- a/src/views/monitoring/equipmentRecentHours/index.vue
+++ b/src/views/monitoring/equipmentRecentHours/index.vue
@ -11,14 +11,16 @@
 			:formConfigs="[{ label: '设备近24小时生产记录', type: 'title' }]"
 			ref="search-bar" />
 		<el-skeleton v-if="initing" :rows="6" animated />
-		<base-table
-			v-else
-			:span-method="mergeColumnHandler"
-			:table-props="tableProps"
-			:table-data="list"
-			@emitFun="handleEmitFun"></base-table>
-		<!-- :page="queryParams.pageNo"
-			:limit="queryParams.pageSize" -->
+		<div v-else :class="{ 'no-data-bg': !list || list.length == 0 }">
+			<base-table
+				v-if="list && list.length > 0"
+				:span-method="mergeColumnHandler"
+				:table-props="tableProps"
+				:table-data="list"
+				@emitFun="handleEmitFun"></base-table>
+			<!-- :page="queryParams.pageNo"
+				:limit="queryParams.pageSize" -->
+		</div>
 	</div>
 </template>

@ -37,6 +39,7 @@ export default {
 			list: [],
 			tableProps: [],
 			spanInfo: {},
+			noData: true,
 		};
 	},
 	computed: {},
@ -51,24 +54,22 @@ export default {
 			} = item;

 			const props = [
-				{ prop: 'productLine', label: '产线', align: 'center' },
-				{ prop: 'specification', label: '规格', align: 'center' },
-				{ prop: 'equipmentName', label: '设备', align: 'center' },
-				{ prop: 'totalQuantity', label: '生产总数', align: 'center' },
+				{ prop: 'productLine', label: '产线' },
+				{ prop: 'specification', label: '规格' },
+				{ prop: 'equipmentName', label: '设备' },
+				{ prop: 'totalQuantity', label: '生产总数' },
 			];

 			for (const key of Object.keys(hourData).sort()) {
 				const subprop = {
 					label: key,
-					align: 'center',
 					children: [
-						{ prop: key + '__in', label: '进数据', align: 'center' },
-						{ prop: key + '__out', label: '出数据', align: 'center' },
-						{ prop: key + '__nok', label: '报废数据', align: 'center' },
+						{ prop: key + '__in', label: '进数据' },
+						{ prop: key + '__out', label: '出数据' },
+						{ prop: key + '__nok', label: '报废数据' },
 						{
 							prop: key + '__ratio',
 							label: '报废率',
-							align: 'center',
 							filter: (val) => (val != null ? val + ' %' : '-'),
 						},
 					],
@ -138,6 +139,13 @@ export default {
 			// console.log('recent-24', data);

 			this.initing = true;
+
+			if (!data || !data.length) {
+				this.initing = false;
+				this.noData = true;
+				return;
+			}
+			this.noData = false;
 			this.buildProps(data[0]);
 			this.buildData(data);
 			this.queryParams.pageSize = this.list.length;
--- a/src/views/monitoring/equipmentStatusAndParams/index.vue
+++ b/src/views/monitoring/equipmentStatusAndParams/index.vue
@ -18,6 +18,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -74,28 +75,24 @@ export default {
 					width: 128,
 					prop: 'equipmentName',
 					label: '设备名称',
-					align: 'center',
 				},
 				{
 					width: 128,
 					prop: 'equipmentCode',
 					label: '设备编码',
-					align: 'center',
 				},
-				{ width: 128, prop: 'inQuantity', label: '投入数', align: 'center' },
-				{ width: 128, prop: 'outQuantity', label: '产出数', align: 'center' },
+				{ width: 128, prop: 'inQuantity', label: '投入数' },
+				{ width: 128, prop: 'outQuantity', label: '产出数' },
 				{
 					width: 128,
 					prop: 'run',
 					label: '是否运行',
-					align: 'center',
 					filter: (val) => (val != null ? (val ? '是' : '否') : '-'),
 				},
 				{
 					width: 128,
 					prop: 'status',
 					label: '状态',
-					align: 'center',
 					filter: (val) =>
 						val != null ? ['正常', '计划停机', '故障'][val] : '-',
 				},
@ -103,7 +100,6 @@ export default {
 					width: 128,
 					prop: 'error',
 					label: '是否故障',
-					align: 'center',
 					filter: (val) => (val != null ? (val ? '是' : '否') : '-'),
 				},
 				{
@ -121,7 +117,6 @@ export default {
 				{
 					_action: 'params-monitor',
 					label: '参数监控',
-					align: 'center',
 					subcomponent: {
 						props: ['injectData'],
 						render: function (h) {
@ -129,7 +124,7 @@ export default {
 							return h(
 								'el-button',
 								{
-									props: { type: 'text', size: 'mini' },
+									props: { type: 'text' },
 									on: {
 										click: function () {
 											console.log('inejctdata', _this.injectData);
--- a/src/views/quality/base/qualityInspectionBoxBtn/dialogForm.vue
+++ b/src/views/quality/base/qualityInspectionBoxBtn/dialogForm.vue
@ -0,0 +1,238 @@
+<!-- 
+    filename: dialogForm.vue
+    author: liubin
+    date: 2023-09-11 15:55:13
+    description: DialogForm for equipmentBindSection only
+-->
+
+<template>
+	<el-form
+		ref="form"
+		:model="dataForm"
+		label-width="100px"
+		v-loading="formLoading">
+		<el-row :gutter="20">
+			<el-col>
+				<el-form-item
+					label="产线"
+					prop="productionId"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-select
+						v-model="dataForm.productionId"
+						placeholder="请选择产线"
+						filterable
+						@change="handleProductlineChange">
+						<el-option
+							v-for="opt in productionLineList"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+				</el-form-item>
+			</el-col>
+			<el-col>
+				<el-form-item
+					label="工段"
+					prop="sectionId"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-select
+						v-model="dataForm.sectionId"
+						placeholder="请选择工段"
+						filterable
+						@change="$emit('update', dataForm)">
+						<el-option
+							v-for="opt in workshopSectionList"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+				</el-form-item>
+			</el-col>
+
+			<el-col>
+				<el-form-item
+					label="按钮盒识别码"
+					prop="buttonId"
+					:rules="[
+						{ required: true, message: '不能为空', trigger: 'blur' },
+						{
+							type: 'number',
+							message: '请输入整数',
+							trigger: 'blur',
+							transform: (val) => Number.isInteger(Number(val)) && Number(val),
+						},
+					]">
+					<el-input
+						v-model="dataForm.buttonId"
+						@change="$emit('update', dataForm)"
+						placeholder="请输入整数" />
+				</el-form-item>
+				<!-- 				
+				<el-form-item
+					label="报警编码"
+					prop="code"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-select
+						v-model="dataForm.code"
+						placeholder="请选择产线"
+						@change="handleProductlineChange">
+						<el-option
+							v-for="opt in productionLineList"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+				</el-form-item> -->
+			</el-col>
+
+			<el-col>
+				<el-form-item label="按钮盒模式" prop="model">
+					<el-input
+						v-model="dataForm.model"
+						@change="$emit('update', dataForm)"
+						placeholder="请输入按钮盒模式" />
+				</el-form-item>
+			</el-col>
+
+			<el-col>
+				<el-form-item
+					label="按钮值"
+					prop="keyValue"
+					:rules="[
+						{ required: true, message: '不能为空', trigger: 'blur' },
+						{
+							type: 'number',
+							message: '请输入100以内的整数',
+							trigger: 'blur',
+							transform: (val) =>
+								Number.isInteger(+val) &&
+								Number(val) >= 0 &&
+								Number(val) <= 100 &&
+								Number(val),
+						},
+					]">
+					<el-input
+						v-model="dataForm.keyValue"
+						type="number"
+						min="0"
+						max="100"
+						@change="$emit('update', dataForm)"
+						placeholder="请输入按钮盒模式" />
+				</el-form-item>
+			</el-col>
+
+			<el-col>
+				<el-form-item label="检测内容" prop="inspectionDetContent">
+					<el-input
+						type="textarea"
+						v-model="dataForm.inspectionDetContent"
+						placeholder="请输入检测内容"
+						@change="$emit('update', dataForm)"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+	</el-form>
+</template>
+
+<script>
+export default {
+	name: 'DialogForm',
+	model: {
+		prop: 'dataForm',
+		event: 'update',
+	},
+	emits: ['update'],
+	components: {},
+	props: {
+		dataForm: {
+			type: Object,
+			default: () => ({}),
+		},
+	},
+	data() {
+		return {
+			formLoading: true,
+			productionLineList: [],
+			workshopSectionList: [],
+		};
+	},
+	mounted() {
+		this.getProductionLineList();
+		// this.getWorksectionList();
+		// this.getCode('/base/equipment-group-alarm/getCode').then((code) => {
+		// 	this.formLoading = false;
+		// 	this.$emit('update', {
+		// 		...this.dataForm,
+		// 		code,
+		// 	});
+		// });
+	},
+	watch: {
+		'dataForm.productionId': {
+			handler(id) {
+				if (id != null) this.getWorksectionList(id);
+			},
+			immediate: true,
+		},
+	},
+	methods: {
+		/** 模拟透传 ref  */
+		validate(cb) {
+			return this.$refs.form.validate(cb);
+		},
+		resetFields(args) {
+			return this.$refs.form.resetFields(args);
+		},
+		async getProductionLineList() {
+			this.formLoading = true;
+			const res = await this.$axios({
+				url: '/base/production-line/listAll',
+				method: 'get',
+			});
+			if (res.code == 0) {
+				this.productionLineList = res.data.map((item) => ({
+					label: item.name,
+					value: item.id,
+				}));
+			}
+			this.formLoading = false;
+		},
+
+		async getWorksectionList(id) {
+			this.formLoading = true;
+			const res = await this.$axios({
+				url: '/base/workshop-section/listByParentId',
+				method: 'get',
+				params: {
+					id,
+				},
+			});
+			if (res.code == 0) {
+				this.workshopSectionList = res.data.map((item) => ({
+					label: item.name,
+					value: item.id,
+				}));
+			}
+			this.formLoading = false;
+		},
+
+		async handleProductlineChange(id) {
+			await this.getWorksectionList(id);
+			this.dataForm.sectionId = null;
+			this.$emit('update', this.dataForm);
+		},
+
+		async getCode(url) {
+			const response = await this.$axios(url);
+			return response.data;
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.el-date-editor,
+.el-select {
+	width: 100%;
+}
+</style>
--- a/src/views/quality/base/qualityInspectionBoxBtn/index.vue
+++ b/src/views/quality/base/qualityInspectionBoxBtn/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				fixed="right"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
@ -38,7 +39,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 		</base-dialog>
 	</div>
 </template>
@ -54,11 +55,12 @@ import {
 } from '@/api/base/qualityInspectionBoxBtn';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import moment from 'moment';
+import DialogForm from './dialogForm.vue';

 export default {
 	name: 'QualityInspectionBoxBtn',
 	mixins: [basicPageMixin],
-	components: {},
+	components: { DialogForm },
 	data() {
 		return {
 			rows: [
@ -81,6 +83,9 @@ export default {
 						url: '/base/workshop-section/listAll',
 						prop: 'sectionId',
 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						bind: {
+							filterable: true,
+						},
 					},
 				],
 				[
@ -91,9 +96,10 @@ export default {
 						rules: [
 							{
 								type: 'number',
-								message: '请输入数字',
+								message: '请输入整数',
 								trigger: 'blur',
-								transform: (val) => Number(val),
+								transform: (val) =>
+									Number.isInteger(Number(val)) && Number(val),
 							},
 						],
 					},
@ -107,9 +113,10 @@ export default {
 						rules: [
 							{
 								type: 'number',
-								message: '请输入100以内的数字',
+								message: '请输入100以内的整数',
 								trigger: 'blur',
-								transform: (val) => Number(val) <= 100 && Number(val),
+								transform: (val) =>
+									Number(val) <= 100 && Number.isInteger(+val) && Number(val),
 							},
 						],
 						bind: { type: 'number', min: 0, max: 100 },
@ -120,7 +127,7 @@ export default {
 						textarea: true,
 						label: '检测内容',
 						prop: 'inspectionDetContent',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
 			],
@ -173,43 +180,36 @@ export default {
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
 				{
-					width: 128,
 					prop: 'productionName',
 					label: '产线',
-					align: 'center',
 				},
 				{
-					width: 128,
 					prop: 'sectionName',
 					label: '工段',
-					align: 'center',
 				},
 				{
-					width: 128,
 					prop: 'inspectionDetContent',
 					label: '检测内容',
-					align: 'center',
 				},
 				{
 					width: 160,
 					prop: 'buttonId',
 					label: '按钮盒识别码',
-					align: 'center',
 				},
 				// {
 				// 	width: 256,
 				// 	prop: 'productionId',
 				// 	label: '按钮盒所在产线ID',
-				// 	align: 'center',
+				// 	,
 				// },
 				// {
 				// 	width: 256,
 				// 	prop: 'sectionId',
 				// 	label: '按钮盒所在工段ID',
-				// 	align: 'center',
+				// 	,
 				// },
-				{ width: 90, prop: 'keyValue', label: '按钮值', align: 'center' },
-				{ width: 128, prop: 'model', label: '按钮盒模式', align: 'center' },
+				{ width: 90, prop: 'keyValue', label: '按钮值' },
+				{ width: 128, prop: 'model', label: '按钮盒模式' },
 			],
 			// 查询参数
 			queryParams: {
@ -220,13 +220,13 @@ export default {
 			// 搜索框需要的 keys, 与上面 queryParams 的除 pageNo, pageSize 之外的 key 一一对应
 			searchBarKeys: ['inspectionDetContent'],
 			form: {
-				id: undefined,
-				inspectionDetId: undefined,
-				inspectionDetContent: undefined,
-				productionId: undefined,
-				sectionId: undefined,
-				model: undefined,
-				keyValue: undefined,
+				id: null,
+				buttonId: null,
+				inspectionDetContent: null,
+				productionId: null,
+				sectionId: null,
+				model: null,
+				keyValue: null,
 			},
 		};
 	},
@ -247,13 +247,13 @@ export default {
 		/** 表单重置 */
 		reset() {
 			this.form = {
-				id: undefined,
-				inspectionDetId: undefined,
-				inspectionDetContent: undefined,
-				productionId: undefined,
-				sectionId: undefined,
-				model: undefined,
-				keyValue: undefined,
+				id: null,
+				buttonId: null,
+				inspectionDetContent: null,
+				productionId: null,
+				sectionId: null,
+				model: null,
+				keyValue: null,
 			};
 			this.resetForm('form');
 		},
@ -300,7 +300,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除安灯按钮16键对应编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除"' + row.sectionName + '"?')
 				.then(function () {
 					return deleteQualityInspectionBoxBtn(id);
 				})
--- a/src/views/quality/base/qualityInspectionDet/index.vue
+++ b/src/views/quality/base/qualityInspectionDet/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				fixed="right"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
@ -172,10 +173,10 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'typeName', label: '类型名称', align: 'center' },
-				{ prop: 'content', label: '检测内容', align: 'center' },
-				{ prop: 'code', label: '检测编码', align: 'center' },
-				{ prop: 'remark', label: '备注', align: 'center' },
+				{ prop: 'typeName', label: '类型名称',  },
+				{ prop: 'content', label: '检测内容',  },
+				{ prop: 'code', label: '检测编码',  },
+				{ prop: 'remark', label: '备注',  },
 			],
 			// 查询参数
 			queryParams: {
@ -275,7 +276,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除质量检测信息基础编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除检测信息"' + row.content + '"?')
 				.then(function () {
 					return deleteQualityInspectionDet(id);
 				})
--- a/src/views/quality/base/qualityInspectionType/index.vue
+++ b/src/views/quality/base/qualityInspectionType/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
 		</base-table>
@ -106,9 +107,9 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'name', label: '检测类型名称', align: 'center' },
-				{ prop: 'code', label: '检测类型编码', align: 'center' },
-				{ prop: 'remark', label: '备注', align: 'center' },
+				{ prop: 'name', label: '检测类型名称' },
+				{ prop: 'code', label: '检测类型编码' },
+				{ prop: 'remark', label: '备注' },
 				// {
 				// 	label: '操作',
 				// 	alignt: 'center',
@ -321,7 +322,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除质量检测类型基础编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除该质量检测类型?')
 				.then(function () {
 					return deleteQualityInspectionType(id);
 				})
--- a/src/views/quality/monitoring/qualityInspectionRecord/index.vue
+++ b/src/views/quality/monitoring/qualityInspectionRecord/index.vue
@ -17,6 +17,7 @@
 				v-if="tableBtn.length"
 				slot="handleBtn"
 				label="操作"
+				:width="120"
 				fixed="right"
 				:method-list="tableBtn"
 				@clickBtn="handleTableBtnClick" />
@ -68,7 +69,7 @@ export default {
 				[
 					{
 						select: true,
-						label: '检测内容ID',
+						label: '检测内容',
 						url: '/base/quality-inspection-det/listAll',
 						prop: 'inspectionDetId',
 						labelKey: 'content',
@ -97,6 +98,9 @@ export default {
 						label: '产线',
 						url: '/base/production-line/listAll',
 						prop: 'productionLineId',
+						bind: {
+							filterable: true,
+						},
 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 					{
@ -105,6 +109,9 @@ export default {
 						url: '/base/workshop-section/listAll', // 这个 url 其实可加可不加，因为下面会更新 options
 						options: [], // 这个options也可加可不加, 因为下面会更新 options
 						prop: 'sectionId',
+						bind: {
+							filterable: true,
+						},
 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
@ -118,6 +125,7 @@ export default {
 						datetime: true,
 						label: '检测时间',
 						prop: 'checkTime',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 						bind: {
 							format: 'yyyy-MM-dd HH:mm:ss',
 							'value-format': 'timestamp',
@ -126,15 +134,15 @@ export default {
 						},
 					},
 				],
-				[
-					{
-						textarea: true,
-						label: '检测内容',
-						prop: 'inspectionDetContent',
-						value: '',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
-					},
-				],
+				// [
+				// 	{
+				// 		textarea: true,
+				// 		label: '检测内容',
+				// 		prop: 'inspectionDetContent',
+				// 		value: '',
+				// 		rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+				// 	},
+				// ],
 				[{ textarea: true, label: '描述', prop: 'explainText' }],
 				[{ input: true, label: '备注', prop: 'remark' }],
 			],
@ -213,32 +221,28 @@ export default {
 					width: 128,
 					prop: 'inspectionDetContent',
 					label: '检测内容',
-					align: 'center',
 				},
 				{
 					// width: 128,
 					prop: 'lineName',
 					label: '产线',
-					align: 'center',
 				},
 				{
 					// width: 128,
 					prop: 'checkPerson',
 					label: '检测人员',
-					align: 'center',
 				},
 				{
 					// width: 160,
 					prop: 'checkTime',
 					label: '检测时间',
-					align: 'center',
-					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
+					filter: (val) =>
+						val != null ? moment(val).format('yyyy-MM-DD HH:mm:ss') : '-',
 				},
 				{
 					width: 90,
 					prop: 'source',
 					label: '来源',
-					align: 'center',
 					filter: (val) => ['未知', '手动', '自动'][val],
 				},
 			],
@ -394,7 +398,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除质量检查信息记录表编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除"' + row.inspectionDetContent + '"?')
 				.then(function () {
 					return deleteQualityInspectionRecord(id);
 				})
--- a/src/views/quality/monitoring/qualityRecentHours/index.vue
+++ b/src/views/quality/monitoring/qualityRecentHours/index.vue
@ -13,18 +13,20 @@
 		<!-- <pre><code v-html="jsondemo"></code></pre> -->

 		<el-skeleton v-if="initing" :rows="6" animated />
-		<base-table
-			v-else
-			:table-props="tableProps"
-			:page="queryParams.pageNo"
-			:limit="queryParams.pageSize"
-			:table-data="list"
-			@emitFun="handleEmitFun"></base-table>
+		<div v-else :class="{ 'no-data-bg': !list || list.length == 0 }">
+			<base-table
+				v-if="list && list.length > 0"
+				:table-props="tableProps"
+				:page="queryParams.pageNo"
+				:limit="queryParams.pageSize"
+				:table-data="list"
+				@emitFun="handleEmitFun"></base-table>
+		</div>
 	</div>
 </template>

 <script>
-import response from './response.json';
+// import response from './response.json';
 import { handleNameData, handleDynamicData } from '@/utils/dynamicProps';
 // import hljs from 'highlight.js/lib/highlight';
 // import json from 'highlight.js/lib/languages/json';
@ -43,7 +45,6 @@ export default {
 				pageNo: 1,
 				pageSize: 10,
 			},
-			// jsondemo: '',
 			list: [
 				// {
 				// 	inspectionContent: '检测内容1',
@ -56,7 +57,6 @@ export default {
 				{
 					prop: 'inspectionContent',
 					label: '检测内容',
-					align: 'center',
 				},
 			],
 		};
@ -67,20 +67,10 @@ export default {
 	},
 	methods: {
 		async getList() {
-			// const response = await this.$axios({
-			// 	url: '/monitoring/record-in-one-day/get',
-			// 	method: 'get',
-			// });
-			console.log(response);
-			// const {
-			// 	// data: { nameData },
-			// 	code,
-			// } = response;
-			// this.jsondemo = hljs.highlight(
-			// 	'json',
-			// 	JSON.stringify(response, null, 2),
-			// 	true
-			// ).value;
+			const response = await this.$axios({
+				url: '/monitoring/record-in-one-day/get',
+				method: 'get',
+			});
 			const {
 				data: { data: dyanmicData, nameData },
 			} = response;
--- a/src/views/quality/monitoring/qualityStatistics/components/graphs/line.vue
+++ b/src/views/quality/monitoring/qualityStatistics/components/graphs/line.vue
@ -82,18 +82,22 @@ export default {
 	computed: {
 		config() {
 			return {
+				color: ['#fde19a', '#8be2b9', '#288aff', '#7164ff'],
 				// title: {
 				// 	text: '折线图',
 				// },
 				grid: {
-					top: '24%',
-					left: '3%',
+					top: '12%',
+					left: '2%',
 					right: '5%',
 					bottom: '5%',
 					containLabel: true,
 				},
 				tooltip: {
 					trigger: 'axis',
+					axisPointer: {
+						type: 'shadow',
+					},
 				},
 				legend: {
 					data: this.legend,
@ -107,13 +111,145 @@ export default {
 				// },
 				xAxis: {
 					type: 'category',
-					boundaryGap: false,
+					boundaryGap: true,
+					onZero: false,
+					axisTick: {
+						show: false,
+					},
+					axisLine: {
+						lineStyle: {
+							// color: 'red'
+						},
+					},
 					data: this.xProps,
+					// data: [
+					// 	'设备1',
+					// 	'设备2',
+					// 	'设备3',
+					// 	'设备4',
+					// 	'设备5',
+					// 	'设备6',
+					// 	'设备7',
+					// 	'设备8',
+					// 	'设备9',
+					// 	'设备10',
+					// 	'设备11',
+					// 	'设备12',
+					// 	'设备13',
+					// 	'设备14',
+					// 	'设备15',
+					// 	'设备16',
+					// 	'设备17',
+					// 	'设备18',
+					// 	'设备19',
+					// 	'设备20',
+					// ],
 				},
 				yAxis: {
 					type: 'value',
+					name: '单位/片',
+					nameTextStyle: {
+						color: '#999',
+						fontSize: 14,
+						align: 'right',
+					},
+					max: function (value) {
+						return value.max + Math.floor(value.max / 5);
+					},
+				},
+				// 缩放 - 滑动
+				dataZoom: {
+					type: 'inside',
 				},
 				series: this.series,
+				// series: [
+				// 	{
+				// 		name: '上片数',
+				// 		type: 'bar',
+				// 		// barWidth: 12,
+				// 		data: [
+				// 			10,
+				// 			12,
+				// 			43,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 			12,
+				// 			8,
+				// 			122,
+				// 			0,
+				// 			,
+				// 			43,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 			12,
+				// 			8,
+				// 			122,
+				// 			77,
+				// 			99,
+				// 		],
+				// 	},
+				// 	{
+				// 		name: '下片数',
+				// 		type: 'bar',
+				// 		// barWidth: 12,
+				// 		data: [
+				// 			10,
+				// 			12,
+				// 			43,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 			12,
+				// 			8,
+				// 			122,
+				// 			0,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 			12,
+				// 			8,
+				// 			122,
+				// 			0,
+				// 			,
+				// 			43,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 		],
+				// 	},
+				// 	{
+				// 		name: '检测数',
+				// 		type: 'bar',
+				// 		// barWidth: 12,
+				// 		barCategoryGap: 12,
+				// 		data: [
+				// 			10,
+				// 			12,
+				// 			43,
+				// 			4,
+				// 			22,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 			12,
+				// 			8,
+				// 			122,
+				// 			0,
+				// 			,
+				// 			43,
+				// 			4,
+				// 			22,
+				// 			32,
+				// 			32,
+				// 			12,
+				// 			8,
+				// 			122,
+				// 			0,
+				// 		],
+				// 	},
+				// ],
 			};
 		},
 	},
--- a/src/views/quality/monitoring/qualityStatistics/components/summaryTable.vue
+++ b/src/views/quality/monitoring/qualityStatistics/components/summaryTable.vue
@ -7,9 +7,9 @@

 <template>
 	<!-- 列表 -->
+	<!-- height="35vh" -->
 	<base-table
 		:table-props="tableProps"
-		height="35vh"
 		:page="queryParams.pageNo"
 		:limit="queryParams.pageSize"
 		:table-data="list"></base-table>
@ -35,27 +35,22 @@ export default {
 				{
 					prop: 'lineName',
 					label: '产线',
-					align: 'center',
 				},
 				{
 					prop: 'sumUp',
 					label: '上片总数',
-					align: 'center',
 				},
 				{
 					prop: 'sumDown',
 					label: '下片总数',
-					align: 'center',
 				},
 				{
 					prop: 'sumCheck',
 					label: '检测总数',
-					align: 'center',
 				},
 				{
 					prop: 'scrapRatio',
 					label: '比例(%)',
-					align: 'center',
 				},
 			],
 		};
--- a/src/views/quality/monitoring/qualityStatistics/graphPage.vue
+++ b/src/views/quality/monitoring/qualityStatistics/graphPage.vue
@ -7,14 +7,20 @@

 <template>
 	<div class="graph-page">
-		<DetailGraph id="dg1" key="dg1" ref="dg1" title="数据总览">
+		<!-- <DetailGraph id="dg1" key="dg1" ref="dg1" title="数据总览">
 			<TotalGraph :summary-list="summaryList" />
-		</DetailGraph>
-		<DetailGraph id="dg2" key="dg2" ref="dg2" title="检测内容数据">
+		</DetailGraph> -->
+		<!-- <DetailGraph id="dg2" key="dg2" ref="dg2" title="检测内容数据">
 			<LineGraph :x-props="lineData.xProps" :legend="legend" :series="series" />
-		</DetailGraph>
+		</DetailGraph> -->
 		<!-- <DetailGraph id="dg3" key="dg3" ref="dg3" />
-		<DetailGraph id="dg4" key="dg4" ref="dg4" /> -->
+			<DetailGraph id="dg4" key="dg4" ref="dg4" /> -->
+		<div v-if="!series || series.length == 0" style="color: #777; font-size: 16px; letter-spacing: 1px; text-align: center; padding-top: 56px; text-decoration: underline;">暂无数据</div>
+		<LineGraph
+			v-else
+			:x-props="lineData.xProps"
+			:legend="legend"
+			:series="series" />
 	</div>
 </template>

@ -55,7 +61,8 @@ export default {
 			console.log('this.list', this.lineData.list, this.lineData.xProps);
 			const seriesItem = {
 				name: item.inspectionContent,
-				type: 'line',
+				type: 'bar',
+				barCategoryGap: 12,
 				data: [],
 			};

--- a/src/views/quality/monitoring/qualityStatistics/index.vue
+++ b/src/views/quality/monitoring/qualityStatistics/index.vue
@ -6,33 +6,84 @@
 -->

 <template>
-	<div class="app-container">
-		<!-- 搜索工作栏 -->
-		<SearchBar
-			:formConfigs="searchBarFormConfig"
-			ref="search-bar"
-			@headBtnClick="handleSearchBarBtnClick" />
+	<div class="quality-container" style="background: #f2f4f9; flex: 1">
+		<el-row
+			class=""
+			style="
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 16px 16px 0;
+				border-radius: 8px;
+			">
+			<!-- 搜索工作栏 -->
+			<SearchBar
+				:formConfigs="searchBarFormConfig"
+				ref="search-bar"
+				@headBtnClick="handleSearchBarBtnClick" />
+		</el-row>

-		<transition mode="out-in" name="fade-down">
-			<template v-if="mode == 'table'">
-				<!-- 列表 -->
-				<base-table
-					v-if="mode == 'table'"
-					:table-props="tableProps"
-					:page="queryParams.pageNo"
-					:limit="queryParams.pageSize"
-					:table-data="list"
-					@emitFun="handleEmitFun"></base-table>
-			</template>
+		<el-row
+			class=""
+			style="
+				margin-top: 0;
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 12px 16px 16px;
+				border-radius: 8px;
+			">
+			<div class="blue-title">产线检测总览</div>
+			<summaryTable :list="summaryList" />
+		</el-row>

-			<GraphPage
-				v-else
-				:summary-list="summaryList"
-				:line-data="{ list: list, xProps: dynamicProps.map((v) => v.prop) }" />
-		</transition>
+		<el-row
+			class=""
+			style="
+				margin-top: 0;
+				margin-bottom: 12px;
+				background: #fff;
+				padding: 12px 16px 16px;
+				border-radius: 8px;
+			">
+			<el-row style="display: flex; align-items: center">
+				<div class="blue-title">产线检测详细</div>
+				<div class="custom-tabs">
+					<el-tabs
+						v-model="activeName"
+						:stretch="true"
+						@tab-click="handleTabClick">
+						<el-tab-pane
+							:label="'\u2002数据列表\u2002'"
+							name="table"></el-tab-pane>
+						<el-tab-pane
+							:label="'\u3000柱状图\u3000'"
+							name="graph"></el-tab-pane>
+					</el-tabs>
+				</div>
+			</el-row>
+
+			<transition mode="out-in" name="fade-down">
+				<template v-if="mode == 'table'">
+					<base-table
+						v-if="mode == 'table'"
+						:table-props="tableProps"
+						:page="queryParams.pageNo"
+						:limit="queryParams.pageSize"
+						:table-data="list"
+						@emitFun="handleEmitFun"></base-table>
+				</template>
+
+				<GraphPage
+					v-else
+					:summary-list="summaryList"
+					:line-data="{
+						list: list,
+						xProps: dynamicProps.map((v) => v.prop),
+					}" />
+			</transition>
+		</el-row>

 		<!-- todo: 数据总览，用弹窗包裹的 table 实现 -->
-		<base-dialog
+		<!-- <base-dialog
 			dialogTitle="数据总览"
 			:dialogVisible="summaryOpen"
 			width="50%"
@ -40,7 +91,7 @@
 			@cancel="handleSummaryClose"
 			@confirm="handleSummaryClose">
 			<summaryTable :list="summaryList" />
-		</base-dialog>
+		</base-dialog> -->
 	</div>
 </template>

@ -48,13 +99,58 @@
 import GraphPage from './graphPage.vue';
 import summaryTable from './components/summaryTable.vue';

+class DateGetter {
+	constructor() {
+		this.today = new Date();
+		this.y = this.today.getFullYear();
+		this.m = this.today.getMonth();
+		this.d = this.today.getDate();
+	}
+	getWeekRange() {
+		const weekStart = new Date(this.y, this.m, this.d - this.today.getDay());
+		const weekEnd = new Date(
+			this.y,
+			this.m,
+			this.d + (6 - this.today.getDay()),
+			23,
+			59,
+			59
+		);
+		// console.log('week', [weekStart, weekEnd]);
+		return [weekStart, weekEnd];
+	}
+
+	getMonthRange() {
+		const monthStart = new Date(this.y, this.m, 1);
+		const monthEnd = new Date(this.y, this.m + 1, 0, 23, 59, 59);
+		// console.log('month', [monthStart, monthEnd]);
+		return [monthStart, monthEnd];
+	}
+
+	getQuarterRange() {
+		const quarterStart = new Date(this.y, this.m - (this.m % 3), 1);
+		const quarterEnd = new Date(
+			this.y,
+			this.m - (this.m % 3) + 3,
+			0,
+			23,
+			59,
+			59
+		);
+		// console.log('quarter', [quarterStart, quarterEnd]);
+		return [quarterStart, quarterEnd];
+	}
+}
+
 export default {
 	name: 'QualityStatistics',
 	components: { GraphPage, summaryTable },
 	props: {},
 	data() {
+		const dateGetter = new DateGetter();
 		return {
-			mode: 'table', // defaults to 'table'
+			// mode: 'table', // defaults to 'table'
+			activeName: 'table', // defaults to 'table'
 			searchBarFormConfig: [
 				{
 					type: 'datePicker',
@ -70,6 +166,28 @@ export default {
 					defaultSelect: [],
 					defaultTime: ['00:00:00', '23:59:59'],
 					param: 'timerange',
+					pickerOptions: {
+						shortcuts: [
+							{
+								text: '本周',
+								onClick(picker) {
+									picker.$emit('pick', dateGetter.getWeekRange());
+								},
+							},
+							{
+								text: '本月',
+								onClick(picker) {
+									picker.$emit('pick', dateGetter.getMonthRange());
+								},
+							},
+							{
+								text: '本季',
+								onClick(picker) {
+									picker.$emit('pick', dateGetter.getQuarterRange());
+								},
+							},
+						],
+					},
 				},
 				{
 					type: 'button',
@ -77,33 +195,33 @@ export default {
 					name: 'search',
 					color: 'primary',
 				},
-				{
-					type: 'separate',
-				},
-				{
-					type: 'button',
-					btnName: '数据总览',
-					name: 'summary',
-					color: 'text',
-				},
-				{
-					type: 'separate',
-				},
-				{
-					type: 'button',
-					btnName: '表格版',
-					name: 'tableVersion',
-					color: 'text btn-table',
-				},
-				{
-					type: 'separate',
-				},
-				{
-					type: 'button',
-					btnName: '图形版',
-					name: 'graphVersion',
-					color: 'text btn-graph',
-				},
+				// {
+				// 	type: 'separate',
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: '数据总览',
+				// 	name: 'summary',
+				// 	color: 'text',
+				// },
+				// {
+				// 	type: 'separate',
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: '表格版',
+				// 	name: 'tableVersion',
+				// 	color: 'text btn-table',
+				// },
+				// {
+				// 	type: 'separate',
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: '图形版',
+				// 	name: 'graphVersion',
+				// 	color: 'text btn-graph',
+				// },
 			],
 			// 动态的 props
 			dynamicProps: [],
@ -166,26 +284,26 @@ export default {
 		};
 	},
 	computed: {
+		mode() {
+			return this.activeName;
+		},
 		tableProps() {
 			return [
 				{
 					// width: 160,
 					prop: 'inspectionContent',
 					label: '检测内容',
-					align: 'center',
 				},
 				...this.dynamicProps,
 				{
 					// width: 128,
 					prop: 'sumInput',
 					label: '检测类型总数',
-					align: 'center',
 				},
 				{
 					// width: 128,
 					prop: 'ratio',
 					label: '比例',
-					align: 'center',
 					// subcomponent: {
 					// 	name: 'TextOnly',
 					// 	props: {
@ -214,16 +332,51 @@ export default {
 	},
 	mounted() {
 		if (this.$route.params.startTime && this.$route.params.endTime) {
-      this.searchBarFormConfig[0].defaultSelect = [this.$route.params.startTime, this.$route.params.endTime]
+			this.searchBarFormConfig[0].defaultSelect = [
+				this.$route.params.startTime,
+				this.$route.params.endTime,
+			];
 			this.queryParams.param = {};
-			this.$set(this.queryParams.param, 'startTime', this.$route.params.startTime);
+			this.$set(
+				this.queryParams.param,
+				'startTime',
+				this.$route.params.startTime
+			);
 			this.$set(this.queryParams.param, 'endTime', this.$route.params.endTime);
-    } else {
-      this.searchBarFormConfig[0].defaultSelect = []
-    }
+		} else {
+			this.searchBarFormConfig[0].defaultSelect = [];
+		}
 		this.getList();
 	},
+	watch: {
+		$route: 'initData',
+	},
 	methods: {
+		initData(to) {
+			// console.log(to)
+			if (to.name === 'QualityStatistics') {
+				if (this.$route.params.startTime && this.$route.params.endTime) {
+					this.searchBarFormConfig[0].defaultSelect = [
+						this.$route.params.startTime,
+						this.$route.params.endTime,
+					];
+					this.queryParams.param = {};
+					this.$set(
+						this.queryParams.param,
+						'startTime',
+						this.$route.params.startTime
+					);
+					this.$set(
+						this.queryParams.param,
+						'endTime',
+						this.$route.params.endTime
+					);
+				} else {
+					this.searchBarFormConfig[0].defaultSelect = [];
+				}
+				this.getList();
+			}
+		},
 		getList() {
 			this.getSummaryList();
 			this.getDetailedList();
@ -232,20 +385,17 @@ export default {
 		async getSummaryList() {
 			const response = await this.$axios({
 				url: '/monitoring/statistical-data/getUpPart',
-				method: 'get',
-				params: this.queryParams.param
+				method: 'post',
+				data: this.queryParams.param
 					? {
-							param: {
-								// startTime: new Date(2022, 6, 1, 0, 0, 0).getTime(), //  '2023-07-01 00:00:00',
-								// endTime: new Date(2023, 7, 10, 0, 0, 0).getTime(), // '2023-08-10 00:00:00',
-								startTime: this.queryParams.param.startTime,
-								endTime: this.queryParams.param.endTime,
-							},
+							// startTime: new Date(2022, 6, 1, 0, 0, 0).getTime(), //  '2023-07-01 00:00:00',
+							// endTime: new Date(2023, 7, 10, 0, 0, 0).getTime(), // '2023-08-10 00:00:00',
+							startTime: this.queryParams.param.startTime,
+							endTime: this.queryParams.param.endTime,
 					  }
-					: null,
+					: {},
 			});
 			this.summaryList = response.data;
-			console.log('summaryList', this.summaryList);
 		},
 		/** 获取 检测内容和产线关联 列表 */
 		async getDetailedList() {
@ -253,22 +403,21 @@ export default {
 				data: { data, otherList, otherMap, nameData },
 			} = await this.$axios({
 				url: '/monitoring/statistical-data/getDownPart',
-				params: this.queryParams.param
+				method: 'post',
+				data: this.queryParams.param
 					? {
-							param: {
-								// startTime: new Date(2023, 6, 1).getTime(), // '2023-07-01 00:00:00',
-								// endTime: new Date(2023, 7, 22).getTime(), // '2023-08-10 00:00:00',
-								startTime: this.queryParams.param.startTime,
-								endTime: this.queryParams.param.endTime,
-							},
+							// startTime: new Date(2023, 6, 1).getTime(), // '2023-07-01 00:00:00',
+							// endTime: new Date(2023, 7, 22).getTime(), // '2023-08-10 00:00:00',
+							startTime: this.queryParams.param.startTime,
+							endTime: this.queryParams.param.endTime,
 					  }
-					: null,
+					: {},
 			});
 			// this.list = response.data;
-			console.log('data', data);
-			console.log('otherList', otherList);
-			console.log('otherMap', otherMap);
-			console.log('nameData', nameData);
+			// console.log('data', data);
+			// console.log('otherList', otherList);
+			// console.log('otherMap', otherMap);
+			// console.log('nameData', nameData);

 			this.dynamicProps = this.filterNameData(nameData);
 			this.list = this.filterData(data);
@ -299,6 +448,14 @@ export default {
 				};
 			});
 		},
+		handleTabClick(tab, event) {
+			const { name } = tab;
+			if (name == 'graph') {
+				// 展示柱状图
+			} else {
+				// 展示表格
+			}
+		},
 		/** 总览关闭 */
 		handleSummaryClose() {
 			this.summaryOpen = false;
@ -383,6 +540,42 @@ export default {
 .fade-down-leave {
 	transform: translateY(0);
 }
+
+.blue-title {
+	position: relative;
+	padding: 4px 0;
+	padding-left: 12px;
+	font-size: 14px;
+	color: #606266;
+	font-weight: 700;
+	margin-bottom: 12px;
+
+	&::before {
+		content: '';
+		position: absolute;
+		left: 0;
+		top: 6px;
+		height: 16px;
+		width: 4px;
+		border-radius: 1px;
+		background: #0b58ff;
+	}
+}
+
+:deep(.custom-tabs) {
+	.el-tabs__header {
+		margin-left: 12px;
+		margin-bottom: 8px;
+		display: inline-block;
+		transform: translateY(-6px);
+	}
+
+	.el-tabs__item {
+		padding-left: 0 !important;
+		padding-right: 0 !important;
+		height: 36px;
+	}
+}
 </style>

 <!-- 
@ -390,47 +583,47 @@ export default {
 	// 	width: 128,
 	// 	prop: 'line1',
 	// 	label: '产线1',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line2',
 	// 	label: '产线2',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line3',
 	// 	label: '产线3',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line4',
 	// 	label: '产线4',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line5',
 	// 	label: '产线5',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line6',
 	// 	label: '产线6',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line7',
 	// 	label: '产线7',
-	// 	align: 'center',
+	// 	,
 	// },
 	// {
 	// 	width: 128,
 	// 	prop: 'line8',
 	// 	label: '产线8',
-	// 	align: 'center',
+	// 	,
 	// }, -->
Author	SHA1	Message	Date
helloDy	699810f40a	Merge branch 'test' into dy	2023-09-22 16:54:40 +08:00
helloDy	d454f20bd6	bug	2023-09-22 16:54:16 +08:00
juzi	95da2191dd	Merge pull request 'zjl' (#32 ) from zjl into test Reviewed-on: #32	2023-09-22 11:09:34 +08:00
juzi	42550264c8	merge test	2023-09-22 11:08:58 +08:00
juzi	727f7d57c3	能源bug	2023-09-22 11:06:43 +08:00
g7hoo	aa32e4d3fb	Merge pull request 'lb' (#31 ) from lb into test Reviewed-on: #31	2023-09-22 10:54:56 +08:00
lb	dcda3a6294	bugfix	2023-09-22 10:54:21 +08:00
lb	f43b1c1eab	update 设备加工数量	2023-09-22 10:29:28 +08:00
g7hoo	ca3965e8cb	Merge pull request 'lb' (#30 ) from lb into test Reviewed-on: #30	2023-09-22 09:57:16 +08:00
lb	ee3d6f9dc6	merge	2023-09-22 09:28:41 +08:00
lb	e2a777069e	update 设备加工数量	2023-09-21 17:09:15 +08:00
lb	06fa7d40b3	update 设备加工数量	2023-09-21 17:03:07 +08:00
lb	f6f0480744	update 设备加工数量	2023-09-21 16:00:46 +08:00
lb	45e7f337bf	update 设备加工数量	2023-09-21 15:54:11 +08:00
lb	8e0d63839a	update 设备加工数量	2023-09-21 15:35:16 +08:00
lb	6c21f01fd7	update 设备加工数量	2023-09-21 15:14:38 +08:00
lb	52bc38499c	update 设备效率分析	2023-09-21 14:54:16 +08:00
lb	c600d14f8f	update 设备产量时序图	2023-09-20 17:03:39 +08:00
juzi	2265c549e6	Merge pull request 'zjl' (#29 ) from zjl into test Reviewed-on: #29	2023-09-20 16:59:53 +08:00
juzi	a74242f3b3	mrege test	2023-09-20 16:59:13 +08:00
juzi	ebcf3d4d78	修改bug	2023-09-20 16:57:20 +08:00
lb	8ad84a4d61	update 设备产量时序图	2023-09-20 14:44:39 +08:00
高天泽	ff9e93d264	Merge pull request 'dy' (#28 ) from dy into test Reviewed-on: #28	2023-09-20 14:28:21 +08:00
lb	928258e509	update 设备状态时序图	2023-09-20 14:11:36 +08:00
lb	a12530b835	update 质量检测统计数据	2023-09-20 11:17:34 +08:00
lb	b3db8dcae8	update 检测统计数据chart	2023-09-20 10:49:17 +08:00
lb	24a0857808	update 质量检测统计数据	2023-09-20 09:50:38 +08:00
lb	e0cc022e34	update 产品质量分析样式	2023-09-20 09:11:31 +08:00
lb	71bcd14c72	update 产品质量分析chart	2023-09-19 17:06:19 +08:00
lb	c965dfbc5a	bugfix	2023-09-18 17:01:44 +08:00
lb	c364162a2a	update no-data-background	2023-09-18 15:14:18 +08:00
lb	7407b97f5a	bugfix zentao	2023-09-18 13:52:36 +08:00
lb	a6d8a7a9da	update	2023-09-15 15:45:37 +08:00
lb	7d2bfaea18	bugfix zentao 2	2023-09-15 14:49:31 +08:00
lb	772a4b0633	bugfix zentao 1	2023-09-15 14:30:19 +08:00
lb	27ebe39a96	update image	2023-09-13 17:06:02 +08:00