From f28363d03c3539b0219c5b58ea8b7db37d50be6f Mon Sep 17 00:00:00 2001
From: gaoshp <291585735@qq.com>
Date: 星期二, 23 四月 2024 22:34:17 +0800
Subject: [PATCH] 编辑时间轴组件

---
 src/views/mdc/station-live.vue |  595 ++++++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 files changed, 546 insertions(+), 49 deletions(-)

diff --git a/src/views/mdc/station-live.vue b/src/views/mdc/station-live.vue
index 7eba7c9..0afc929 100644
--- a/src/views/mdc/station-live.vue
+++ b/src/views/mdc/station-live.vue
@@ -2,7 +2,7 @@
  * @Author: lzhe lzhe@example.com
  * @Date: 2024-03-26 10:28:33
  * @LastEditors: lzhe lzhe@example.com
- * @LastEditTime: 2024-04-18 18:27:19
+ * @LastEditTime: 2024-04-23 17:08:42
  * @FilePath: /smart-web/src/views/master/person/main/index.vue
  * @Description: 杩欐槸榛樿璁剧疆,璇疯缃甡customMade`, 鎵撳紑koroFileHeader鏌ョ湅閰嶇疆 杩涜璁剧疆: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -16,20 +16,20 @@
 			<div class="content-machine-box">
 				<div class="content-machine-img"><img src="./station.png" alt=""></div>
 				<div class="content-machine-detail">
-					<div class="content-machine-name">461</div>
+					<div class="content-machine-name">{{stationForm.machineName}}</div>
 					<el-form :model="stationForm" ref="dialogForm" label-width="80px" label-position="center" style="width: 100%;">
 						<el-row>
 							<el-col :span="8">
-								<el-form-item label="宸ヤ綅缂栧彿">{{stationForm.test}}</el-form-item>
+								<el-form-item label="宸ヤ綅缂栧彿">{{stationForm.code}}</el-form-item>
 							</el-col>
 							<el-col :span="8">
-								<el-form-item label="鏈哄櫒鍝佺墝">{{stationForm.test}}</el-form-item>
+								<el-form-item label="鏈哄櫒鍝佺墝">{{stationForm.machineBrand}}</el-form-item>
 							</el-col>
 							<el-col :span="8">
-								<el-form-item label="鏈哄櫒缂栧彿">{{stationForm.test}}</el-form-item>
+								<el-form-item label="鏈哄櫒缂栧彿">{{stationForm.machineCode}}</el-form-item>
 							</el-col>
 							<el-col :span="8">
-								<el-form-item label="鏈哄櫒鍚嶇О">{{stationForm.test}}</el-form-item>
+								<el-form-item label="鏈哄櫒鍚嶇О">{{stationForm.machineName}}</el-form-item>
 							</el-col>
 						</el-row>
 					</el-form>
@@ -37,24 +37,229 @@
 			</div>
 			<div class="collect-info-panel">
 				<div class="fact-analysis-realtim">
-					<div class="fact-analysis-card">
-						<div class="card-name" style="background-color: rgb(127, 192, 192);">璁惧鐘舵��</div>
+					<div class="wimi-empty" style="background-color: rgb(255, 255, 255);" v-if="dmpList.length == 0">
+						<div class="wimi-empty-img" style="width: 150px; height: 150px;">
+							<img src="./quesheng.bd026700.png" style="height: auto; width: 100%;">
+						</div>
+						<div class="empty-description">
+							<div>鏆傛棤鏁版嵁</div>
+						</div>
+					</div>
+					<div class="fact-analysis-card" v-for="item in dmpList" v-if="dmpList.length != 0">
+						<div class="card-name" style="background-color: rgb(127, 192, 192);">{{item.description}}</div>
 						<div class="card-value" style="background-color: rgba(127, 192, 192, 0.14);"></div>
 					</div>
 				</div>
 			</div>
+			<el-tabs type="border-card" class="demo-tabs">
+			    <el-tab-pane label="宸ヤ綅鏁版嵁">
+					<div style="text-align: right;margin-bottom: 14px;">
+						<el-date-picker v-model="wcsDate" type="date" @change="wcschangedate" value-format="YYYY-MM-DD" size="small" />
+					</div>
+			    	<div class="wcs-main">
+			    		<div><div id="wcs-left" style="width: 100%;height:400px;"></div></div>
+			    		<div><div id="wcs-right" style="width: 100%;height:400px;"></div></div>
+			    	</div>
+					<div class="bottom-panel content-panel">
+						<div class="panel-title">鐝鐘舵�佽褰�</div>
+						<div class="panel-content bottom-panel-chart">
+							<div class="status">
+								<div class="feed-button" @click="table_edit">鐘舵�佸弽棣�</div>
+								<div class="status-wrap align-left">
+									<div class="collect-status">閲囬泦鐘舵��</div>
+									<div class="status-box" v-for="item in achievements"><div class="status-color" :style="{'background-color': item.color}"></div>{{ item.name }}</div>
+								</div>
+								<div class="status-wrap">
+									<el-checkbox v-model="checked1" label="浜哄伐鍙嶉鐘舵��" size="large" />
+									<div class="status-con">
+										<div class="status-box" v-for="item in collectionstatus"><div class="status-color" :style="{'background-color': item.color}"></div>{{ item.name }}</div>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div style="padding: 8px;">
+							<div id="wcs-log" style="width: 100%;height:200px;"></div>
+							<el-table ref="multipleTableRef1" :data="recordData" border style="width: 100%;">
+								<el-table-column prop="shiftIndexName" label="鐝"></el-table-column>
+								<el-table-column prop="temdata" label="璋冭瘯"></el-table-column>
+								<el-table-column prop="temdata" label="绂荤嚎"></el-table-column>
+								<el-table-column prop="temdata" label="寰呮満"></el-table-column>
+								<el-table-column prop="temdata" label="鎶ヨ"></el-table-column>
+								<el-table-column prop="temdata" label="杩愯"></el-table-column>
+								<el-table-column prop="perdata" label="绋煎姩鐜�%"></el-table-column>
+								<el-table-column prop="perdata" label="鎶ヨ鐜�%"></el-table-column>
+							</el-table>
+						</div>
+					</div>
+			    </el-tab-pane>
+			    <el-tab-pane label="鏈哄櫒灞ュ巻">
+					<div class="alarm-title">鎶ヨ淇℃伅灞ュ巻</div>
+					<el-table ref="multipleTableRef" :data="alarmtableData" border style="width: 100%" class="multipleTableRef">
+						<el-table-column prop="alarmCode" label="鎶ヨ浠g爜"></el-table-column>
+						<el-table-column prop="alarmMsg" label="鎶ヨ淇℃伅"></el-table-column>
+						<el-table-column prop="alarmTime" label="鎶ヨ鏃堕棿"></el-table-column>
+					</el-table>
+					<el-pagination
+						style="margin-top: 12px;"
+						@size-change="alarmSizeChange"
+						@current-change="alarmCurrentChange"
+						:current-page="currentPage4"
+						:page-sizes="[15, 50, 100]"
+						:page-size="15"
+						layout="total, sizes, prev, pager, next, jumper"
+						:total="alarmtotal">
+					</el-pagination>
+				</el-tab-pane>
+			 </el-tabs>
 		</div>
 	</div>
-	<save-dialog v-if="dialog.save" ref="saveDialog"  @success="addfeedbackSuccess" @closed="dialog.save=false"></save-dialog>
+	<save-dialog v-if="dialog.save" ref="saveDialog"  @success="addfeedbackSuccess" :workstationId="lastLevelId" @closed="dialog.save=false"></save-dialog>
 </template>
 <script>
-import saveDialog from './add-station-status'
+	import * as echarts from 'echarts';
+	import saveDialog from './add-station-status'
 	export default {
 		name: "state-feedback",
 		data(){
 			return {
+				achievements: [],
+				collectionstatus: [],
+				checked1: "",
+				alarmtotal: 0,
+				alarmtableData: [],
+				wcsDate: "",
+				wcsOptionL: {  
+		            title: {  
+		                text: '鐢ㄦ椂鍒嗗竷鎯呭喌',   
+		                left: 'left',
+		                textStyle: {
+		                	fontSize:14
+		                }
+		            },  
+		            grid: {
+		            	top: 0,
+		            },
+		            tooltip: {  
+		                trigger: 'item',  
+		                //formatter: '{a} <br/>{b} : {c} ({d}%)'  
+		                formatter: '{a} 0鍒嗛挓'
+		            },  
+		            legend: {  
+		                orient: 'vertical',  
+		                bottom: 'bottom',  
+		                data: ['璋冭瘯', '绂荤嚎', '寰呮満', '鎶ュ憡', '鎶ヨ', '杩愯']  
+		            },  
+		            series: [  
+		                {  
+		                	top: -30,
+		                    name: '鐢ㄦ椂:',  
+		                    type: 'pie',  
+		                    radius: '55%',  
+		                    center: ['40%', '50%'],  
+		                    data: [],  
+							itemStyle: {
+								borderRadius: 10,
+								borderColor: '#fff',
+								borderWidth: 2
+							},
+		                    emphasis: {  
+		                        itemStyle: {  
+		                            shadowBlur: 10,  
+		                            shadowOffsetX: 0,  
+		                            shadowColor: 'rgba(0, 0, 0, 0.5)'  
+		                        }  
+		                    }  
+		                }  
+		            ]  
+		        },
+				wcsOptionR:{
+					title: {  
+		                text: '璁惧鏁堢巼',   
+		                left: 'left',
+		                textStyle: {
+		                	fontSize:14
+		                }
+		            }, 
+					xAxis: {
+						max: '100'
+					},
+					yAxis: {
+						type: 'category',
+						data: ['杩愯鐜�', '鎶ヨ鐜�', '绋煎姩鐜�']
+					},
+					tooltip: {  
+		                trigger: 'item',  
+		                //formatter: '{a} <br/>{b} : {c} ({d}%)'  
+		                formatter: '{b} {c}%'
+		            },
+					series: [
+						{	
+							top: -30,
+		                    name: 'wcsR',  
+		                    type: 'bar',   
+		                    center: ['40%', '50%'],  
+		                    data: [],  
+							itemStyle: {
+								borderRadius: 8,
+								borderColor: '#fff',
+								borderWidth: 1
+							},
+							label: {
+								show: true,
+								position: 'right',
+								formatter: '{c}%',
+								valueAnimation: true
+							},
+		                    emphasis: {  
+		                        itemStyle: {  
+		                            shadowBlur: 10,  
+		                            shadowOffsetX: 0,  
+		                            shadowColor: 'rgba(0, 0, 0, 0.5)'  
+		                        }  
+		                    }  
+						}
+					],
+					legend: {
+						show: true, // 寮哄埗鏄剧ず鍥句緥  
+						orient: 'vertical', // 鍥句緥鍒楄〃鐨勫竷灞�鏈濆悜锛屽彲閫夊�间负锛�'horizontal' 鎴� 'vertical'  
+						left: 'left', // 鍥句緥缁勪欢绂诲鍣ㄥ乏渚х殑璺濈  
+						top: 'top', // 鍥句緥缁勪欢绂诲鍣ㄤ笂渚х殑璺濈  
+						data: ['杩愯鐜�', '鎶ヨ鐜�', '绋煎姩鐜�'] // 涓巗eries涓殑name瀵瑰簲锛岀敤浜庢樉绀哄浘渚嬪悕绉�
+					}
+				},
+				wcsOptionLog:{
+					grid: {  
+						top: '0%'
+					},
+					xAxis: {
+						type: 'category',
+						data: ['00:00:00', '02:00:00', '04:00:00', '06:00:00', '08:00:00', '10:00:00', '12:00:00', '14:00:00', '18:00:00'],  
+					},
+					yAxis: {
+						type: 'category',
+						data: ['1', '2']
+					},
+					series: [
+						{	
+		                    name: 'wcsLog',  
+		                    type: 'bar',   
+		                    data: [],  
+		                    emphasis: {  
+		                        itemStyle: {  
+		                            shadowBlur: 10,  
+		                            shadowOffsetX: 0,  
+		                            shadowColor: 'rgba(0, 0, 0, 0.5)'  
+		                        }  
+		                    }  
+						}
+					]
+				},
+				dmpList: [],
 				stationForm: {
-					test: "461"
+					code: "",
+					machineBrand: "",
+					machineCode: "",
+					machineName: ""
 				},
 				dialog: {
 					save: false
@@ -78,46 +283,184 @@
 				},
 				parentId: "0",
 				tableData: [],
-				searchSelection: []
+				searchSelection: [],
+				wcsBeginOption: {},
+				alarmsearchData: {
+					current: "1",
+					size: "15"
+				},
+				recordData: [] // 鐝鐘舵�佽褰晅able
 			}
 		},
 		created(){
 			
 		},
 		mounted(){
-			this.getTreeList();
+			this.newDate();  //鑾峰彇褰撳墠鏃ユ湡
+			this.getTreeList(this.$route.query.code);
 		},
 		components: {
 			saveDialog
 	    },
 		methods: {
-			addfeedbackSuccess() {
-				this.getlist();
+			table_edit(){
+				this.dialog.save = true
+				this.$nextTick(() => {
+					this.$refs.saveDialog.open('edit').setData(this.lastLevelId);
+				})
 			},
-			feedBackStatusChange(val) {
-				this.getlist();
+			alarmSizeChange(val) {
+				console.log(`姣忛〉 ${val} 鏉);
+				this.alarmsearchData.current = "1";
+				this.alarmsearchData.size = val;
+				this.alarmsearchBtn();
+			},
+			alarmCurrentChange(val) {
+				console.log(`褰撳墠椤�: ${val}`);
+				this.alarmsearchData.current = val;
+				this.alarmsearchBtn();
+			},
+			alarmsearchBtn() {
+				this.$HTTP.get(`/api/blade-mdc/work-station-analysis/alarm/${this.lastLevelId}?current=${this.alarmsearchData.current}&size=${this.alarmsearchData.size}`).then(res=> {
+					if(res.code == 200) {
+						this.alarmtableData = res.data.records;
+						this.alarmtotal = res.data.total;
+					}
+				})
+			},
+			wcschangedate(date) {
+				this.wcsDate = date;
+				this.getwscLvalue();  //宸︿晶鍥捐〃
+				this.getwcsR();
+				this.getrecord();  //鐝鐘舵�佽褰晅able
+				this.getlogcart();  //鐝鐘舵�佽褰昪hart
+			},
+			getrecord() {  //鐝鐘舵�佽褰晅able
+				var obj = {
+					date: this.wcsDate,
+					humanFeedback: true,
+					workstationId: this.lastLevelId
+				}
+				this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-table`,obj).then(res=> {
+					if(res.code == 200) {
+						res.data.forEach(item=> {
+							item.temdata = "00:00:00";
+							item.perdata = "0";
+						})
+						this.recordData = res.data;
+					}
+				})
+			},
+			getlogcart() {  //鐝鐘舵�佽褰昪hart
+				var obj = {
+					date: this.wcsDate,
+					humanFeedback: true,
+					workstationId: this.lastLevelId
+				}
+				this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-table`,obj).then(res=> {
+					if(res.code == 200) {
+						var myChart = echarts.init(document.getElementById('wcs-log')); 
+						res.data.forEach(item => {
+							item.value = 0;
+						})
+						this.wcsOptionLog.series[0].data = res.data;
+						myChart.setOption(this.wcsOptionLog);
+					}
+				})
+			},
+			getwscLvalue() {
+				var obj = {
+					date: this.wcsDate,
+					humanFeedback: true,
+					workstationId: this.lastLevelId
+				}
+				this.$HTTP.post(`/api/blade-mdc/status-record/time-distribution`,obj).then(res=> {
+					if(res.code == 200) {
+						var myChart = echarts.init(document.getElementById('wcs-left')); 
+						var wcsOption = JSON.parse(JSON.stringify(this.wcsBeginOption));
+						if(res.data.length == 0) {
+							wcsOption.forEach(item=> {
+								item.value = 20;
+							})
+						}else {
+							wcsOption.forEach(item=> {
+								res.data.forEach(item2=> {
+									if(item.code == item2.name) {
+										item.value = item2.value;
+									}
+								})
+							})
+						}
+						this.wcsOptionL.series[0].data = wcsOption;
+						myChart.setOption(this.wcsOptionL);
+					}
+				})
+			},
+			getwcsLcolor() {
+				this.$HTTP.get(`/api/blade-cps/global_wcs/list?code=&name=`).then(res=> {
+					if(res.code == 200) {
+						res.data.forEach(item=> {
+							item.itemStyle = {color: item.color};
+						})
+						this.wcsBeginOption = res.data;
+						this.getwscLvalue();
+					}
+				})
+			},
+			getwcsR() {
+				var obj = {
+					date: this.wcsDate,
+					humanFeedback: true,
+					workstationId: this.lastLevelId
+				}
+				this.$HTTP.post(`/api/blade-mdc/status-record/equipment-efficiency`,obj).then(res=> {
+					if(res.code == 200) {
+						var myChart = echarts.init(document.getElementById('wcs-right')); 
+						res.data.forEach(item=> {
+							item.value = (Number(item.value)*100).toFixed(2);
+							if(item.name == "杩愯鐜�") item.itemStyle = {color: '#73d13d'};
+							if(item.name == "鎶ヨ鐜�") item.itemStyle = {color: '#ff4d4f'};
+							if(item.name == "绋煎姩鐜�") item.itemStyle = {color: '#40a9ff'};
+						})
+						this.wcsOptionR.series[0].data = res.data;	
+						myChart.setOption(this.wcsOptionR);
+					}
+				})
+			},
+			newDate() {
+				var date = new Date();  
+			    var year = date.getFullYear();  
+			    var month = (1 + date.getMonth()).toString().padStart(2, '0'); // JavaScript涓湀浠芥槸浠�0寮�濮嬬殑锛屾墍浠ユ垜浠渶瑕佸姞1  
+			    var day = date.getDate().toString().padStart(2, '0'); // getDate()杩斿洖鐨勬槸褰撳墠鏈堢殑鏃ユ暟锛屼笉闇�瑕佸姞1  
+			    this.wcsDate = year + '-' + month + '-' + day;
+			},
+			addfeedbackSuccess() {
+				
 			},
 			handleNodeClick(data) {
 				if(data.code) {
 					this.lastLevelId = data.id;
-					var obj = {
-						workstationId: this.lastLevelId,
-					}
-					if(this.searchData.feedBackStatus.length != 0) {
-						obj.feedBackStatus = this.searchData.feedBackStatus;
-					}
-					if(this.searchData.endDate) {
-						obj.endDate = this.searchData.endDate;
-					}
-					if(this.searchData.startDate) {
-						obj.startDate = this.searchData.startDate;
-					}
-					this.$HTTP.post("/api/blade-cps/workstation-wcs-feedback/page?current=1&size=15",obj).then(res=> {
+					this.$HTTP.get(`/api/blade-cps/workstation/get?workstationId=${this.lastLevelId}`).then(res=> {
 						if(res.code == 200) {
-							this.searchDataList = res.data.records;
+							this.stationForm = res.data;
+							this.getdmp(this.lastLevelId,this.stationForm.machineId);
+							this.newDate();  //鑾峰彇褰撳墠鏃ユ湡
+							this.getwcsR();
+							this.getwscLvalue();  //宸︿晶鍥捐〃
+							this.alarmsearchBtn();  //鏈哄櫒灞ュ巻
+							this.getrecord();  //鐝鐘舵�佽褰晅able
+							this.getlogcart();  //鐝鐘舵�佽褰昪hart
 						}
 					})
 				}
+			},
+			getdmp(lastLevelId,machineId) {
+				this.$HTTP.get(`/api/blade-cps/workstation/get-dmp-variables?machineId=${machineId}&workstationId=${lastLevelId}`).then(res=> {
+					if(res.code == 200) {
+						this.dmpList = res.data;
+						console.log(this.dmpList,1)
+					}
+				})
 			},
 			getLastLevelIds(tree) {  
 				if (tree.length === 0) return ""; // 濡傛灉娌℃湁鏍硅妭鐐癸紝杩斿洖绌� 
@@ -174,7 +517,7 @@
 				})
 				return tree;
 			},
