Compare commits
	
		
			40 Commits
		
	
	
		
			bb6bfc5ab6
			...
			projects/z
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 10219fd841 | |||
| 74a2a3b8e5 | |||
| c3b4223e5b | |||
| 070e01c2c4 | |||
| 2665b6a0b0 | |||
| a71fb90e6a | |||
| ac85c83cf9 | |||
| c2e987aee4 | |||
| 0e4ed597cd | |||
| 3e7914ac91 | |||
| 9c19a6197a | |||
| 074b35b6a6 | |||
| 9be57ad750 | |||
| f7313c5911 | |||
| a7e81ad8fb | |||
| 32cbf9076f | |||
| 9a411cc663 | |||
| 
						 | 
					445a88e540 | ||
| 
						 | 
					2b355aaf8f | ||
| f60a46ed1d | |||
| 2688896660 | |||
| 
						 | 
					4a67e226e1 | ||
| 
						 | 
					11ee0d6541 | ||
| 98b3237c9a | |||
| 
						 | 
					46aaa47e07 | ||
| ca0f62b2eb | |||
| 5534104e87 | |||
| b72fe1bfed | |||
| f4493bde1c | |||
| 
						 | 
					d682ecc91c | ||
| 
						 | 
					2b76ef7d23 | ||
| 9ec13b35b8 | |||
| 7acccd3de0 | |||
| e40f45a79a | |||
| 77083a84a1 | |||
| 9f53ea6981 | |||
| 8f634d012c | |||
| 03c573d5b2 | |||
| 348714edaf | |||
| 814fe4605a | 
							
								
								
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							@@ -1,7 +1,7 @@
 | 
			
		||||
###
 | 
			
		||||
 # @Author: Do not edit
 | 
			
		||||
 # @Date: 2023-08-29 09:40:39
 | 
			
		||||
 # @LastEditTime: 2023-09-18 10:44:07
 | 
			
		||||
 # @LastEditTime: 2023-10-16 09:22:52
 | 
			
		||||
 # @LastEditors: DY
 | 
			
		||||
 # @Description: 
 | 
			
		||||
### 
 | 
			
		||||
 
 | 
			
		||||
@@ -75,7 +75,7 @@
 | 
			
		||||
    "vue-count-to": "1.0.13",
 | 
			
		||||
    "vue-cropper": "0.5.8",
 | 
			
		||||
    "vue-meta": "^2.4.0",
 | 
			
		||||
    "vue-plugin-hiprint": "^0.0.54-fix",
 | 
			
		||||
    "vue-plugin-hiprint": "0.0.54-fix",
 | 
			
		||||
    "vue-quill-editor": "^3.0.6",
 | 
			
		||||
    "vue-router": "3.4.9",
 | 
			
		||||
    "vue-video-player": "^5.0.2",
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										
											BIN
										
									
								
								public/static/videos/login.webm
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								public/static/videos/login.webm
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							@@ -1,3 +1,10 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-08-28 15:30:53
 | 
			
		||||
 * @LastEditTime: 2023-10-13 17:08:33
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
 */
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
 | 
			
		||||
// 创建产线目前生产产品表 主要为更新
 | 
			
		||||