-			getTreeList(flag) {
+			getTreeList(id) {
 				var obj = {
 					groupCategory: 1,
 					groupType: "group_workstation"
@@ -185,31 +528,48 @@
 							var treeDisabled = this.addTreeDisable(res.data);
 							this.tableData = this.buildTree(treeDisabled);  //浠庢墎骞冲寲鍙樹负鏍戠姸缁撴瀯
 							this.$nextTick(()=> {
-								this.lastLevelId = this.getLastLevelIds(this.tableData).lastLevelId;
+								if(id) {
+									this.lastLevelId = id;  //鎸囧畾id
+								}else {
+									this.lastLevelId = this.getLastLevelIds(this.tableData).lastLevelId;
+								}
 								this.$refs.treeRef.setCurrentKey(this.lastLevelId);  //绗竴涓妭鐐圭殑绗竴涓瓙鑺傜偣鏈�鍚庝竴绾ч粯璁ら�変腑
-								this.getlist();  //娓叉煋鍙嶉鍒楄〃
+								//浠ヤ笅鏄垵濮嬪寲鏁版嵁
+								this.getlist();  //娓叉煋璇︽儏鍜�(鐘舵�乴ist)
+								this.getwcsLcolor();  //宸︿晶鍥捐〃
+								this.getwcsR();  //鍙充晶鍥炬爣
+								this.getachievements();  //鐝鐘舵�佽褰曢噰闆嗙姸鎬�
+								this.getrecord();  //鐝鐘舵�佽褰晅able
+								this.getlogcart();  //鐝鐘舵�佽褰昪hart
 							})
 							
 						}
 					}
 				})
 			},