@@ -35,11 +42,11 @@ export function getLineBindProductLog(id) {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产线目前生产产品表 主要为更新分页
 | 
			
		||||
export function getLineBindProductLogPage(query) {
 | 
			
		||||
export function getLineBindProductLogPage(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/line-bind-product-log/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										15
									
								
								src/assets/icons/svg/changelogo.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										15
									
								
								src/assets/icons/svg/changelogo.svg
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,15 @@
 | 
			
		||||
<?xml version="1.0" encoding="UTF-8"?>
 | 
			
		||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 | 
			
		||||
    <title>状态切换备份 3</title>
 | 
			
		||||
    <g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
 | 
			
		||||
        <g id="icon和插图" transform="translate(-877.000000, -246.000000)">
 | 
			
		||||
            <g id="状态切换备份-3" transform="translate(885.000000, 254.000000) rotate(-270.000000) translate(-885.000000, -254.000000) translate(877.000000, 246.000000)">
 | 
			
		||||
                <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="15" height="15"></rect>
 | 
			
		||||
                <g id="错误" transform="translate(0.000000, 0.000000)" fill-rule="nonzero">
 | 
			
		||||
                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="6.4293957e-15" width="16" height="16"></rect>
 | 
			
		||||
                    <path d="M8,1 C11.85,1 15,4.15 15,8 C15,11.85 11.85,15 8,15 C4.15,15 1,11.85 1,8 C1,4.15 4.15,1 8,1 Z M8,2.19926499 C4.80249503,2.19926499 2.18635461,4.80959575 2.18635461,8 C2.18635461,11.1904043 4.80249503,13.800735 8,13.800735 C11.197505,13.800735 13.8136454,11.1904043 13.8136454,8 C13.8136454,4.80959575 11.197505,2.19926499 8,2.19926499 Z M9.18342887,4.39602962 C9.42080763,4.39602962 9.61773566,4.56921978 9.65474747,4.7961346 L9.66099805,4.87359881 L9.66052938,9.97276858 L10.1621026,9.47231604 C10.3071657,9.32725295 10.5223305,9.29501672 10.6985498,9.37560733 L10.7713701,9.41705393 L10.837514,9.47231606 C11.0033004,9.63810246 11.0217211,9.89545015 10.8927761,10.0815835 L10.837514,10.1477274 L9.52115984,11.4640816 C9.38457467,11.600698 9.17913638,11.6415719 9.00066062,11.5676398 C8.84450229,11.5029526 8.73591407,11.3615296 8.71120699,11.1977853 L8.70585968,11.1264012 L8.70585968,4.87359881 C8.70585968,4.60984463 8.91967469,4.39602962 9.18342887,4.39602962 Z M6.99933939,4.43236016 C7.15549771,4.49704738 7.26408594,4.63847045 7.28879302,4.80221473 L7.29414032,4.87359881 L7.29414032,11.1264012 C7.29414032,11.2530604 7.24382515,11.374532 7.15426356,11.4640936 C7.06470196,11.5536552 6.94323037,11.6039704 6.81657114,11.6039704 C6.68991191,11.6039704 6.56844032,11.5536552 6.47887872,11.4640936 C6.40722945,11.3924443 6.36069788,11.3003726 6.34495123,11.2015604 L6.33900196,11.1264012 L6.33858601,6.02634681 L5.83789738,6.52768395 C5.69283427,6.67274705 5.47766955,6.70498329 5.30145018,6.62439268 L5.22862992,6.58294608 L5.162486,6.52768394 C4.9966996,6.36189754 4.97827889,6.10454984 5.10722387,5.91841648 L5.162486,5.85227257 L6.47884017,4.53591839 C6.61542534,4.39930202 6.82086362,4.35842813 6.99933939,4.43236016 Z" id="形状结合" fill="#0B58FF"></path>
 | 
			
		||||
                </g>
 | 
			
		||||
            </g>
 | 
			
		||||
        </g>
 | 
			
		||||
    </g>
 | 
			
		||||
</svg>
 | 
			
		||||
| 
		 After Width: | Height: | Size: 2.7 KiB  | 
							
								
								
									
										14
									
								
								src/assets/icons/svg/icon-upload.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										14
									
								
								src/assets/icons/svg/icon-upload.svg
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,14 @@
 | 
			
		||||
<?xml version="1.0" encoding="UTF-8"?>
 | 
			
		||||
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 | 
			
		||||
    <title>上传</title>
 | 
			
		||||
    <g id="组件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.65">
 | 
			
		||||
        <g id="上传_Resources/Button" transform="translate(-12.000000, -9.000000)">
 | 
			
		||||
            <g id="上传" transform="translate(12.000000, 9.000000)">
 | 
			
		||||
                <g id="upload" transform="translate(0.875000, 0.875000)" fill="currentColor" fill-rule="nonzero">
 | 
			
		||||
                    <path d="M5.80371094,0.138085937 C5.8953125,0.046484375 6.01699219,0 6.13867188,0 C6.26035156,0 6.38066406,0.046484375 6.47363281,0.138085937 L8.60371094,2.26953125 C8.78828125,2.45410156 8.78828125,2.75351562 8.60371094,2.93808594 C8.51484375,3.02695312 8.39589844,3.07617188 8.27011719,3.07617188 C8.14433594,3.07617188 8.02539062,3.02695312 7.93652344,2.93808594 L6.61171875,1.61328125 L6.61171875,9.51289062 C6.61171875,9.77402344 6.39980469,9.9859375 6.13867188,9.9859375 C5.87753906,9.9859375 5.665625,9.77402344 5.665625,9.51289062 L5.665625,1.61328125 L4.34082031,2.93808594 C4.15625,3.12265625 3.85683594,3.12265625 3.67363281,2.93808594 C3.4890625,2.75351562 3.4890625,2.45410156 3.67226563,2.26953125 L5.80371094,0.138085937 Z M11.7769531,7.88046875 C11.5158203,7.88046875 11.3039063,8.09238281 11.3039063,8.35351563 L11.3039063,11.025 C11.3039063,11.1794922 11.178125,11.3066406 11.0222656,11.3066406 L1.22636719,11.3066406 C1.071875,11.3066406 0.944726562,11.1808594 0.944726562,11.025 L0.944726562,8.35214844 C0.944726562,8.09101563 0.7328125,7.87910156 0.471679688,7.87910156 C0.210546875,7.87910156 0,8.09238281 0,8.35214844 L0,11.3996094 C0,11.8685547 0.381445313,12.2486328 0.849023437,12.2486328 L11.4009766,12.2486328 C11.8699219,12.2486328 12.25,11.8671875 12.25,11.3996094 L12.25,8.35214844 C12.25,8.09238281 12.0380859,7.88046875 11.7769531,7.88046875 Z" id="Shape"></path>
 | 
			
		||||
                </g>
 | 
			
		||||
                <rect id="Rectangle-49" x="0" y="0" width="14" height="14"></rect>
 | 
			
		||||
            </g>
 | 
			
		||||
        </g>
 | 
			
		||||
    </g>
 | 
			
		||||
</svg>
 | 
			
		||||
| 
		 After Width: | Height: | Size: 2.1 KiB  | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/default-file-icon.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/default-file-icon.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 1.6 KiB  | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/login-bg.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/login-bg.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 137 KiB  | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/tuple.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/tuple.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 944 B  | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/logo/cnbm.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/logo/cnbm.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 1.9 KiB  | 
@@ -1,10 +1,13 @@
 | 
			
		||||
/* ===== PC DESIGN ===== */
 | 
			
		||||
$W: 1000;
 | 
			
		||||
$W: 1080;
 | 
			
		||||
$H: 1920;
 | 
			
		||||
$picW: 438;
 | 
			
		||||
$picH: 560;
 | 
			
		||||
$formW: 320;
 | 
			
		||||
// $picW: 438;
 | 
			
		||||
// $picH: 560;
 | 
			
		||||
$picW: 1080;
 | 
			
		||||
$picH: 1118;
 | 
			
		||||
$formW: 420;
 | 
			
		||||
$tabW: $formW / 2;
 | 
			
		||||
// $rowH: 56;
 | 
			
		||||
$rowH: 56;
 | 
			
		||||
$buttonH: 50;
 | 
			
		||||
 | 
			
		||||
@@ -15,6 +18,7 @@ $containerBgImage: '../assets/images/bg.png';
 | 
			
		||||
$logoWidth: 417px;
 | 
			
		||||
$logoHeight: 64px;
 | 
			
		||||
$logoImage: '../assets/logo/login-logo.png';
 | 
			
		||||
$cnbmLogo: '../assets/logo/cnbm.png';
 | 
			
		||||
// container-content
 | 
			
		||||
$contentWidth: round($W / $H * 100) * 1vw;
 | 
			
		||||
$contentHeight: round($picH / $W * 100) / 100 * $contentWidth;
 | 
			
		||||
@@ -22,7 +26,8 @@ $contentBgColor: #ffffff;
 | 
			
		||||
// container-content-pic
 | 
			
		||||
$picWidth: round($picW / $H * 100) * 1vw;
 | 
			
		||||
$picHeight: inherit;
 | 
			
		||||
$picImage: '../assets/images/pic.png';
 | 
			
		||||
// $picImage: '../assets/images/pic.png';
 | 
			
		||||
$picImage: '../assets/images/login-bg.png';
 | 
			
		||||
// container-content-field
 | 
			
		||||
$fieldWidth: $contentWidth - $picWidth;
 | 
			
		||||
$fieldHeight: inherit;
 | 
			
		||||
@@ -34,231 +39,310 @@ $buttonHeight: $buttonH * 1px;
 | 
			
		||||
 | 
			
		||||
// - - - - - 页面基础设置
 | 
			
		||||
.container {
 | 
			
		||||
  .login-code {
 | 
			
		||||
    width: 33%;
 | 
			
		||||
    height: 38px;
 | 
			
		||||
    float: right;
 | 
			
		||||
    img {
 | 
			
		||||
      cursor: pointer;
 | 
			
		||||
      width:100%;max-width:100px; height:auto;
 | 
			
		||||
      vertical-align: middle;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  // 元素
 | 
			
		||||
  width: inherit;
 | 
			
		||||
  height: inherit;
 | 
			
		||||
  min-width: 1080px;
 | 
			
		||||
  min-height: 620px;
 | 
			
		||||
  background-color: $containerBgColor;
 | 
			
		||||
  background-image: url($containerBgImage);
 | 
			
		||||
  background-size: cover;
 | 
			
		||||
  // 定位
 | 
			
		||||
  position: relative;
 | 
			
		||||
  display: flex;
 | 
			
		||||
  justify-content: center;
 | 
			
		||||
  align-items: center;
 | 
			
		||||
  // 文字
 | 
			
		||||
  font-size: 14px;
 | 
			
		||||
  font-family: Microsoft YaHei;
 | 
			
		||||
  font-weight: 400;
 | 
			
		||||
  .logo {
 | 
			
		||||
    // 元素
 | 
			
		||||
    width: $logoWidth;
 | 
			
		||||
    height: $logoHeight;
 | 
			
		||||
    // background-image: url($logoImage);
 | 
			
		||||
    // background-size: contain;
 | 
			
		||||
    // 定位
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    top: 50px;
 | 
			
		||||
    left: 50%;
 | 
			
		||||
    margin-left: -$logoWidth/2;
 | 
			
		||||
  }
 | 
			
		||||
  .content {
 | 
			
		||||
    // 元素
 | 
			
		||||
    width: $contentWidth;
 | 
			
		||||
    height: $contentHeight;
 | 
			
		||||
    background-color: #ffffff;
 | 
			
		||||
    box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07);
 | 
			
		||||
    border-radius: 20px;
 | 
			
		||||
    // 定位
 | 
			
		||||
    position: relative;
 | 
			
		||||
    .pic {
 | 
			
		||||
      // 元素
 | 
			
		||||
      width: $picWidth;
 | 
			
		||||
      height: $picHeight;
 | 
			
		||||
      background-image: url($picImage);
 | 
			
		||||
      background-repeat: no-repeat;
 | 
			
		||||
      background-size: cover;
 | 
			
		||||
      border-radius: 20px 0 0 20px;
 | 
			
		||||
      // 定位
 | 
			
		||||
      position: absolute;
 | 
			
		||||
      top: 0;
 | 
			
		||||
      left: 0;
 | 
			
		||||
    }
 | 
			
		||||
    .field {
 | 
			
		||||
      width: $fieldWidth;
 | 
			
		||||
      height: $fieldHeight;
 | 
			
		||||
      // 定位
 | 
			
		||||
      position: absolute;
 | 
			
		||||
      top: 0;
 | 
			
		||||
      left: $picWidth;
 | 
			
		||||
      display:flex;
 | 
			
		||||
      justify-content: center;
 | 
			
		||||
      align-items: center;
 | 
			
		||||
      .pc-title{ width: 100%; clear: both;}
 | 
			
		||||
      .mobile-title,
 | 
			
		||||
      .mobile-switch {
 | 
			
		||||
        display: none;
 | 
			
		||||
      }
 | 
			
		||||
      .form {
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
        width: $formWidth;
 | 
			
		||||
        // - - - tab
 | 
			
		||||
        :deep(.el-tabs__content) {
 | 
			
		||||
          padding: 20px 0 0;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-tabs__item) {
 | 
			
		||||
          // 元素
 | 
			
		||||
          width: $tabWidth;
 | 
			
		||||
          height: $rowHeight;
 | 
			
		||||
          padding: 0;
 | 
			
		||||
          // 文字
 | 
			
		||||
          line-height: $rowHeight;
 | 
			
		||||
          color: #666666;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-tabs__item.is-active) {
 | 
			
		||||
          font-weight: bold;
 | 
			
		||||
          color: #2F53EB;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-tabs__active-bar) {
 | 
			
		||||
          height: 3px;
 | 
			
		||||
          border-radius: 2px;
 | 
			
		||||
        }
 | 
			
		||||
        // - - - input
 | 
			
		||||
        :deep(.el-input__inner) {
 | 
			
		||||
          // 元素
 | 
			
		||||
          width: 100%;
 | 
			
		||||
          height: $rowHeight;
 | 
			
		||||
          background: #f5f5f5;
 | 
			
		||||
          border: 0;
 | 
			
		||||
          border-radius: 28px;
 | 
			
		||||
          // 文字
 | 
			
		||||
          text-align: center;
 | 
			
		||||
          line-height: 19px;
 | 
			
		||||
          color: #262626;
 | 
			
		||||
        }
 | 
			
		||||
        .code:deep(.el-input__inner) {
 | 
			
		||||
          padding: 0 24px;
 | 
			
		||||
          // 文字
 | 
			
		||||
          text-align: left;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-input__inner::-webkit-input-placeholder) { /* WebKit browsers */
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          color: #8C8C8C;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-input__inner:-moz-placeholder) { /* Mozilla Firefox 4 to 18 */
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          color: #8C8C8C;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-input__inner::-moz-placeholder) { /* Mozilla Firefox 19+ */
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          color: #8C8C8C;
 | 
			
		||||
          opacity:1;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-input__inner:-ms-input-placeholder) { /* Internet Explorer 10+ */
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          color: #8C8C8C !important;
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-form-item) {
 | 
			
		||||
          position: relative;
 | 
			
		||||
          .button-code {
 | 
			
		||||
            // 元素
 | 
			
		||||
            height: $rowHeight;
 | 
			
		||||
            box-sizing: border-box;
 | 
			
		||||
            // 定位
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            top: 0;
 | 
			
		||||
            right: 20px;
 | 
			
		||||
            z-index: 1;
 | 
			
		||||
            // 文字
 | 
			
		||||
            line-height: 20px;
 | 
			
		||||
            font-size: 14px;
 | 
			
		||||
            font-family: PingFang SC;
 | 
			
		||||
            font-weight: 400;
 | 
			
		||||
            color: #2F53EB;
 | 
			
		||||
            span {
 | 
			
		||||
              padding-left: 15px;
 | 
			
		||||
              border-left: 2px solid #D9D9D9;
 | 
			
		||||
            }
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        :deep(.el-form-item__error) {
 | 
			
		||||
          padding-left: 24px;
 | 
			
		||||
        }
 | 
			
		||||
        .button {
 | 
			
		||||
          width: 100%;
 | 
			
		||||
          height: $buttonHeight;
 | 
			
		||||
          background: rgba(24, 144, 255, 0.2);
 | 
			
		||||
          border: 0;
 | 
			
		||||
          border-radius: 24px;
 | 
			
		||||
          margin-bottom: 20px;
 | 
			
		||||
          // 文字
 | 
			
		||||
          line-height: 26px;
 | 
			
		||||
          font-size: 20px;
 | 
			
		||||
          color: #FFFFFF;
 | 
			
		||||
        }
 | 
			
		||||
        .button-active {
 | 
			
		||||
          background: #2F53EB;
 | 
			
		||||
          box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2);
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  .footer {
 | 
			
		||||
    // 元素
 | 
			
		||||
    height: 16px;
 | 
			
		||||
    line-height: 16px;
 | 
			
		||||
    font-size: 12px;
 | 
			
		||||
    color: #8c8c8c;
 | 
			
		||||
    // 定位
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    bottom: 30px;
 | 
			
		||||
    a,
 | 
			
		||||
    a:hover,
 | 
			
		||||
    a:active {
 | 
			
		||||
      color: inherit;
 | 
			
		||||
      text-decoration: none;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
	.login-code {
 | 
			
		||||
		width: 33%;
 | 
			
		||||
		height: 38px;
 | 
			
		||||
		float: right;
 | 
			
		||||
		img {
 | 
			
		||||
			cursor: pointer;
 | 
			
		||||
			width: 100%;
 | 
			
		||||
			max-width: 100px;
 | 
			
		||||
			height: auto;
 | 
			
		||||
			vertical-align: middle;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
	// 元素
 | 
			
		||||
	width: inherit;
 | 
			
		||||
	height: inherit;
 | 
			
		||||
	min-width: 1080px;
 | 
			
		||||
	min-height: 620px;
 | 
			
		||||
	background-color: $containerBgColor;
 | 
			
		||||
	// background-image: url($containerBgImage);
 | 
			
		||||
	background-size: cover;
 | 
			
		||||
	// 定位
 | 
			
		||||
	position: relative;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	justify-content: center;
 | 
			
		||||
	align-items: center;
 | 
			
		||||
	// 文字
 | 
			
		||||
	font-size: 14px;
 | 
			
		||||
	font-family: Microsoft YaHei;
 | 
			
		||||
	font-weight: 400;
 | 
			
		||||
	.logo {
 | 
			
		||||
		// 元素
 | 
			
		||||
		width: $logoWidth;
 | 
			
		||||
		height: $logoHeight;
 | 
			
		||||
		// background-image: url($logoImage);
 | 
			
		||||
		// background-size: contain;
 | 
			
		||||
		// 定位
 | 
			
		||||
		position: absolute;
 | 
			
		||||
		top: 50px;
 | 
			
		||||
		left: 50%;
 | 
			
		||||
		margin-left: -$logoWidth/2;
 | 
			
		||||
	}
 | 
			
		||||
	.content {
 | 
			
		||||
		// 元素
 | 
			
		||||
		// width: $contentWidth;
 | 
			
		||||
		// height: $contentHeight;
 | 
			
		||||
		width: 100%;
 | 
			
		||||
		height: 100%;
 | 
			
		||||
		background-color: #ffffff;
 | 
			
		||||
		// box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07);
 | 
			
		||||
		// border-radius: 20px;
 | 
			
		||||
		// 定位
 | 
			
		||||
		position: relative;
 | 
			
		||||
		display: flex;
 | 
			
		||||
 | 
			
		||||
		.pic {
 | 
			
		||||
			// 元素
 | 
			
		||||
			width: $picWidth;
 | 
			
		||||
			height: $picHeight;
 | 
			
		||||
			background-image: url($picImage);
 | 
			
		||||
			background-repeat: no-repeat;
 | 
			
		||||
			background-size: 100% 100%;
 | 
			
		||||
			background-position: 0 0;
 | 
			
		||||
			position: relative;
 | 
			
		||||
 | 
			
		||||
			&::after {
 | 
			
		||||
        content: '';
 | 
			
		||||
				position: absolute;
 | 
			
		||||
				top: 0;
 | 
			
		||||
				left: 0;
 | 
			
		||||
				width: 100%;
 | 
			
		||||
				height: 100%;
 | 
			
		||||
        // background: #f003;
 | 
			
		||||
        display: inline-block;
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
		.field {
 | 
			
		||||
			// background: #ccc3;
 | 
			
		||||
			position: relative;
 | 
			
		||||
			padding-top: 196px;
 | 
			
		||||
			flex: 1;
 | 
			
		||||
			display: flex;
 | 
			
		||||
			flex-direction: column;
 | 
			
		||||
			// justify-content: center;
 | 
			
		||||
			align-items: center;
 | 
			
		||||
			.pc-title {
 | 
			
		||||
				width: 100%;
 | 
			
		||||
				text-align: center;
 | 
			
		||||
				clear: both;
 | 
			
		||||
				position: relative;
 | 
			
		||||
				top: -36px;
 | 
			
		||||
 | 
			
		||||
				// h3.title {
 | 
			
		||||
				// 	position: relative;
 | 
			
		||||
 | 
			
		||||
				// 	&::before {
 | 
			
		||||
				// 		content: '';
 | 
			
		||||
				// 		background: url($cnbmLogo) 100% / 100% no-repeat;
 | 
			
		||||
				// 		height: 48px;
 | 
			
		||||
				// 		width: 48px;
 | 
			
		||||
				// 		position: absolute;
 | 
			
		||||
				// 		left: 0px;
 | 
			
		||||
				// 		top: 4px;
 | 
			
		||||
				// 		display: inline-block;
 | 
			
		||||
				// 	}
 | 
			
		||||
				// }
 | 
			
		||||
			}
 | 
			
		||||
			.mobile-title,
 | 
			
		||||
			.mobile-switch {
 | 
			
		||||
				display: none;
 | 
			
		||||
			}
 | 
			
		||||
			.form {
 | 
			
		||||
				margin-top: 32px;
 | 
			
		||||
				box-sizing: border-box;
 | 
			
		||||
				// width: $formWidth;
 | 
			
		||||
				width: 100%;
 | 
			
		||||
				// - - - tab
 | 
			
		||||
				:deep(.el-tabs__nav) {
 | 
			
		||||
					// background: #f0f3;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-tabs__content) {
 | 
			
		||||
					padding: 20px 0 0;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-tabs__item) {
 | 
			
		||||
					user-select: none;
 | 
			
		||||
					// 元素
 | 
			
		||||
					width: $tabWidth;
 | 
			
		||||
					height: $rowHeight;
 | 
			
		||||
					padding: 0;
 | 
			
		||||
					// 文字
 | 
			
		||||
					line-height: $rowHeight;
 | 
			
		||||
					color: #666666;
 | 
			
		||||
					font-size: 18px;
 | 
			
		||||
					font-weight: 400;
 | 
			
		||||
					text-align: center;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-tabs__item.is-active) {
 | 
			
		||||
					font-weight: 500;
 | 
			
		||||
					color: #2f53eb;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-tabs__active-bar) {
 | 
			
		||||
					height: 3px;
 | 
			
		||||
					border-radius: 2px;
 | 
			
		||||
				}
 | 
			
		||||
				// - - - input
 | 
			
		||||
				:deep(.el-input__inner) {
 | 
			
		||||
					// 元素
 | 
			
		||||
					width: 100%;
 | 
			
		||||
					height: $rowHeight;
 | 
			
		||||
					background: #f5f5f5;
 | 
			
		||||
					border: 0;
 | 
			
		||||
					border-radius: 28px;
 | 
			
		||||
					// 文字
 | 
			
		||||
					text-align: center;
 | 
			
		||||
					line-height: 19px;
 | 
			
		||||
					color: #262626;
 | 
			
		||||
				}
 | 
			
		||||
				.code:deep(.el-input__inner) {
 | 
			
		||||
					padding: 0 24px;
 | 
			
		||||
					// 文字
 | 
			
		||||
					text-align: left;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-input__inner::-webkit-input-placeholder) {
 | 
			
		||||
					/* WebKit browsers */
 | 
			
		||||
					font-weight: 400;
 | 
			
		||||
					color: #8c8c8c;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-input__inner:-moz-placeholder) {
 | 
			
		||||
					/* Mozilla Firefox 4 to 18 */
 | 
			
		||||
					font-weight: 400;
 | 
			
		||||
					color: #8c8c8c;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-input__inner::-moz-placeholder) {
 | 
			
		||||
					/* Mozilla Firefox 19+ */
 | 
			
		||||
					font-weight: 400;
 | 
			
		||||
					color: #8c8c8c;
 | 
			
		||||
					opacity: 1;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-input__inner:-ms-input-placeholder) {
 | 
			
		||||
					/* Internet Explorer 10+ */
 | 
			
		||||
					font-weight: 400;
 | 
			
		||||
					color: #8c8c8c !important;
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-form-item) {
 | 
			
		||||
					position: relative;
 | 
			
		||||
					.button-code {
 | 
			
		||||
						// 元素
 | 
			
		||||
						height: $rowHeight;
 | 
			
		||||
						box-sizing: border-box;
 | 
			
		||||
						// 定位
 | 
			
		||||
						position: absolute;
 | 
			
		||||
						top: 0;
 | 
			
		||||
						right: 20px;
 | 
			
		||||
						z-index: 1;
 | 
			
		||||
						// 文字
 | 
			
		||||
						line-height: 20px;
 | 
			
		||||
						font-size: 14px;
 | 
			
		||||
						font-family: PingFang SC;
 | 
			
		||||
						font-weight: 400;
 | 
			
		||||
						color: #2f53eb;
 | 
			
		||||
						span {
 | 
			
		||||
							padding-left: 15px;
 | 
			
		||||
							border-left: 2px solid #d9d9d9;
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
				:deep(.el-form-item__error) {
 | 
			
		||||
					padding-left: 24px;
 | 
			
		||||
				}
 | 
			
		||||
				.button {
 | 
			
		||||
					width: 100%;
 | 
			
		||||
					height: $buttonHeight;
 | 
			
		||||
					background: rgba(24, 144, 255, 0.2);
 | 
			
		||||
					border: 0;
 | 
			
		||||
					border-radius: 24px;
 | 
			
		||||
					margin-bottom: 20px;
 | 
			
		||||
					// 文字
 | 
			
		||||
					line-height: 26px;
 | 
			
		||||
					font-size: 20px;
 | 
			
		||||
					color: #ffffff;
 | 
			
		||||
				}
 | 
			
		||||
				.button-active {
 | 
			
		||||
					background: #2f53eb;
 | 
			
		||||
					box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2);
 | 
			
		||||
				}
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.login-form {
 | 
			
		||||
		* {
 | 
			
		||||
			user-select: none;
 | 
			
		||||
		}
 | 
			
		||||
		// - - - input
 | 
			
		||||
		:deep(.el-input__inner) {
 | 
			
		||||
			// 元素
 | 
			
		||||
			width: 420px;
 | 
			
		||||
			height: 66px;
 | 
			
		||||
			color: #262626;
 | 
			
		||||
			font-size: 18px;
 | 
			
		||||
		}
 | 
			
		||||
		:deep(.el-checkbox__label) {
 | 
			
		||||
			font-size: 18px;
 | 
			
		||||
			line-height: 14px;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.footer {
 | 
			
		||||
		user-select: none;
 | 
			
		||||
		// 元素
 | 
			
		||||
		height: 16px;
 | 
			
		||||
		line-height: 16px;
 | 
			
		||||
		font-size: 12px;
 | 
			
		||||
		color: #8c8c8c;
 | 
			
		||||
		// 定位
 | 
			
		||||
		position: absolute;
 | 
			
		||||
		bottom: 30px;
 | 
			
		||||
		a,
 | 
			
		||||
		a:hover,
 | 
			
		||||
		a:active {
 | 
			
		||||
			color: inherit;
 | 
			
		||||
			text-decoration: none;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// - - - - - PC 最小尺寸设置
 | 
			
		||||
@media screen and (min-width: 599px) and (max-width: 1366px) {
 | 
			
		||||
  .container {
 | 
			
		||||
    .content {
 | 
			
		||||
      width: 710px;
 | 
			
		||||
      height: 397px;
 | 
			
		||||
      .pic {
 | 
			
		||||
        width: 314px;
 | 
			
		||||
      }
 | 
			
		||||
      .field {
 | 
			
		||||
        width: calc(710px - 314px);
 | 
			
		||||
        left: 314px;
 | 
			
		||||
        .form {
 | 
			
		||||
          width: 320px;
 | 
			
		||||
          :deep(.el-input__inner) {
 | 
			
		||||
            width: 320px;
 | 
			
		||||
            height: 56px;
 | 
			
		||||
          }
 | 
			
		||||
          .button {
 | 
			
		||||
            height: 50px;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
	.container {
 | 
			
		||||
		min-width: 599px;
 | 
			
		||||
		.content {
 | 
			
		||||
			// width: 710px;
 | 
			
		||||
			// height: 397px;
 | 
			
		||||
			width: 100%;
 | 
			
		||||
			height: 100%;
 | 
			
		||||
			.pic {
 | 
			
		||||
				// width: 314px;
 | 
			
		||||
				display: none;
 | 
			
		||||
			}
 | 
			
		||||
			.field {
 | 
			
		||||
				// width: calc(710px - 314px);
 | 
			
		||||
				// left: 314px;
 | 
			
		||||
				// justify-content: center;
 | 
			
		||||
				width: 100%;
 | 
			
		||||
 | 
			
		||||
				.pc-title {
 | 
			
		||||
					h3 {
 | 
			
		||||
						font-size: 2.4rem !important;
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				.form {
 | 
			
		||||
					// width: 320px;
 | 
			
		||||
					:deep(.el-input__inner) {
 | 
			
		||||
						width: 320px;
 | 
			
		||||
						height: 56px;
 | 
			
		||||
					}
 | 
			
		||||
					.button {
 | 
			
		||||
						height: 50px;
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/* ===== MOBILE DESIGN ===== */
 | 
			
		||||
$mobileW: 375;
 | 
			
		||||
@@ -273,115 +357,142 @@ $mobileButtonH: 48;
 | 
			
		||||
$mobileContainerBgImage: '../assets/images/bg-mobile.png';
 | 
			
		||||
// container-content
 | 
			
		||||
$mobileContentWidth: round($mobileContentW / $mobileW * 100) * 1vw;
 | 
			
		||||
$mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 * $mobileContentWidth;
 | 
			
		||||
$mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 *
 | 
			
		||||
	$mobileContentWidth;
 | 
			
		||||
// container-content-field-form
 | 
			
		||||
$mobileFormWidth: round($mobileFormW / $mobileW *100) * 1vw;
 | 
			
		||||
$mobileFormWidth: round($mobileFormW / $mobileW * 100) * 1vw;
 | 
			
		||||
$mobileRowHeight: $mobileRowH * 1px;
 | 
			
		||||
$mobileButtonHeight: $mobileButtonH * 1px;
 | 
			
		||||
$iconBgImage: '../assets/images/icon.png';
 | 
			
		||||
 | 
			
		||||
// - - - - - 移动端设置
 | 
			
		||||
@media screen and (max-width: 599px) {
 | 
			
		||||
  .container {
 | 
			
		||||
    // 元素
 | 
			
		||||
    background-image: url($mobileContainerBgImage);
 | 
			
		||||
    min-width: 280px;
 | 
			
		||||
    min-height: 568px;
 | 
			
		||||
    // 文字
 | 
			
		||||
    font-size: 17px;
 | 
			
		||||
    font-family: PingFang SC;
 | 
			
		||||
    font-weight: bold;
 | 
			
		||||
    .logo {
 | 
			
		||||
      display: none;
 | 
			
		||||
    }
 | 
			
		||||
	.container {
 | 
			
		||||
		// 元素
 | 
			
		||||
		background-image: url($mobileContainerBgImage);
 | 
			
		||||
		min-width: 280px;
 | 
			
		||||
		min-height: 568px;
 | 
			
		||||
		// 文字
 | 
			
		||||
		font-size: 14px;
 | 
			
		||||
		font-family: PingFang SC;
 | 
			
		||||
		font-weight: bold;
 | 
			
		||||
		.logo {
 | 
			
		||||
			display: none;
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
    .content {
 | 
			
		||||
      // 元素
 | 
			
		||||
      width: $mobileContentWidth;
 | 
			
		||||
      height: $mobileContentHeight;
 | 
			
		||||
      min-width: 250px;
 | 
			
		||||
      min-height: 340px;
 | 
			
		||||
      // 定位
 | 
			
		||||
      display: flex;
 | 
			
		||||
      justify-content: center;
 | 
			
		||||
      align-items: center;
 | 
			
		||||
      .pic {
 | 
			
		||||
        display: none;
 | 
			
		||||
      }
 | 
			
		||||
      .field {
 | 
			
		||||
        // 元素
 | 
			
		||||
        width: inherit;
 | 
			
		||||
        min-height: inherit;
 | 
			
		||||
        // 定位
 | 
			
		||||
        left: 0;
 | 
			
		||||
        display: flex;
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
        .mobile-title {
 | 
			
		||||
          // 元素
 | 
			
		||||
          margin: 0 0 20px;
 | 
			
		||||
          display: block;
 | 
			
		||||
        }
 | 
			
		||||
        .form {
 | 
			
		||||
          width: $mobileFormWidth;
 | 
			
		||||
          // - - - tab
 | 
			
		||||
          :deep(.el-tabs__header) {
 | 
			
		||||
            display: none;
 | 
			
		||||
          }
 | 
			
		||||
          :deep(.el-tabs__content) {
 | 
			
		||||
            padding: 0;
 | 
			
		||||
          }
 | 
			
		||||
          // - - - input
 | 
			
		||||
          :deep(.el-input__inner) {
 | 
			
		||||
            height: $mobileRowHeight;
 | 
			
		||||
            line-height: 24px;
 | 
			
		||||
            // 文字
 | 
			
		||||
            text-align: center;
 | 
			
		||||
            color: #262626;
 | 
			
		||||
          }
 | 
			
		||||
          :deep(.el-form-item) {
 | 
			
		||||
            .button-code {
 | 
			
		||||
              // 元素
 | 
			
		||||
              height: $mobileRowHeight;
 | 
			
		||||
            }
 | 
			
		||||
          }
 | 
			
		||||
          .button {
 | 
			
		||||
            height: $mobileButtonHeight;
 | 
			
		||||
            line-height: 24px;
 | 
			
		||||
            color: #FFFFFF;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        .mobile-switch {
 | 
			
		||||
          display: block;
 | 
			
		||||
          line-height: 20px;
 | 
			
		||||
          font-size: 14px;
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          color: #595959;
 | 
			
		||||
		.pc-title {
 | 
			
		||||
			display: none;
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		.content {
 | 
			
		||||
			// 元素
 | 
			
		||||
			width: $mobileContentWidth;
 | 
			
		||||
			height: $mobileContentHeight;
 | 
			
		||||
			min-width: 250px;
 | 
			
		||||
			min-height: 340px;
 | 
			
		||||
			// 定位
 | 
			
		||||
			display: flex;
 | 
			
		||||
			justify-content: center;
 | 
			
		||||
			align-items: center;
 | 
			
		||||
			.pic {
 | 
			
		||||
				display: none;
 | 
			
		||||
			}
 | 
			
		||||
			.field {
 | 
			
		||||
        padding: 0;
 | 
			
		||||
				// 元素
 | 
			
		||||
				width: inherit;
 | 
			
		||||
				min-height: inherit;
 | 
			
		||||
				// 定位
 | 
			
		||||
				left: 0;
 | 
			
		||||
				display: flex;
 | 
			
		||||
				flex-direction: column;
 | 
			
		||||
 | 
			
		||||
				.mobile-title {
 | 
			
		||||
					// 元素
 | 
			
		||||
					margin: 0;
 | 
			
		||||
					display: block;
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				.form {
 | 
			
		||||
          margin: 0;
 | 
			
		||||
          .icon {
 | 
			
		||||
            width: 14px;
 | 
			
		||||
            height: 14px;
 | 
			
		||||
            display: inline-block;
 | 
			
		||||
            background-image: url($iconBgImage);
 | 
			
		||||
            background-size: cover;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        .mobile-switch:hover {
 | 
			
		||||
          cursor: pointer;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    .footer {
 | 
			
		||||
      // 元素
 | 
			
		||||
      font-size: 12px;
 | 
			
		||||
      font-family: PingFang SC;
 | 
			
		||||
      font-weight: 400;
 | 
			
		||||
      line-height: 17px;
 | 
			
		||||
      color: #333333;
 | 
			
		||||
      opacity: 0.6;
 | 
			
		||||
      // 定位
 | 
			
		||||
      position: absolute;
 | 
			
		||||
      bottom: 20px;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
					width: $mobileFormWidth;
 | 
			
		||||
					// - - - tab
 | 
			
		||||
					:deep(.el-tabs__header) {
 | 
			
		||||
						display: none;
 | 
			
		||||
					}
 | 
			
		||||
					:deep(.el-tabs__content) {
 | 
			
		||||
						padding: 0;
 | 
			
		||||
					}
 | 
			
		||||
					// - - - input
 | 
			
		||||
					:deep(.el-input__inner) {
 | 
			
		||||
						height: $mobileRowHeight;
 | 
			
		||||
						line-height: 24px;
 | 
			
		||||
						// 文字
 | 
			
		||||
						text-align: center;
 | 
			
		||||
						color: #262626;
 | 
			
		||||
					}
 | 
			
		||||
					:deep(.el-form-item) {
 | 
			
		||||
						.button-code {
 | 
			
		||||
							// 元素
 | 
			
		||||
							height: $mobileRowHeight;
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
					.button {
 | 
			
		||||
						height: $mobileButtonHeight;
 | 
			
		||||
						line-height: 24px;
 | 
			
		||||
						color: #ffffff;
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				.login-form {
 | 
			
		||||
					:deep(.el-input__inner) {
 | 
			
		||||
						height: $mobileRowHeight;
 | 
			
		||||
						line-height: 24px;
 | 
			
		||||
						// 文字
 | 
			
		||||
						text-align: center;
 | 
			
		||||
						color: #262626;
 | 
			
		||||
					}
 | 
			
		||||
 | 
			
		||||
          :deep(#button-form-item) {
 | 
			
		||||
            margin: 0 !important;
 | 
			
		||||
						button {
 | 
			
		||||
							// 元素
 | 
			
		||||
							height: $mobileRowHeight;
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
				.mobile-switch {
 | 
			
		||||
					display: block;
 | 
			
		||||
					line-height: 20px;
 | 
			
		||||
					font-size: 14px;
 | 
			
		||||
					font-weight: 400;
 | 
			
		||||
					color: #595959;
 | 
			
		||||
					margin: 0;
 | 
			
		||||
					.icon {
 | 
			
		||||
						width: 14px;
 | 
			
		||||
						height: 14px;
 | 
			
		||||
						display: inline-block;
 | 
			
		||||
						background-image: url($iconBgImage);
 | 
			
		||||
						background-size: cover;
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
				.mobile-switch:hover {
 | 
			
		||||
					cursor: pointer;
 | 
			
		||||
				}
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		.footer {
 | 
			
		||||
			// 元素
 | 
			
		||||
			font-size: 12px;
 | 
			
		||||
			font-family: PingFang SC;
 | 
			
		||||
			font-weight: 400;
 | 
			
		||||
			line-height: 17px;
 | 
			
		||||
			color: #333333;
 | 
			
		||||
			opacity: 0.6;
 | 
			
		||||
			// 定位
 | 
			
		||||
			// position: absolute;
 | 
			
		||||
			bottom: -32px;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -10,6 +10,8 @@
 | 
			
		||||
		ref="form"
 | 
			
		||||
		:model="form"
 | 
			
		||||
		:label-width="`${labelWidth}px`"
 | 
			
		||||
		:size="size"
 | 
			
		||||
		:label-position="labelPosition"
 | 
			
		||||
		v-loading="formLoading">
 | 
			
		||||
		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex">
 | 
			
		||||
			<el-col v-for="col in row" :key="col.label" :span="24 / row.length">
 | 
			
		||||
@@ -46,23 +48,6 @@
 | 
			
		||||
						:placeholder="`请选择${col.label}`"
 | 
			
		||||
						value-format="timestamp"
 | 
			
		||||
						v-bind="col.bind"></el-date-picker>
 | 
			
		||||
					<el-upload
 | 
			
		||||
						class="upload-in-dialog"
 | 
			
		||||
						v-if="col.upload"
 | 
			
		||||
						:file-list="uploadedFileList"
 | 
			
		||||
						:action="col.url"
 | 
			
		||||
						:on-success="handleUploadSuccess"
 | 
			
		||||
						v-bind="col.bind">
 | 
			
		||||
						<el-button
 | 
			
		||||
							size="small"
 | 
			
		||||
							type="primary"
 | 
			
		||||
							:disabled="col.bind?.disabled || false">
 | 
			
		||||
							点击上传
 | 
			
		||||
						</el-button>
 | 
			
		||||
						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
 | 
			
		||||
							{{ col.uploadTips || '只能上传jpg/png文件,大小不超过2MB' }}
 | 
			
		||||
						</div>
 | 
			
		||||
					</el-upload>
 | 
			
		||||
					<el-switch
 | 
			
		||||
						v-if="col.switch"
 | 
			
		||||
						v-model="form[col.prop]"
 | 
			
		||||
@@ -74,6 +59,47 @@
 | 
			
		||||
						:key="col.key"
 | 
			
		||||
						:is="col.subcomponent"
 | 
			
		||||
						:inlineStyle="col.style"></component>
 | 
			
		||||
 | 
			
		||||
					<div
 | 
			
		||||
						class="upload-area"
 | 
			
		||||
						:class="uploadOpen ? '' : 'height-48'"
 | 
			
		||||
						ref="uploadArea"
 | 
			
		||||
						v-if="col.upload">
 | 
			
		||||
						<span class="close-icon" :class="uploadOpen ? 'open' : ''">
 | 
			
		||||
							<el-button
 | 
			
		||||
								type="text"
 | 
			
		||||
								icon="el-icon-arrow-right"
 | 
			
		||||
								@click="handleFilesOpen" />
 | 
			
		||||
						</span>
 | 
			
		||||
						<!-- :file-list="uploadedFileList" -->
 | 
			
		||||
						<el-upload
 | 
			
		||||
							class="upload-in-dialog"
 | 
			
		||||
							v-if="col.upload"
 | 
			
		||||
							:action="uploadUrl"
 | 
			
		||||
							:headers="uploadHeaders"
 | 
			
		||||
							:show-file-list="false"
 | 
			
		||||
							icon="el-icon-upload2"
 | 
			
		||||
							:before-upload="beforeUpload"
 | 
			
		||||
							:on-success="handleUploadSuccess"
 | 
			
		||||
							v-bind="col.bind">
 | 
			
		||||
							<el-button size="mini" :disabled="col.bind?.disabled || false">
 | 
			
		||||
								<svg-icon
 | 
			
		||||
									icon-class="icon-upload"
 | 
			
		||||
									style="color: inherit"></svg-icon>
 | 
			
		||||
								上传文件
 | 
			
		||||
							</el-button>
 | 
			
		||||
							<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
 | 
			
		||||
								{{ col.uploadTips || '只能上传jpg/png文件, 大小不超过2MB' }}
 | 
			
		||||
							</div>
 | 
			
		||||
						</el-upload>
 | 
			
		||||
 | 
			
		||||
						<uploadedFile
 | 
			
		||||
							class="file"
 | 
			
		||||
							v-for="file in form[col.prop] || []"
 | 
			
		||||
							:file="file"
 | 
			
		||||
							:key="file.fileUrl"
 | 
			
		||||
							@delete="handleDeleteFile(file)" />
 | 
			
		||||
					</div>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
@@ -81,6 +107,9 @@
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
import tupleImg from '@/assets/images/tuple.png';
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * 找到最长的label
 | 
			
		||||
 * @param {*} options
 | 
			
		||||
@@ -99,6 +128,47 @@ function findMaxLabelWidth(rows) {
 | 
			
		||||
	return max;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const uploadedFile = {
 | 
			
		||||
	name: 'UploadedFile',
 | 
			
		||||
	props: ['file'],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {};
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleDelete() {
 | 
			
		||||
			this.$emit('delete', this.file);
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {},
 | 
			
		||||
	render: function (h) {
 | 
			
		||||
		return (
 | 
			
		||||
			<div
 | 
			
		||||
				title={this.file.fileName}
 | 
			
		||||
				style={{
 | 
			
		||||
					background: `url(${tupleImg}) no-repeat`,
 | 
			
		||||
					backgroundSize: '14px',
 | 
			
		||||
					backgroundPosition: '0 55%',
 | 
			
		||||
					paddingLeft: '20px',
 | 
			
		||||
					paddingRight: '24px',
 | 
			
		||||
					textOverflow: 'ellipsis',
 | 
			
		||||
					whiteSpace: 'nowrap',
 | 
			
		||||
					overflow: 'hidden',
 | 
			
		||||
					cursor: 'pointer',
 | 
			
		||||
					display: 'inline-block',
 | 
			
		||||
				}}>
 | 
			
		||||
				{this.file.fileName}
 | 
			
		||||
				<el-button
 | 
			
		||||
					type="text"
 | 
			
		||||
					icon="el-icon-close"
 | 
			
		||||
					style="float: right; position: relative; top: 2px; left: 8px; z-index: 100"
 | 
			
		||||
					class="dialog__upload_component__close"
 | 
			
		||||
					onClick={this.handleDelete}
 | 
			
		||||
				/>
 | 
			
		||||
			</div>
 | 
			
		||||
		);
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'DialogForm',
 | 
			
		||||
	model: {
 | 
			
		||||
@@ -106,7 +176,7 @@ export default {
 | 
			
		||||
		event: 'update',
 | 
			
		||||
	},
 | 
			
		||||
	emits: ['update'],
 | 
			
		||||
	components: {},
 | 
			
		||||
	components: { uploadedFile },
 | 
			
		||||
	props: {
 | 
			
		||||
		rows: {
 | 
			
		||||
			type: Array,
 | 
			
		||||
@@ -119,14 +189,30 @@ export default {
 | 
			
		||||
		disabled: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		}
 | 
			
		||||
		},
 | 
			
		||||
		hasFile: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
		labelPosition: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: 'right',
 | 
			
		||||
		},
 | 
			
		||||
		size: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: '',
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			uploadOpen: false,
 | 
			
		||||
			form: {},
 | 
			
		||||
			formLoading: true,
 | 
			
		||||
			optionListOf: {},
 | 
			
		||||
			uploadedFileList: [],
 | 
			
		||||
			dataLoaded: false,
 | 
			
		||||
			uploadHeaders: { Authorization: 'Bearer ' + getAccessToken() },
 | 
			
		||||
			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 上传有关的headers,url都是固定的
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	computed: {
 | 
			
		||||
@@ -136,21 +222,10 @@ export default {
 | 
			
		||||
			return max * 20;
 | 
			
		||||
			// return max * 20 + 'px';
 | 
			
		||||
		},
 | 
			
		||||
		form: {
 | 
			
		||||
			get() {
 | 
			
		||||
				// if (this.dataLoaded) return this.dataForm;
 | 
			
		||||
				// else return {}
 | 
			
		||||
				return this.dataForm;
 | 
			
		||||
			},
 | 
			
		||||
			set(val) {
 | 
			
		||||
				console.log('set form', val);
 | 
			
		||||
			},
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		rows: {
 | 
			
		||||
			handler() {
 | 
			
		||||
				console.log('watch triggered!');
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.handleOptions('watch');
 | 
			
		||||
				});
 | 
			
		||||
@@ -158,6 +233,16 @@ export default {
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: false,
 | 
			
		||||
		},
 | 
			
		||||
		dataForm: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				this.form = JSON.parse(JSON.stringify(val));
 | 
			
		||||
				if (this.hasFile) {
 | 
			
		||||
					this.form.files = this.form.files ?? [];
 | 
			
		||||
				}
 | 
			
		||||
			},
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: true,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		// 处理 options
 | 
			
		||||
@@ -273,23 +358,29 @@ export default {
 | 
			
		||||
		beforeUpload() {},
 | 
			
		||||
		// 上传前的验证规则可通过 bind 属性传入
 | 
			
		||||
		handleUploadSuccess(response, file, fileList) {
 | 
			
		||||
			console.log(
 | 
			
		||||
				'[dialogForm:handleUploadSuccess]',
 | 
			
		||||
				response,
 | 
			
		||||
				file,
 | 
			
		||||
				fileList,
 | 
			
		||||
				this.form
 | 
			
		||||
			);
 | 
			
		||||
			// 保存原始文件名
 | 
			
		||||
			if ('fileNames' in this.form) this.form.fileNames.push(file.name);
 | 
			
		||||
			// 保存完整地址
 | 
			
		||||
			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data);
 | 
			
		||||
			this.form.files.push({
 | 
			
		||||
				fileName: file.name,
 | 
			
		||||
				fileUrl: response.data,
 | 
			
		||||
				fileType: 2,
 | 
			
		||||
			});
 | 
			
		||||
			this.$modal.msgSuccess('上传成功');
 | 
			
		||||
			this.$emit('update', this.form);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		getFileName(fileUrl) {
 | 
			
		||||
			return fileUrl.split('/').pop();
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleFilesOpen() {
 | 
			
		||||
			this.uploadOpen = !this.uploadOpen;
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleDeleteFile(file) {
 | 
			
		||||
			this.form.files = this.form.files.filter(
 | 
			
		||||
				(item) => item.fileUrl != file.fileUrl
 | 
			
		||||
			);
 | 
			
		||||
			this.$emit('update', this.form);
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
@@ -299,4 +390,52 @@ export default {
 | 
			
		||||
.el-select {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.upload-area {
 | 
			
		||||
	// background: #ccc;
 | 
			
		||||
	// display: grid;
 | 
			
		||||
	// grid-auto-rows: 34px;
 | 
			
		||||
	// grid-template-columns: repeat(6, minmax(32px, max-content));
 | 
			
		||||
	// gap: 8px;
 | 
			
		||||
	// align-items: center;
 | 
			
		||||
	position: relative;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
	transition: height 0.3s ease-out;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.upload-in-dialog {
 | 
			
		||||
	// display: inline-block;
 | 
			
		||||
	margin-right: 24px;
 | 
			
		||||
	// background: #ccc;
 | 
			
		||||
	position: relative;
 | 
			
		||||
	// top: -13px;
 | 
			
		||||
	float: left;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.close-icon {
 | 
			
		||||
	// background: #ccc;
 | 
			
		||||
	position: absolute;
 | 
			
		||||
	top: 0;
 | 
			
		||||
	right: 12px;
 | 
			
		||||
	z-index: 100;
 | 
			
		||||
	transition: transform 0.3s ease-out;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.close-icon.open {
 | 
			
		||||
	transform: rotateZ(90deg);
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
<style>
 | 
			
		||||
.dialog__upload_component__close {
 | 
			
		||||
	color: #ccc;
 | 
			
		||||
}
 | 
			
		||||
.dialog__upload_component__close:hover {
 | 
			
		||||
	/* color: #777; */
 | 
			
		||||
	color: red;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.height-48 {
 | 
			
		||||
	height: 35px !important;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -6,7 +6,9 @@
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<div ref="dataBoard" class=""></div>
 | 
			
		||||
	<div ref="dataBoard" class="data-board">
 | 
			
		||||
		<el-button type="text" @click="goback" class="go-back--btn">返回</el-button>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
@@ -24,39 +26,42 @@ export default {
 | 
			
		||||
			mainFooter: null, // dom
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.$nextTick(() => {
 | 
			
		||||
			this.modify();
 | 
			
		||||
		});
 | 
			
		||||
	},
 | 
			
		||||
	activated() {
 | 
			
		||||
		this.modify();
 | 
			
		||||
	},
 | 
			
		||||
	deactivated() {
 | 
			
		||||
		this.recover();
 | 
			
		||||
	},
 | 
			
		||||
	beforeDestroy() {
 | 
			
		||||
		this.recover();
 | 
			
		||||
	},
 | 
			
		||||
	// mounted() {
 | 
			
		||||
	// 	this.$nextTick(() => {
 | 
			
		||||
	// 		this.modify();
 | 
			
		||||
	// 	});
 | 
			
		||||
	// },
 | 
			
		||||
	// activated() {
 | 
			
		||||
	// 	this.modify();
 | 
			
		||||
	// },
 | 
			
		||||
	// deactivated() {
 | 
			
		||||
	// 	this.recover();
 | 
			
		||||
	// },
 | 
			
		||||
	// beforeDestroy() {
 | 
			
		||||
	// 	this.recover();
 | 
			
		||||
	// },
 | 
			
		||||
	methods: {
 | 
			
		||||
		modify() {
 | 
			
		||||
			// 在这个页面临时修改下父类的margin,结束时需还原
 | 
			
		||||
			this.appMain = document.querySelector('.app-main');
 | 
			
		||||
			// this.appMain.style.minHeight = 'calc(100vh - 90px)';
 | 
			
		||||
			this.appMain.style.margin = 0;
 | 
			
		||||
			// 在这个页面临时删除 main-footer 元素,结束时需还原
 | 
			
		||||
			// this.mainFooter = document.querySelector('.main-footer').cloneNode(true);
 | 
			
		||||
			// document.querySelector('.main-footer').remove();
 | 
			
		||||
            this.$refs.dataBoard.classList.add('data-board');
 | 
			
		||||
		},
 | 
			
		||||
		recover() {
 | 
			
		||||
            this.$refs.dataBoard.classList.remove('data-board');
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.appMain.style.margin = this.parentStyle.margin;
 | 
			
		||||
				// this.appMain.style.minHeight = this.parentStyle.minHeight;
 | 
			
		||||
				// this.appMain.insertAdjacentElement('afterend', this.mainFooter);
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		// modify() {
 | 
			
		||||
		// 	// 在这个页面临时修改下父类的margin,结束时需还原
 | 
			
		||||
		// 	this.appMain = document.querySelector('.app-main');
 | 
			
		||||
		// 	// this.appMain.style.minHeight = 'calc(100vh - 90px)';
 | 
			
		||||
		// 	this.appMain.style.margin = 0;
 | 
			
		||||
		// 	// 在这个页面临时删除 main-footer 元素,结束时需还原
 | 
			
		||||
		// 	// this.mainFooter = document.querySelector('.main-footer').cloneNode(true);
 | 
			
		||||
		// 	// document.querySelector('.main-footer').remove();
 | 
			
		||||
        //     this.$refs.dataBoard.classList.add('data-board');
 | 
			
		||||
		// },
 | 
			
		||||
		// recover() {
 | 
			
		||||
        //     this.$refs.dataBoard.classList.remove('data-board');
 | 
			
		||||
		// 	this.$nextTick(() => {
 | 
			
		||||
		// 		this.appMain.style.margin = this.parentStyle.margin;
 | 
			
		||||
		// 		// this.appMain.style.minHeight = this.parentStyle.minHeight;
 | 
			
		||||
		// 		// this.appMain.insertAdjacentElement('afterend', this.mainFooter);
 | 
			
		||||
		// 	});
 | 
			
		||||
		// },
 | 
			
		||||
		goback() {
 | 
			
		||||
			this.$router.go(-1);
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
@@ -71,4 +76,25 @@ export default {
 | 
			
		||||
	background: url('../../../assets/images/DataBoard.png') 100% 100% / contain
 | 
			
		||||
		no-repeat;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.go-back--btn {
 | 
			
		||||
	position: fixed;
 | 
			
		||||
	top: 28px;
 | 
			
		||||
	left: 24px;
 | 
			
		||||
	color: #fff;
 | 
			
		||||
	font-size: 18px;
 | 
			
		||||
	letter-spacing: 6px;
 | 
			
		||||
 | 
			
		||||
	&:hover {
 | 
			
		||||
		text-decoration: underline;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	&::after {
 | 
			
		||||
		content: "\2BAA";
 | 
			
		||||
		position: absolute;
 | 
			
		||||
		top: 6px;
 | 
			
		||||
		right: -26px;
 | 
			
		||||
		font-size: 24px;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -38,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>
 | 
			
		||||
 | 
			
		||||
		<!-- 抽屉 详情 -->
 | 
			
		||||
 
 | 
			
		||||
@@ -36,7 +36,7 @@
 | 
			
		||||
							v-if="showForm"
 | 
			
		||||
							ref="form"
 | 
			
		||||
							:disabled="mode.includes('detail')"
 | 
			
		||||
							:dataForm="form"
 | 
			
		||||
							v-model="form"
 | 
			
		||||
							:rows="formRows" />
 | 
			
		||||
					</div>
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -38,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>
 | 
			
		||||
 | 
			
		||||
		<!-- 抽屉 详情 -->
 | 
			
		||||
 
 | 
			
		||||
@@ -38,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>
 | 
			
		||||
 
 | 
			
		||||
@@ -36,7 +36,7 @@
 | 
			
		||||
							v-if="showForm"
 | 
			
		||||
							ref="form"
 | 
			
		||||
							:disabled="mode.includes('detail')"
 | 
			
		||||
							:dataForm="form"
 | 
			
		||||
							v-model="form"
 | 
			
		||||
							:rows="formRows" />
 | 
			
		||||
					</div>
 | 
			
		||||
 | 
			
		||||
@@ -151,7 +151,7 @@ export default {
 | 
			
		||||
				name: '',
 | 
			
		||||
				plcParamName: '',
 | 
			
		||||
				unit: '',
 | 
			
		||||
				collection: '',
 | 
			
		||||
				collection: 1,
 | 
			
		||||
				minValue: '',
 | 
			
		||||
				maxValue: '',
 | 
			
		||||
				defaultValue: '',
 | 
			
		||||
@@ -370,7 +370,7 @@ export default {
 | 
			
		||||
				name: '',
 | 
			
		||||
				plcParamName: '',
 | 
			
		||||
				unit: '',
 | 
			
		||||
				collection: '',
 | 
			
		||||
				collection: 1,
 | 
			
		||||
				minValue: '',
 | 
			
		||||
				maxValue: '',
 | 
			
		||||
				defaultValue: '',
 | 
			
		||||
 
 | 
			
		||||
@@ -38,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>
 | 
			
		||||
 | 
			
		||||
		<!-- 抽屉 详情 -->
 | 
			
		||||
 
 | 
			
		||||
@@ -38,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>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zhp
 | 
			
		||||
 * @Date: 2023-09-13 09:02:25
 | 
			
		||||
 * @LastEditTime: 2023-10-08 15:39:38
 | 
			
		||||
 * @LastEditTime: 2023-10-16 14:56:58
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
 
 | 
			
		||||
@@ -1,8 +1,12 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="app-container">
 | 
			
		||||
    <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
 | 
			
		||||
    <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" />
 | 
			
		||||
    <balance-chart ref="lineChart" />
 | 
			
		||||
    <div v-if="tableData.length">
 | 
			
		||||
      <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" />
 | 
			
		||||
      <SearchBar :formConfigs="[{ label: '产线平衡分析图', type: 'title' }]" />
 | 
			
		||||
      <balance-chart ref="lineChart" />
 | 
			
		||||
    </div>
 | 
			
		||||
    <div v-else class="no-data-bg"></div>
 | 
			
		||||
    <!-- <pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
@@ -89,7 +93,7 @@ export default {
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'button',
 | 
			
		||||
          btnName: '搜索',
 | 
			
		||||
          btnName: '查询',
 | 
			
		||||
          name: 'search',
 | 
			
		||||
          color: 'primary',
 | 
			
		||||
        }
 | 
			
		||||
@@ -144,11 +148,6 @@ export default {
 | 
			
		||||
      // this.listQuery.lineId = '1672847052717821953'
 | 
			
		||||
      // this.listQuery.startTime = '1693497600000';
 | 
			
		||||
      // this.listQuery.endTime = '1693843200000';
 | 
			
		||||
      this.tableData.splice(0)
 | 
			
		||||
      this.xData.splice(0)
 | 
			
		||||
      this.yData.splice(0)
 | 
			
		||||
      this.tableProps.splice(0)
 | 
			
		||||
      this.spanArr.splice(0)
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(res => {
 | 
			
		||||
        console.log(res)
 | 
			
		||||
        let arr = [
 | 
			
		||||
@@ -228,11 +227,17 @@ export default {
 | 
			
		||||
          this.listQuery.lineId = val.lineIds
 | 
			
		||||
          this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined;
 | 
			
		||||
          this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined;
 | 
			
		||||
          if (val.time) {
 | 
			
		||||
          if (val.time && val.lineIds) {
 | 
			
		||||
            this.tableData = []
 | 
			
		||||
            this.xData = []
 | 
			
		||||
            this.yData = []
 | 
			
		||||
            this.tableProps = []
 | 
			
		||||
            this.spanArr = []
 | 
			
		||||
            this.timeList = []
 | 
			
		||||
            this.getData()
 | 
			
		||||
          } else {
 | 
			
		||||
            this.$message({
 | 
			
		||||
              message: '请选择时间',
 | 
			
		||||
              message: '请选择产线和时间',
 | 
			
		||||
              type: 'warning'
 | 
			
		||||
            });
 | 
			
		||||
          }
 | 
			
		||||
 
 | 
			
		||||
@@ -1,8 +1,12 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="app-container">
 | 
			
		||||
    <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
 | 
			
		||||
    <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" />
 | 
			
		||||
    <line-chart ref="lineChart" />
 | 
			
		||||
    <div v-if="tableData.length">
 | 
			
		||||
      <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" />
 | 
			
		||||
      <SearchBar :formConfigs="[{ label: '产品产量对比图', type: 'title' }]" />
 | 
			
		||||
      <line-chart ref="lineChart" />
 | 
			
		||||
    </div>
 | 
			
		||||
    <div v-else class="no-data-bg"></div>
 | 
			
		||||
    <!-- <pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
@@ -72,7 +76,7 @@ export default {
 | 
			
		||||
				{
 | 
			
		||||
					type: 'datePicker',
 | 
			
		||||
					label: '时间',
 | 
			
		||||
					dateType: 'datetime',
 | 
			
		||||
					dateType: 'month',
 | 
			
		||||
					format: 'yyyy-MM-dd',
 | 
			
		||||
					valueFormat: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
					rangeSeparator: '-',
 | 
			
		||||
@@ -82,7 +86,7 @@ export default {
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '搜索',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				}
 | 
			
		||||
@@ -101,6 +105,8 @@ export default {
 | 
			
		||||
			this.optionArrUrl.forEach((item, index) => {
 | 
			
		||||
				item(params).then((response) => {
 | 
			
		||||
					this.formConfig[index].selectOptions = response.data.list
 | 
			
		||||
          // this.formConfig[0].defaultSelect = response.data.list[0].id
 | 
			
		||||
          this.$set(this.formConfig[0], 'defaultSelect', response.data.list[0].id)
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
    },
 | 
			
		||||
@@ -112,11 +118,13 @@ export default {
 | 
			
		||||
        let arr = [
 | 
			
		||||
          	{
 | 
			
		||||
              prop: 'lineName',
 | 
			
		||||
          		label: '产线'
 | 
			
		||||
          		label: '产线',
 | 
			
		||||
              fixed: 'left'
 | 
			
		||||
          	},
 | 
			
		||||
            {
 | 
			
		||||
              prop: 'sum',
 | 
			
		||||
              label: '合计'
 | 
			
		||||
              label: '合计',
 | 
			
		||||
              fixed: 'left'
 | 
			
		||||
            },
 | 
			
		||||
            {
 | 
			
		||||
              prop: res.data ? res.data.nameData[0].name : undefined,
 | 
			
		||||
@@ -220,7 +228,6 @@ export default {
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
      // console.log(val)
 | 
			
		||||
			switch (val.btnName) {
 | 
			
		||||
        case 'search':
 | 
			
		||||
          this.listQuery.lineIds = val.lineIds ? val.lineIds :undefined
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										422
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										422
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,422 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: AssetsUpload.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-10-12 16:40:14
 | 
			
		||||
    description: 上传资料/图片 组件
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="assets-upload">
 | 
			
		||||
		<section class="operations">
 | 
			
		||||
			<el-button type="text" class="expand-btn" @click="expand = !expand">
 | 
			
		||||
				<i class="el-icon-folder-opened" v-if="expand"></i>
 | 
			
		||||
				<i class="el-icon-folder" v-else></i>
 | 
			
		||||
				展开
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<!-- <div class="preview-btn">
 | 
			
		||||
				<i class="el-icon-view"></i>
 | 
			
		||||
				预览
 | 
			
		||||
			</div> -->
 | 
			
		||||
		</section>
 | 
			
		||||
		<section
 | 
			
		||||
			class="file-area"
 | 
			
		||||
			:style="{
 | 
			
		||||
				height: expand ? 'auto' : isPicMode ? '180px' : '152px',
 | 
			
		||||
				gap: isPicMode ? '0 24px' : '24px',
 | 
			
		||||
				gridAutoRows: isPicMode ? '180px' : '152px',
 | 
			
		||||
			}">
 | 
			
		||||
			<el-upload
 | 
			
		||||
				class="equipment-upload"
 | 
			
		||||
				:style="{ marginBottom: isPicMode ? '48px' : '24px' }"
 | 
			
		||||
				:disabled="disabled"
 | 
			
		||||
				drag
 | 
			
		||||
				:action="uploadUrl"
 | 
			
		||||
				:headers="headers"
 | 
			
		||||
				multiple
 | 
			
		||||
				:show-file-list="false"
 | 
			
		||||
				:before-upload="beforeUpload"
 | 
			
		||||
				:on-success="handleSuccess">
 | 
			
		||||
				<i class="el-icon-upload"></i>
 | 
			
		||||
				<div class="el-upload__text">
 | 
			
		||||
					<span>将文件拖到此处或</span>
 | 
			
		||||
					<em>点击上传</em>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="el-upload__tip" slot="tip">
 | 
			
		||||
					{{
 | 
			
		||||
						isPicMode ? '仅支持上传 .jpg .png 格式文件, 且' : ''
 | 
			
		||||
					}}文件大小不超过2MB
 | 
			
		||||
				</div>
 | 
			
		||||
			</el-upload>
 | 
			
		||||
			<!-- <div
 | 
			
		||||
				class="file-list__item"
 | 
			
		||||
				v-for="n in 9"
 | 
			
		||||
				:key="n"
 | 
			
		||||
				:style="{
 | 
			
		||||
					display: n > 4 && !expand ? 'none' : 'block',
 | 
			
		||||
				}"
 | 
			
		||||
				:data-name="n"
 | 
			
		||||
				:class="{ 'default-icon': !isPicMode }">
 | 
			
		||||
				<i class="el-icon-delete"></i>
 | 
			
		||||
			</div> -->
 | 
			
		||||
			<div
 | 
			
		||||
				class="file-list__item"
 | 
			
		||||
				v-for="(file, index) in files"
 | 
			
		||||
				:key="file.fileName"
 | 
			
		||||
				:style="{
 | 
			
		||||
					background: isPicMode
 | 
			
		||||
						? `url(${file.fileUrl}) no-repeat`
 | 
			
		||||
						: `url(${defaultBg}) no-repeat`,
 | 
			
		||||
					backgroundSize: isPicMode ? '100% 100%' : '64px',
 | 
			
		||||
					backgroundPosition: isPicMode ? '0% 0%' : 'center',
 | 
			
		||||
				}"
 | 
			
		||||
				:data-name="file.fileName">
 | 
			
		||||
				<el-button
 | 
			
		||||
					v-if="!disabled"
 | 
			
		||||
					type="text"
 | 
			
		||||
					class="el-icon-delete"
 | 
			
		||||
					style="padding: 0"
 | 
			
		||||
					@click="(e) => handleDelete(file)" />
 | 
			
		||||
			</div>
 | 
			
		||||
		</section>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
import defaultBg from '../../../../../assets/images/default-file-icon.png';
 | 
			
		||||
 | 
			
		||||
function checkSize(file, message) {
 | 
			
		||||
	const isLt2M = file.size / 1024 / 1024 < 2;
 | 
			
		||||
	if (!isLt2M) {
 | 
			
		||||
		message.error('上传文件大小不能超过 2MB!');
 | 
			
		||||
	}
 | 
			
		||||
	return isLt2M;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function checkPic(file, message) {
 | 
			
		||||
	const isJPG = file.type === 'image/jpeg';
 | 
			
		||||
	const isPNG = file.type === 'image/png';
 | 
			
		||||
	const isPic = isJPG || isPNG;
 | 
			
		||||
	if (!isPic) {
 | 
			
		||||
		message.error('上传图片只能是 JPG/PNG 格式!');
 | 
			
		||||
	}
 | 
			
		||||
	return isPic;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'AssetsUpload',
 | 
			
		||||
	components: {},
 | 
			
		||||
	model: {
 | 
			
		||||
		prop: 'dataSource',
 | 
			
		||||
		event: 'update',
 | 
			
		||||
	},
 | 
			
		||||
	props: {
 | 
			
		||||
		type: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: 'image',
 | 
			
		||||
		},
 | 
			
		||||
		dataSource: {
 | 
			
		||||
			type: Array,
 | 
			
		||||
			default: () => [],
 | 
			
		||||
		},
 | 
			
		||||
		equipmentId: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: '',
 | 
			
		||||
		},
 | 
			
		||||
		isPicMode: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
		disabled: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	emits: ['update-filelist'],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			defaultBg,
 | 
			
		||||
			expand: false,
 | 
			
		||||
			headers: { Authorization: 'Bearer ' + getAccessToken() }, // 设置上传的请求头部
 | 
			
		||||
			fileList: [],
 | 
			
		||||
			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload',
 | 
			
		||||
			files: [
 | 
			
		||||
				// 服务器返回的结构
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'sf.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://hbimg.b0.upaiyun.com/cc7475787bd08ed926b68eaf53fa1f2c5473259115e3c-gJdObd_fw658',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'sddf.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl: 'https://img0.sc115.com/wm/xqx/pic1/1501xofo4ssolji.jpg',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'jjj.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://www.mms591.com/www.mms591.com-photo/2013081823/1-130QR34544.jpg',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'asdfasdf.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://hbimg.b0.upaiyun.com/8f6bced5f2e38d3a021b2c48d5a98dfb6317e3e12c6a0-QmhJ5v_fw658',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'asdkj.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://www.mms591.com/www.mms591.com-photo/2013013021/1-130130212034.jpg',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'lkasjdf.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://www.mms591.com/www.mms591.com-photo/2013072122/1-130H1223057.jpg',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'asdf.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://img.1ppt.com/uploads/allimg/1212/1-1212101ZH5A2.jpg',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	fileName: 'afdffff.docs',
 | 
			
		||||
				// 	fileType: 'asset',
 | 
			
		||||
				// 	fileUrl:
 | 
			
		||||
				// 		'https://www.mms591.com/www.mms591.com-photo/2013051721/1-13051H11945.jpg',
 | 
			
		||||
				// },
 | 
			
		||||
			],
 | 
			
		||||
			updateTimer: null,
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		dataSource: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				this.files = JSON.parse(JSON.stringify(val));
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true,
 | 
			
		||||
			deep: true,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		// handle success, per file!
 | 
			
		||||
		handleSuccess(response, file, fileList) {
 | 
			
		||||
			this.$notify({
 | 
			
		||||
				title: '成功',
 | 
			
		||||
				message: '上传成功! 点击确认保存上传结果',
 | 
			
		||||
				type: 'success',
 | 
			
		||||
			});
 | 
			
		||||
			if (
 | 
			
		||||
				response == null ||
 | 
			
		||||
				!('data' in response) ||
 | 
			
		||||
				response.data == null ||
 | 
			
		||||
				response.data.trim() == ''
 | 
			
		||||
			) {
 | 
			
		||||
				this.$message.error('上传出错了!');
 | 
			
		||||
				return;
 | 
			
		||||
			}
 | 
			
		||||
			this.files.push({
 | 
			
		||||
				fileName: file.name,
 | 
			
		||||
				fileUrl: response.data,
 | 
			
		||||
				fileType: this.isPicMode ? 1 : 2,
 | 
			
		||||
			});
 | 
			
		||||
			// debugger;
 | 
			
		||||
 | 
			
		||||
			// 延时更新
 | 
			
		||||
			if (this.updateTimer) {
 | 
			
		||||
				clearTimeout(this.updateTimer);
 | 
			
		||||
			}
 | 
			
		||||
			this.updateTimer = setTimeout(() => {
 | 
			
		||||
				// console.log('[AssetsUpload] 更新上传列表');
 | 
			
		||||
				this.emitFilelist();
 | 
			
		||||
				clearTimeout(this.updateTimer);
 | 
			
		||||
				this.updateTimer = null;
 | 
			
		||||
			}, 500);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		emitFilelist() {
 | 
			
		||||
			this.$emit('update', this.files);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleRemove(file, fileList) {
 | 
			
		||||
			debugger;
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleDelete(file) {
 | 
			
		||||
			// fileName fileType 都可能一样,但 fileUrl 一定不一样
 | 
			
		||||
			this.files = this.files.filter((item) => item.fileUrl != file.fileUrl);
 | 
			
		||||
			this.$notify({
 | 
			
		||||
				title: '成功',
 | 
			
		||||
				message: '删除成功! 需点击确认保存删除结果',
 | 
			
		||||
				type: 'success',
 | 
			
		||||
			});
 | 
			
		||||
			this.emitFilelist();
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		beforeUpload(file) {
 | 
			
		||||
			if (this.isPicMode) {
 | 
			
		||||
				return checkPic(file, this.$message) && checkSize(file, this.$message);
 | 
			
		||||
			}
 | 
			
		||||
			return checkSize(file, this.$message);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleUpload() {
 | 
			
		||||
			switch (this.type) {
 | 
			
		||||
				case 'image':
 | 
			
		||||
					break;
 | 
			
		||||
				case 'asset':
 | 
			
		||||
					break;
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		updateFileList(appendFilelist) {
 | 
			
		||||
			// Array
 | 
			
		||||
			this.$emit('update-filelist', this.appendFilelist);
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.assets-upload {
 | 
			
		||||
	position: relative;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.operations {
 | 
			
		||||
	position: absolute;
 | 
			
		||||
	top: -36px;
 | 
			
		||||
	right: 0;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	align-items: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.expand-btn,
 | 
			
		||||
.preview-btn {
 | 
			
		||||
	font-size: 14px;
 | 
			
		||||
	line-height: 1.2;
 | 
			
		||||
	display: inline-block;
 | 
			
		||||
	padding-left: 20px;
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
	z-index: 1000;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.expand-btn {
 | 
			
		||||
	margin-right: 12px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.preview-btn {
 | 
			
		||||
	color: #ccc;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.expand-btn,
 | 
			
		||||
.preview-btn:hover,
 | 
			
		||||
.preview-btn.active {
 | 
			
		||||
	// color: #0042d0;
 | 
			
		||||
	color: #0b58ff;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
:deep(.equipment-upload) {
 | 
			
		||||
	.el-upload-dragger {
 | 
			
		||||
		width: 188px;
 | 
			
		||||
		height: 128px;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.el-icon-upload {
 | 
			
		||||
		margin: 12px 0;
 | 
			
		||||
		font-size: 48px;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.el-upload__text {
 | 
			
		||||
		font-size: 12px;
 | 
			
		||||
		line-height: 2px;
 | 
			
		||||
		display: flex;
 | 
			
		||||
		flex-direction: column;
 | 
			
		||||
 | 
			
		||||
		em {
 | 
			
		||||
			margin-top: 12px;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.el-upload__tip {
 | 
			
		||||
		font-size: 12px;
 | 
			
		||||
		line-height: 1.5;
 | 
			
		||||
		color: #d1d1d1;
 | 
			
		||||
		margin: 0 0 12px;
 | 
			
		||||
		transform: translateY(-12px);
 | 
			
		||||
		user-select: none;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-upload {
 | 
			
		||||
	margin-bottom: 24px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.file-list {
 | 
			
		||||
	padding: 12px;
 | 
			
		||||
	border: 1px solid #ccc;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// custom
 | 
			
		||||
.file-area {
 | 
			
		||||
	display: grid;
 | 
			
		||||
	grid-template-columns: repeat(auto-fill, 188px);
 | 
			
		||||
	grid-auto-rows: 152px;
 | 
			
		||||
	gap: 48px 24px;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.file-list__item {
 | 
			
		||||
	height: 128px;
 | 
			
		||||
	background-color: #fff;
 | 
			
		||||
	border: 1px dashed #d9d9d9;
 | 
			
		||||
	border-radius: 6px;
 | 
			
		||||
	-webkit-box-sizing: border-box;
 | 
			
		||||
	box-sizing: border-box;
 | 
			
		||||
	text-align: center;
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
	position: relative;
 | 
			
		||||
	// overflow: hidden;
 | 
			
		||||
 | 
			
		||||
	&:hover {
 | 
			
		||||
		.el-icon-delete {
 | 
			
		||||
			display: block;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.el-icon-delete {
 | 
			
		||||
		color: #ccc;
 | 
			
		||||
		position: absolute;
 | 
			
		||||
		top: 8px;
 | 
			
		||||
		right: 8px;
 | 
			
		||||
		display: none;
 | 
			
		||||
 | 
			
		||||
		&:hover {
 | 
			
		||||
			color: rgb(210, 41, 41);
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.file-list__item:hover {
 | 
			
		||||
	border-color: #0b58ff;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.file-list__item::after {
 | 
			
		||||
	content: attr(data-name);
 | 
			
		||||
	position: absolute;
 | 
			
		||||
	left: 0;
 | 
			
		||||
	bottom: -26px;
 | 
			
		||||
	font-size: 14px;
 | 
			
		||||
	line-height: 2;
 | 
			
		||||
	color: #616161;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.default-icon {
 | 
			
		||||
	background: url(../../../../../assets/images/default-file-icon.png) no-repeat;
 | 
			
		||||
	background-position: center;
 | 
			
		||||
	background-size: 64px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										313
									
								
								src/views/core/base/equipment/components/DialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										313
									
								
								src/views/core/base/equipment/components/DialogForm.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,313 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: dialogForm.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-08-15 10:32:36
 | 
			
		||||
    description: 弹窗的表单组件
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<el-form
 | 
			
		||||
		ref="form"
 | 
			
		||||
		:model="form"
 | 
			
		||||
		:label-width="`${labelWidth}px`"
 | 
			
		||||
		:size="size"
 | 
			
		||||
		:label-position="labelPosition"
 | 
			
		||||
		v-loading="formLoading">
 | 
			
		||||
		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex">
 | 
			
		||||
			<el-col v-for="col in row" :key="col.label" :span="24 / row.length">
 | 
			
		||||
				<el-form-item :label="col.label" :prop="col.prop" :rules="col.rules">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-if="col.input"
 | 
			
		||||
						v-model="form[col.prop]"
 | 
			
		||||
						@change="$emit('update', form)"
 | 
			
		||||
						:placeholder="`请输入${col.label}`"
 | 
			
		||||
						v-bind="col.bind" />
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-if="col.textarea"
 | 
			
		||||
						type="textarea"
 | 
			
		||||
						v-model="form[col.prop]"
 | 
			
		||||
						@change="$emit('update', form)"
 | 
			
		||||
						:placeholder="`请输入${col.label}`"
 | 
			
		||||
						v-bind="col.bind" />
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-if="col.select"
 | 
			
		||||
						v-model="form[col.prop]"
 | 
			
		||||
						:placeholder="`请选择${col.label}`"
 | 
			
		||||
						@change="$emit('update', form)"
 | 
			
		||||
						v-bind="col.bind">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="opt in optionListOf[col.prop]"
 | 
			
		||||
							:key="opt.value"
 | 
			
		||||
							:label="opt.label"
 | 
			
		||||
							:value="opt.value" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
					<el-date-picker
 | 
			
		||||
						v-if="col.datetime"
 | 
			
		||||
						v-model="form[col.prop]"
 | 
			
		||||
						type="datetime"
 | 
			
		||||
						:placeholder="`请选择${col.label}`"
 | 
			
		||||
						value-format="timestamp"
 | 
			
		||||
						v-bind="col.bind"></el-date-picker>
 | 
			
		||||
					<el-upload
 | 
			
		||||
						class="upload-in-dialog"
 | 
			
		||||
						v-if="col.upload"
 | 
			
		||||
						:file-list="uploadedFileList"
 | 
			
		||||
						:action="col.url"
 | 
			
		||||
						:on-success="handleUploadSuccess"
 | 
			
		||||
						v-bind="col.bind">
 | 
			
		||||
						<el-button
 | 
			
		||||
							size="small"
 | 
			
		||||
							type="primary"
 | 
			
		||||
							:disabled="col.bind?.disabled || false">
 | 
			
		||||
							点击上传
 | 
			
		||||
						</el-button>
 | 
			
		||||
						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
 | 
			
		||||
							{{ col.uploadTips || '只能上传jpg/png文件,大小不超过2MB' }}
 | 
			
		||||
						</div>
 | 
			
		||||
					</el-upload>
 | 
			
		||||
					<el-switch
 | 
			
		||||
						v-if="col.switch"
 | 
			
		||||
						v-model="form[col.prop]"
 | 
			
		||||
						active-color="#0b58ff"
 | 
			
		||||
						inactive-color="#e1e1e1"
 | 
			
		||||
						v-bind="col.bind"></el-switch>
 | 
			
		||||
					<component
 | 
			
		||||
						v-if="col.subcomponent"
 | 
			
		||||
						:key="col.key"
 | 
			
		||||
						:is="col.subcomponent"
 | 
			
		||||
						v-bind="col.bind"
 | 
			
		||||
						:inlineStyle="col.style"></component>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
	</el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
/**
 | 
			
		||||
 * 找到最长的label
 | 
			
		||||
 * @param {*} options
 | 
			
		||||
 */
 | 
			
		||||
function findMaxLabelWidth(rows) {
 | 
			
		||||
	let max = 0;
 | 
			
		||||
	rows.forEach((row) => {
 | 
			
		||||
		row.forEach((opt) => {
 | 
			
		||||
			// debugger;
 | 
			
		||||
			if (!opt.label) return 0;
 | 
			
		||||
			if (opt.label.length > max) {
 | 
			
		||||
				max = opt.label.length;
 | 
			
		||||
			}
 | 
			
		||||
		});
 | 
			
		||||
	});
 | 
			
		||||
	return max;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'DialogForm',
 | 
			
		||||
	model: {
 | 
			
		||||
		prop: 'dataForm',
 | 
			
		||||
		event: 'update',
 | 
			
		||||
	},
 | 
			
		||||
	emits: ['update'],
 | 
			
		||||
	components: {},
 | 
			
		||||
	props: {
 | 
			
		||||
		rows: {
 | 
			
		||||
			type: Array,
 | 
			
		||||
			default: () => [],
 | 
			
		||||
		},
 | 
			
		||||
		dataForm: {
 | 
			
		||||
			type: Object,
 | 
			
		||||
			default: () => ({}),
 | 
			
		||||
		},
 | 
			
		||||
		disabled: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
		labelPosition: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: 'right',
 | 
			
		||||
		},
 | 
			
		||||
		size: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: '',
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			formLoading: true,
 | 
			
		||||
			optionListOf: {},
 | 
			
		||||
			uploadedFileList: [],
 | 
			
		||||
			dataLoaded: false,
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	computed: {
 | 
			
		||||
		labelWidth() {
 | 
			
		||||
			let max = findMaxLabelWidth(this.rows);
 | 
			
		||||
			// 每个汉字占20px
 | 
			
		||||
			return max * 20;
 | 
			
		||||
			// return max * 20 + 'px';
 | 
			
		||||
		},
 | 
			
		||||
		form: {
 | 
			
		||||
			get() {
 | 
			
		||||
				// if (this.dataLoaded) return this.dataForm;
 | 
			
		||||
				// else return {}
 | 
			
		||||
				return this.dataForm;
 | 
			
		||||
			},
 | 
			
		||||
			set(val) {
 | 
			
		||||
				console.log('set form', val);
 | 
			
		||||
			},
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		rows: {
 | 
			
		||||
			handler() {
 | 
			
		||||
				console.log('watch triggered!');
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.handleOptions('watch');
 | 
			
		||||
				});
 | 
			
		||||
			},
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: false,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		// 处理 options
 | 
			
		||||
		this.handleOptions();
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		/** 模拟透传 ref  */
 | 
			
		||||
		validate(cb) {
 | 
			
		||||
			return this.$refs.form.validate(cb);
 | 
			
		||||
		},
 | 
			
		||||
		resetFields(args) {
 | 
			
		||||
			return this.$refs.form.resetFields(args);
 | 
			
		||||
		},
 | 
			
		||||
		// getCode
 | 
			
		||||
		async getCode(url) {
 | 
			
		||||
			const response = await this.$axios(url);
 | 
			
		||||
			return response.data;
 | 
			
		||||
		},
 | 
			
		||||
		async handleOptions(trigger = 'monuted') {
 | 
			
		||||
			console.log('[dialogForm:handleOptions]');
 | 
			
		||||
			const promiseList = [];
 | 
			
		||||
			this.rows.forEach((cols) => {
 | 
			
		||||
				cols.forEach((opt) => {
 | 
			
		||||
					if (opt.value && !this.form[opt.prop]) {
 | 
			
		||||
						// 默认值
 | 
			
		||||
						this.form[opt.prop] = opt.value;
 | 
			
		||||
					}
 | 
			
		||||
 | 
			
		||||
					if (opt.options) {
 | 
			
		||||
						this.$set(this.optionListOf, opt.prop, opt.options);
 | 
			
		||||
					} else if (opt.url) {
 | 
			
		||||
						// 如果有 depends,则暂时先不获取,注册一个watcher
 | 
			
		||||
						if (opt.depends) {
 | 
			
		||||
							console.log('[handleOptions] setting watch');
 | 
			
		||||
							this.$watch(
 | 
			
		||||
								() => this.form[opt.depends],
 | 
			
		||||
								(id) => {
 | 
			
		||||
									console.log('<', opt.depends, '>', 'changed', id);
 | 
			
		||||
									if (id == null) return;
 | 
			
		||||
									// 清空原有选项
 | 
			
		||||
									this.form[opt.prop] = null;
 | 
			
		||||
									// 获取新的选项
 | 
			
		||||
									this.$axios({
 | 
			
		||||
										url: `${opt.url}?id=${id}`,
 | 
			
		||||
									}).then((res) => {
 | 
			
		||||
										this.$set(
 | 
			
		||||
											this.optionListOf,
 | 
			
		||||
											opt.prop,
 | 
			
		||||
											res.data.map((item) => ({
 | 
			
		||||
												label: item[opt.labelKey ?? 'name'],
 | 
			
		||||
												value: item[opt.valueKey ?? 'id'],
 | 
			
		||||
											}))
 | 
			
		||||
										);
 | 
			
		||||
									});
 | 
			
		||||
								},
 | 
			
		||||
								{
 | 
			
		||||
									immediate: true,
 | 
			
		||||
								}
 | 
			
		||||
							);
 | 
			
		||||
							return;
 | 
			
		||||
						}
 | 
			
		||||
						// 如果是下拉框,或者新增模式下的输入框,才去请求
 | 
			
		||||
						if (opt.select || (opt.input && !this.form?.id)) {
 | 
			
		||||
							promiseList.push(async () => {
 | 
			
		||||
								const response = await this.$axios(opt.url, {
 | 
			
		||||
									method: opt.method ?? 'get',
 | 
			
		||||
								});
 | 
			
		||||
								console.log('[dialogForm:handleOptions:response]', response);
 | 
			
		||||
								if (opt.select) {
 | 
			
		||||
									// 处理下拉框选项
 | 
			
		||||
									const list =
 | 
			
		||||
										'list' in response.data
 | 
			
		||||
											? response.data.list
 | 
			
		||||
											: response.data;
 | 
			
		||||
									this.$set(
 | 
			
		||||
										this.optionListOf,
 | 
			
		||||
										opt.prop,
 | 
			
		||||
										list.map((item) => ({
 | 
			
		||||
											label: item[opt.labelKey ?? 'name'],
 | 
			
		||||
											value: item[opt.valueKey ?? 'id'],
 | 
			
		||||
										}))
 | 
			
		||||
									);
 | 
			
		||||
								} else if (opt.input) {
 | 
			
		||||
									console.log('setting code: ', response.data);
 | 
			
		||||
									// 处理输入框数据
 | 
			
		||||
									this.form[opt.prop] = response.data;
 | 
			
		||||
								}
 | 
			
		||||
							});
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
 | 
			
		||||
			console.log('[dialogForm:handleOptions] done!');
 | 
			
		||||
 | 
			
		||||
			// 如果是 watch 触发的,不需要执行进一步的请求
 | 
			
		||||
			if (trigger == 'watch') {
 | 
			
		||||
				this.formLoading = false;
 | 
			
		||||
				return;
 | 
			
		||||
			}
 | 
			
		||||
			try {
 | 
			
		||||
				await Promise.all(promiseList.map((fn) => fn()));
 | 
			
		||||
				this.formLoading = false;
 | 
			
		||||
				this.dataLoaded = true;
 | 
			
		||||
				// console.log("[dialogForm:handleOptions:optionListOf]", this.optionListOf)
 | 
			
		||||
			} catch (error) {
 | 
			
		||||
				console.log('[dialogForm:handleOptions:error]', error);
 | 
			
		||||
				this.formLoading = false;
 | 
			
		||||
			}
 | 
			
		||||
			if (!promiseList.length) this.formLoading = false;
 | 
			
		||||
		},
 | 
			
		||||
		// 上传成功的特殊处理
 | 
			
		||||
		beforeUpload() {},
 | 
			
		||||
		// 上传前的验证规则可通过 bind 属性传入
 | 
			
		||||
		handleUploadSuccess(response, file, fileList) {
 | 
			
		||||
			console.log(
 | 
			
		||||
				'[dialogForm:handleUploadSuccess]',
 | 
			
		||||
				response,
 | 
			
		||||
				file,
 | 
			
		||||
				fileList,
 | 
			
		||||
				this.form
 | 
			
		||||
			);
 | 
			
		||||
			// 保存原始文件名
 | 
			
		||||
			if ('fileNames' in this.form) this.form.fileNames.push(file.name);
 | 
			
		||||
			// 保存完整地址
 | 
			
		||||
			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data);
 | 
			
		||||
			this.$modal.msgSuccess('上传成功');
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		getFileName(fileUrl) {
 | 
			
		||||
			return fileUrl.split('/').pop();
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.el-date-editor,
 | 
			
		||||
.el-select {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -1,32 +0,0 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: EquipmentAssets.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-08-22 11:11:18
 | 
			
		||||
    description: 设备资产
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
    <div class="equipment-assets"></div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
    name: "EquipmentAssets",
 | 
			
		||||
    components: {},
 | 
			
		||||
    props: {},
 | 
			
		||||
    data() {
 | 
			
		||||
        return {}
 | 
			
		||||
    },
 | 
			
		||||
    computed: {},
 | 
			
		||||
    methods: {},
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.equipment-assets {
 | 
			
		||||
    background: #f1f1f1;
 | 
			
		||||
    padding: 12px;
 | 
			
		||||
    min-height: 128px;
 | 
			
		||||
    margin-top: 8px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -29,23 +29,28 @@
 | 
			
		||||
				<section v-for="(section, index) in sections" :key="section.key">
 | 
			
		||||
					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle>
 | 
			
		||||
 | 
			
		||||
					<div class="form-part" v-if="section.key == 'base'">
 | 
			
		||||
					<div
 | 
			
		||||
						class="form-part"
 | 
			
		||||
						v-if="section.key == 'base'"
 | 
			
		||||
						style="margin-bottom: 32px">
 | 
			
		||||
						<el-skeleton v-if="!showForm" animated />
 | 
			
		||||
						<DialogForm
 | 
			
		||||
						<EquipmentInfoForm
 | 
			
		||||
							key="drawer-dialog-form"
 | 
			
		||||
							v-if="showForm"
 | 
			
		||||
							ref="form"
 | 
			
		||||
							:dataForm="form"
 | 
			
		||||
							:rows="formRows" />
 | 
			
		||||
							:disabled="mode.includes('detail')"
 | 
			
		||||
							:sync-filelist="syncFileListFlag"
 | 
			
		||||
							v-model="form" />
 | 
			
		||||
					</div>
 | 
			
		||||
 | 
			
		||||
					<div v-if="section.key == 'attrs'" style="margin-top: 12px">
 | 
			
		||||
						<base-table
 | 
			
		||||
							v-loading="attrListLoading"
 | 
			
		||||
							:table-props="section.props"
 | 
			
		||||
							:page="section.pageNo || 1"
 | 
			
		||||
							:limit="section.pageSize || 10"
 | 
			
		||||
							:page="attrQuery?.params.pageNo || 1"
 | 
			
		||||
							:limit="attrQuery?.params.pageSize || 10"
 | 
			
		||||
							:table-data="list"
 | 
			
		||||
							:add-button-show="mode.includes('detail') ? null : '添加属性'"
 | 
			
		||||
							@emitButtonClick="handleAddAttr"
 | 
			
		||||
							@emitFun="handleEmitFun">
 | 
			
		||||
							<method-btn
 | 
			
		||||
								v-if="section.tableBtn"
 | 
			
		||||
@@ -54,27 +59,31 @@
 | 
			
		||||
								:method-list="tableBtn"
 | 
			
		||||
								@clickBtn="handleTableBtnClick" />
 | 
			
		||||
						</base-table>
 | 
			
		||||
 | 
			
		||||
						<!-- 分页组件 -->
 | 
			
		||||
						<pagination
 | 
			
		||||
							v-show="total > 0"
 | 
			
		||||
							:total="total"
 | 
			
		||||
							:page.sync="attrQuery.params.pageNo"
 | 
			
		||||
							:limit.sync="attrQuery.params.pageSize"
 | 
			
		||||
							@pagination="getAttrList" />
 | 
			
		||||
					</div>
 | 
			
		||||
				</section>
 | 
			
		||||
			</div>
 | 
			
		||||
 | 
			
		||||
			<div class="drawer-body__footer">
 | 
			
		||||
				<el-button style="margin-right: 10px" @click="handleCancel">
 | 
			
		||||
					返回
 | 
			
		||||
				</el-button>
 | 
			
		||||
				<el-button style="" @click="handleCancel">取消</el-button>
 | 
			
		||||
				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
 | 
			
		||||
					编辑
 | 
			
		||||
				</el-button>
 | 
			
		||||
				<span v-else>
 | 
			
		||||
					<el-button type="primary" @click="handleSave">保存</el-button>
 | 
			
		||||
					<!-- sections的第二项必须是 属性列表  -->
 | 
			
		||||
					<el-button
 | 
			
		||||
				<el-button v-else type="primary" @click="handleConfirm">确定</el-button>
 | 
			
		||||
				<!-- sections的第二项必须是 属性列表  -->
 | 
			
		||||
				<!-- <el-button
 | 
			
		||||
						v-if="sections[1].allowAdd"
 | 
			
		||||
						type="primary"
 | 
			
		||||
						@click="handleAddAttr">
 | 
			
		||||
						添加属性
 | 
			
		||||
					</el-button>
 | 
			
		||||
				</span>
 | 
			
		||||
					</el-button> -->
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
@@ -99,11 +108,13 @@
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import DialogForm from '@/components/DialogForm';
 | 
			
		||||
import DialogForm from './DialogForm';
 | 
			
		||||
import EquipmentInfoForm from './EquipmentInfoForm.vue';
 | 
			
		||||
 | 
			
		||||
const SmallTitle = {
 | 
			
		||||
	name: 'SmallTitle',
 | 
			
		||||
	props: ['size'],
 | 
			
		||||
	components: {},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {};
 | 
			
		||||
	},
 | 
			
		||||
@@ -127,12 +138,13 @@ const SmallTitle = {
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	components: { SmallTitle, DialogForm },
 | 
			
		||||
	components: { SmallTitle, DialogForm, EquipmentInfoForm },
 | 
			
		||||
	props: ['sections', 'mode', 'dataId'], // dataId 作为一个通用的存放id的字段
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			visible: false,
 | 
			
		||||
			showForm: false,
 | 
			
		||||
			btnLoading: false,
 | 
			
		||||
			total: 0,
 | 
			
		||||
			form: {},
 | 
			
		||||
			list: [],
 | 
			
		||||
@@ -161,10 +173,16 @@ export default {
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			],
 | 
			
		||||
			attrQuery: null, // 属性列表的请求
 | 
			
		||||
			attrQuery: {
 | 
			
		||||
				params: {
 | 
			
		||||
					pageNo: 1,
 | 
			
		||||
					pageSize: 10,
 | 
			
		||||
				},
 | 
			
		||||
			}, // 属性列表的请求
 | 
			
		||||
			infoQuery: null, // 基本信息的请求
 | 
			
		||||
			attrFormSubmitting: false,
 | 
			
		||||
			attrListLoading: false,
 | 
			
		||||
			syncFileListFlag: null,
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	computed: {
 | 
			
		||||
@@ -175,15 +193,19 @@ export default {
 | 
			
		||||
						// 重置图片的位置
 | 
			
		||||
						return {
 | 
			
		||||
							...col,
 | 
			
		||||
							bind: {
 | 
			
		||||
								...col.bind,
 | 
			
		||||
							},
 | 
			
		||||
							style: {
 | 
			
		||||
								left: 0,
 | 
			
		||||
								right: 'unset'
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
								right: 'unset',
 | 
			
		||||
							},
 | 
			
		||||
						};
 | 
			
		||||
					}
 | 
			
		||||
					return {
 | 
			
		||||
						...col,
 | 
			
		||||
						bind: {
 | 
			
		||||
							...col.bind,
 | 
			
		||||
							// 详情 模式下,禁用各种输入
 | 
			
		||||
							disabled: this.mode == 'detail',
 | 
			
		||||
						},
 | 
			
		||||
@@ -208,9 +230,52 @@ export default {
 | 
			
		||||
				this.$axios(query).then(({ data }) => {
 | 
			
		||||
					if (section.key == 'base') {
 | 
			
		||||
						this.form = data;
 | 
			
		||||
						// this.form = {
 | 
			
		||||
						// 	code: 'gj',
 | 
			
		||||
						// 	name: '下片机',
 | 
			
		||||
						// 	enName: 'unload',
 | 
			
		||||
						// 	abbr: '',
 | 
			
		||||
						// 	equipmentTypeId: 21084,
 | 
			
		||||
						// 	remark: '备注',
 | 
			
		||||
						// 	id: '1712367395052384257',
 | 
			
		||||
						// 	createTime: 1697095176000,
 | 
			
		||||
						// 	enterTime: 0,
 | 
			
		||||
						// 	productionTime: 0,
 | 
			
		||||
						// 	files: [
 | 
			
		||||
						// 		{
 | 
			
		||||
						// 			fileName: '测试.xlsx',
 | 
			
		||||
						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0108%2F0f0c6f30j00r5cle9000sc000hs00gtc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
 | 
			
		||||
						// 			fileType: 1
 | 
			
		||||
						// 		},
 | 
			
		||||
						// 		{
 | 
			
		||||
						// 			fileName: '测试2.xlsx',
 | 
			
		||||
						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0415%2F2cd23619j00racb96000kc000hs00hsc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
 | 
			
		||||
						// 			fileType: 1
 | 
			
		||||
						// 		},
 | 
			
		||||
						// 		{
 | 
			
		||||
						// 			fileName: '测试3.xlsx',
 | 
			
		||||
						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F1fea91a0-d088-409e-b145-e0e61254b28b%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=2e0fe7d1de7f54adff3007efe133d67c',
 | 
			
		||||
						// 			fileType: 1
 | 
			
		||||
						// 		},
 | 
			
		||||
						// 		{
 | 
			
		||||
						// 			fileName: '测试4.xlsx',
 | 
			
		||||
						// 			fileUrl: 'https://pics5.baidu.com/feed/b7003af33a87e950cdfb4b4546eed044faf2b40d.jpeg?token=1d7484cfe4b014dd201f8c8725cab945',
 | 
			
		||||
						// 			fileType: 2
 | 
			
		||||
						// 		},
 | 
			
		||||
						// 		{
 | 
			
		||||
						// 			fileName: '测试5.xlsx',
 | 
			
		||||
						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Fe3500876-9c46-4b70-8d37-4799520cdd13%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=4abc1df930e62730e5361a7d3765e0f2',
 | 
			
		||||
						// 			fileType: 2
 | 
			
		||||
						// 		},
 | 
			
		||||
						// 	],
 | 
			
		||||
						// 	tvalue: 0,
 | 
			
		||||
						// 	processingTime: 0,
 | 
			
		||||
						// 	manufacturer: '',
 | 
			
		||||
						// 	spec: '',
 | 
			
		||||
						// 	description: '描述',
 | 
			
		||||
						// };
 | 
			
		||||
						this.showForm = true;
 | 
			
		||||
						this.infoQuery = query;
 | 
			
		||||
						console.log('setting form: ', this.form, data);
 | 
			
		||||
					} else if (section.key == 'attrs') {
 | 
			
		||||
						this.attrQuery = query;
 | 
			
		||||
						this.list = data.list;
 | 
			
		||||
@@ -231,6 +296,24 @@ export default {
 | 
			
		||||
					break;
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		async handleConfirm() {
 | 
			
		||||
			this.btnLoading = true;
 | 
			
		||||
			this.syncFileListFlag = Math.random();
 | 
			
		||||
 | 
			
		||||
			this.$nextTick(async () => {
 | 
			
		||||
				const { code, data } = await this.$axios({
 | 
			
		||||
					url: this.sections[0].urlUpdate,
 | 
			
		||||
					method: 'put',
 | 
			
		||||
					data: this.form,
 | 
			
		||||
				});
 | 
			
		||||
				if (code == 0) {
 | 
			
		||||
					this.$modal.msgSuccess('更新成功');
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				this.btnLoading = false;
 | 
			
		||||
				this.handleCancel();
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleEmitFun(val) {
 | 
			
		||||
			console.log('handleEmitFun', val);
 | 
			
		||||
@@ -273,7 +356,7 @@ export default {
 | 
			
		||||
 | 
			
		||||
		// 开启编辑
 | 
			
		||||
		toggleEdit() {
 | 
			
		||||
			this.mode = 'edit';
 | 
			
		||||
			this.$emit('update-mode', 'edit');
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		// 新增属性
 | 
			
		||||
@@ -331,33 +414,44 @@ export default {
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		// 提交属性表
 | 
			
		||||
		async submitAttrForm() {
 | 
			
		||||
			this.$refs['attrForm'].validate((valid) => {
 | 
			
		||||
		submitAttrForm() {
 | 
			
		||||
			this.$refs['attrForm'].validate(async (valid) => {
 | 
			
		||||
				if (!valid) {
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
			console.log('this.attrform', this.attrForm);
 | 
			
		||||
			const isEdit = this.attrForm.id != null;
 | 
			
		||||
			this.attrFormSubmitting = true;
 | 
			
		||||
			const res = await this.$axios({
 | 
			
		||||
				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
 | 
			
		||||
				method: isEdit ? 'put' : 'post',
 | 
			
		||||
				data: this.attrForm,
 | 
			
		||||
			});
 | 
			
		||||
 | 
			
		||||
			if (res.code == 0) {
 | 
			
		||||
				this.closeAttrForm();
 | 
			
		||||
				this.$message({
 | 
			
		||||
					message: `${isEdit ? '更新' : '创建'}成功`,
 | 
			
		||||
					type: 'success',
 | 
			
		||||
					duration: 1500,
 | 
			
		||||
					onClose: () => {
 | 
			
		||||
						this.getAttrList();
 | 
			
		||||
					},
 | 
			
		||||
				});
 | 
			
		||||
			}
 | 
			
		||||
			this.attrFormSubmitting = false;
 | 
			
		||||
				try {
 | 
			
		||||
					const isEdit = this.attrForm.id != null;
 | 
			
		||||
					this.attrFormSubmitting = true;
 | 
			
		||||
					const res = await this.$axios({
 | 
			
		||||
						url: isEdit
 | 
			
		||||
							? this.sections[1].urlUpdate
 | 
			
		||||
							: this.sections[1].urlCreate,
 | 
			
		||||
						method: isEdit ? 'put' : 'post',
 | 
			
		||||
						data: this.attrForm,
 | 
			
		||||
					});
 | 
			
		||||
 | 
			
		||||
					if (res.code == 0) {
 | 
			
		||||
						this.closeAttrForm();
 | 
			
		||||
						this.$message({
 | 
			
		||||
							message: `${isEdit ? '更新' : '创建'}成功`,
 | 
			
		||||
							type: 'success',
 | 
			
		||||
							duration: 1500,
 | 
			
		||||
							onClose: () => {
 | 
			
		||||
								this.getAttrList();
 | 
			
		||||
							},
 | 
			
		||||
						});
 | 
			
		||||
					}
 | 
			
		||||
					this.attrFormSubmitting = false;
 | 
			
		||||
				} catch (err) {
 | 
			
		||||
					this.$message({
 | 
			
		||||
						message: err,
 | 
			
		||||
						type: 'error',
 | 
			
		||||
						duration: 1500,
 | 
			
		||||
					});
 | 
			
		||||
					this.attrFormSubmitting = false;
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		closeAttrForm() {
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										337
									
								
								src/views/core/base/equipment/components/EquipmentInfoForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										337
									
								
								src/views/core/base/equipment/components/EquipmentInfoForm.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,337 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: dialogForm.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-08-15 10:32:36
 | 
			
		||||
    description: 弹窗的表单组件
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<el-form
 | 
			
		||||
		class="equipment-info-form"
 | 
			
		||||
		ref="form"
 | 
			
		||||
		:model="form"
 | 
			
		||||
		label-width="200px"
 | 
			
		||||
		label-position="top"
 | 
			
		||||
		v-loading="formLoading">
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item
 | 
			
		||||
					label="设备名称"
 | 
			
		||||
					prop="name"
 | 
			
		||||
					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.name"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入设备名称"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="设备编码" prop="code" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.code"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入设备编码"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="英文名称" prop="enName" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.enName"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入英文名称"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="缩写" prop="abbr" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.abbr"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入名称缩写"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="设备类型" prop="equipmentTypeId" :rules="[]">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="form.equipmentTypeId"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						filterable
 | 
			
		||||
						placeholder="请选择设备类型">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="eqType in eqTypeList"
 | 
			
		||||
							:key="eqType.id"
 | 
			
		||||
							:label="eqType.name"
 | 
			
		||||
							:value="eqType.id"></el-option>
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="备注" prop="remark" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.remark"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入备注"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="生产日期" prop="productionTime" :rules="[]">
 | 
			
		||||
					<el-date-picker
 | 
			
		||||
						v-model="form.enterTime"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						type="datetime"
 | 
			
		||||
						placeholder="请选择生产日期"
 | 
			
		||||
						value-format="timestamp"></el-date-picker>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="进场日期" prop="enterTime" :rules="[]">
 | 
			
		||||
					<el-date-picker
 | 
			
		||||
						v-model="form.enterTime"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						type="datetime"
 | 
			
		||||
						placeholder="请选择进场日期"
 | 
			
		||||
						value-format="timestamp"></el-date-picker>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item
 | 
			
		||||
					label="设备TT值"
 | 
			
		||||
					prop="tvalue"
 | 
			
		||||
					:rules="[
 | 
			
		||||
						{ required: true, message: '不能为空', trigger: 'blur' },
 | 
			
		||||
						{
 | 
			
		||||
							type: 'number',
 | 
			
		||||
							message: '请输入正确的数字值',
 | 
			
		||||
							trigger: 'blur',
 | 
			
		||||
							transform: (val) => Number(val),
 | 
			
		||||
						},
 | 
			
		||||
					]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.tvalue"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入设备TT值"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item
 | 
			
		||||
					label="产品加工时间(s)"
 | 
			
		||||
					prop="processingTime"
 | 
			
		||||
					:rules="[
 | 
			
		||||
						{ required: true, message: '不能为空', trigger: 'blur' },
 | 
			
		||||
						{
 | 
			
		||||
							type: 'number',
 | 
			
		||||
							message: '请输入正确的数字值',
 | 
			
		||||
							trigger: 'blur',
 | 
			
		||||
							transform: (val) => Number(val),
 | 
			
		||||
						},
 | 
			
		||||
					]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.processingTime"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入产品加工时间"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="制造商" prop="manufacturer" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.manufacturer"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入制造商"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="8">
 | 
			
		||||
				<el-form-item label="设备规格" prop="spec" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="form.spec"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						placeholder="请输入设备规格"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<!-- 功能描述  -->
 | 
			
		||||
			<el-col>
 | 
			
		||||
				<el-form-item label="功能描述" prop="description" :rules="[]">
 | 
			
		||||
					<el-input
 | 
			
		||||
						type="textarea"
 | 
			
		||||
						:disabled="disabled"
 | 
			
		||||
						v-model="form.description"
 | 
			
		||||
						placeholder="请填写功能描述"></el-input>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<!-- 上传资料  -->
 | 
			
		||||
			<el-col>
 | 
			
		||||
				<el-form-item label="上传资料" prop="assets" :rules="[]">
 | 
			
		||||
					<AssetsUpload v-model="form.assets" :disabled="disabled" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<!-- 上传图片  -->
 | 
			
		||||
			<el-col>
 | 
			
		||||
				<el-form-item label="上传图片" prop="pics" :rules="[]">
 | 
			
		||||
					<AssetsUpload
 | 
			
		||||
						:is-pic-mode="true"
 | 
			
		||||
						v-model="form.pics"
 | 
			
		||||
						:disabled="disabled" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
	</el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import AssetsUpload from './AssetsUpload.vue';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'EquipmentInfoForm',
 | 
			
		||||
 | 
			
		||||
	model: {
 | 
			
		||||
		prop: 'dataForm',
 | 
			
		||||
		event: 'update',
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	emits: ['update'],
 | 
			
		||||
 | 
			
		||||
	components: { AssetsUpload },
 | 
			
		||||
 | 
			
		||||
	props: {
 | 
			
		||||
		dataForm: {
 | 
			
		||||
			type: Object,
 | 
			
		||||
			default: () => ({}),
 | 
			
		||||
		},
 | 
			
		||||
		disabled: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
		syncFilelist: {
 | 
			
		||||
			type: Number,
 | 
			
		||||
			default: null,
 | 
			
		||||
			required: false,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			formLoading: false,
 | 
			
		||||
			form: {
 | 
			
		||||
				name: '',
 | 
			
		||||
				code: '',
 | 
			
		||||
				enName: '',
 | 
			
		||||
				abbr: '',
 | 
			
		||||
				equipmentTypeId: '',
 | 
			
		||||
				remark: '',
 | 
			
		||||
				productionTime: '',
 | 
			
		||||
				enterTime: '',
 | 
			
		||||
				tvalue: '',
 | 
			
		||||
				processingTime: '',
 | 
			
		||||
				manufacturer: '',
 | 
			
		||||
				spec: '',
 | 
			
		||||
				description: '',
 | 
			
		||||
				assets: [],
 | 
			
		||||
				pics: [],
 | 
			
		||||
			},
 | 
			
		||||
			eqTypeList: [],
 | 
			
		||||
			dataLoaded: false,
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	watch: {
 | 
			
		||||
		dataForm: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				// debugger;
 | 
			
		||||
				this.form = JSON.parse(JSON.stringify(val));
 | 
			
		||||
				this.form.assets =
 | 
			
		||||
					this.form.files?.filter((item) => item.fileType == '2') || [];
 | 
			
		||||
				this.form.pics =
 | 
			
		||||
					this.form.files?.filter((item) => item.fileType == '1') || [];
 | 
			
		||||
				delete this.form.files;
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true,
 | 
			
		||||
			deep: true,
 | 
			
		||||
		},
 | 
			
		||||
		syncFilelist: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				if (val != null) {
 | 
			
		||||
					this.updateForm();
 | 
			
		||||
				}
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.getEqTypeList();
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	methods: {
 | 
			
		||||
		updateForm() {
 | 
			
		||||
			console.log('update form ==> ');
 | 
			
		||||
			this.form.files = [...this.form.assets, ...this.form.pics];
 | 
			
		||||
			delete this.form.assets;
 | 
			
		||||
			delete this.form.pics;
 | 
			
		||||
			this.$emit('update', this.form);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async getEqTypeList() {
 | 
			
		||||
			this.formLoading = true;
 | 
			
		||||
			const { code, data } = await this.$axios(
 | 
			
		||||
				'/base/equipment-type/page?pageNo=1&pageSize=100'
 | 
			
		||||
			);
 | 
			
		||||
			// debugger;
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.eqTypeList = data.list;
 | 
			
		||||
			}
 | 
			
		||||
			this.formLoading = false;
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		/** 模拟透传 ref  */
 | 
			
		||||
		validate(cb) {
 | 
			
		||||
			return this.$refs.form.validate(cb);
 | 
			
		||||
		},
 | 
			
		||||
		resetFields(args) {
 | 
			
		||||
			return this.$refs.form.resetFields(args);
 | 
			
		||||
		},
 | 
			
		||||
		// getCode
 | 
			
		||||
		async getCode(url) {
 | 
			
		||||
			const response = await this.$axios(url);
 | 
			
		||||
			return response.data;
 | 
			
		||||
		},
 | 
			
		||||
		// 上传成功的特殊处理
 | 
			
		||||
		beforeUpload() {},
 | 
			
		||||
		// 上传前的验证规则可通过 bind 属性传入
 | 
			
		||||
		handleUploadSuccess(response, file, fileList) {
 | 
			
		||||
			console.log(
 | 
			
		||||
				'[dialogForm:handleUploadSuccess]',
 | 
			
		||||
				response,
 | 
			
		||||
				file,
 | 
			
		||||
				fileList,
 | 
			
		||||
				this.form
 | 
			
		||||
			);
 | 
			
		||||
			// 保存原始文件名
 | 
			
		||||
			if ('fileNames' in this.form) this.form.fileNames.push(file.name);
 | 
			
		||||
			// 保存完整地址
 | 
			
		||||
			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data);
 | 
			
		||||
			this.$modal.msgSuccess('上传成功');
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		getFileName(fileUrl) {
 | 
			
		||||
			return fileUrl.split('/').pop();
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.el-date-editor,
 | 
			
		||||
.el-select {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -1,111 +0,0 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: EquipmentPics.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-08-18 16:29:39
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="equipment-pics">
 | 
			
		||||
		<div v-for="(url, idx) in images" :key="url">
 | 
			
		||||
			<img :src="url" :alt="url" />
 | 
			
		||||
			<figure class="big-img" :style="inlineStyle">
 | 
			
		||||
				<img :src="url" :alt="url" />
 | 
			
		||||
				<figcaption>{{ desc[idx] }}</figcaption>
 | 
			
		||||
			</figure>
 | 
			
		||||
		</div>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'EquipmentPics',
 | 
			
		||||
	components: {},
 | 
			
		||||
	props: {
 | 
			
		||||
		inlineStyle: {
 | 
			
		||||
			type: Object,
 | 
			
		||||
			default: () => ({}),
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			desc: [
 | 
			
		||||
				'车间设备 - 1',
 | 
			
		||||
				'车间设备 - 2',
 | 
			
		||||
				'车间设备 - 3',
 | 
			
		||||
				'车间设备 - 4',
 | 
			
		||||
				'车间设备 - 5',
 | 
			
		||||
				'车间设备 - 6',
 | 
			
		||||
				'车间设备 - 7',
 | 
			
		||||
				'车间设备 - 8',
 | 
			
		||||
				'车间设备 - 9',
 | 
			
		||||
				'车间设备 - 10',
 | 
			
		||||
				'车间设备 - 11',
 | 
			
		||||
				'车间设备 - 12',
 | 
			
		||||
			],
 | 
			
		||||
			images: Array(10)
 | 
			
		||||
				.fill(1)
 | 
			
		||||
				.map((_, index) => require(`../assets/eq${index + 1}.jpg`)),
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	methods: {},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.equipment-pics {
 | 
			
		||||
	// background: #cfcfcf;
 | 
			
		||||
	padding: 12px;
 | 
			
		||||
	// margin: 8px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	overflow-x: auto;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div {
 | 
			
		||||
	height: 100px;
 | 
			
		||||
	position: relative;
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div:not(:last-child) {
 | 
			
		||||
	margin-right: 12px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > img {
 | 
			
		||||
	height: 95%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > figure {
 | 
			
		||||
	display: none;
 | 
			
		||||
	position: fixed;
 | 
			
		||||
	// inset: 0;
 | 
			
		||||
	// margin: auto;
 | 
			
		||||
	top: 0;
 | 
			
		||||
	right: 0;
 | 
			
		||||
	// width: 640px;
 | 
			
		||||
	// height: 480px;
 | 
			
		||||
	background: #000;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
	padding: 8px 8px 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div:hover > figure {
 | 
			
		||||
	margin: 0;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
	align-items: center;
 | 
			
		||||
	justify-content: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > figure > img {
 | 
			
		||||
	flex: 1;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > figure > figcaption {
 | 
			
		||||
	height: 24px;
 | 
			
		||||
	margin-top: 8px;
 | 
			
		||||
	font-size: 18px;
 | 
			
		||||
	line-height: 1;
 | 
			
		||||
	color: #fff;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -36,13 +36,17 @@
 | 
			
		||||
			:dialogVisible="open"
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			width="60%"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				key="index-dialog-form"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				:dataForm="form"
 | 
			
		||||
				:rows="rows" />
 | 
			
		||||
				label-position="top"
 | 
			
		||||
				size="small"
 | 
			
		||||
				v-model="form"
 | 
			
		||||
				:rows="computedRows"
 | 
			
		||||
				:has-file="true" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
 | 
			
		||||
		<!-- 设备 详情 - 编辑 -->
 | 
			
		||||
@@ -50,12 +54,13 @@
 | 
			
		||||
			v-if="editVisible"
 | 
			
		||||
			ref="drawer"
 | 
			
		||||
			:mode="editMode"
 | 
			
		||||
			@update-mode="editMode = $event"
 | 
			
		||||
			:data-id="form.id"
 | 
			
		||||
			:sections="[
 | 
			
		||||
				{
 | 
			
		||||
					name: '基本信息',
 | 
			
		||||
					key: 'base',
 | 
			
		||||
					rows: rows,
 | 
			
		||||
					rows: computedRows,
 | 
			
		||||
					url: '/base/equipment/get',
 | 
			
		||||
					urlUpdate: '/base/equipment/update',
 | 
			
		||||
					urlCreate: '/base/equipment/create',
 | 
			
		||||
@@ -93,17 +98,14 @@
 | 
			
		||||
				},
 | 
			
		||||
			]"
 | 
			
		||||
			@refreshDataList="getList"
 | 
			
		||||
			@cancel="editVisible = false"
 | 
			
		||||
			@destroy="editVisible = false" />
 | 
			
		||||
			@cancel="cancelEdit"
 | 
			
		||||
			@destroy="cancelEdit" />
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import moment from 'moment';
 | 
			
		||||
import basicPageMixin from '@/mixins/lb/basicPageMixin';
 | 
			
		||||
import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
import EquipmentPics from './components/EquipmentPics';
 | 
			
		||||
import EquipmentAssets from './components/EquipmentAssets';
 | 
			
		||||
import EquipmentDrawer from './components/EquipmentDrawer';
 | 
			
		||||
 | 
			
		||||
import {
 | 
			
		||||
@@ -115,6 +117,7 @@ import {
 | 
			
		||||
	exportEquipmentExcel,
 | 
			
		||||
} from '@/api/base/equipment';
 | 
			
		||||
import Editor from '@/components/Editor';
 | 
			
		||||
import AssetsUpload from './components/AssetsUpload.vue';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'Equipment',
 | 
			
		||||
@@ -127,6 +130,12 @@ export default {
 | 
			
		||||
		return {
 | 
			
		||||
			searchBarKeys: ['name', 'code'],
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
				this.$auth.hasPermi(`base:equipment:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'detail',
 | 
			
		||||
							btnName: '详情',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
				this.$auth.hasPermi('base:equipment:update')
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
@@ -139,12 +148,6 @@ export default {
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
				this.$auth.hasPermi(`base:equipment:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'detail',
 | 
			
		||||
							btnName: '详情',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
			].filter((v) => v),
 | 
			
		||||
			tableProps: [
 | 
			
		||||
				{
 | 
			
		||||
@@ -155,7 +158,7 @@ export default {
 | 
			
		||||
					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 | 
			
		||||
				},
 | 
			
		||||
				{ prop: 'name', label: '设备名称' },
 | 
			
		||||
				{ width: 256, prop: 'code', label: '检测编码' },
 | 
			
		||||
				{ width: 256, prop: 'code', label: '设备编码' },
 | 
			
		||||
				{ prop: 'equipmentType', label: '设备类型' },
 | 
			
		||||
				{ prop: 'enName', label: '英文名称' },
 | 
			
		||||
				{ prop: 'abbr', label: '缩写' },
 | 
			
		||||
@@ -208,6 +211,13 @@ export default {
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					plain: true,
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:equipment:create') ? 'button' : '',
 | 
			
		||||
					btnName: '新增',
 | 
			
		||||
@@ -215,12 +225,6 @@ export default {
 | 
			
		||||
					plain: true,
 | 
			
		||||
					color: 'success',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					color: 'warning',
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			rows: [
 | 
			
		||||
				[
 | 
			
		||||
@@ -239,8 +243,6 @@ export default {
 | 
			
		||||
						prop: 'code',
 | 
			
		||||
						url: '/base/equipment/getCode',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '英文名称',
 | 
			
		||||
@@ -250,6 +252,8 @@ export default {
 | 
			
		||||
						// 	disabled: true, // some condition, like detail mode...
 | 
			
		||||
						// }
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '缩写',
 | 
			
		||||
@@ -259,13 +263,15 @@ export default {
 | 
			
		||||
						// 	disabled: true, // some condition, like detail mode...
 | 
			
		||||
						// }
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '设备类型',
 | 
			
		||||
						prop: 'equipmentTypeId',
 | 
			
		||||
						url: '/base/equipment-type/page?pageNo=1&pageSize=100',
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
					// {
 | 
			
		||||
					// 	select: true,
 | 
			
		||||
@@ -286,8 +292,6 @@ export default {
 | 
			
		||||
						label: '进厂日期',
 | 
			
		||||
						prop: 'enterTime',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						prop: 'tvalue',
 | 
			
		||||
@@ -302,11 +306,14 @@ export default {
 | 
			
		||||
							},
 | 
			
		||||
						],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '产品加工时间',
 | 
			
		||||
						label: '产品加工时间(s)',
 | 
			
		||||
						prop: 'processingTime',
 | 
			
		||||
						rules: [
 | 
			
		||||
							{ required: true, message: '不能为空', trigger: 'blur' },
 | 
			
		||||
							{
 | 
			
		||||
								type: 'number',
 | 
			
		||||
								message: '请输入正确的数字值',
 | 
			
		||||
@@ -315,8 +322,7 @@ export default {
 | 
			
		||||
							},
 | 
			
		||||
						],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '制造商',
 | 
			
		||||
@@ -337,40 +343,79 @@ export default {
 | 
			
		||||
						prop: 'description',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						upload: true,
 | 
			
		||||
						label: '上传资料',
 | 
			
		||||
						prop: 'uploadFiles',
 | 
			
		||||
						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
 | 
			
		||||
						bind: {
 | 
			
		||||
							headers: { Authorization: 'Bearer ' + getAccessToken() },
 | 
			
		||||
							'show-file-list': false,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						diy: true,
 | 
			
		||||
						key: 'eq-assets',
 | 
			
		||||
						label: '设备资料',
 | 
			
		||||
						prop: 'fileNames',
 | 
			
		||||
						subcomponent: EquipmentAssets,
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						diy: true,
 | 
			
		||||
						key: 'eq-pics',
 | 
			
		||||
						label: '设备图片',
 | 
			
		||||
						prop: 'fileUrls',
 | 
			
		||||
						subcomponent: EquipmentPics,
 | 
			
		||||
						pictures: async () => {
 | 
			
		||||
							// some async request
 | 
			
		||||
							return [];
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				// [
 | 
			
		||||
				// 	{
 | 
			
		||||
				// 		assetUpload: true,
 | 
			
		||||
				// 		label: '上传资料',
 | 
			
		||||
				// 		fieldName: 'assets',
 | 
			
		||||
				// 		subcomponent: AssetsUpload
 | 
			
		||||
				// 	},
 | 
			
		||||
				// ],
 | 
			
		||||
				// [
 | 
			
		||||
				// 	{
 | 
			
		||||
				// 		assetUpload: true,
 | 
			
		||||
				// 		label: '上传图片',
 | 
			
		||||
				// 		fieldName: 'images',
 | 
			
		||||
				// 		subcomponent: AssetsUpload
 | 
			
		||||
				// 	},
 | 
			
		||||
				// ],
 | 
			
		||||
				// [
 | 
			
		||||
				// 	{
 | 
			
		||||
				// 		upload: true,
 | 
			
		||||
				// 		label: '上传资料',
 | 
			
		||||
				// 		prop: 'uploadFiles',
 | 
			
		||||
				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
 | 
			
		||||
				// 		uploadFnName: 'assetsUpload', // 上传方法名
 | 
			
		||||
				// 		bind: {
 | 
			
		||||
				// 			headers: { Authorization: 'Bearer ' + getAccessToken() },
 | 
			
		||||
				// 			'show-file-list': false,
 | 
			
		||||
				// 		},
 | 
			
		||||
				// 	},
 | 
			
		||||
				// 	{
 | 
			
		||||
				// 		diy: true,
 | 
			
		||||
				// 		key: 'eq-assets',
 | 
			
		||||
				// 		label: '设备资料',
 | 
			
		||||
				// 		prop: 'fileNames',
 | 
			
		||||
				// 		subcomponent: EquipmentAssets,
 | 
			
		||||
				// 	},
 | 
			
		||||
				// ],
 | 
			
		||||
				// [
 | 
			
		||||
				// {
 | 
			
		||||
				// 		upload: true,
 | 
			
		||||
				// 		label: '上传图片',
 | 
			
		||||
				// 		prop: 'uploadImages',
 | 
			
		||||
				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
 | 
			
		||||
				// 		uploadFnName: 'imagesUpload', // 上传方法名
 | 
			
		||||
				// 		bind: {
 | 
			
		||||
				// 			headers: { Authorization: 'Bearer ' + getAccessToken() },
 | 
			
		||||
				// 			'show-file-list': false,
 | 
			
		||||
				// 		},
 | 
			
		||||
				// 	},
 | 
			
		||||
				// 	{
 | 
			
		||||
				// 		diy: true,
 | 
			
		||||
				// 		key: 'eq-pics',
 | 
			
		||||
				// 		label: '设备图片',
 | 
			
		||||
				// 		prop: 'fileUrls',
 | 
			
		||||
				// 		subcomponent: EquipmentPics,
 | 
			
		||||
				// 		pictures: async () => {
 | 
			
		||||
				// 			// some async request
 | 
			
		||||
				// 			return [];
 | 
			
		||||
				// 		},
 | 
			
		||||
				// 	},
 | 
			
		||||
				// ],
 | 
			
		||||
				// [
 | 
			
		||||
				// 	{
 | 
			
		||||
				// 		diy: true,
 | 
			
		||||
				// 		key: 'eq-pics',
 | 
			
		||||
				// 		label: '设备图片',
 | 
			
		||||
				// 		prop: 'fileUrls',
 | 
			
		||||
				// 		subcomponent: EquipmentPics,
 | 
			
		||||
				// 		pictures: async () => {
 | 
			
		||||
				// 			// some async request
 | 
			
		||||
				// 			return [];
 | 
			
		||||
				// 		},
 | 
			
		||||
				// 	},
 | 
			
		||||
				// ],
 | 
			
		||||
			],
 | 
			
		||||
			editVisible: false,
 | 
			
		||||
			editMode: 'edit', // 'edit', 'detail'
 | 
			
		||||
@@ -399,11 +444,49 @@ export default {
 | 
			
		||||
			form: {
 | 
			
		||||
				id: null,
 | 
			
		||||
			},
 | 
			
		||||
			showUploadComponents: false, // 是否显示上传组件
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	created() {
 | 
			
		||||
		this.getList();
 | 
			
		||||
	},
 | 
			
		||||
	computed: {
 | 
			
		||||
		computedRows() {
 | 
			
		||||
			return this.showUploadComponents
 | 
			
		||||
				? [
 | 
			
		||||
						...this.rows,
 | 
			
		||||
						[
 | 
			
		||||
							{
 | 
			
		||||
								assetUpload: true,
 | 
			
		||||
								key: 'eq-assets', // 用于区分不同的上传组件
 | 
			
		||||
								label: '上传资料',
 | 
			
		||||
								fieldName: 'assets',
 | 
			
		||||
								subcomponent: AssetsUpload,
 | 
			
		||||
								prop: 'uploadedAssets',
 | 
			
		||||
								default: [],
 | 
			
		||||
								bind: {
 | 
			
		||||
									'is-pic-mode': false,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						],
 | 
			
		||||
						[
 | 
			
		||||
							{
 | 
			
		||||
								assetUpload: true,
 | 
			
		||||
								key: 'eq-pics', // 用于区分不同的上传组件
 | 
			
		||||
								label: '上传图片',
 | 
			
		||||
								fieldName: 'images',
 | 
			
		||||
								subcomponent: AssetsUpload,
 | 
			
		||||
								// prop: '',
 | 
			
		||||
								// default: [],
 | 
			
		||||
								bind: {
 | 
			
		||||
									'is-pic-mode': true,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						],
 | 
			
		||||
				  ]
 | 
			
		||||
				: this.rows;
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		/** 查询列表 */
 | 
			
		||||
		getList() {
 | 
			
		||||
@@ -420,6 +503,10 @@ export default {
 | 
			
		||||
			this.open = false;
 | 
			
		||||
			this.reset();
 | 
			
		||||
		},
 | 
			
		||||
		cancelEdit() {
 | 
			
		||||
			this.showUploadComponents = false;
 | 
			
		||||
			this.editVisible = false;
 | 
			
		||||
		},
 | 
			
		||||
		/** 表单重置 */
 | 
			
		||||
		reset() {
 | 
			
		||||
			this.form = {
 | 
			
		||||
@@ -445,11 +532,13 @@ export default {
 | 
			
		||||
		handleAdd() {
 | 
			
		||||
			this.reset();
 | 
			
		||||
			this.open = true;
 | 
			
		||||
			this.showUploadComponents = false;
 | 
			
		||||
			this.title = '添加设备';
 | 
			
		||||
		},
 | 
			
		||||
		/** 修改按钮操作 */
 | 
			
		||||
		handleUpdate(row) {
 | 
			
		||||
			this.reset();
 | 
			
		||||
			this.showUploadComponents = true;
 | 
			
		||||
			const id = row.id;
 | 
			
		||||
			getEquipment(id).then((response) => {
 | 
			
		||||
				this.form = response.data;
 | 
			
		||||
@@ -516,6 +605,7 @@ export default {
 | 
			
		||||
		viewDetail(id) {
 | 
			
		||||
			this.reset();
 | 
			
		||||
			this.editMode = 'detail';
 | 
			
		||||
			this.showUploadComponents = true;
 | 
			
		||||
			this.form.id = id;
 | 
			
		||||
			this.editVisible = true;
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
@@ -524,11 +614,11 @@ export default {
 | 
			
		||||
		},
 | 
			
		||||
		// overwrite basicPageMixin 里的 处理表格按钮 方法
 | 
			
		||||
		handleTableBtnClick({ data, type }) {
 | 
			
		||||
			console.log('[handleTableBtnClick]', data, type);
 | 
			
		||||
			switch (type) {
 | 
			
		||||
				case 'edit':
 | 
			
		||||
					this.reset();
 | 
			
		||||
					this.editMode = 'edit';
 | 
			
		||||
					this.showUploadComponents = true;
 | 
			
		||||
					this.form.id = data.id;
 | 
			
		||||
					this.editVisible = true;
 | 
			
		||||
					this.$nextTick(() => {
 | 
			
		||||
 
 | 
			
		||||
@@ -37,7 +37,12 @@
 | 
			
		||||
			@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"
 | 
			
		||||
				:has-file="true" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
@@ -55,7 +60,7 @@ import {
 | 
			
		||||
	exportEquipmentTypeExcel,
 | 
			
		||||
} from '@/api/base/equipmentType';
 | 
			
		||||
 | 
			
		||||
import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
// import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'EquipmentType',
 | 
			
		||||
@@ -86,9 +91,9 @@ export default {
 | 
			
		||||
					width: 180,
 | 
			
		||||
					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 | 
			
		||||
				},
 | 
			
		||||
				{ prop: 'name', label: '设备类型名称',  },
 | 
			
		||||
				{ prop: 'code', label: '检测类型编码',  },
 | 
			
		||||
				{ prop: 'remark', label: '备注',  },
 | 
			
		||||
				{ prop: 'name', label: '设备类型名称' },
 | 
			
		||||
				{ prop: 'code', label: '检测类型编码' },
 | 
			
		||||
				{ prop: 'remark', label: '备注' },
 | 
			
		||||
			],
 | 
			
		||||
			searchBarFormConfig: [
 | 
			
		||||
				{
 | 
			
		||||
@@ -149,15 +154,13 @@ export default {
 | 
			
		||||
						prop: 'parentId',
 | 
			
		||||
						url: '/base/equipment-type/page?pageNo=1&pageSize=100',
 | 
			
		||||
					},
 | 
			
		||||
					{},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						upload: true,
 | 
			
		||||
						label: '上传资料',
 | 
			
		||||
						prop: 'uploadFiles',
 | 
			
		||||
						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
 | 
			
		||||
						bind: {
 | 
			
		||||
							headers: { Authorization: 'Bearer ' + getAccessToken() },
 | 
			
		||||
							'show-file-list': false,
 | 
			
		||||
						},
 | 
			
		||||
						prop: 'files',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[{ input: true, label: '备注', prop: 'remark' }],
 | 
			
		||||
@@ -209,8 +212,6 @@ export default {
 | 
			
		||||
				name: undefined,
 | 
			
		||||
				parentId: undefined,
 | 
			
		||||
				remark: undefined,
 | 
			
		||||
				fileNames: [],
 | 
			
		||||
				fileUrls: [],
 | 
			
		||||
			};
 | 
			
		||||
			this.resetForm('form');
 | 
			
		||||
		},
 | 
			
		||||
@@ -236,6 +237,25 @@ export default {
 | 
			
		||||
			const id = row.id;
 | 
			
		||||
			getEquipmentType(id).then((response) => {
 | 
			
		||||
				this.form = response.data;
 | 
			
		||||
				// this.form = {
 | 
			
		||||
				// 	code: 'SBLX20230925184444000041',
 | 
			
		||||
				// 	name: '测试131',
 | 
			
		||||
				// 	remark: '测试可删除',
 | 
			
		||||
				// 	id: '1706258479729336322',
 | 
			
		||||
				// 	files: [
 | 
			
		||||
				// 		{ fileName: '1.png', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: '1.asdfaslkjfkasdf.png', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: '2.txt', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: '1.rar', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: '1.kkk', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: 'test.file', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: '222', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 		{ fileName: 'g', fileUrl: '', fileType: 2 },
 | 
			
		||||
				// 	],
 | 
			
		||||
				// 	createTime: 1695638697000,
 | 
			
		||||
				// 	parentId: '1701869972319584257',
 | 
			
		||||
				// };
 | 
			
		||||
				// debugger;
 | 
			
		||||
				this.open = true;
 | 
			
		||||
				this.title = '修改设备类型';
 | 
			
		||||
			});
 | 
			
		||||
@@ -267,7 +287,7 @@ export default {
 | 
			
		||||
		handleDelete(row) {
 | 
			
		||||
			const id = row.id;
 | 
			
		||||
			this.$modal
 | 
			
		||||
				.confirm('是否确认删除设备类型编号为"' + id + '"的数据项?')
 | 
			
		||||
				.confirm('是否确认删除设备类型"' + row.name + '"?')
 | 
			
		||||
				.then(function () {
 | 
			
		||||
					return deleteEquipmentType(id);
 | 
			
		||||
				})
 | 
			
		||||
 
 | 
			
		||||
@@ -1,8 +1,8 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-11-18 14:16:25
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-08-01 16:59:06
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-16 11:16:48
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -12,21 +12,30 @@
 | 
			
		||||
		ref="dataForm"
 | 
			
		||||
		@keyup.enter.native="dataFormSubmit()"
 | 
			
		||||
		label-width="80px">
 | 
			
		||||
		<el-form-item label="工厂编码" prop="code">
 | 
			
		||||
			<el-input
 | 
			
		||||
				v-model="dataForm.code"
 | 
			
		||||
				clearable
 | 
			
		||||
				placeholder="请输入工厂编码" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-form-item label="工厂名称" prop="name">
 | 
			
		||||
			<el-input
 | 
			
		||||
				v-model="dataForm.name"
 | 
			
		||||
				clearable
 | 
			
		||||
				placeholder="请输入工厂名称" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-form-item label="地址" prop="address">
 | 
			
		||||
			<el-input v-model="dataForm.address" clearable placeholder="请输入地址" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="工厂编码" prop="code">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.code"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入工厂编码" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="工厂名称" prop="name">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.name"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入工厂名称" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="地址" prop="address">
 | 
			
		||||
					<el-input v-model="dataForm.address" clearable placeholder="请输入地址" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		<!-- <el-form-item label="启用状态" prop="enabled">
 | 
			
		||||
			<el-select
 | 
			
		||||
				v-model="dataForm.enabled"
 | 
			
		||||
@@ -38,9 +47,12 @@
 | 
			
		||||
					:value="dict.value" />
 | 
			
		||||
			</el-select>
 | 
			
		||||
		</el-form-item> -->
 | 
			
		||||
		<el-form-item label="备注" prop="remark">
 | 
			
		||||
			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="备注" prop="remark">
 | 
			
		||||
					<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
	</el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -29,7 +29,7 @@
 | 
			
		||||
			@cancel="handleCancel"
 | 
			
		||||
			@confirm="handleConfirm"
 | 
			
		||||
			:before-close="handleCancel"
 | 
			
		||||
			width="70%">
 | 
			
		||||
			width="50%">
 | 
			
		||||
			<add-or-update
 | 
			
		||||
				ref="addOrUpdate"
 | 
			
		||||
				@refreshDataList="successSubmit"></add-or-update>
 | 
			
		||||
 
 | 
			
		||||
@@ -2,15 +2,14 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-02 15:12:42
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-10 16:49:03
 | 
			
		||||
 * @LastEditTime: 2023-10-13 16:35:03
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="app-container">
 | 
			
		||||
		<search-bar
 | 
			
		||||
			:formConfigs="formConfig"
 | 
			
		||||
			ref="searchBarForm"
 | 
			
		||||
			@headBtnClick="buttonClick" />
 | 
			
		||||
			:formConfigs="[{ label: '产线在制产品', type: 'title' }]"
 | 
			
		||||
			ref="searchBarForm" />
 | 
			
		||||
		<base-table
 | 
			
		||||
			v-loading="dataListLoading"
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
@@ -36,20 +35,17 @@ import { getProductPage } from '@/api/core/base/product';
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'lineName',
 | 
			
		||||
		label: '产线',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产线'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'productName',
 | 
			
		||||
		label: '在制产品',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		list: [],
 | 
			
		||||
		subcomponent: selectProduct,
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'recordTime',
 | 
			
		||||
		label: '开始时间',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
@@ -63,14 +59,14 @@ export default {
 | 
			
		||||
			},
 | 
			
		||||
			tableProps,
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '同步',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			// formConfig: [
 | 
			
		||||
			// 	{
 | 
			
		||||
			// 		type: 'button',
 | 
			
		||||
			// 		btnName: '同步',
 | 
			
		||||
			// 		name: 'search',
 | 
			
		||||
			// 		color: 'primary',
 | 
			
		||||
			// 	},
 | 
			
		||||
			// ],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	components: {},
 | 
			
		||||
 
 | 
			
		||||
@@ -2,12 +2,11 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-03 14:09:18
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-10 16:54:09
 | 
			
		||||
 * @LastEditTime: 2023-10-13 16:47:25
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="tableInner">
 | 
			
		||||
		<el-input readonly v-model="list.productName" style="width: 50%;" ></el-input>
 | 
			
		||||
		<el-popover
 | 
			
		||||
    placement="top"
 | 
			
		||||
    title="切换在制产品"
 | 
			
		||||
@@ -28,8 +27,11 @@
 | 
			
		||||
					确定
 | 
			
		||||
				</el-button>
 | 
			
		||||
			</div>
 | 
			
		||||
			<el-button type="text" slot="reference">切换</el-button>
 | 
			
		||||
			<el-button type="text" slot="reference">
 | 
			
		||||
				<svg-icon icon-class="changelogo"/>
 | 
			
		||||
			</el-button>
 | 
			
		||||
		</el-popover>
 | 
			
		||||
		<el-input readonly v-model="list.productName" style="width: 50%;margin-left: 5px" ></el-input>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
@@ -61,6 +63,7 @@ export default {
 | 
			
		||||
			switchLineBindProduct(data).then((response) => {
 | 
			
		||||
				this.$modal.msgSuccess('修改成功');
 | 
			
		||||
				this.visible = false;
 | 
			
		||||
				this.list.productName = this.list.string.split('+')[1]
 | 
			
		||||
				this.$emit('emitData');
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 
 | 
			
		||||
@@ -28,24 +28,20 @@ import { getProductPage } from '@/api/core/base/product';
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'productionLineName',
 | 
			
		||||
		label: '产线',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产线'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'productName',
 | 
			
		||||
		label: '在制产品',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '在制产品'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'startTime',
 | 
			
		||||
		label: '开始时间',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'endTime',
 | 
			
		||||
		label: '结束时间',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
@@ -86,7 +82,8 @@ export default {
 | 
			
		||||
					rangeSeparator: '-',
 | 
			
		||||
					startPlaceholder: '开始时间',
 | 
			
		||||
					endPlaceholder: '结束时间',
 | 
			
		||||
					param: 'createTime',
 | 
			
		||||
					param: 'startTime',
 | 
			
		||||
					valueFormat: 'timestamp'
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
@@ -126,7 +123,7 @@ export default {
 | 
			
		||||
					this.listQuery.pageSize = 10;
 | 
			
		||||
					this.listQuery.productionLineId = val.productionLineId;
 | 
			
		||||
					this.listQuery.productId = val.productId;
 | 
			
		||||
					this.listQuery.createTime = val.createTime;
 | 
			
		||||
					this.listQuery.startTime = val.startTime;
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'reset':
 | 
			
		||||
 
 | 
			
		||||
@@ -43,7 +43,7 @@
 | 
			
		||||
							<el-form-item label="产品类型" prop="typeDictValue">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.typeDictValue"
 | 
			
		||||
                  style="width: 100%"
 | 
			
		||||
									style="width: 100%"
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择产品类型">
 | 
			
		||||
									<el-option
 | 
			
		||||
@@ -58,7 +58,7 @@
 | 
			
		||||
							<el-form-item label="单位" prop="unitDictValue">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.unitDictValue"
 | 
			
		||||
                  style="width: 100%"
 | 
			
		||||
									style="width: 100%"
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择单位">
 | 
			
		||||
									<el-option
 | 
			
		||||
@@ -83,8 +83,8 @@
 | 
			
		||||
							<el-form-item label="单位平方数" prop="area">
 | 
			
		||||
								<el-input
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
                  v-model="dataForm.area"
 | 
			
		||||
                  placeholder="请输入单位平方数" />
 | 
			
		||||
									v-model="dataForm.area"
 | 
			
		||||
									placeholder="请输入单位平方数" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
@@ -111,6 +111,8 @@
 | 
			
		||||
						:table-props="tableProps"
 | 
			
		||||
						:page="listQuery.pageNo"
 | 
			
		||||
						:limit="listQuery.pageSize"
 | 
			
		||||
						:add-button-show="isdetail ? null : '添加属性'"
 | 
			
		||||
						@emitButtonClick="addNew()"
 | 
			
		||||
						:table-data="productAttributeList">
 | 
			
		||||
						<method-btn
 | 
			
		||||
							v-if="!isdetail"
 | 
			
		||||
@@ -123,15 +125,15 @@
 | 
			
		||||
					<pagination
 | 
			
		||||
						v-show="listQuery.total > 0"
 | 
			
		||||
						:total="listQuery.total"
 | 
			
		||||
						:page.sync="listQuery.current"
 | 
			
		||||
						:limit.sync="listQuery.size"
 | 
			
		||||
						:page.sync="listQuery.pageNo"
 | 
			
		||||
						:limit.sync="listQuery.pageSize"
 | 
			
		||||
						:page-sizes="[5, 10, 15]"
 | 
			
		||||
						@pagination="getList" />
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<div style="position: absolute; bottom: 24px; right: 24px">
 | 
			
		||||
		<!-- <div style="position: absolute; bottom: 24px; right: 24px">
 | 
			
		||||
			<el-button style="margin-right: 10px" @click="goback()">返回</el-button>
 | 
			
		||||
			<el-button v-if="isdetail" type="primary" @click="goEdit()">
 | 
			
		||||
				编辑
 | 
			
		||||
@@ -145,6 +147,14 @@
 | 
			
		||||
					添加属性
 | 
			
		||||
				</el-button>
 | 
			
		||||
			</span>
 | 
			
		||||
		</div> -->
 | 
			
		||||
 | 
			
		||||
		<div class="drawer-body__footer">
 | 
			
		||||
			<el-button style="" @click="goback()">取消</el-button>
 | 
			
		||||
			<el-button v-if="isdetail" type="primary" @click="goEdit()">
 | 
			
		||||
				编辑
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button v-else type="primary" @click="dataFormSubmit()">确定</el-button>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<product-attr-add
 | 
			
		||||
@@ -250,12 +260,12 @@ export default {
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				area: [
 | 
			
		||||
					// {
 | 
			
		||||
					// 	type: 'float',
 | 
			
		||||
					// 	message: '单位平方数为浮点类型',
 | 
			
		||||
					// 	trigger: 'blur',
 | 
			
		||||
					// 	transfom: 'val => Float(val)',
 | 
			
		||||
					// },
 | 
			
		||||
					{
 | 
			
		||||
						type: 'number',
 | 
			
		||||
						message: '请输入正确的数值',
 | 
			
		||||
						trigger: 'change',
 | 
			
		||||
						transform: (val) => Number(val),
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				processTime: [
 | 
			
		||||
					{
 | 
			
		||||
@@ -263,12 +273,12 @@ export default {
 | 
			
		||||
						message: '完成单位产品用时不能为空',
 | 
			
		||||
						trigger: 'blur',
 | 
			
		||||
					},
 | 
			
		||||
					// {
 | 
			
		||||
					// 	type: 'number',
 | 
			
		||||
					// 	message: '完成单位产品用时为浮点类型',
 | 
			
		||||
					// 	trigger: 'blur',
 | 
			
		||||
					// 	transfom: 'val => Number(val)',
 | 
			
		||||
					// },
 | 
			
		||||
					{
 | 
			
		||||
						type: 'number',
 | 
			
		||||
						message: '请输入正确的数值',
 | 
			
		||||
						trigger: 'blur',
 | 
			
		||||
						transform: (val) => Number(val),
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			},
 | 
			
		||||
			isdetail: false,
 | 
			
		||||
@@ -277,6 +287,7 @@ export default {
 | 
			
		||||
	methods: {
 | 
			
		||||
		initData() {
 | 
			
		||||
			this.productAttributeList.splice(0);
 | 
			
		||||
			this.listQuery.total = 0;
 | 
			
		||||
		},
 | 
			
		||||
		init(id, isdetail) {
 | 
			
		||||
			this.initData();
 | 
			
		||||
@@ -304,12 +315,10 @@ export default {
 | 
			
		||||
 | 
			
		||||
		getList() {
 | 
			
		||||
			// 获取产品的属性列表
 | 
			
		||||
			const params = {
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
			getProductAttrPage({
 | 
			
		||||
				...this.listQuery,
 | 
			
		||||
				productId: this.dataForm.id,
 | 
			
		||||
			};
 | 
			
		||||
			getProductAttrPage(params).then((response) => {
 | 
			
		||||
			}).then((response) => {
 | 
			
		||||
				this.productAttributeList = response.data.list;
 | 
			
		||||
				this.listQuery.total = response.data.total;
 | 
			
		||||
			});
 | 
			
		||||
@@ -390,6 +399,8 @@ export default {
 | 
			
		||||
<style scoped>
 | 
			
		||||
.drawer >>> .el-drawer {
 | 
			
		||||
	border-radius: 8px 0 0 8px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-form-item__label {
 | 
			
		||||
@@ -400,14 +411,20 @@ export default {
 | 
			
		||||
	margin: 0;
 | 
			
		||||
	padding: 32px 32px 24px;
 | 
			
		||||
	border-bottom: 1px solid #dcdfe6;
 | 
			
		||||
	margin-bottom: 30px;
 | 
			
		||||
}
 | 
			
		||||
.drawer >>> .el-drawer__body {
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	height: 1px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .content {
 | 
			
		||||
	padding: 0 24px 30px;
 | 
			
		||||
	padding: 30px 24px;
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
	height: 100%;
 | 
			
		||||
	/* height: 100%; */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .visual-part {
 | 
			
		||||
@@ -422,4 +439,10 @@ export default {
 | 
			
		||||
.drawer >>> .attr-list {
 | 
			
		||||
	padding: 0 16px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer-body__footer {
 | 
			
		||||
	display: flex;
 | 
			
		||||
	justify-content: flex-end;
 | 
			
		||||
	padding: 18px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,8 +1,8 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 14:55:51
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-08-03 15:22:53
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-13 10:27:00
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -50,30 +50,25 @@ import {
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'code',
 | 
			
		||||
		label: '产品编码',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产品编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'name',
 | 
			
		||||
		label: '产品名称',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产品名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'specifications',
 | 
			
		||||
		label: '规格',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '规格'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'unitDictValue',
 | 
			
		||||
		label: '单位',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		subcomponent: unitDict,
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '创建时间',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
		filter: parseTime
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
@@ -127,14 +122,14 @@ export default {
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '重置',
 | 
			
		||||
					name: 'reset',
 | 
			
		||||
				},
 | 
			
		||||
				// {
 | 
			
		||||
				// 	type: 'separate',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	type: 'button',
 | 
			
		||||
				// 	btnName: '重置',
 | 
			
		||||
				// 	name: 'reset',
 | 
			
		||||
				// },
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
 
 | 
			
		||||
@@ -7,53 +7,84 @@
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<el-form
 | 
			
		||||
		class="dialog-inner__form"
 | 
			
		||||
		:model="dataForm"
 | 
			
		||||
		:rules="dataRule"
 | 
			
		||||
		ref="dataForm"
 | 
			
		||||
		@keyup.enter.native="dataFormSubmit()"
 | 
			
		||||
		label-width="90px">
 | 
			
		||||
		<el-form-item label="产线编码" prop="code">
 | 
			
		||||
			<el-input
 | 
			
		||||
				v-model="dataForm.code"
 | 
			
		||||
				clearable
 | 
			
		||||
				placeholder="请输入产线编码" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-form-item label="产线名称" prop="name">
 | 
			
		||||
			<el-input
 | 
			
		||||
				v-model="dataForm.name"
 | 
			
		||||
				clearable
 | 
			
		||||
				placeholder="请输入产线名称" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
    <el-form-item prop="factoryId" label="工厂名称">
 | 
			
		||||
      <el-select
 | 
			
		||||
      v-model="dataForm.factoryId" filterable clearable placeholder="请选择工厂">
 | 
			
		||||
        <el-option
 | 
			
		||||
          v-for="item in urlOptions.optionArr.arr0"
 | 
			
		||||
          :key="item.id"
 | 
			
		||||
          :label="item.name"
 | 
			
		||||
          :value="item.id"
 | 
			
		||||
        >
 | 
			
		||||
        </el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
		<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"
 | 
			
		||||
				type="textarea"
 | 
			
		||||
				placeholder="请输入内容" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-form-item label="备注" prop="remark">
 | 
			
		||||
			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="产线编码" prop="code">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.code"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入产线编码" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="产线名称" prop="name">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.name"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入产线名称" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item prop="factoryId" label="工厂名称">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.factoryId"
 | 
			
		||||
						filterable
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请选择工厂">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="item in urlOptions.optionArr.arr0"
 | 
			
		||||
							:key="item.id"
 | 
			
		||||
							:label="item.name"
 | 
			
		||||
							:value="item.id"></el-option>
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="产线TT值(h)" prop="tvalue">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.tvalue"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入每小时下片数量" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="额外编码" prop="externalCode">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.externalCode"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入额外编码" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="备注" prop="remark">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.remark"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入备注" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
 | 
			
		||||
		<el-row>
 | 
			
		||||
			<el-col>
 | 
			
		||||
				<el-form-item label="描述" prop="description">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.description"
 | 
			
		||||
						type="textarea"
 | 
			
		||||
						placeholder="请输入内容" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
	</el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
@@ -65,22 +96,20 @@ import {
 | 
			
		||||
	getProductionLine,
 | 
			
		||||
	getCode,
 | 
			
		||||
} from '@/api/core/base/productionLine';
 | 
			
		||||
import {
 | 
			
		||||
	getFactoryPage,
 | 
			
		||||
} from '@/api/core/base/factory';
 | 
			
		||||
import { getFactoryPage } from '@/api/core/base/factory';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicAdd],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
        getOption: true,
 | 
			
		||||
			  isGetCode: true,
 | 
			
		||||
        codeURL: getCode,
 | 
			
		||||
				getOption: true,
 | 
			
		||||
				isGetCode: true,
 | 
			
		||||
				codeURL: getCode,
 | 
			
		||||
				createURL: createProductionLine,
 | 
			
		||||
				updateURL: updateProductionLine,
 | 
			
		||||
				infoURL: getProductionLine,
 | 
			
		||||
        optionArrUrl: [getFactoryPage],
 | 
			
		||||
				optionArrUrl: [getFactoryPage],
 | 
			
		||||
			},
 | 
			
		||||
			dataForm: {
 | 
			
		||||
				id: undefined,
 | 
			
		||||
@@ -99,13 +128,26 @@ export default {
 | 
			
		||||
				name: [
 | 
			
		||||
					{ required: true, message: '产线名称不能为空', trigger: 'blur' },
 | 
			
		||||
				],
 | 
			
		||||
        factoryId: [
 | 
			
		||||
				factoryId: [
 | 
			
		||||
					{ required: true, message: '工厂不能为空', trigger: 'change' },
 | 
			
		||||
				],
 | 
			
		||||
				tvalue: [
 | 
			
		||||
					{
 | 
			
		||||
						type: 'number',
 | 
			
		||||
						message: '请输入正确的数字',
 | 
			
		||||
						trigger: 'change',
 | 
			
		||||
						transform: (val) => Number(val),
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			},
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
	},
 | 
			
		||||
	methods: {},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped>
 | 
			
		||||
.dialog-inner__form >>> .el-select {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -29,7 +29,7 @@
 | 
			
		||||
			@cancel="handleCancel"
 | 
			
		||||
			@confirm="handleConfirm"
 | 
			
		||||
			:before-close="handleCancel"
 | 
			
		||||
			width="70%">
 | 
			
		||||
			width="50%">
 | 
			
		||||
			<add-or-update
 | 
			
		||||
				ref="addOrUpdate"
 | 
			
		||||
				@refreshDataList="successSubmit"></add-or-update>
 | 
			
		||||
@@ -52,45 +52,37 @@ import {
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'code',
 | 
			
		||||
		label: '产线编码',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产线编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'name',
 | 
			
		||||
		label: '产线名称',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产线名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'factoryName',
 | 
			
		||||
		label: '工厂',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '工厂'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'externalCode',
 | 
			
		||||
		label: '额外编码',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '额外编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'status',
 | 
			
		||||
		label: '当前状态',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: codeFilter('lineStatus'),
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'description',
 | 
			
		||||
		label: '描述',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '描述'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'remark',
 | 
			
		||||
		label: '备注',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '备注'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '创建时间',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
		filter: parseTime
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
@@ -132,14 +124,14 @@ export default {
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '重置',
 | 
			
		||||
					name: 'reset',
 | 
			
		||||
				},
 | 
			
		||||
				// {
 | 
			
		||||
				// 	type: 'separate',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	type: 'button',
 | 
			
		||||
				// 	btnName: '重置',
 | 
			
		||||
				// 	name: 'reset',
 | 
			
		||||
				// },
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
@@ -173,7 +165,7 @@ export default {
 | 
			
		||||
		getDataList() {
 | 
			
		||||
			this.dataListLoading = true;
 | 
			
		||||
			this.urlOptions.getDataListURL(this.listQuery).then((response) => {
 | 
			
		||||
				this.total = response.data.total;
 | 
			
		||||
				this.listQuery.total = response.data.total;
 | 
			
		||||
				this.getStatus(response.data.list);
 | 
			
		||||
				this.dataListLoading = false;
 | 
			
		||||
			});
 | 
			
		||||
@@ -195,7 +187,7 @@ export default {
 | 
			
		||||
			switch (val.btnName) {
 | 
			
		||||
				case 'search':
 | 
			
		||||
					this.listQuery.pageNo = 1;
 | 
			
		||||
					this.listQuery.pageSize = 10;.7
 | 
			
		||||
					this.listQuery.pageSize = 10;
 | 
			
		||||
					this.listQuery.name = val.name;
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 13:52:10
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-09-21 10:48:54
 | 
			
		||||
 * @LastEditTime: 2023-10-16 13:40:00
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -12,33 +12,45 @@
 | 
			
		||||
		ref="dataForm"
 | 
			
		||||
		@keyup.enter.native="dataFormSubmit()"
 | 
			
		||||
		label-width="90px">
 | 
			
		||||
		<el-form-item label="工段编码" prop="code">
 | 
			
		||||
			<el-input
 | 
			
		||||
				v-model="dataForm.code"
 | 
			
		||||
				clearable
 | 
			
		||||
				placeholder="请输入工段编码" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-form-item label="工段名称" prop="name">
 | 
			
		||||
			<el-input
 | 
			
		||||
				v-model="dataForm.name"
 | 
			
		||||
				clearable
 | 
			
		||||
				placeholder="请输入工段名称" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
    <el-form-item prop="productionLineId" label="产线">
 | 
			
		||||
      <el-select
 | 
			
		||||
      v-model="dataForm.productionLineId" filterable clearable placeholder="请选择产线">
 | 
			
		||||
        <el-option
 | 
			
		||||
          v-for="item in urlOptions.optionArr.arr0"
 | 
			
		||||
          :key="item.id"
 | 
			
		||||
          :label="item.name"
 | 
			
		||||
          :value="item.id"
 | 
			
		||||
        >
 | 
			
		||||
        </el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
		<el-form-item label="排序" prop="sort">
 | 
			
		||||
			<el-input-number v-model="dataForm.sort" :min="1" :max="100" clearable placeholder="请输入排序" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="工段编码" prop="code">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.code"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入工段编码" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="工段名称" prop="name">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.name"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请输入工段名称" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item prop="productionLineId" label="产线">
 | 
			
		||||
					<el-select
 | 
			
		||||
					v-model="dataForm.productionLineId" filterable clearable placeholder="请选择产线">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="item in urlOptions.optionArr.arr0"
 | 
			
		||||
							:key="item.id"
 | 
			
		||||
							:label="item.name"
 | 
			
		||||
							:value="item.id"
 | 
			
		||||
						>
 | 
			
		||||
						</el-option>
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="排序" prop="sort">
 | 
			
		||||
					<el-input-number v-model="dataForm.sort" :min="1" :max="100" clearable placeholder="请输入排序" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-form-item label="备注" prop="remark">
 | 
			
		||||
			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
 
 | 
			
		||||
@@ -29,7 +29,7 @@
 | 
			
		||||
			@cancel="handleCancel"
 | 
			
		||||
			@confirm="handleConfirm"
 | 
			
		||||
			:before-close="handleCancel"
 | 
			
		||||
			width="70%">
 | 
			
		||||
			width="50%">
 | 
			
		||||
			<add-or-update
 | 
			
		||||
				ref="addOrUpdate"
 | 
			
		||||
				@refreshDataList="successSubmit"></add-or-update>
 | 
			
		||||
@@ -50,34 +50,28 @@ import {
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'code',
 | 
			
		||||
		label: '工段编码',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '工段编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'name',
 | 
			
		||||
		label: '工段名称',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '工段名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'productionLineName',
 | 
			
		||||
		label: '产线',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产线'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'sort',
 | 
			
		||||
		label: '排序',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '排序'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'remark',
 | 
			
		||||
		label: '备注',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '备注'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '创建时间',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
		filter: parseTime
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
@@ -119,14 +113,14 @@ export default {
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '重置',
 | 
			
		||||
					name: 'reset',
 | 
			
		||||
				},
 | 
			
		||||
				// {
 | 
			
		||||
				// 	type: 'separate',
 | 
			
		||||
				// },
 | 
			
		||||
				// {
 | 
			
		||||
				// 	type: 'button',
 | 
			
		||||
				// 	btnName: '重置',
 | 
			
		||||
				// 	name: 'reset',
 | 
			
		||||
				// },
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
 
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-08-29 14:59:29
 | 
			
		||||
 * @LastEditTime: 2023-10-09 09:08:08
 | 
			
		||||
 * @LastEditTime: 2023-10-16 15:10:42
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
-->
 | 
			
		||||
@@ -12,6 +12,7 @@
 | 
			
		||||
			ref="searchBarForm"
 | 
			
		||||
			@headBtnClick="buttonClick" />
 | 
			
		||||
		<base-table
 | 
			
		||||
			v-if="showData.length"
 | 
			
		||||
			class="right-aside"
 | 
			
		||||
			v-loading="dataListLoading"
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
@@ -22,6 +23,7 @@
 | 
			
		||||
			@selection-change="selectChange"
 | 
			
		||||
			>
 | 
			
		||||
		</base-table>
 | 
			
		||||
		<div v-else class="no-data-bg"></div>
 | 
			
		||||
		<pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
@@ -117,6 +119,7 @@ export default {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        total: 1,
 | 
			
		||||
      },
 | 
			
		||||
			fileName: '',
 | 
			
		||||
      exportLoading: false,
 | 
			
		||||
      dataListLoading: false,
 | 
			
		||||
			dialogVisible: false,
 | 
			
		||||
@@ -194,7 +197,8 @@ export default {
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					color: 'warning',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
					plain: true
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
@@ -207,6 +211,7 @@ export default {
 | 
			
		||||
		test() {
 | 
			
		||||
			var target = document.getElementsByClassName("right-aside")[0]
 | 
			
		||||
			target.style.background = '#FFFFFF'
 | 
			
		||||
			var that = this
 | 
			
		||||
			setTimeout(() => {
 | 
			
		||||
				html2canvas(target).then(function(canvas) {
 | 
			
		||||
						var contentWidth = canvas.width
 | 
			
		||||
@@ -242,7 +247,7 @@ export default {
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
 | 
			
		||||
						pdf.save('产线统计自动报表.pdf')
 | 
			
		||||
						pdf.save(that.fileName + '产线产量.pdf')
 | 
			
		||||
				})
 | 
			
		||||
			}, 300)
 | 
			
		||||
		},
 | 
			
		||||
@@ -285,7 +290,7 @@ export default {
 | 
			
		||||
      try {
 | 
			
		||||
        FileSaver.saveAs(new Blob([exportTableOut], {
 | 
			
		||||
          type: 'application/octet-stream'
 | 
			
		||||
        }), '产线统计自动报表.xlsx')
 | 
			
		||||
        }), this.fileName + '产线产量.xlsx')
 | 
			
		||||
      } catch (e) {
 | 
			
		||||
        if (typeof console !== 'undefined') console.log(e, exportTableOut)
 | 
			
		||||
      }
 | 
			
		||||
@@ -310,6 +315,9 @@ export default {
 | 
			
		||||
					this.listQuery.reportType = val.reportType ? val.reportType : undefined;
 | 
			
		||||
					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined;
 | 
			
		||||
					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined;
 | 
			
		||||
					if (val.timeVal && val.timeVal.length > 0) {
 | 
			
		||||
						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_'
 | 
			
		||||
          }
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'export':
 | 
			
		||||
@@ -327,7 +335,7 @@ export default {
 | 
			
		||||
					item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月'
 | 
			
		||||
					return item
 | 
			
		||||
				});
 | 
			
		||||
        this.total = response.data.total;
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
				this.showData = this.tableData
 | 
			
		||||
      });
 | 
			
		||||
 
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-08-29 14:59:29
 | 
			
		||||
 * @LastEditTime: 2023-10-09 15:14:42
 | 
			
		||||
 * @LastEditTime: 2023-10-16 15:18:23
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
-->
 | 
			
		||||
@@ -12,6 +12,7 @@
 | 
			
		||||
			ref="searchBarForm"
 | 
			
		||||
			@headBtnClick="buttonClick" />
 | 
			
		||||
		<base-table
 | 
			
		||||
			v-if="showData.length"
 | 
			
		||||
			class="right-aside"
 | 
			
		||||
			v-loading="dataListLoading"
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
@@ -29,6 +30,7 @@
 | 
			
		||||
				:method-list="tableBtn"
 | 
			
		||||
				@clickBtn="handleClick" />
 | 
			
		||||
		</base-table>
 | 
			
		||||
		<div v-else class="no-data-bg"></div>
 | 
			
		||||
		<pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
@@ -110,7 +112,7 @@ export default {
 | 
			
		||||
			showData: [],
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			selectedList: [],
 | 
			
		||||
			fileName: [],
 | 
			
		||||
			fileName: '',
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'select',
 | 
			
		||||
@@ -145,7 +147,8 @@ export default {
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					color: 'warning',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
					plain: true
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
@@ -156,7 +159,7 @@ export default {
 | 
			
		||||
		}
 | 
			
		||||
		// const time = new Date()
 | 
			
		||||
		// this.formConfig[1].defaultSelect = [time, time]
 | 
			
		||||
		// this.getDataList()
 | 
			
		||||
		this.getDataList()
 | 
			
		||||
		this.getPdLineList()
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
@@ -199,7 +202,7 @@ export default {
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
 | 
			
		||||
						pdf.save(that.fileName[0] + '-' + that.fileName[1] + '_产线产量.pdf')
 | 
			
		||||
						pdf.save(that.fileName + '产线产量.pdf')
 | 
			
		||||
				})
 | 
			
		||||
			}, 300)
 | 
			
		||||
		},
 | 
			
		||||
@@ -222,7 +225,7 @@ export default {
 | 
			
		||||
      try {
 | 
			
		||||
        FileSaver.saveAs(new Blob([exportTableOut], {
 | 
			
		||||
          type: 'application/octet-stream'
 | 
			
		||||
        }), this.fileName[0] + '-' + this.fileName[1] + '_产线产量.xlsx')
 | 
			
		||||
        }), this.fileName + '产线产量.xlsx')
 | 
			
		||||
      } catch (e) {
 | 
			
		||||
        if (typeof console !== 'undefined') console.log(e, exportTableOut)
 | 
			
		||||
      }
 | 
			
		||||
@@ -265,17 +268,10 @@ export default {
 | 
			
		||||
					this.listQuery.proLineId = val.line ? val.line : undefined;
 | 
			
		||||
					this.listQuery.startTime = val.timeVal ? new Date(val.timeVal[0]).getTime() : undefined;
 | 
			
		||||
					this.listQuery.endTime = val.timeVal ? new Date(val.timeVal[1]).getTime() : undefined;
 | 
			
		||||
					console.log('nihc 你好', val.timeVal)
 | 
			
		||||
					if (val.timeVal && val.timeVal.length > 0) {
 | 
			
		||||
						this.fileName[0] = val.timeVal[0].slice(0, 10)
 | 
			
		||||
						this.fileName[1] = val.timeVal[1].slice(0, 10)
 | 
			
		||||
            this.getDataList();
 | 
			
		||||
          } else {
 | 
			
		||||
            this.$message({
 | 
			
		||||
              message: '请选择时间',
 | 
			
		||||
              type: 'warning'
 | 
			
		||||
            });
 | 
			
		||||
						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_'
 | 
			
		||||
          }
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'export':
 | 
			
		||||
					this.handleExport();
 | 
			
		||||
@@ -289,7 +285,7 @@ export default {
 | 
			
		||||
      this.dataListLoading = true;
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
 | 
			
		||||
        this.tableData = response.data;
 | 
			
		||||
        this.total = response.data.total;
 | 
			
		||||
        this.listQuery.total = response.data.length;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
				this.showData = this.tableData
 | 
			
		||||
      });
 | 
			
		||||
 
 | 
			
		||||
@@ -11,13 +11,14 @@
 | 
			
		||||
			ref="search-bar" />
 | 
			
		||||
		<el-skeleton v-if="initing" :rows="6" animated />
 | 
			
		||||
		<!-- :span-method="mergeColumnHandler" -->
 | 
			
		||||
		<div v-else :class="{ 'no-data-bg': !tableData || tableData.length == 0 }">
 | 
			
		||||
		<base-table
 | 
			
		||||
			v-else
 | 
			
		||||
		v-if="tableData && tableData.length > 0"
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
			:table-data="tableData"
 | 
			
		||||
			@emitFun="handleEmitFun"></base-table>
 | 
			
		||||
		<!-- :page="queryParams.pageNo"
 | 
			
		||||
			:limit="queryParams.pageSize" -->
 | 
			
		||||
			@emitFun="handleEmitFun"
 | 
			
		||||
		/>
 | 
			
		||||
		</div>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
@@ -65,10 +66,10 @@ export default {
 | 
			
		||||
						label: times.slice(0, 10) + ' ' + times.slice(11),
 | 
			
		||||
						align: 'center',
 | 
			
		||||
						children: [
 | 
			
		||||
							{ prop: times + '_in', label: '投入数量', align: 'center' },
 | 
			
		||||
							{ prop: times + '_out', label: '产出数量', align: 'center' },
 | 
			
		||||
							{ prop: times + '_junk', label: '报废数量', align: 'center' },
 | 
			
		||||
							{ prop: times + '_area', label: '产出面积', align: 'center' }
 | 
			
		||||
							{ prop: times + '_in', label: '投入数量' },
 | 
			
		||||
							{ prop: times + '_out', label: '产出数量' },
 | 
			
		||||
							{ prop: times + '_junk', label: '报废数量' },
 | 
			
		||||
							{ prop: times + '_area', label: '产出面积' }
 | 
			
		||||
						]
 | 
			
		||||
					}
 | 
			
		||||
					this.arr.push(subprop)
 | 
			
		||||
@@ -149,14 +150,14 @@ export default {
 | 
			
		||||
          {
 | 
			
		||||
            prop: 'proLineName',
 | 
			
		||||
            label: '生产线',
 | 
			
		||||
            align: 'center',
 | 
			
		||||
						fixed: 'left'
 | 
			
		||||
						fixed: 'left',
 | 
			
		||||
						showOverflowTooltip: true
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
            prop: 'spec',
 | 
			
		||||
            label: '产品规格',
 | 
			
		||||
            align: 'center',
 | 
			
		||||
						fixed: 'left'
 | 
			
		||||
						fixed: 'left',
 | 
			
		||||
						showOverflowTooltip: true
 | 
			
		||||
          }
 | 
			
		||||
				]
 | 
			
		||||
				this.buildProps(res.data.nameData);
 | 
			
		||||
 
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-08-29 14:59:29
 | 
			
		||||
 * @LastEditTime: 2023-10-08 10:51:49
 | 
			
		||||
 * @LastEditTime: 2023-10-16 15:19:04
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
-->
 | 
			
		||||
@@ -13,6 +13,7 @@
 | 
			
		||||
			ref="searchBarForm"
 | 
			
		||||
			@headBtnClick="buttonClick" />
 | 
			
		||||
		<base-table
 | 
			
		||||
			v-if="showData.length"
 | 
			
		||||
			class="right-aside"
 | 
			
		||||
			v-loading="dataListLoading"
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
@@ -30,6 +31,7 @@
 | 
			
		||||
				:method-list="tableBtn"
 | 
			
		||||
				@clickBtn="handleClick" />
 | 
			
		||||
		</base-table>
 | 
			
		||||
		<div v-else class="no-data-bg"></div>
 | 
			
		||||
		<pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
@@ -129,6 +131,7 @@ export default {
 | 
			
		||||
			tableBtn: [],
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			showData: [],
 | 
			
		||||
			fileName: '',
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'select',
 | 
			
		||||
@@ -187,7 +190,8 @@ export default {
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					color: 'warning',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
					plain: true
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
@@ -200,6 +204,7 @@ export default {
 | 
			
		||||
		test() {
 | 
			
		||||
			var target = document.getElementsByClassName("right-aside")[0]
 | 
			
		||||
			target.style.background = '#FFFFFF'
 | 
			
		||||
			var that = this
 | 
			
		||||
			setTimeout(() => {
 | 
			
		||||
				html2canvas(target).then(function(canvas) {
 | 
			
		||||
						var contentWidth = canvas.width
 | 
			
		||||
@@ -235,7 +240,7 @@ export default {
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
 | 
			
		||||
						pdf.save('工段统计自动报表.pdf')
 | 
			
		||||
						pdf.save(that.fileName + '工段统计.pdf')
 | 
			
		||||
				})
 | 
			
		||||
			}, 300)
 | 
			
		||||
		},
 | 
			
		||||
@@ -258,7 +263,7 @@ export default {
 | 
			
		||||
      try {
 | 
			
		||||
        FileSaver.saveAs(new Blob([exportTableOut], {
 | 
			
		||||
          type: 'application/octet-stream'
 | 
			
		||||
        }), '工段统计自动报表.xlsx')
 | 
			
		||||
        }), this.fileName + '工段统计.xlsx')
 | 
			
		||||
      } catch (e) {
 | 
			
		||||
        if (typeof console !== 'undefined') console.log(e, exportTableOut)
 | 
			
		||||
      }
 | 
			
		||||
@@ -307,6 +312,9 @@ export default {
 | 
			
		||||
					this.listQuery.reportType = val.reportType ? val.reportType : undefined;
 | 
			
		||||
					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined;
 | 
			
		||||
					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined;
 | 
			
		||||
					if (val.timeVal && val.timeVal.length > 0) {
 | 
			
		||||
						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_'
 | 
			
		||||
          }
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'export':
 | 
			
		||||
@@ -325,7 +333,7 @@ export default {
 | 
			
		||||
					return item
 | 
			
		||||
				});
 | 
			
		||||
				this.showData = this.tableData
 | 
			
		||||
        this.total = response.data.total;
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
 
 | 
			
		||||
@@ -3,15 +3,20 @@
 | 
			
		||||
		<search-bar
 | 
			
		||||
			:formConfigs="formConfig"
 | 
			
		||||
			ref="searchBarForm"
 | 
			
		||||
			@select-changed="handleSearchBarChanged"
 | 
			
		||||
			@headBtnClick="buttonClick" />
 | 
			
		||||
		<base-table
 | 
			
		||||
			v-if="showData.length"
 | 
			
		||||
			class="right-aside"
 | 
			
		||||
			v-loading="dataListLoading"
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
			:table-data="showData"
 | 
			
		||||
			:page="listQuery.pageNo"
 | 
			
		||||
			:limit="listQuery.pageSize"
 | 
			
		||||
			:selectWidth="55"
 | 
			
		||||
			:table-data="showData"
 | 
			
		||||
			@selection-change="selectChange"
 | 
			
		||||
		/>
 | 
			
		||||
		<div v-else class="no-data-bg"></div>
 | 
			
		||||
		<pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
@@ -45,38 +50,31 @@ import html2canvas from 'html2canvas'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
    prop: 'proLineName',
 | 
			
		||||
		label: '产线名称',
 | 
			
		||||
		align: 'center',
 | 
			
		||||
		label: '产线名称'
 | 
			
		||||
	},
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'sectionName',
 | 
			
		||||
    label: '工段名称',
 | 
			
		||||
    align: 'center',
 | 
			
		||||
    label: '工段名称'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'inputNum',
 | 
			
		||||
    label: '进片数量/片',
 | 
			
		||||
    align: 'center',
 | 
			
		||||
    label: '进片数量/片'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'outputNum',
 | 
			
		||||
    label: '出片数量/片',
 | 
			
		||||
    align: 'center',
 | 
			
		||||
    label: '出片数量/片'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'lossNum',
 | 
			
		||||
    label: '损耗数量/片',
 | 
			
		||||
    align: 'center',
 | 
			
		||||
    label: '损耗数量/片'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'lossArea',
 | 
			
		||||
    label: '损耗面积/m²',
 | 
			
		||||
    align: 'center',
 | 
			
		||||
    label: '损耗面积/m²'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'lossRate',
 | 
			
		||||
    label: '损耗比例/%',
 | 
			
		||||
    align: 'center',
 | 
			
		||||
    label: '损耗比例/%'
 | 
			
		||||
  }
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
@@ -110,6 +108,7 @@ export default {
 | 
			
		||||
          param: 'proLineId',
 | 
			
		||||
					defaultSelect: '',
 | 
			
		||||
					filterable: true,
 | 
			
		||||
					onchange: true,
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'select',
 | 
			
		||||
@@ -132,15 +131,20 @@ export default {
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '搜索',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
				},
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
					plain: true
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
@@ -151,9 +155,39 @@ export default {
 | 
			
		||||
    // this.getDataList()
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		/** 根据产线获取工段 */
 | 
			
		||||
		async getWorksectionById(lineId) {
 | 
			
		||||
			const { code, data } = await this.$axios({
 | 
			
		||||
				url: '/base/workshop-section/listByParentId',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
				params: {
 | 
			
		||||
					id: lineId,
 | 
			
		||||
				},
 | 
			
		||||
			});
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.formConfig[1].selectOptions = data.map((item) => {
 | 
			
		||||
					return {
 | 
			
		||||
						name: item.name,
 | 
			
		||||
						id: item.id,
 | 
			
		||||
					};
 | 
			
		||||
				});
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		handleSearchBarChanged({ param, value }) {
 | 
			
		||||
			if (!value) {
 | 
			
		||||
				this.formConfig[1].selectOptions = [];
 | 
			
		||||
				return;
 | 
			
		||||
			}
 | 
			
		||||
			switch (param) {
 | 
			
		||||
				case 'proLineId':
 | 
			
		||||
					this.getWorksectionById(value);
 | 
			
		||||
					break;
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		test() {
 | 
			
		||||
			var target = document.getElementsByClassName("right-aside")[0]
 | 
			
		||||
			target.style.background = '#FFFFFF'
 | 
			
		||||
			var that = this
 | 
			
		||||
			setTimeout(() => {
 | 
			
		||||
				html2canvas(target).then(function(canvas) {
 | 
			
		||||
						var contentWidth = canvas.width
 | 
			
		||||
@@ -189,7 +223,7 @@ export default {
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
 | 
			
		||||
						pdf.save('工段统计数据查询报表.pdf')
 | 
			
		||||
						pdf.save(that.fileName[0] + '-' + that.fileName[1] + '_工段统计.pdf')
 | 
			
		||||
				})
 | 
			
		||||
			}, 300)
 | 
			
		||||
		},
 | 
			
		||||
@@ -212,7 +246,7 @@ export default {
 | 
			
		||||
      try {
 | 
			
		||||
        FileSaver.saveAs(new Blob([exportTableOut], {
 | 
			
		||||
          type: 'application/octet-stream'
 | 
			
		||||
        }), '工段统计数据查询报表.xlsx')
 | 
			
		||||
        }), this.fileName[0] + '-' + this.fileName[1] + '_工段统计.xlsx')
 | 
			
		||||
      } catch (e) {
 | 
			
		||||
        if (typeof console !== 'undefined') console.log(e, exportTableOut)
 | 
			
		||||
      }
 | 
			
		||||
@@ -293,10 +327,9 @@ export default {
 | 
			
		||||
          this.listQuery.sectionId = val.sectionId ? val.sectionId : undefined
 | 
			
		||||
          this.listQuery.startTime = val.timeSlot ? new Date(val.timeSlot[0]).getTime() : undefined
 | 
			
		||||
          this.listQuery.endTime = val.timeSlot ? new Date(val.timeSlot[1]).getTime() : undefined
 | 
			
		||||
					this.fileName[0] = val.timeSlot[0]
 | 
			
		||||
					this.fileName[1] = val.timeSlot[1]
 | 
			
		||||
					console.log('wfjmmki文件名称', this.fileName)
 | 
			
		||||
					if (val.timeSlot) {
 | 
			
		||||
					if (val.timeSlot && val.timeSlot.length > 0) {
 | 
			
		||||
						this.fileName[0] = val.timeSlot[0].slice(0, 10)
 | 
			
		||||
						this.fileName[1] = val.timeSlot[1].slice(0, 10)
 | 
			
		||||
            this.getDataList()
 | 
			
		||||
          } else {
 | 
			
		||||
            this.$message({
 | 
			
		||||
@@ -315,7 +348,14 @@ export default {
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'export':
 | 
			
		||||
					this.handleExport();
 | 
			
		||||
					if (val.timeSlot && val.timeSlot.length > 0) {
 | 
			
		||||
						this.handleExport();
 | 
			
		||||
          } else {
 | 
			
		||||
            this.$message({
 | 
			
		||||
              message: '请选择时间',
 | 
			
		||||
              type: 'warning'
 | 
			
		||||
            });
 | 
			
		||||
          }
 | 
			
		||||
					break;
 | 
			
		||||
				default:
 | 
			
		||||
					console.log(val);
 | 
			
		||||
 
 | 
			
		||||
@@ -97,6 +97,22 @@ export default {
 | 
			
		||||
          trigger: 'axis',
 | 
			
		||||
          axisPointer: {
 | 
			
		||||
            type: 'shadow'
 | 
			
		||||
          },
 | 
			
		||||
          formatter: function(params) {
 | 
			
		||||
            return (
 | 
			
		||||
              params[0].axisValue + 
 | 
			
		||||
              `<br>` +
 | 
			
		||||
              params.map((item) => {
 | 
			
		||||
                let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>`
 | 
			
		||||
                let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>`
 | 
			
		||||
						let value = item.value ? item.value : '-'
 | 
			
		||||
						let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>`
 | 
			
		||||
						return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px">
 | 
			
		||||
									<span>${str}${seriesNameStr}</span>
 | 
			
		||||
									<span>${valueStr}</span>
 | 
			
		||||
								</span>`
 | 
			
		||||
              }).join(``)
 | 
			
		||||
            )
 | 
			
		||||
          }
 | 
			
		||||
        },
 | 
			
		||||
        grid: {
 | 
			
		||||
@@ -106,7 +122,11 @@ export default {
 | 
			
		||||
          containLabel: true
 | 
			
		||||
        },
 | 
			
		||||
        legend: {
 | 
			
		||||
          data: legendData
 | 
			
		||||
          data: legendData,
 | 
			
		||||
          right: '1%',
 | 
			
		||||
          icon: 'rect',
 | 
			
		||||
          itemHeight: 8,
 | 
			
		||||
          itemWidth: 8
 | 
			
		||||
        },
 | 
			
		||||
        xAxis: {
 | 
			
		||||
          type: 'category',
 | 
			
		||||
 
 | 
			
		||||
@@ -103,7 +103,8 @@ export default {
 | 
			
		||||
          containLabel: true
 | 
			
		||||
        },
 | 
			
		||||
        legend: {
 | 
			
		||||
          data: legendData
 | 
			
		||||
          data: legendData,
 | 
			
		||||
          right: '1%'
 | 
			
		||||
        },
 | 
			
		||||
        xAxis: {
 | 
			
		||||
          type: 'category',
 | 
			
		||||
 
 | 
			
		||||
@@ -425,7 +425,7 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
/* 时间整点 */
 | 
			
		||||
.noneMinute .el-time-spinner__wrapper {
 | 
			
		||||
  width: 100%;
 | 
			
		||||
@@ -433,6 +433,16 @@ export default {
 | 
			
		||||
.noneMinute .el-scrollbar:nth-of-type(2) {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
  .el-date-editor .el-range__icon {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
  .el-input__prefix .el-icon-date {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
@@ -446,8 +456,6 @@ export default {
 | 
			
		||||
    margin-top: 12px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style scoped>
 | 
			
		||||
.searchBarBox .foldClass {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  top: 14px;
 | 
			
		||||
 
 | 
			
		||||
@@ -15,7 +15,7 @@ export default {
 | 
			
		||||
    return {
 | 
			
		||||
      chartDom: '',
 | 
			
		||||
      chart: '',
 | 
			
		||||
      chartHeight: this.tableHeight(350)
 | 
			
		||||
      chartHeight: this.tableHeight(370)
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  props: {
 | 
			
		||||
@@ -34,7 +34,7 @@ export default {
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.chartHeight = this.tableHeight(350)
 | 
			
		||||
      this.chartHeight = this.tableHeight(370)
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
@@ -86,17 +86,35 @@ export default {
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
      var option = {
 | 
			
		||||
        // title: {
 | 
			
		||||
        //   text: 'World Population'
 | 
			
		||||
        // },
 | 
			
		||||
        color:['#288AFF','#8EF0AB'],
 | 
			
		||||
        tooltip: {
 | 
			
		||||
          trigger: 'axis',
 | 
			
		||||
          axisPointer: {
 | 
			
		||||
            type: 'shadow'
 | 
			
		||||
          },
 | 
			
		||||
          formatter: function(params) {
 | 
			
		||||
            return (
 | 
			
		||||
              params[0].axisValue + 
 | 
			
		||||
              `<br>` +
 | 
			
		||||
              params.map((item) => {
 | 
			
		||||
                let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>`
 | 
			
		||||
                let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>`
 | 
			
		||||
						let value = item.value ? item.value : '-'
 | 
			
		||||
						let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>`
 | 
			
		||||
						return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px">
 | 
			
		||||
									<span>${str}${seriesNameStr}</span>
 | 
			
		||||
									<span>${valueStr}</span>
 | 
			
		||||
								</span>`
 | 
			
		||||
              }).join(``)
 | 
			
		||||
            )
 | 
			
		||||
          }
 | 
			
		||||
        },
 | 
			
		||||
        legend: {},
 | 
			
		||||
        legend: {
 | 
			
		||||
          right: '1%',
 | 
			
		||||
          icon: 'rect',
 | 
			
		||||
          itemHeight: 8,
 | 
			
		||||
          itemWidth: 8
 | 
			
		||||
        },
 | 
			
		||||
        grid: {
 | 
			
		||||
          left: '1%',
 | 
			
		||||
          right: '1%',
 | 
			
		||||
 
 | 
			
		||||
@@ -194,13 +194,23 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
/* 级联选择器 */
 | 
			
		||||
.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
  .el-date-editor .el-range__icon {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
  .el-input__prefix .el-icon-date {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style scoped>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.separateStyle {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 1px;
 | 
			
		||||
@@ -208,8 +218,6 @@ export default {
 | 
			
		||||
  background: #E8E8E8;
 | 
			
		||||
  vertical-align: middle;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
  .blue-block {
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
 
 | 
			
		||||
@@ -9,7 +9,8 @@
 | 
			
		||||
        :table-data="list"
 | 
			
		||||
        class="qoq-out-table"
 | 
			
		||||
      />
 | 
			
		||||
      <div style='width: 100%;height: 300px;padding-top: 30px;'>
 | 
			
		||||
      <div class="chartTitle">环比分析图</div>
 | 
			
		||||
      <div style='width: 100%'>
 | 
			
		||||
        <line-chart ref="analysisLineChart" :chartData="chartData"/>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
@@ -112,3 +113,20 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang='scss' scoped>
 | 
			
		||||
.chartTitle {
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  color: #000;
 | 
			
		||||
  margin-top: 20px;
 | 
			
		||||
}
 | 
			
		||||
.chartTitle::before {
 | 
			
		||||
  content: '';
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 4px;
 | 
			
		||||
  height: 18px;
 | 
			
		||||
  background-color: #0B58FF;
 | 
			
		||||
  border-radius: 1px;
 | 
			
		||||
  margin-right: 8px;
 | 
			
		||||
  vertical-align: bottom;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -68,12 +68,6 @@ export default {
 | 
			
		||||
      }
 | 
			
		||||
      var option = {
 | 
			
		||||
        color:['#288AFF'],
 | 
			
		||||
        tooltip: {
 | 
			
		||||
          trigger: 'axis',
 | 
			
		||||
          axisPointer: {
 | 
			
		||||
            type: 'shadow'
 | 
			
		||||
          }
 | 
			
		||||
        },
 | 
			
		||||
        grid: {
 | 
			
		||||
          left: '4%',
 | 
			
		||||
          right: '1%',
 | 
			
		||||
 
 | 
			
		||||
@@ -70,9 +70,9 @@ export default {
 | 
			
		||||
 | 
			
		||||
      var option = {
 | 
			
		||||
        color:['#288AFF'],
 | 
			
		||||
        tooltip: {
 | 
			
		||||
          trigger: 'axis'
 | 
			
		||||
        },
 | 
			
		||||
        // tooltip: {
 | 
			
		||||
        //   trigger: 'axis'
 | 
			
		||||
        // },
 | 
			
		||||
        grid: {
 | 
			
		||||
          left: '4%',
 | 
			
		||||
          right: '1%',
 | 
			
		||||
 
 | 
			
		||||
@@ -385,7 +385,7 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
/* 级联选择器 */
 | 
			
		||||
.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
 | 
			
		||||
  display: none;
 | 
			
		||||
@@ -397,6 +397,16 @@ export default {
 | 
			
		||||
.noneMinute .el-scrollbar:nth-of-type(2) {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
  .el-date-editor .el-range__icon {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
  .el-input__prefix .el-icon-date {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
@@ -410,8 +420,6 @@ export default {
 | 
			
		||||
    margin-top: 12px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style scoped>
 | 
			
		||||
.searchBarBox .foldClass {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  top: 14px;
 | 
			
		||||
 
 | 
			
		||||
@@ -77,7 +77,8 @@ export default {
 | 
			
		||||
      var option = {
 | 
			
		||||
        color:['#FFDC94','#8EF0AB','#63BDFF','#288AFF','#7164FF','#FF6860','#FF9747','#B0EB42','#D680FF','#0043D2'],
 | 
			
		||||
        legend: {
 | 
			
		||||
          data: keys
 | 
			
		||||
          data: keys,
 | 
			
		||||
          right:'1%'
 | 
			
		||||
        },
 | 
			
		||||
        tooltip: {
 | 
			
		||||
          trigger: 'axis'
 | 
			
		||||
 
 | 
			
		||||
@@ -125,7 +125,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')
 | 
			
		||||
@@ -143,19 +167,20 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
/* 级联选择器 */
 | 
			
		||||
.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style scoped>
 | 
			
		||||
.separateStyle {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 1px;
 | 
			
		||||
  height: 24px;
 | 
			
		||||
  background: #E8E8E8;
 | 
			
		||||
  vertical-align: middle;
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
  .el-date-editor .el-range__icon {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
  .el-input__prefix .el-icon-date {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
@@ -170,4 +195,11 @@ export default {
 | 
			
		||||
    margin-top: 10px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
.separateStyle {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 1px;
 | 
			
		||||
  height: 24px;
 | 
			
		||||
  background: #E8E8E8;
 | 
			
		||||
  vertical-align: middle;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -3,6 +3,7 @@
 | 
			
		||||
    <!-- 搜索工作栏 -->
 | 
			
		||||
    <search-area @submit="getList" @exportD="exportData"/>
 | 
			
		||||
    <div v-show='chartData.length'>
 | 
			
		||||
      <div class="chartTitle">同比分析图</div>
 | 
			
		||||
      <div style='width: 100%;height: 400px;'>
 | 
			
		||||
        <line-chart ref="analysisLineChart" :chartData="chartData"/>
 | 
			
		||||
      </div>
 | 
			
		||||
@@ -33,12 +34,12 @@ export default {
 | 
			
		||||
      chartData: [],
 | 
			
		||||
      tableProps: [],
 | 
			
		||||
      list: [],
 | 
			
		||||
      tableH: this.tableHeight(600)
 | 
			
		||||
      tableH: this.tableHeight(640)
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(600)
 | 
			
		||||
      this.tableH = this.tableHeight(640)
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
@@ -99,9 +100,10 @@ export default {
 | 
			
		||||
      }
 | 
			
		||||
      this.chartData = this.list
 | 
			
		||||
    },
 | 
			
		||||
    exportData() {
 | 
			
		||||
    exportData(val) {
 | 
			
		||||
      if (this.list.length > 0) {
 | 
			
		||||
        var wb = XLSX.utils.table_to_book(document.querySelector(".yoy-out-table"))
 | 
			
		||||
        let fileName = val.name + "同比分析.xlsx"
 | 
			
		||||
        var wbout = XLSX.write(wb, {
 | 
			
		||||
            bookType: "xlsx",
 | 
			
		||||
            bookSST: true,
 | 
			
		||||
@@ -110,7 +112,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);
 | 
			
		||||
@@ -123,3 +125,19 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang='scss' scoped>
 | 
			
		||||
.chartTitle {
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  color: #000;
 | 
			
		||||
}
 | 
			
		||||
.chartTitle::before {
 | 
			
		||||
  content: '';
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 4px;
 | 
			
		||||
  height: 18px;
 | 
			
		||||
  background-color: #0B58FF;
 | 
			
		||||
  border-radius: 1px;
 | 
			
		||||
  margin-right: 8px;
 | 
			
		||||
  vertical-align: bottom;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -130,7 +130,7 @@ export default {
 | 
			
		||||
      this.plcTableName = data.plcTableName
 | 
			
		||||
      this.objName = data.objName
 | 
			
		||||
      this.getList()
 | 
			
		||||
      if (title === 'view') {
 | 
			
		||||
      if (title === 'detail') {
 | 
			
		||||
        this.showBtn = false
 | 
			
		||||
        this.tableBtn = []
 | 
			
		||||
      } else {
 | 
			
		||||
 
 | 
			
		||||
@@ -113,22 +113,22 @@ export default {
 | 
			
		||||
      ],
 | 
			
		||||
      tableProps,
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
        this.$auth.hasPermi('base:energy-plc-connect:bind')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'connect',
 | 
			
		||||
              btnName: '绑定'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        {
 | 
			
		||||
          type: 'detail',
 | 
			
		||||
          btnName: '详情'
 | 
			
		||||
        },
 | 
			
		||||
        this.$auth.hasPermi('base:energy-plc-connect:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'edit',
 | 
			
		||||
              btnName: '编辑'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        {
 | 
			
		||||
          type: 'view',
 | 
			
		||||
          btnName: '查看'
 | 
			
		||||
        },
 | 
			
		||||
        this.$auth.hasPermi('base:energy-plc-connect:bind')
 | 
			
		||||
        ? {
 | 
			
		||||
            type: 'connect',
 | 
			
		||||
            btnName: '绑定'
 | 
			
		||||
          }
 | 
			
		||||
        : undefined,
 | 
			
		||||
        this.$auth.hasPermi('base:energy-plc-connect:delete')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'delete',
 | 
			
		||||
@@ -205,10 +205,10 @@ export default {
 | 
			
		||||
        case 'delete':
 | 
			
		||||
          this.handleDelete(val.data)
 | 
			
		||||
          break
 | 
			
		||||
        case 'view':
 | 
			
		||||
        case 'detail':
 | 
			
		||||
          this.paramVisible = true
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.plcParam.init(val.data, 'view')
 | 
			
		||||
            this.$refs.plcParam.init(val.data, 'detail')
 | 
			
		||||
          })
 | 
			
		||||
          break
 | 
			
		||||
        default:
 | 
			
		||||
 
 | 
			
		||||
@@ -1,54 +1,72 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-form ref="form" :rules="rules" label-width="110px" :model="form">
 | 
			
		||||
    <el-form-item label="监控对象" prop="objectId">
 | 
			
		||||
      <el-cascader
 | 
			
		||||
        style='width: 100%;'
 | 
			
		||||
        v-model="objIds"
 | 
			
		||||
        :options="objList"
 | 
			
		||||
        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
 | 
			
		||||
        popper-class="cascaderParent"
 | 
			
		||||
        @change="selectObj"
 | 
			
		||||
        clearable></el-cascader>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="能源类型" prop="energyTypeId">
 | 
			
		||||
      <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;" @change="toggleType">
 | 
			
		||||
        <el-option
 | 
			
		||||
          v-for="item in this.energyTypeList"
 | 
			
		||||
          :key="item.id"
 | 
			
		||||
          :label="item.name"
 | 
			
		||||
          :value="item.id">
 | 
			
		||||
        </el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="监控模式" prop="type">
 | 
			
		||||
      <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange">
 | 
			
		||||
        <el-option label="合并" :value= "1" ></el-option>
 | 
			
		||||
        <el-option label="详细" :value= "2" ></el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <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"
 | 
			
		||||
          :key="item.id"
 | 
			
		||||
          :label="item.name"
 | 
			
		||||
          :value="item.id">
 | 
			
		||||
        </el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="指标类型" prop="limitType">
 | 
			
		||||
      <el-select v-model="form.limitType" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
        <el-option
 | 
			
		||||
          v-for="item in getDictDatas(DICT_TYPE.MONITOR_INDEX_TYPE)"
 | 
			
		||||
          :key="item.value"
 | 
			
		||||
          :label="item.label"
 | 
			
		||||
          :value="item.value">
 | 
			
		||||
        </el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="消耗量阈值" prop="limitValue">
 | 
			
		||||
      <el-input-number v-model="form.limitValue" :min="0" :max="10000000000000000" style="width: 100%;"></el-input-number>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="监控对象" prop="objectId">
 | 
			
		||||
          <el-cascader
 | 
			
		||||
            style='width: 100%;'
 | 
			
		||||
            v-model="objIds"
 | 
			
		||||
            :options="objList"
 | 
			
		||||
            :props="{ checkStrictly: true, value: 'id', label: 'name' }"
 | 
			
		||||
            popper-class="cascaderParent"
 | 
			
		||||
            @change="selectObj"
 | 
			
		||||
            clearable></el-cascader>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="能源类型" prop="energyTypeId">
 | 
			
		||||
          <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;" @change="toggleType">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in this.energyTypeList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
              :label="item.name"
 | 
			
		||||
              :value="item.id">
 | 
			
		||||
            </el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="监控模式" prop="type">
 | 
			
		||||
          <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange">
 | 
			
		||||
            <el-option label="合并" :value= "1" ></el-option>
 | 
			
		||||
            <el-option label="详细" :value= "2" ></el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <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"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
              :label="item.name"
 | 
			
		||||
              :value="item.id">
 | 
			
		||||
            </el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="指标类型" prop="limitType">
 | 
			
		||||
          <el-select v-model="form.limitType" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in getDictDatas(DICT_TYPE.MONITOR_INDEX_TYPE)"
 | 
			
		||||
              :key="item.value"
 | 
			
		||||
              :label="item.label"
 | 
			
		||||
              :value="item.value">
 | 
			
		||||
            </el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="消耗量阈值" prop="limitValue">
 | 
			
		||||
          <el-input-number v-model="form.limitValue" :min="0" :max="10000000000000000" style="width: 100%;"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
  </el-form>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
 
 | 
			
		||||
@@ -124,7 +124,7 @@ export default {
 | 
			
		||||
      this.energyType = data.energyType
 | 
			
		||||
      this.energyTypeId = data.energyTypeId
 | 
			
		||||
      this.getList()
 | 
			
		||||
      if (title === 'view') {
 | 
			
		||||
      if (title === 'detail') {
 | 
			
		||||
        this.showBtn = false
 | 
			
		||||
        this.tableBtn = []
 | 
			
		||||
      } else {
 | 
			
		||||
 
 | 
			
		||||
@@ -111,22 +111,22 @@ export default {
 | 
			
		||||
      ],
 | 
			
		||||
      tableProps,
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
        this.$auth.hasPermi('monitoring:energy-statistics:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'edit',
 | 
			
		||||
              btnName: '编辑'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        {
 | 
			
		||||
          type: 'view',
 | 
			
		||||
          btnName: '查看'
 | 
			
		||||
        },
 | 
			
		||||
        this.$auth.hasPermi('monitoring:energy-statistics:bind')
 | 
			
		||||
        ? {
 | 
			
		||||
            type: 'connect',
 | 
			
		||||
            btnName: '绑定'
 | 
			
		||||
          }
 | 
			
		||||
        : undefined,
 | 
			
		||||
        {
 | 
			
		||||
          type: 'detail',
 | 
			
		||||
          btnName: '详情'
 | 
			
		||||
        },
 | 
			
		||||
        this.$auth.hasPermi('monitoring:energy-statistics:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'edit',
 | 
			
		||||
              btnName: '编辑'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        this.$auth.hasPermi('monitoring:energy-statistics:delete')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'delete',
 | 
			
		||||
@@ -199,9 +199,9 @@ export default {
 | 
			
		||||
        case 'delete':
 | 
			
		||||
          this.handleDelete(val.data)
 | 
			
		||||
          break
 | 
			
		||||
        case 'view':
 | 
			
		||||
        case 'detail':
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.plcParam.init(val.data, 'view')
 | 
			
		||||
            this.$refs.plcParam.init(val.data, 'detail')
 | 
			
		||||
          })
 | 
			
		||||
          break
 | 
			
		||||
        default:
 | 
			
		||||
 
 | 
			
		||||
@@ -43,7 +43,7 @@ export default {
 | 
			
		||||
					eq.okQuantity,
 | 
			
		||||
					eq.nokQuantity,
 | 
			
		||||
					eq.totalQuantity,
 | 
			
		||||
					eq.passRate.toFixed(4),
 | 
			
		||||
					eq.passRate?.toFixed(4),
 | 
			
		||||
				]);
 | 
			
		||||
			});
 | 
			
		||||
			return {
 | 
			
		||||
 
 | 
			
		||||
@@ -29,7 +29,10 @@
 | 
			
		||||
							@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
 | 
			
		||||
							v-if="activeName == 'graph'"
 | 
			
		||||
							class="graph"
 | 
			
		||||
							style="height: 40vh; display: flex; flex-direction: column">
 | 
			
		||||
							<div class="blue-title">各设备加工数量</div>
 | 
			
		||||
							<LineChart v-if="list && list.length" :list="list" />
 | 
			
		||||
							<div v-else class="no-data-bg"></div>
 | 
			
		||||
@@ -87,6 +90,7 @@ export default {
 | 
			
		||||
					rangeSeparator: '-',
 | 
			
		||||
					startPlaceholder: '开始日期',
 | 
			
		||||
					endPlaceholder: '结束日期',
 | 
			
		||||
					defaultTime: ['00:00:00', '23:59:59'],
 | 
			
		||||
					param: 'recordTime',
 | 
			
		||||
					defaultSelect: [
 | 
			
		||||
						new Date(y, m, d)
 | 
			
		||||
@@ -246,7 +250,9 @@ export default {
 | 
			
		||||
	created() {
 | 
			
		||||
		this.fillLineOptions();
 | 
			
		||||
		this.fillProductOptions();
 | 
			
		||||
		this.getList();
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.$refs['search-bar'].headBtnClick('search');
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleTabClick(tab, event) {
 | 
			
		||||
@@ -307,12 +313,16 @@ export default {
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleSearchBarBtnClick(btn) {
 | 
			
		||||
			console.log('handleSearchBarBtnClick', btn);
 | 
			
		||||
			// debugger;
 | 
			
		||||
			switch (btn.btnName) {
 | 
			
		||||
				case 'search':
 | 
			
		||||
					this.queryParams.lineId = btn.lineId;
 | 
			
		||||
					this.queryParams.productId = btn.productId;
 | 
			
		||||
					this.queryParams.recordTime = btn.recordTime ? btn.recordTime.map(time => moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')) : null;
 | 
			
		||||
					this.queryParams.recordTime = btn.recordTime
 | 
			
		||||
						? btn.recordTime.map((time) =>
 | 
			
		||||
								moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')
 | 
			
		||||
						  )
 | 
			
		||||
						: null;
 | 
			
		||||
					this.$nextTick(() => {
 | 
			
		||||
						this.getList();
 | 
			
		||||
					});
 | 
			
		||||
@@ -388,7 +398,7 @@ export default {
 | 
			
		||||
	font-size: 14px;
 | 
			
		||||
 | 
			
		||||
	&::before {
 | 
			
		||||
		content: "";
 | 
			
		||||
		content: '';
 | 
			
		||||
		position: absolute;
 | 
			
		||||
		left: 0;
 | 
			
		||||
		top: 6px;
 | 
			
		||||
@@ -398,5 +408,4 @@ export default {
 | 
			
		||||
		background: #0b58ff;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -14,7 +14,7 @@ import * as echarts from 'echarts';
 | 
			
		||||
 * 
 | 
			
		||||
 * https://echarts.apache.org/zh/option.html#series-custom.renderItem.arguments.params
 | 
			
		||||
 */
 | 
			
		||||
function renderItem(params, api) { }
 | 
			
		||||
// function renderItem(params, api) { }
 | 
			
		||||
 | 
			
		||||
export default class Gantt {
 | 
			
		||||
    constructor(el) {
 | 
			
		||||
 
 | 
			
		||||
@@ -74,7 +74,7 @@
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import LineChart from './components/lineChart.vue';
 | 
			
		||||
import response from './response.json';
 | 
			
		||||
// import response from './response.json';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'SGProduction',
 | 
			
		||||
 
 | 
			
		||||
@@ -1,497 +0,0 @@
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html lang="en">
 | 
			
		||||
 | 
			
		||||
<head>
 | 
			
		||||
	<meta charset="UTF-8" />
 | 
			
		||||
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 | 
			
		||||
	<title>Document</title>
 | 
			
		||||
</head>
 | 
			
		||||
 | 
			
		||||
<body>
 | 
			
		||||
	<div id="app" style="width: 100vw; height: 80vh; background: #fff; margin: 24px"></div>
 | 
			
		||||
 | 
			
		||||
	<script src="./echarts.js"></script>
 | 
			
		||||
	<script>
 | 
			
		||||
		function getStartTime(timestamp) {
 | 
			
		||||
			return new Date(new Date(timestamp).toLocaleDateString()).getTime();
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		function renderItem(params, api) {
 | 
			
		||||
			var categoryIndex = api.value(0);
 | 
			
		||||
			var start = api.coord([api.value(1), categoryIndex]);
 | 
			
		||||
			var end = api.coord([api.value(2), categoryIndex]);
 | 
			
		||||
			console.log(`
 | 
			
		||||
                    categoryIndex: ${categoryIndex},
 | 
			
		||||
                    start: ${start},
 | 
			
		||||
                    end: ${end},
 | 
			
		||||
                    api.value0: ${api.value(0)}
 | 
			
		||||
                    api.value1: ${api.value(1)}
 | 
			
		||||
                    api.value2: ${api.value(2)}
 | 
			
		||||
                    params.coordSys: ${JSON.stringify(params.coordSys)}
 | 
			
		||||
                    api.size: ${api.size([0, 1])}
 | 
			
		||||
                    api.style(): ${JSON.stringify(api.style())}
 | 
			
		||||
                `);
 | 
			
		||||
 | 
			
		||||
			var height = api.size([0, 1])[1] * 2;
 | 
			
		||||
			// 用一个矩形去截取另一个矩形
 | 
			
		||||
			var rectShape = echarts.graphic.clipRectByRect(
 | 
			
		||||
				// 被截取矩形
 | 
			
		||||
				{
 | 
			
		||||
					x: start[0],
 | 
			
		||||
					y: start[1] - height / 2,
 | 
			
		||||
					width: end[0] - start[0],
 | 
			
		||||
					height: height,
 | 
			
		||||
				},
 | 
			
		||||
				// {x: 0, y: 0, width: 2000, height: 60 } // <== 也行...
 | 
			
		||||
				// 截取矩形
 | 
			
		||||
				{
 | 
			
		||||
					// 截取掉grid以外的部分,实质是计算方块的偏移量
 | 
			
		||||
					x: params.coordSys.x, // {number} grid rect 的 x
 | 
			
		||||
					// y: params.coordSys.y, // {number} grid rect 的 y
 | 
			
		||||
					y: params.coordSys.y - 16, // {number} grid rect 的 y,并多减掉 16 个单位
 | 
			
		||||
					// width: end[0] - start[0],
 | 
			
		||||
					width: params.coordSys.width, // {number} grid rect 的 width
 | 
			
		||||
					height: params.coordSys.height, // {number} grid rect 的 height
 | 
			
		||||
				}
 | 
			
		||||
			);
 | 
			
		||||
			console.log(`------------- ${JSON.stringify(rectShape)} -------------- `)
 | 
			
		||||
			return (
 | 
			
		||||
				rectShape && {
 | 
			
		||||
					type: 'rect',
 | 
			
		||||
					transition: ['shape'],
 | 
			
		||||
					shape: rectShape,
 | 
			
		||||
					style: api.style(),
 | 
			
		||||
				}
 | 
			
		||||
			);
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		function getXaxisRange(startTime) {
 | 
			
		||||
			return Array(24)
 | 
			
		||||
				.fill(startTime)
 | 
			
		||||
				.map((item, index) => {
 | 
			
		||||
					return new Date(item + index * 3600 * 1000)
 | 
			
		||||
						.toLocaleTimeString()
 | 
			
		||||
						.split(':')
 | 
			
		||||
						.slice(0, 2)
 | 
			
		||||
						.join(':');
 | 
			
		||||
				});
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		function getTodayStart(today) {
 | 
			
		||||
			const [y, m, d] = [
 | 
			
		||||
				today.getFullYear(),
 | 
			
		||||
				today.getMonth(),
 | 
			
		||||
				today.getDate(),
 | 
			
		||||
			];
 | 
			
		||||
			return new Date(y, m, d).getTime();
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		/** 颜色配置 */
 | 
			
		||||
		const types = [
 | 
			
		||||
			{ name: '运行', color: '#288AFF' },
 | 
			
		||||
			{ name: '故障', color: '#FC9C91' },
 | 
			
		||||
			{ name: '计划停机', color: '#FFDC94' },
 | 
			
		||||
			{ name: '空白', color: '#F2F4F9' },
 | 
			
		||||
		];
 | 
			
		||||
 | 
			
		||||
		const option = {
 | 
			
		||||
			tooltip: {
 | 
			
		||||
				trigger: 'item',
 | 
			
		||||
				axisPointer: {
 | 
			
		||||
					type: 'none',
 | 
			
		||||
					// label: {
 | 
			
		||||
					// 	backgroundColor: '#6a7985',
 | 
			
		||||
					// },
 | 
			
		||||
				},
 | 
			
		||||
				formatter: (params) => {
 | 
			
		||||
					// console.log('formatter', params)
 | 
			
		||||
					// return `
 | 
			
		||||
					// <div>${new Date(params[0].value[1]).toLocaleString()} ~ ${new Date(params[0].value[2]).toLocaleString()}</div>
 | 
			
		||||
					// <div style="display: flex; justify-content: space-between; min-width: 128px; align-items: center;">
 | 
			
		||||
					//     <span>${params[0].seriesName}</span>
 | 
			
		||||
					//     <span>${params[0].name}</span>
 | 
			
		||||
					// </div>
 | 
			
		||||
					// `
 | 
			
		||||
					return `
 | 
			
		||||
						<div style="display: flex; align-items: center; justify-content: space-between">
 | 
			
		||||
						<h1 style="font-size: 18px; font-weight: 600;">${params.seriesName}</h1>
 | 
			
		||||
                        <h2 style="font-size: 18px; font-weight: 400; letter-spacing: 1px;">${params.name} <span style="display: inline-block; margin-left: 8px; width: 12px; height: 12px; border-radius: 50%; background: ${params.color} "></span></h2>
 | 
			
		||||
                        </div>
 | 
			
		||||
						<div>${new Date(params.value[1]).toLocaleString()} ~ ${new Date(params.value[2]).toLocaleString()}</div>
 | 
			
		||||
                        `
 | 
			
		||||
				}
 | 
			
		||||
			},
 | 
			
		||||
			grid: [
 | 
			
		||||
				{
 | 
			
		||||
					id: 0,
 | 
			
		||||
					top: 10,
 | 
			
		||||
					left: 128,
 | 
			
		||||
					right: 64,
 | 
			
		||||
					height: 56,
 | 
			
		||||
				},
 | 
			
		||||
				// {
 | 
			
		||||
				// 	id: 1,
 | 
			
		||||
				// 	top: 80,
 | 
			
		||||
				// 	height: 56,
 | 
			
		||||
				// },
 | 
			
		||||
				// ***************** 添加第二个grid *****************
 | 
			
		||||
				{
 | 
			
		||||
					id: 1,
 | 
			
		||||
					top: 180,
 | 
			
		||||
					left: 128,
 | 
			
		||||
					right: 64,
 | 
			
		||||
					height: 56
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
			xAxis: [
 | 
			
		||||
				{
 | 
			
		||||
					id: 'asdf',
 | 
			
		||||
					gridIndex: 0,
 | 
			
		||||
					axisTick: {
 | 
			
		||||
						alignWithLabel: true,
 | 
			
		||||
						inside: true,
 | 
			
		||||
					},
 | 
			
		||||
					type: 'time',
 | 
			
		||||
					min: getTodayStart(new Date()), // <===
 | 
			
		||||
					max: getStartTime(new Date().getTime() + 3600 * 24 * 1000), // <===
 | 
			
		||||
					splitNumber: 10,
 | 
			
		||||
					axisLabel: {
 | 
			
		||||
						margin: 12,
 | 
			
		||||
						// rotate: -15,
 | 
			
		||||
						formatter: function (val) {
 | 
			
		||||
							return new Date(val)
 | 
			
		||||
								.toLocaleTimeString()
 | 
			
		||||
								.split(':')
 | 
			
		||||
								.slice(0, 2)
 | 
			
		||||
								.join(':');
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
					boundaryGap: false,
 | 
			
		||||
					// data: getXaxisRange(getTodayStart(new Date())),
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					id: 'asdff',
 | 
			
		||||
					gridIndex: 0,
 | 
			
		||||
					axisLabel: { show: false },
 | 
			
		||||
					axisLine: { show: false },
 | 
			
		||||
				},
 | 
			
		||||
				// ***************** 添加第二个 xAxis *****************
 | 
			
		||||
				{
 | 
			
		||||
					id: 'asdfjk',
 | 
			
		||||
					gridIndex: 1,
 | 
			
		||||
					axisTick: {
 | 
			
		||||
						alignWithLabel: true,
 | 
			
		||||
						inside: true,
 | 
			
		||||
					},
 | 
			
		||||
					type: 'time',
 | 
			
		||||
					min: getTodayStart(new Date()), // <===
 | 
			
		||||
					max: getStartTime(new Date().getTime() + 3600 * 24 * 1000), // <===
 | 
			
		||||
					splitNumber: 10,
 | 
			
		||||
					axisLabel: {
 | 
			
		||||
						margin: 12,
 | 
			
		||||
						// rotate: -15,
 | 
			
		||||
						formatter: function (val) {
 | 
			
		||||
							return new Date(val)
 | 
			
		||||
								.toLocaleTimeString()
 | 
			
		||||
								.split(':')
 | 
			
		||||
								.slice(0, 2)
 | 
			
		||||
								.join(':');
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
					boundaryGap: false,
 | 
			
		||||
					// data: getXaxisRange(getTodayStart(new Date())),
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					id: 'fjkd',
 | 
			
		||||
					gridIndex: 1,
 | 
			
		||||
					axisLabel: { show: false },
 | 
			
		||||
					axisLine: { show: false },
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			yAxis: [
 | 
			
		||||
				// 主y轴
 | 
			
		||||
				{
 | 
			
		||||
					id: 0,
 | 
			
		||||
					gridIndex: 0,
 | 
			
		||||
					type: 'value',
 | 
			
		||||
					splitLine: { show: false },
 | 
			
		||||
					name: '设备1',
 | 
			
		||||
					nameLocation: 'center',
 | 
			
		||||
					nameGap: 56,
 | 
			
		||||
					nameRotate: 0,
 | 
			
		||||
					nameTextStyle: {
 | 
			
		||||
						fontSize: 18,
 | 
			
		||||
					},
 | 
			
		||||
					axisLine: {
 | 
			
		||||
						show: true,
 | 
			
		||||
						lineStyle: {},
 | 
			
		||||
					},
 | 
			
		||||
					axisLabel: { show: false },
 | 
			
		||||
					axisTick: { show: false },
 | 
			
		||||
				},
 | 
			
		||||
				// 辅y轴
 | 
			
		||||
				{
 | 
			
		||||
					id: 1,
 | 
			
		||||
					gridIndex: 0,
 | 
			
		||||
					type: 'value',
 | 
			
		||||
					splitLine: { show: false },
 | 
			
		||||
					axisLabel: { show: false },
 | 
			
		||||
					axisTick: { show: false },
 | 
			
		||||
				},
 | 
			
		||||
				// ***************** 添加第二个 yAxis *****************
 | 
			
		||||
				{
 | 
			
		||||
					id: 2,
 | 
			
		||||
					gridIndex: 1,
 | 
			
		||||
					type: 'value',
 | 
			
		||||
					splitLine: { show: false },
 | 
			
		||||
					name: '设备1',
 | 
			
		||||
					nameLocation: 'center',
 | 
			
		||||
					nameGap: 56,
 | 
			
		||||
					nameRotate: 0,
 | 
			
		||||
					nameTextStyle: {
 | 
			
		||||
						fontSize: 18,
 | 
			
		||||
					},
 | 
			
		||||
					axisLine: {
 | 
			
		||||
						show: true,
 | 
			
		||||
						lineStyle: {},
 | 
			
		||||
					},
 | 
			
		||||
					axisLabel: { show: false },
 | 
			
		||||
					axisTick: { show: false },
 | 
			
		||||
				},
 | 
			
		||||
				// 辅y轴
 | 
			
		||||
				{
 | 
			
		||||
					id: 3,
 | 
			
		||||
					gridIndex: 1,
 | 
			
		||||
					type: 'value',
 | 
			
		||||
					splitLine: { show: false },
 | 
			
		||||
					axisLabel: { show: false },
 | 
			
		||||
					axisTick: { show: false },
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			series: [
 | 
			
		||||
				{
 | 
			
		||||
					// 沉默的背景
 | 
			
		||||
					xAxisIndex: 0,
 | 
			
		||||
					yAxisIndex: 0,
 | 
			
		||||
					type: 'custom',
 | 
			
		||||
					renderItem: renderItem,
 | 
			
		||||
					silent: true,
 | 
			
		||||
					itemStyle: {
 | 
			
		||||
						opacity: 0.8,
 | 
			
		||||
					},
 | 
			
		||||
					encode: {
 | 
			
		||||
						x: [1, 2],
 | 
			
		||||
						y: 0,
 | 
			
		||||
					},
 | 
			
		||||
					data: [
 | 
			
		||||
						{
 | 
			
		||||
							name: '无数据',
 | 
			
		||||
							value: [0, 1696694400000, 1696780800000, 0],
 | 
			
		||||
							tooltip: { show: false },
 | 
			
		||||
							// silent: true,
 | 
			
		||||
							// animation: false,
 | 
			
		||||
							// universalTransition: { enable: false },
 | 
			
		||||
							// hoverAnimation: false,
 | 
			
		||||
							// selectMode: true,
 | 
			
		||||
							// select: { disabled: true },
 | 
			
		||||
							// emphasis: { disabled: false, focus: 'none', itemStyle: { opacity: 0 } },
 | 
			
		||||
							// z: 0,
 | 
			
		||||
							// zlevel: 0,
 | 
			
		||||
							// emphasis: { disabled: true },
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								color: '#ccc',
 | 
			
		||||
								opacity: 0.3,
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
					]
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					name: '设备1',
 | 
			
		||||
					xAxisIndex: 0,
 | 
			
		||||
					yAxisIndex: 0,
 | 
			
		||||
					type: 'custom',
 | 
			
		||||
					renderItem: renderItem,
 | 
			
		||||
					itemStyle: {
 | 
			
		||||
						opacity: 0.8,
 | 
			
		||||
					},
 | 
			
		||||
					encode: {
 | 
			
		||||
						x: [1, 2],
 | 
			
		||||
						y: 0,
 | 
			
		||||
					},
 | 
			
		||||
					data: [
 | 
			
		||||
						{
 | 
			
		||||
							name: '运行',
 | 
			
		||||
							value: [0, 1696694400000, 1696699400000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[0].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '运行',
 | 
			
		||||
							value: [0, 1696730000000, 1696734040450, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[0].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '故障',
 | 
			
		||||
							value: [0, 1696737040000, 1696754040450, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[1].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '计划停机',
 | 
			
		||||
							value: [0, 1696755000000, 1696759000000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[2].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '运行',
 | 
			
		||||
							value: [0, 1696759000000, 1696769000000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[0].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '计划停机',
 | 
			
		||||
							value: [0, 1696769400000, 1696779000000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[2].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
				},
 | 
			
		||||
				// ***************** 添加第二个设备 *****************
 | 
			
		||||
				{
 | 
			
		||||
					// 沉默的背景
 | 
			
		||||
					xAxisIndex: 2,
 | 
			
		||||
					yAxisIndex: 2,
 | 
			
		||||
					type: 'custom',
 | 
			
		||||
					renderItem: renderItem,
 | 
			
		||||
					silent: true,
 | 
			
		||||
					itemStyle: {
 | 
			
		||||
						opacity: 0.8,
 | 
			
		||||
					},
 | 
			
		||||
					encode: {
 | 
			
		||||
						x: [1, 2],
 | 
			
		||||
						y: 0,
 | 
			
		||||
					},
 | 
			
		||||
					data: [
 | 
			
		||||
						{
 | 
			
		||||
							name: '无数据',
 | 
			
		||||
							value: [0, 1696694400000, 1696780800000, 0],
 | 
			
		||||
							tooltip: { show: false },
 | 
			
		||||
							// silent: true,
 | 
			
		||||
							// animation: false,
 | 
			
		||||
							// universalTransition: { enable: false },
 | 
			
		||||
							// hoverAnimation: false,
 | 
			
		||||
							// selectMode: true,
 | 
			
		||||
							// select: { disabled: true },
 | 
			
		||||
							// emphasis: { disabled: false, focus: 'none', itemStyle: { opacity: 0 } },
 | 
			
		||||
							// z: 0,
 | 
			
		||||
							// zlevel: 0,
 | 
			
		||||
							// emphasis: { disabled: true },
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								color: '#ccc',
 | 
			
		||||
								opacity: 0.3,
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
					]
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					name: '设备2',
 | 
			
		||||
					xAxisIndex: 2,
 | 
			
		||||
					yAxisIndex: 2,
 | 
			
		||||
					type: 'custom',
 | 
			
		||||
					renderItem: renderItem,
 | 
			
		||||
					itemStyle: {
 | 
			
		||||
						opacity: 0.8,
 | 
			
		||||
					},
 | 
			
		||||
					encode: {
 | 
			
		||||
						x: [1, 2],
 | 
			
		||||
						y: 0,
 | 
			
		||||
					},
 | 
			
		||||
					data: [
 | 
			
		||||
						{
 | 
			
		||||
							name: '运行',
 | 
			
		||||
							value: [0, 1696694400000, 1696699400000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[0].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
							// showBackground: true,
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '运行',
 | 
			
		||||
							value: [0, 1696730000000, 1696734040450, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[0].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '故障',
 | 
			
		||||
							value: [0, 1696737040000, 1696754040450, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[1].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '计划停机',
 | 
			
		||||
							value: [0, 1696755000000, 1696759000000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[2].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '运行',
 | 
			
		||||
							value: [0, 1696759000000, 1696769000000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[0].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							name: '计划停机',
 | 
			
		||||
							value: [0, 1696769400000, 1696779000000, 0],
 | 
			
		||||
							itemStyle: {
 | 
			
		||||
								normal: {
 | 
			
		||||
									color: types[2].color,
 | 
			
		||||
								},
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
 | 
			
		||||
		const el = document.getElementById('app');
 | 
			
		||||
		const myChart = echarts.init(el);
 | 
			
		||||
 | 
			
		||||
		console.log('mychart', myChart);
 | 
			
		||||
		myChart.setOption(option);
 | 
			
		||||
	</script>
 | 
			
		||||
</body>
 | 
			
		||||
 | 
			
		||||
</html>
 | 
			
		||||
@@ -37,7 +37,7 @@
 | 
			
		||||
      @cancel="handleCancel"
 | 
			
		||||
      @confirm="handleConfirm"
 | 
			
		||||
      :before-close="handleCancel"
 | 
			
		||||
      width='70%'
 | 
			
		||||
      width='50%'
 | 
			
		||||
    >
 | 
			
		||||
      <group-class-add ref="classList" @successSubmit="successSubmit" />
 | 
			
		||||
    </base-dialog>
 | 
			
		||||
@@ -108,12 +108,6 @@ export default {
 | 
			
		||||
      ],
 | 
			
		||||
      tableProps,
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
        this.$auth.hasPermi('base:group-classes:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'edit',
 | 
			
		||||
              btnName: '编辑'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
          {
 | 
			
		||||
            type: 'cancel',
 | 
			
		||||
            btnName: '作废',
 | 
			
		||||
@@ -128,6 +122,12 @@ export default {
 | 
			
		||||
              ]
 | 
			
		||||
            }
 | 
			
		||||
          },
 | 
			
		||||
        this.$auth.hasPermi('base:group-classes:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'edit',
 | 
			
		||||
              btnName: '编辑'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        this.$auth.hasPermi('base:group-classes:delete')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'delete',
 | 
			
		||||
 
 | 
			
		||||
@@ -1,17 +1,29 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-form ref="form" :rules="rules" label-width="80px" :model="form">
 | 
			
		||||
    <el-form-item label="班组名称" prop="name">
 | 
			
		||||
      <el-input v-model="form.name"></el-input>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="班组编码" prop="code">
 | 
			
		||||
      <el-input v-model="form.code" disabled></el-input>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="班组人数" prop="num">
 | 
			
		||||
      <el-input-number v-model="form.num" :min="1" :max="99999999" style="width: 100%;"></el-input-number>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="班组组长" prop="leaderName">
 | 
			
		||||
      <el-input v-model="form.leaderName"></el-input>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="班组名称" prop="name">
 | 
			
		||||
          <el-input v-model="form.name"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="班组编码" prop="code">
 | 
			
		||||
          <el-input v-model="form.code" disabled></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="班组人数" prop="num">
 | 
			
		||||
          <el-input-number v-model="form.num" :min="1" :max="99999999" style="width: 100%;"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="班组组长" prop="leaderName">
 | 
			
		||||
          <el-input v-model="form.leaderName"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
  </el-form>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
 
 | 
			
		||||
@@ -308,6 +308,16 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
.demo-form-inline {
 | 
			
		||||
  .el-date-editor .el-range__icon {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
  .el-input__prefix .el-icon-date {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: #0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
.groupTeamScheduling {
 | 
			
		||||
  background-color: #F2F4F9;
 | 
			
		||||
  .operationArea {
 | 
			
		||||
 
 | 
			
		||||
@@ -1,81 +1,238 @@
 | 
			
		||||
<template xmlns="">
 | 
			
		||||
  <div class="container">
 | 
			
		||||
    <div class="logo"></div>
 | 
			
		||||
    <!-- 登录区域 -->
 | 
			
		||||
    <div class="content">
 | 
			
		||||
      <!-- 配图 -->
 | 
			
		||||
      <div class="pic"></div>
 | 
			
		||||
      <!-- 表单 -->
 | 
			
		||||
      <div class="field">
 | 
			
		||||
        <!-- [移动端]标题 -->
 | 
			
		||||
        <h2 class="mobile-title">
 | 
			
		||||
          <h3 class="title">芋道后台管理系统</h3>
 | 
			
		||||
        </h2>
 | 
			
		||||
	<div class="container">
 | 
			
		||||
		<div class="logo"></div>
 | 
			
		||||
		<!-- 登录区域 -->
 | 
			
		||||
		<div class="content">
 | 
			
		||||
			<!-- 配图 -->
 | 
			
		||||
			<div class="pic">
 | 
			
		||||
				<div
 | 
			
		||||
					class="welcome"
 | 
			
		||||
					style="
 | 
			
		||||
						position: absolute;
 | 
			
		||||
						top: 15%;
 | 
			
		||||
						left: 20%;
 | 
			
		||||
						user-select: none;
 | 
			
		||||
						display: flex;
 | 
			
		||||
						flex-direction: column;
 | 
			
		||||
						align-items: flex-start;
 | 
			
		||||
					">
 | 
			
		||||
					<strong
 | 
			
		||||
						style="
 | 
			
		||||
							letter-spacing: 1px;
 | 
			
		||||
							font-family: Arial, Helvetica, sans-serif;
 | 
			
		||||
							font-weight: 500;
 | 
			
		||||
							font-size: 88px;
 | 
			
		||||
						">
 | 
			
		||||
						<span style="color: #26b9de">Wel</span>
 | 
			
		||||
						<span style="color: #fff">come</span>
 | 
			
		||||
					</strong>
 | 
			
		||||
					<p
 | 
			
		||||
						style="
 | 
			
		||||
							margin: 0;
 | 
			
		||||
							font-size: 26px;
 | 
			
		||||
							letter-spacing: 1px;
 | 
			
		||||
							color: #26b9de;
 | 
			
		||||
							opacity: 75%;
 | 
			
		||||
						">
 | 
			
		||||
						<span
 | 
			
		||||
							style="
 | 
			
		||||
								display: inline-block;
 | 
			
		||||
								height: 20px;
 | 
			
		||||
								width: 20px;
 | 
			
		||||
								margin-left: 8px;
 | 
			
		||||
								margin-right: 12px;
 | 
			
		||||
								border-radius: 100%;
 | 
			
		||||
								background: #26b9de;
 | 
			
		||||
							"></span>
 | 
			
		||||
						产线生产监控系统
 | 
			
		||||
					</p>
 | 
			
		||||
				</div>
 | 
			
		||||
				<video
 | 
			
		||||
					src="/static/videos/login.webm"
 | 
			
		||||
					muted
 | 
			
		||||
					autoplay
 | 
			
		||||
					loop
 | 
			
		||||
					style="
 | 
			
		||||
						user-select: none;
 | 
			
		||||
						position: absolute;
 | 
			
		||||
						top: 28%;
 | 
			
		||||
						width: 100%;
 | 
			
		||||
						height: 70%;
 | 
			
		||||
					"></video>
 | 
			
		||||
			</div>
 | 
			
		||||
			<!-- 表单 -->
 | 
			
		||||
			<div class="field">
 | 
			
		||||
				<!-- [移动端]标题 -->
 | 
			
		||||
				<h2 class="mobile-title">
 | 
			
		||||
					<h3 class="title">中建材智能自动化研究院有限公司</h3>
 | 
			
		||||
				</h2>
 | 
			
		||||
				<h2 class="pc-title" style="">
 | 
			
		||||
					<h3
 | 
			
		||||
						class="title"
 | 
			
		||||
						style="
 | 
			
		||||
							margin: 0;
 | 
			
		||||
							margin-left: 32px;
 | 
			
		||||
							font-weight: 400;
 | 
			
		||||
							user-select: none;
 | 
			
		||||
							color: #000;
 | 
			
		||||
							font-size: 36px;
 | 
			
		||||
							line-height: 54px;
 | 
			
		||||
							letter-spacing: 2px;
 | 
			
		||||
						">
 | 
			
		||||
						<img
 | 
			
		||||
							src="../assets/logo/cnbm.png"
 | 
			
		||||
							alt="cnbm_logo"
 | 
			
		||||
							style="
 | 
			
		||||
								height: 48px;
 | 
			
		||||
								width: 48px;
 | 
			
		||||
								position: relative;
 | 
			
		||||
								top: 12px;
 | 
			
		||||
								right: 8px;
 | 
			
		||||
							" />
 | 
			
		||||
						<span>中建材智能自动化研究院有限公司</span>
 | 
			
		||||
					</h3>
 | 
			
		||||
					<h3
 | 
			
		||||
						class="sub-title"
 | 
			
		||||
						style="
 | 
			
		||||
							margin: 0;
 | 
			
		||||
							margin-left: 32px;
 | 
			
		||||
							font-weight: 400;
 | 
			
		||||
							user-select: none;
 | 
			
		||||
							color: #000;
 | 
			
		||||
							font-size: 36px;
 | 
			
		||||
							line-height: 54px;
 | 
			
		||||
							letter-spacing: 2px;
 | 
			
		||||
						">
 | 
			
		||||
						产线生产监控系统
 | 
			
		||||
					</h3>
 | 
			
		||||
				</h2>
 | 
			
		||||
 | 
			
		||||
        <!-- 表单 -->
 | 
			
		||||
        <div class="form-cont">
 | 
			
		||||
          <el-tabs class="form" v-model="loginForm.loginType" style=" float:none;">
 | 
			
		||||
            <el-tab-pane label="账号密码登录" name="uname">
 | 
			
		||||
            </el-tab-pane>
 | 
			
		||||
            <el-tab-pane label="短信验证码登录" name="sms">
 | 
			
		||||
            </el-tab-pane>
 | 
			
		||||
          </el-tabs>
 | 
			
		||||
          <div>
 | 
			
		||||
            <el-form ref="loginForm" :model="loginForm" :rules="LoginRules" class="login-form">
 | 
			
		||||
              <el-form-item prop="tenantName" v-if="tenantEnable">
 | 
			
		||||
                <el-input v-model="loginForm.tenantName" type="text" auto-complete="off" placeholder='租户'>
 | 
			
		||||
                  <svg-icon slot="prefix" icon-class="tree" class="el-input__icon input-icon" />
 | 
			
		||||
                </el-input>
 | 
			
		||||
              </el-form-item>
 | 
			
		||||
              <!-- 账号密码登录 -->
 | 
			
		||||
              <div v-if="loginForm.loginType === 'uname'">
 | 
			
		||||
                <el-form-item prop="username">
 | 
			
		||||
                  <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
 | 
			
		||||
                    <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
 | 
			
		||||
                  </el-input>
 | 
			
		||||
                </el-form-item>
 | 
			
		||||
                <el-form-item prop="password">
 | 
			
		||||
                  <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码"
 | 
			
		||||
                    @keyup.enter.native="getCode">
 | 
			
		||||
                    <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
 | 
			
		||||
                  </el-input>
 | 
			
		||||
                </el-form-item>
 | 
			
		||||
                <el-checkbox v-model="loginForm.rememberMe" style="margin:0 0 25px 0;">记住密码</el-checkbox>
 | 
			
		||||
              </div>
 | 
			
		||||
				<!-- 表单 -->
 | 
			
		||||
				<div class="form-cont">
 | 
			
		||||
					<el-tabs
 | 
			
		||||
						class="form"
 | 
			
		||||
						v-model="loginForm.loginType"
 | 
			
		||||
						style="float: none">
 | 
			
		||||
						<el-tab-pane label="账号密码登录" name="uname"></el-tab-pane>
 | 
			
		||||
						<el-tab-pane label="短信验证码登录" name="sms"></el-tab-pane>
 | 
			
		||||
					</el-tabs>
 | 
			
		||||
					<div style="">
 | 
			
		||||
						<el-form
 | 
			
		||||
							ref="loginForm"
 | 
			
		||||
							:model="loginForm"
 | 
			
		||||
							:rules="LoginRules"
 | 
			
		||||
							class="login-form">
 | 
			
		||||
							<el-form-item prop="tenantName" v-if="tenantEnable">
 | 
			
		||||
								<el-input
 | 
			
		||||
									v-model="loginForm.tenantName"
 | 
			
		||||
									type="text"
 | 
			
		||||
									auto-complete="off"
 | 
			
		||||
									placeholder="租户">
 | 
			
		||||
									<!-- <svg-icon
 | 
			
		||||
										slot="prefix"
 | 
			
		||||
										icon-class="tree"
 | 
			
		||||
										class="el-input__icon input-icon" /> -->
 | 
			
		||||
								</el-input>
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
							<!-- 账号密码登录 -->
 | 
			
		||||
							<div v-if="loginForm.loginType === 'uname'">
 | 
			
		||||
								<el-form-item prop="username">
 | 
			
		||||
									<el-input
 | 
			
		||||
										v-model="loginForm.username"
 | 
			
		||||
										type="text"
 | 
			
		||||
										auto-complete="off"
 | 
			
		||||
										placeholder="账号">
 | 
			
		||||
										<!-- <svg-icon
 | 
			
		||||
											slot="prefix"
 | 
			
		||||
											icon-class="user"
 | 
			
		||||
											class="el-input__icon input-icon" /> -->
 | 
			
		||||
									</el-input>
 | 
			
		||||
								</el-form-item>
 | 
			
		||||
								<el-form-item prop="password">
 | 
			
		||||
									<el-input
 | 
			
		||||
										v-model="loginForm.password"
 | 
			
		||||
										type="password"
 | 
			
		||||
										auto-complete="off"
 | 
			
		||||
										placeholder="密码"
 | 
			
		||||
										@keyup.enter.native="getCode">
 | 
			
		||||
										<!-- <svg-icon
 | 
			
		||||
											slot="prefix"
 | 
			
		||||
											icon-class="password"
 | 
			
		||||
											class="el-input__icon input-icon" /> -->
 | 
			
		||||
									</el-input>
 | 
			
		||||
								</el-form-item>
 | 
			
		||||
								<el-checkbox
 | 
			
		||||
									v-model="loginForm.rememberMe"
 | 
			
		||||
									style="margin: 0 0 25px 0">
 | 
			
		||||
									记住密码
 | 
			
		||||
								</el-checkbox>
 | 
			
		||||
							</div>
 | 
			
		||||
 | 
			
		||||
              <!-- 短信验证码登录 -->
 | 
			
		||||
              <div v-if="loginForm.loginType === 'sms'">
 | 
			
		||||
                <el-form-item prop="mobile">
 | 
			
		||||
                  <el-input v-model="loginForm.mobile" type="text" auto-complete="off" placeholder="请输入手机号">
 | 
			
		||||
                    <svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" />
 | 
			
		||||
                  </el-input>
 | 
			
		||||
                </el-form-item>
 | 
			
		||||
                <el-form-item prop="mobileCode">
 | 
			
		||||
                  <el-input v-model="loginForm.mobileCode" type="text" auto-complete="off" placeholder="短信验证码"
 | 
			
		||||
                    class="sms-login-mobile-code-prefix" @keyup.enter.native="handleLogin">
 | 
			
		||||
                    <template>
 | 
			
		||||
                      <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
 | 
			
		||||
                    </template>
 | 
			
		||||
                    <template slot="append">
 | 
			
		||||
                      <span v-if="mobileCodeTimer <= 0" class="getMobileCode" @click="getSmsCode"
 | 
			
		||||
                        style="cursor: pointer;">获取验证码</span>
 | 
			
		||||
                      <span v-if="mobileCodeTimer > 0" class="getMobileCode">{{ mobileCodeTimer }}秒后可重新获取</span>
 | 
			
		||||
                    </template>
 | 
			
		||||
                  </el-input>
 | 
			
		||||
                </el-form-item>
 | 
			
		||||
              </div>
 | 
			
		||||
							<!-- 短信验证码登录 -->
 | 
			
		||||
							<div v-if="loginForm.loginType === 'sms'">
 | 
			
		||||
								<el-form-item prop="mobile">
 | 
			
		||||
									<el-input
 | 
			
		||||
										v-model="loginForm.mobile"
 | 
			
		||||
										type="text"
 | 
			
		||||
										auto-complete="off"
 | 
			
		||||
										placeholder="请输入手机号">
 | 
			
		||||
										<!-- <svg-icon
 | 
			
		||||
											slot="prefix"
 | 
			
		||||
											icon-class="phone"
 | 
			
		||||
											class="el-input__icon input-icon" /> -->
 | 
			
		||||
									</el-input>
 | 
			
		||||
								</el-form-item>
 | 
			
		||||
								<el-form-item prop="mobileCode">
 | 
			
		||||
									<el-input
 | 
			
		||||
										v-model="loginForm.mobileCode"
 | 
			
		||||
										type="text"
 | 
			
		||||
										auto-complete="off"
 | 
			
		||||
										placeholder="短信验证码"
 | 
			
		||||
										class="sms-login-mobile-code-prefix"
 | 
			
		||||
										@keyup.enter.native="handleLogin">
 | 
			
		||||
										<!-- <template>
 | 
			
		||||
											<svg-icon
 | 
			
		||||
												slot="prefix"
 | 
			
		||||
												icon-class="password"
 | 
			
		||||
												class="el-input__icon input-icon" />
 | 
			
		||||
										</template> -->
 | 
			
		||||
										<template slot="suffix">
 | 
			
		||||
											<span
 | 
			
		||||
												v-if="mobileCodeTimer <= 0"
 | 
			
		||||
												class="getMobileCode"
 | 
			
		||||
												@click="getSmsCode"
 | 
			
		||||
												style="
 | 
			
		||||
													cursor: pointer;
 | 
			
		||||
													color: #0b58ff;
 | 
			
		||||
													font-size: 18px;
 | 
			
		||||
													line-height: 66px;
 | 
			
		||||
													padding-right: 12px;
 | 
			
		||||
												">
 | 
			
		||||
												获取验证码
 | 
			
		||||
											</span>
 | 
			
		||||
											<span v-if="mobileCodeTimer > 0" class="getMobileCode">
 | 
			
		||||
												{{ mobileCodeTimer }}秒后可重新获取
 | 
			
		||||
											</span>
 | 
			
		||||
										</template>
 | 
			
		||||
									</el-input>
 | 
			
		||||
								</el-form-item>
 | 
			
		||||
							</div>
 | 
			
		||||
 | 
			
		||||
              <!-- 下方的登录按钮 -->
 | 
			
		||||
              <el-form-item style="width:100%;">
 | 
			
		||||
                <el-button :loading="loading" size="medium" type="primary" style="width:100%;"
 | 
			
		||||
                  @click.native.prevent="getCode">
 | 
			
		||||
                  <span v-if="!loading">登 录</span>
 | 
			
		||||
                  <span v-else>登 录 中...</span>
 | 
			
		||||
                </el-button>
 | 
			
		||||
              </el-form-item>
 | 
			
		||||
							<!-- 下方的登录按钮 -->
 | 
			
		||||
							<el-form-item id="button-form-item" style="width: 100%; margin-top: 32px">
 | 
			
		||||
								<el-button
 | 
			
		||||
									:loading="loading"
 | 
			
		||||
									size="medium"
 | 
			
		||||
									type="primary"
 | 
			
		||||
									style="width: 100%; height: 66px; font-size: 18px;"
 | 
			
		||||
									@click.native.prevent="getCode">
 | 
			
		||||
									<span v-if="!loading">登 录</span>
 | 
			
		||||
									<span v-else>登 录 中...</span>
 | 
			
		||||
								</el-button>
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
 | 
			
		||||
              <!--  社交登录 -->
 | 
			
		||||
              <!-- <el-form-item style="width:100%;">
 | 
			
		||||
							<!--  社交登录 -->
 | 
			
		||||
							<!-- <el-form-item style="width:100%;">
 | 
			
		||||
                  <div class="oauth-login" style="display:flex">
 | 
			
		||||
                    <div class="oauth-login-item" v-for="item in SysUserSocialTypeEnum" :key="item.type" @click="doSocialLogin(item)">
 | 
			
		||||
                      <img :src="item.img" height="25px" width="25px" alt="登录" >
 | 
			
		||||
@@ -83,265 +240,305 @@
 | 
			
		||||
                    </div>
 | 
			
		||||
                </div>
 | 
			
		||||
              </el-form-item> -->
 | 
			
		||||
            </el-form>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
						</el-form>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
 | 
			
		||||
    <!-- 图形验证码 -->
 | 
			
		||||
    <Verify ref="verify" :captcha-type="'blockPuzzle'" :img-size="{ width: '400px', height: '200px' }"
 | 
			
		||||
      @success="handleLogin" />
 | 
			
		||||
				<!-- footer -->
 | 
			
		||||
				<div class="footer">
 | 
			
		||||
					Copyright © 2023 中建材智能自动化院 All Rights Reserved.
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
    <!-- footer -->
 | 
			
		||||
    <div class="footer">
 | 
			
		||||
      Copyright © 2023 中建材智能自动化院 All Rights Reserved.
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
		<!-- 图形验证码 -->
 | 
			
		||||
		<Verify
 | 
			
		||||
			ref="verify"
 | 
			
		||||
			:captcha-type="'blockPuzzle'"
 | 
			
		||||
			:img-size="{ width: '400px', height: '200px' }"
 | 
			
		||||
			@success="handleLogin" />
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import { sendSmsCode, socialAuthRedirect } from "@/api/login";
 | 
			
		||||
import { getTenantIdByName } from "@/api/system/tenant";
 | 
			
		||||
import { SystemUserSocialTypeEnum } from "@/utils/constants";
 | 
			
		||||
import { getCaptchaEnable, getTenantEnable } from "@/utils/ruoyi";
 | 
			
		||||
import { sendSmsCode, socialAuthRedirect } from '@/api/login';
 | 
			
		||||
import { getTenantIdByName } from '@/api/system/tenant';
 | 
			
		||||
import { SystemUserSocialTypeEnum } from '@/utils/constants';
 | 
			
		||||
import { getCaptchaEnable, getTenantEnable } from '@/utils/ruoyi';
 | 
			
		||||
import {
 | 
			
		||||
  getPassword,
 | 
			
		||||
  getRememberMe, getTenantName,
 | 
			
		||||
  getUsername,
 | 
			
		||||
  removePassword, removeRememberMe, removeTenantName,
 | 
			
		||||
  removeUsername,
 | 
			
		||||
  setPassword, setRememberMe, setTenantId, setTenantName,
 | 
			
		||||
  setUsername
 | 
			
		||||
} from "@/utils/auth";
 | 
			
		||||
	getPassword,
 | 
			
		||||
	getRememberMe,
 | 
			
		||||
	getTenantName,
 | 
			
		||||
	getUsername,
 | 
			
		||||
	removePassword,
 | 
			
		||||
	removeRememberMe,
 | 
			
		||||
	removeTenantName,
 | 
			
		||||
	removeUsername,
 | 
			
		||||
	setPassword,
 | 
			
		||||
	setRememberMe,
 | 
			
		||||
	setTenantId,
 | 
			
		||||
	setTenantName,
 | 
			
		||||
	setUsername,
 | 
			
		||||
} from '@/utils/auth';
 | 
			
		||||
 | 
			
		||||
import Verify from '@/components/Verifition/Verify';
 | 
			
		||||
import { resetUserPwd } from "@/api/system/user";
 | 
			
		||||
import { resetUserPwd } from '@/api/system/user';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  name: "Login",
 | 
			
		||||
  components: {
 | 
			
		||||
    Verify
 | 
			
		||||
  },
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      codeUrl: "",
 | 
			
		||||
      captchaEnable: true,
 | 
			
		||||
      tenantEnable: true,
 | 
			
		||||
      mobileCodeTimer: 0,
 | 
			
		||||
      loginForm: {
 | 
			
		||||
        loginType: "uname",
 | 
			
		||||
        username: "admin",
 | 
			
		||||
        password: "admin123",
 | 
			
		||||
        captchaVerification: "",
 | 
			
		||||
        mobile: "",
 | 
			
		||||
        mobileCode: "",
 | 
			
		||||
        rememberMe: false,
 | 
			
		||||
        tenantName: "技术中心",
 | 
			
		||||
      },
 | 
			
		||||
      scene: 21,
 | 
			
		||||
	name: 'Login',
 | 
			
		||||
	components: {
 | 
			
		||||
		Verify,
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			codeUrl: '',
 | 
			
		||||
			captchaEnable: true,
 | 
			
		||||
			tenantEnable: true,
 | 
			
		||||
			mobileCodeTimer: 0,
 | 
			
		||||
			loginForm: {
 | 
			
		||||
				loginType: 'uname',
 | 
			
		||||
				username: 'admin',
 | 
			
		||||
				password: 'admin123',
 | 
			
		||||
				captchaVerification: '',
 | 
			
		||||
				mobile: '',
 | 
			
		||||
				mobileCode: '',
 | 
			
		||||
				rememberMe: false,
 | 
			
		||||
				tenantName: '技术中心',
 | 
			
		||||
			},
 | 
			
		||||
			scene: 21,
 | 
			
		||||
 | 
			
		||||
      LoginRules: {
 | 
			
		||||
        username: [
 | 
			
		||||
          { required: true, trigger: "blur", message: "用户名不能为空" }
 | 
			
		||||
        ],
 | 
			
		||||
        password: [
 | 
			
		||||
          { required: true, trigger: "blur", message: "密码不能为空" }
 | 
			
		||||
        ],
 | 
			
		||||
        mobile: [
 | 
			
		||||
          { required: true, trigger: "blur", message: "手机号不能为空" },
 | 
			
		||||
          {
 | 
			
		||||
            validator: function (rule, value, callback) {
 | 
			
		||||
              if (/^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/.test(value) === false) {
 | 
			
		||||
                callback(new Error("手机号格式错误"));
 | 
			
		||||
              } else {
 | 
			
		||||
                callback();
 | 
			
		||||
              }
 | 
			
		||||
            }, trigger: "blur"
 | 
			
		||||
          }
 | 
			
		||||
        ],
 | 
			
		||||
        tenantName: [
 | 
			
		||||
          { required: true, trigger: "blur", message: "租户不能为空" },
 | 
			
		||||
          {
 | 
			
		||||
            validator: (rule, value, callback) => {
 | 
			
		||||
              // debugger
 | 
			
		||||
              getTenantIdByName(value).then(res => {
 | 
			
		||||
                const tenantId = res.data;
 | 
			
		||||
                if (tenantId && tenantId >= 0) {
 | 
			
		||||
                  // 设置租户
 | 
			
		||||
                  setTenantId(tenantId)
 | 
			
		||||
                  callback();
 | 
			
		||||
                } else {
 | 
			
		||||
                  callback('租户不存在');
 | 
			
		||||
                }
 | 
			
		||||
              });
 | 
			
		||||
            },
 | 
			
		||||
            trigger: 'blur'
 | 
			
		||||
          }
 | 
			
		||||
        ]
 | 
			
		||||
      },
 | 
			
		||||
      loading: false,
 | 
			
		||||
      redirect: undefined,
 | 
			
		||||
      // 枚举
 | 
			
		||||
      SysUserSocialTypeEnum: SystemUserSocialTypeEnum,
 | 
			
		||||
    };
 | 
			
		||||
  },
 | 
			
		||||
  created() {
 | 
			
		||||
    // 租户开关
 | 
			
		||||
    this.tenantEnable = getTenantEnable();
 | 
			
		||||
    if (this.tenantEnable) {
 | 
			
		||||
      getTenantIdByName(this.loginForm.tenantName).then(res => { // 设置租户
 | 
			
		||||
        const tenantId = res.data;
 | 
			
		||||
        if (tenantId && tenantId >= 0) {
 | 
			
		||||
          setTenantId(tenantId)
 | 
			
		||||
        }
 | 
			
		||||
      });
 | 
			
		||||
    }
 | 
			
		||||
    // 验证码开关
 | 
			
		||||
    this.captchaEnable = getCaptchaEnable();
 | 
			
		||||
    // 重定向地址
 | 
			
		||||
    this.redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : undefined;
 | 
			
		||||
    this.getCookie();
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getCode() {
 | 
			
		||||
      // 情况一,未开启:则直接登录
 | 
			
		||||
      if (!this.captchaEnable) {
 | 
			
		||||
        this.handleLogin({})
 | 
			
		||||
        return;
 | 
			
		||||
      }
 | 
			
		||||
			LoginRules: {
 | 
			
		||||
				username: [
 | 
			
		||||
					{ required: true, trigger: 'blur', message: '用户名不能为空' },
 | 
			
		||||
				],
 | 
			
		||||
				password: [
 | 
			
		||||
					{ required: true, trigger: 'blur', message: '密码不能为空' },
 | 
			
		||||
				],
 | 
			
		||||
				mobile: [
 | 
			
		||||
					{ required: true, trigger: 'blur', message: '手机号不能为空' },
 | 
			
		||||
					{
 | 
			
		||||
						validator: function (rule, value, callback) {
 | 
			
		||||
							if (
 | 
			
		||||
								/^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/.test(
 | 
			
		||||
									value
 | 
			
		||||
								) === false
 | 
			
		||||
							) {
 | 
			
		||||
								callback(new Error('手机号格式错误'));
 | 
			
		||||
							} else {
 | 
			
		||||
								callback();
 | 
			
		||||
							}
 | 
			
		||||
						},
 | 
			
		||||
						trigger: 'blur',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				tenantName: [
 | 
			
		||||
					{ required: true, trigger: 'blur', message: '租户不能为空' },
 | 
			
		||||
					{
 | 
			
		||||
						validator: (rule, value, callback) => {
 | 
			
		||||
							// debugger
 | 
			
		||||
							getTenantIdByName(value).then((res) => {
 | 
			
		||||
								const tenantId = res.data;
 | 
			
		||||
								if (tenantId && tenantId >= 0) {
 | 
			
		||||
									// 设置租户
 | 
			
		||||
									setTenantId(tenantId);
 | 
			
		||||
									callback();
 | 
			
		||||
								} else {
 | 
			
		||||
									callback('租户不存在');
 | 
			
		||||
								}
 | 
			
		||||
							});
 | 
			
		||||
						},
 | 
			
		||||
						trigger: 'blur',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			},
 | 
			
		||||
			loading: false,
 | 
			
		||||
			redirect: undefined,
 | 
			
		||||
			// 枚举
 | 
			
		||||
			SysUserSocialTypeEnum: SystemUserSocialTypeEnum,
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	created() {
 | 
			
		||||
		// 租户开关
 | 
			
		||||
		this.tenantEnable = getTenantEnable();
 | 
			
		||||
		if (this.tenantEnable) {
 | 
			
		||||
			getTenantIdByName(this.loginForm.tenantName).then((res) => {
 | 
			
		||||
				// 设置租户
 | 
			
		||||
				const tenantId = res.data;
 | 
			
		||||
				if (tenantId && tenantId >= 0) {
 | 
			
		||||
					setTenantId(tenantId);
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		}
 | 
			
		||||
		// 验证码开关
 | 
			
		||||
		this.captchaEnable = getCaptchaEnable();
 | 
			
		||||
		// 重定向地址
 | 
			
		||||
		this.redirect = this.$route.query.redirect
 | 
			
		||||
			? decodeURIComponent(this.$route.query.redirect)
 | 
			
		||||
			: undefined;
 | 
			
		||||
		this.getCookie();
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		getCode() {
 | 
			
		||||
			// 情况一,未开启:则直接登录
 | 
			
		||||
			if (!this.captchaEnable) {
 | 
			
		||||
				this.handleLogin({});
 | 
			
		||||
				return;
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
      // 情况二,已开启:则展示验证码;只有完成验证码的情况,才进行登录
 | 
			
		||||
      // 弹出验证码
 | 
			
		||||
      this.$refs.verify.show()
 | 
			
		||||
    },
 | 
			
		||||
    getCookie() {
 | 
			
		||||
      const username = getUsername();
 | 
			
		||||
      const password = getPassword();
 | 
			
		||||
      const rememberMe = getRememberMe();
 | 
			
		||||
      const tenantName = getTenantName();
 | 
			
		||||
      this.loginForm = {
 | 
			
		||||
        ...this.loginForm,
 | 
			
		||||
        username: username ? username : this.loginForm.username,
 | 
			
		||||
        password: password ? password : this.loginForm.password,
 | 
			
		||||
        rememberMe: rememberMe ? getRememberMe() : false,
 | 
			
		||||
        tenantName: tenantName ? tenantName : this.loginForm.tenantName,
 | 
			
		||||
      };
 | 
			
		||||
    },
 | 
			
		||||
    handleLogin(captchaParams) {
 | 
			
		||||
      this.$refs.loginForm.validate(valid => {
 | 
			
		||||
        if (valid) {
 | 
			
		||||
          this.loading = true;
 | 
			
		||||
          // 设置 Cookie
 | 
			
		||||
          if (this.loginForm.rememberMe) {
 | 
			
		||||
            setUsername(this.loginForm.username)
 | 
			
		||||
            setPassword(this.loginForm.password)
 | 
			
		||||
            setRememberMe(this.loginForm.rememberMe)
 | 
			
		||||
            setTenantName(this.loginForm.tenantName)
 | 
			
		||||
          } else {
 | 
			
		||||
            removeUsername()
 | 
			
		||||
            removePassword()
 | 
			
		||||
            removeRememberMe()
 | 
			
		||||
            removeTenantName()
 | 
			
		||||
          }
 | 
			
		||||
          this.loginForm.captchaVerification = captchaParams.captchaVerification
 | 
			
		||||
          // 发起登陆
 | 
			
		||||
          // console.log("发起登录", this.loginForm);
 | 
			
		||||
          this.$store.dispatch(this.loginForm.loginType === "sms" ? "SmsLogin" : "Login", this.loginForm).then(() => {
 | 
			
		||||
            this.$router.push({ path: this.redirect || "/" }).catch(() => {
 | 
			
		||||
            });
 | 
			
		||||
          }).catch(() => {
 | 
			
		||||
            this.loading = false;
 | 
			
		||||
          });
 | 
			
		||||
        }
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
    async doSocialLogin(socialTypeEnum) {
 | 
			
		||||
      // 设置登录中
 | 
			
		||||
      this.loading = true;
 | 
			
		||||
      let tenant = false;
 | 
			
		||||
      if (this.tenantEnable) {
 | 
			
		||||
        await this.$prompt('请输入租户名称', "提示", {
 | 
			
		||||
          confirmButtonText: "确定",
 | 
			
		||||
          cancelButtonText: "取消"
 | 
			
		||||
        }).then(async ({ value }) => {
 | 
			
		||||
          await getTenantIdByName(value).then(res => {
 | 
			
		||||
            const tenantId = res.data;
 | 
			
		||||
            tenant = true
 | 
			
		||||
            if (tenantId && tenantId >= 0) {
 | 
			
		||||
              setTenantId(tenantId)
 | 
			
		||||
            }
 | 
			
		||||
          });
 | 
			
		||||
        }).catch(() => {
 | 
			
		||||
          // 取消登录按钮 loading状态
 | 
			
		||||
          this.loading = false;
 | 
			
		||||
			// 情况二,已开启:则展示验证码;只有完成验证码的情况,才进行登录
 | 
			
		||||
			// 弹出验证码
 | 
			
		||||
			this.$refs.verify.show();
 | 
			
		||||
		},
 | 
			
		||||
		getCookie() {
 | 
			
		||||
			const username = getUsername();
 | 
			
		||||
			const password = getPassword();
 | 
			
		||||
			const rememberMe = getRememberMe();
 | 
			
		||||
			const tenantName = getTenantName();
 | 
			
		||||
			this.loginForm = {
 | 
			
		||||
				...this.loginForm,
 | 
			
		||||
				username: username ? username : this.loginForm.username,
 | 
			
		||||
				password: password ? password : this.loginForm.password,
 | 
			
		||||
				rememberMe: rememberMe ? getRememberMe() : false,
 | 
			
		||||
				tenantName: tenantName ? tenantName : this.loginForm.tenantName,
 | 
			
		||||
			};
 | 
			
		||||
		},
 | 
			
		||||
		handleLogin(captchaParams) {
 | 
			
		||||
			this.$refs.loginForm.validate((valid) => {
 | 
			
		||||
				if (valid) {
 | 
			
		||||
					this.loading = true;
 | 
			
		||||
					// 设置 Cookie
 | 
			
		||||
					if (this.loginForm.rememberMe) {
 | 
			
		||||
						setUsername(this.loginForm.username);
 | 
			
		||||
						setPassword(this.loginForm.password);
 | 
			
		||||
						setRememberMe(this.loginForm.rememberMe);
 | 
			
		||||
						setTenantName(this.loginForm.tenantName);
 | 
			
		||||
					} else {
 | 
			
		||||
						removeUsername();
 | 
			
		||||
						removePassword();
 | 
			
		||||
						removeRememberMe();
 | 
			
		||||
						removeTenantName();
 | 
			
		||||
					}
 | 
			
		||||
					this.loginForm.captchaVerification =
 | 
			
		||||
						captchaParams.captchaVerification;
 | 
			
		||||
					// 发起登陆
 | 
			
		||||
					// console.log("发起登录", this.loginForm);
 | 
			
		||||
					this.$store
 | 
			
		||||
						.dispatch(
 | 
			
		||||
							this.loginForm.loginType === 'sms' ? 'SmsLogin' : 'Login',
 | 
			
		||||
							this.loginForm
 | 
			
		||||
						)
 | 
			
		||||
						.then(() => {
 | 
			
		||||
							this.$router.push({ path: this.redirect || '/' }).catch(() => {});
 | 
			
		||||
						})
 | 
			
		||||
						.catch(() => {
 | 
			
		||||
							this.loading = false;
 | 
			
		||||
						});
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		async doSocialLogin(socialTypeEnum) {
 | 
			
		||||
			// 设置登录中
 | 
			
		||||
			this.loading = true;
 | 
			
		||||
			let tenant = false;
 | 
			
		||||
			if (this.tenantEnable) {
 | 
			
		||||
				await this.$prompt('请输入租户名称', '提示', {
 | 
			
		||||
					confirmButtonText: '确定',
 | 
			
		||||
					cancelButtonText: '取消',
 | 
			
		||||
				})
 | 
			
		||||
					.then(async ({ value }) => {
 | 
			
		||||
						await getTenantIdByName(value).then((res) => {
 | 
			
		||||
							const tenantId = res.data;
 | 
			
		||||
							tenant = true;
 | 
			
		||||
							if (tenantId && tenantId >= 0) {
 | 
			
		||||
								setTenantId(tenantId);
 | 
			
		||||
							}
 | 
			
		||||
						});
 | 
			
		||||
					})
 | 
			
		||||
					.catch(() => {
 | 
			
		||||
						// 取消登录按钮 loading状态
 | 
			
		||||
						this.loading = false;
 | 
			
		||||
 | 
			
		||||
          return false
 | 
			
		||||
        });
 | 
			
		||||
      } else {
 | 
			
		||||
        tenant = true
 | 
			
		||||
      }
 | 
			
		||||
      if (tenant) {
 | 
			
		||||
        // 计算 redirectUri
 | 
			
		||||
        const redirectUri = location.origin + '/social-login?'
 | 
			
		||||
          + encodeURIComponent('type=' + socialTypeEnum.type + '&redirect=' + (this.redirect || "/")); // 重定向不能丢
 | 
			
		||||
        // const redirectUri = 'http://127.0.0.1:48080/api/gitee/callback';
 | 
			
		||||
        // const redirectUri = 'http://127.0.0.1:48080/api/dingtalk/callback';
 | 
			
		||||
        // 进行跳转
 | 
			
		||||
        socialAuthRedirect(socialTypeEnum.type, encodeURIComponent(redirectUri)).then((res) => {
 | 
			
		||||
          // console.log(res.url);
 | 
			
		||||
          window.location.href = res.data;
 | 
			
		||||
        });
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    /** ========== 以下为升级短信登录 ========== */
 | 
			
		||||
    getSmsCode() {
 | 
			
		||||
      if (this.mobileCodeTimer > 0) return;
 | 
			
		||||
      this.$refs.loginForm.validate(valid => {
 | 
			
		||||
        if (!valid) return;
 | 
			
		||||
        sendSmsCode(this.loginForm.mobile, this.scene, this.loginForm.uuid, this.loginForm.code).then(res => {
 | 
			
		||||
          this.$modal.msgSuccess("获取验证码成功")
 | 
			
		||||
          this.mobileCodeTimer = 60;
 | 
			
		||||
          let msgTimer = setInterval(() => {
 | 
			
		||||
            this.mobileCodeTimer = this.mobileCodeTimer - 1;
 | 
			
		||||
            if (this.mobileCodeTimer <= 0) {
 | 
			
		||||
              clearInterval(msgTimer);
 | 
			
		||||
            }
 | 
			
		||||
          }, 1000);
 | 
			
		||||
        });
 | 
			
		||||
      });
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
						return false;
 | 
			
		||||
					});
 | 
			
		||||
			} else {
 | 
			
		||||
				tenant = true;
 | 
			
		||||
			}
 | 
			
		||||
			if (tenant) {
 | 
			
		||||
				// 计算 redirectUri
 | 
			
		||||
				const redirectUri =
 | 
			
		||||
					location.origin +
 | 
			
		||||
					'/social-login?' +
 | 
			
		||||
					encodeURIComponent(
 | 
			
		||||
						'type=' +
 | 
			
		||||
							socialTypeEnum.type +
 | 
			
		||||
							'&redirect=' +
 | 
			
		||||
							(this.redirect || '/')
 | 
			
		||||
					); // 重定向不能丢
 | 
			
		||||
				// const redirectUri = 'http://127.0.0.1:48080/api/gitee/callback';
 | 
			
		||||
				// const redirectUri = 'http://127.0.0.1:48080/api/dingtalk/callback';
 | 
			
		||||
				// 进行跳转
 | 
			
		||||
				socialAuthRedirect(
 | 
			
		||||
					socialTypeEnum.type,
 | 
			
		||||
					encodeURIComponent(redirectUri)
 | 
			
		||||
				).then((res) => {
 | 
			
		||||
					// console.log(res.url);
 | 
			
		||||
					window.location.href = res.data;
 | 
			
		||||
				});
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		/** ========== 以下为升级短信登录 ========== */
 | 
			
		||||
		getSmsCode() {
 | 
			
		||||
			if (this.mobileCodeTimer > 0) return;
 | 
			
		||||
			this.$refs.loginForm.validate((valid) => {
 | 
			
		||||
				if (!valid) return;
 | 
			
		||||
				sendSmsCode(
 | 
			
		||||
					this.loginForm.mobile,
 | 
			
		||||
					this.scene,
 | 
			
		||||
					this.loginForm.uuid,
 | 
			
		||||
					this.loginForm.code
 | 
			
		||||
				).then((res) => {
 | 
			
		||||
					this.$modal.msgSuccess('获取验证码成功');
 | 
			
		||||
					this.mobileCodeTimer = 60;
 | 
			
		||||
					let msgTimer = setInterval(() => {
 | 
			
		||||
						this.mobileCodeTimer = this.mobileCodeTimer - 1;
 | 
			
		||||
						if (this.mobileCodeTimer <= 0) {
 | 
			
		||||
							clearInterval(msgTimer);
 | 
			
		||||
						}
 | 
			
		||||
					}, 1000);
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
@import "~@/assets/styles/login.scss";
 | 
			
		||||
 | 
			
		||||
@import '~@/assets/styles/login.scss';
 | 
			
		||||
 | 
			
		||||
.oauth-login {
 | 
			
		||||
  display: flex;
 | 
			
		||||
  align-items: center;
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	align-items: center;
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.oauth-login-item {
 | 
			
		||||
  display: flex;
 | 
			
		||||
  align-items: center;
 | 
			
		||||
  margin-right: 10px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	align-items: center;
 | 
			
		||||
	margin-right: 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.oauth-login-item img {
 | 
			
		||||
  height: 25px;
 | 
			
		||||
  width: 25px;
 | 
			
		||||
	height: 25px;
 | 
			
		||||
	width: 25px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.oauth-login-item span:hover {
 | 
			
		||||
  text-decoration: underline red;
 | 
			
		||||
  color: red;
 | 
			
		||||
	text-decoration: underline red;
 | 
			
		||||
	color: red;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.sms-login-mobile-code-prefix {
 | 
			
		||||
  :deep(.el-input__prefix) {
 | 
			
		||||
    top: 22%;
 | 
			
		||||
  }
 | 
			
		||||
}</style>
 | 
			
		||||
	:deep(.el-input__prefix) {
 | 
			
		||||
		top: 22%;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -77,7 +77,6 @@ export default {
 | 
			
		||||
					label: '设备名称',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					width: 128,
 | 
			
		||||
					prop: 'equipmentCode',
 | 
			
		||||
					label: '设备编码',
 | 
			
		||||
				},
 | 
			
		||||
@@ -117,6 +116,7 @@ export default {
 | 
			
		||||
				{
 | 
			
		||||
					_action: 'params-monitor',
 | 
			
		||||
					label: '操作',
 | 
			
		||||
					width: 56,
 | 
			
		||||
					subcomponent: {
 | 
			
		||||
						props: ['injectData'],
 | 
			
		||||
						render: function (h) {
 | 
			
		||||
@@ -124,10 +124,10 @@ export default {
 | 
			
		||||
							return h(
 | 
			
		||||
								'el-button',
 | 
			
		||||
								{
 | 
			
		||||
									class: 'iconfont icon-detail',
 | 
			
		||||
									props: { type: 'text' },
 | 
			
		||||
									on: {
 | 
			
		||||
										click: function () {
 | 
			
		||||
											console.log('inejctdata', _this.injectData);
 | 
			
		||||
											_this.$emit('emitData', {
 | 
			
		||||
												action: _this.injectData._action,
 | 
			
		||||
												// value: _this.injectData.id,
 | 
			
		||||
@@ -135,8 +135,8 @@ export default {
 | 
			
		||||
											});
 | 
			
		||||
										},
 | 
			
		||||
									},
 | 
			
		||||
								},
 | 
			
		||||
								'查看详情'
 | 
			
		||||
								}
 | 
			
		||||
								// '查看详情'
 | 
			
		||||
							);
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
 
 | 
			
		||||
@@ -42,7 +42,7 @@
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				:dataForm="form"
 | 
			
		||||
				v-model="form"
 | 
			
		||||
				:rows="[
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
 
 | 
			
		||||
@@ -40,7 +40,7 @@
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				:dataForm="form"
 | 
			
		||||
				v-model="form"
 | 
			
		||||
				:rows="[
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
 
 | 
			
		||||
@@ -64,6 +64,7 @@ export default {
 | 
			
		||||
				name: item.inspectionContent,
 | 
			
		||||
				type: 'bar',
 | 
			
		||||
				barCategoryGap: 12,
 | 
			
		||||
				barWidth: 20,
 | 
			
		||||
				data: [],
 | 
			
		||||
			};
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user