-			getlist() {
-				var obj = {
-					workstationId: this.lastLevelId,
-				}
-				if(this.searchData.feedBackStatus != 0) {
-					obj.feedBackStatus = this.searchData.feedBackStatus;
-				}
-				if(this.searchData.endDate) {
-					obj.endDate = this.searchData.endDate;
-				}
-				if(this.searchData.startDate) {
-					obj.startDate = this.searchData.startDate;
-				}
-				this.$HTTP.post("/api/blade-cps/workstation-wcs-feedback/page?current=1&size=15",obj).then(res=> {
+			getachievements() { //鐝鐘舵�佽褰曢噰闆嗙姸鎬�
+				this.$HTTP.get(`/api/blade-cps/global_wcs/wcs-achievements`).then(res=> {
 					if(res.code == 200) {
-						this.searchDataList = res.data.records;
+						var achievements = [];//閲囬泦鐘舵��
+						var collectionstatus = [];  //浜哄伐鍙嶉鐘舵��
+						res.data.forEach(item=> {
+							if(item.type == 1) {
+								achievements.push(item);
+							}
+							if(item.type == 4) {
+								collectionstatus.push(item);
+							}
+						})
+						this.achievements = achievements;
+						this.collectionstatus = collectionstatus;
+					}
+				})
+			},
+			getlist() {
+				this.$HTTP.get(`/api/blade-cps/workstation/get?workstationId=${this.lastLevelId}`).then(res=> {
+					if(res.code == 200) {
+						this.stationForm = res.data;
+						this.getdmp(this.lastLevelId,this.stationForm.machineId);
 					}
 				})
 			}
@@ -246,6 +606,12 @@
 .content-machine-box {
 	display: flex;
 	align-items: center;
+	flex-direction: row;
+    flex-wrap: nowrap;
+    align-content: center;
+    justify-content: flex-start;
+    background-color: rgba(59, 142, 142, .06);
+    border-radius: 2px;
 }
 .content-machine-img {
 	margin: 14px;
@@ -308,4 +674,135 @@
     overflow: hidden;
     word-break: break-all;
 }
+.wcs-main {
+	display: flex;
+}
+.wcs-main > div {
+	padding: 6px;
+	box-shadow: 2px 3px 10px rgba(0,0,0,.16);
+}
+.wcs-main > div:nth-child(1) {
+	width: 50%;
+	margin-right: 4px;
+}
+.wcs-main > div:nth-child(2) {
+	flex:1;
+}
+.alarm-title {
+	padding-bottom: 8px;
+	font-size: 14px;
+}
+.wimi-empty {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    border-radius: 2px;
+    flex-direction: column;
+    flex-wrap: nowrap;
+    align-content: center;
+    justify-content: center;
+    align-items: center;
+}
+.empty-description {
+    margin-bottom: 20px;
+    font-size: 14px;
+    color: #5e6d82;
+    margin-top: -16px;
+    line-height: 28px;
+}
+.bottom-panel {
+    margin-top: 8px;
+    min-height: 300px;
+}
+.content-panel {
+    height: 100%;
+    box-shadow: 2px 3px 10px rgba(0,0,0,.16);
+}
+.panel-title {
+    font-size: 16px;
+    box-sizing: border-box;
+    padding: 12px 24px;
+    width: 100%;
+    position: relative;
+    color: #333;
+    font-weight: 700;
+}
+.bottom-panel-chart {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+    align-content: flex-start;
+    align-items: flex-start;
+    padding: 8px;
+    padding-top: 0;
+    box-sizing: border-box;
+}
+.panel-content {
+    width: 100%;
+    height: calc(100% - 45px);
+}
+.panel-content-gant, .panel-content-table {
+    width: 100%;
+}
+.gant {
+    box-sizing: border-box;
+    padding: 8px;
+}
+.status {
+    display: flex;
+    align-items: start;
+    flex-direction: column;
+    justify-content: start;
+    margin: 8px 0;
+    position: relative;
+	width: 100%;
+	font-size: 16px;
+	cursor: pointer;
+}
+.feed-button {
+	position: absolute;
+    right: 10px;
+    top: -2px;
+    color: #3b8e8e;
+    cursor: pointer;
+}
+.status-wrap.align-left, .status-wrap:first-child {
+    padding-left: 24px;
+    margin-bottom: 8px;
+}
+.status-wrap {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: start;
+}
+.collect-status {
+    color: #3b8e8e;
+    margin-right: 16px;
+	font-size: 14px;
+}
+.status-box {
+    margin: 0 8px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+}
+.status-color {
+    width: 40px;
+    height: 15px;
+    border-radius: 2px;
+    margin-right: 8px;
+}
+.status-wrap {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: start;
+}
+.status-wrap .status-con {
+    display: flex;
+    flex: 1;
+    flex-wrap: wrap;
+}
+.status-wrap /deep/ .el-checkbox.el-checkbox--large {
+    color: #3b8e8e;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3