diff --git a/src/views/bigScreen/information/left1.vue b/src/views/bigScreen/information/left1.vue
index 38dd1a2..e53d825 100644
--- a/src/views/bigScreen/information/left1.vue
+++ b/src/views/bigScreen/information/left1.vue
@@ -5,7 +5,7 @@
 				<!-- <div style="display: flex; align-items: center; margin-bottom: 28px">
 					<span>·已完成任务/完成率</span>
 					<span>55/80%</span>
-					<progressBar :percentage="89" />
+					<progressBar :percentage="" />
 				</div> -->
 				<div class="than">
 					<span style="font-size: 25px; margin-right: 3px">·</span>
@@ -78,8 +78,7 @@
 					<span style="font-size: 25px; margin-right: 3px">·</span>
 					<span>已完成任务/完成率</span>
 					<i class="num">{{ totalAndRateTwo.total }}/{{ totalAndRateTwo.rate }}%</i>
-					<progressBar :percentage="70" />
-					<el-progress :show-text="false" :stroke-width="6" :percentage="70"></el-progress>
+					<progressBar :percentage="totalAndRateTwo.rate" />
 				</div>
 				<div style="height: 100%; width: 100%" ref="chart"></div>
 			</el-row>
diff --git a/src/views/bigScreen/information/right1.vue b/src/views/bigScreen/information/right1.vue
index 77e5984..0f876ca 100644
--- a/src/views/bigScreen/information/right1.vue
+++ b/src/views/bigScreen/information/right1.vue
@@ -457,6 +457,28 @@ export default {
 ::v-deep .el-progress-bar__inner {
 	background: linear-gradient(180deg, #fad961 0%, #f76b1c 100%) !important;
 }
+
+::v-deep .el-date-editor {
+	border-radius: 0;
+	box-shadow: none !important;
+	border: 1px solid rgba(255, 255, 255, 0.2);
+	vertical-align: middle;
+	color: #fff;
+	background-color: transparent;
+	.el-range-input,
+	.el-range-separator {
+		color: #fff;
+	}
+	.el-range-editor.is-active {
+		border-color: #fff !important;
+	}
+
+	input {
+		background-color: transparent;
+		color: #fff;
+	}
+}
+
 .warp-scroll {
 	height: 215px;
 	width: 100%;
diff --git a/src/views/bigScreen/scientific/tab1/center-bg.png b/src/views/bigScreen/scientific/tab1/center-bg.png
index 166b78d..bd028bb 100644
Binary files a/src/views/bigScreen/scientific/tab1/center-bg.png and b/src/views/bigScreen/scientific/tab1/center-bg.png differ
diff --git a/src/views/bigScreen/scientific/tab1/center1.vue b/src/views/bigScreen/scientific/tab1/center1.vue
index 415fc92..a5307cc 100644
--- a/src/views/bigScreen/scientific/tab1/center1.vue
+++ b/src/views/bigScreen/scientific/tab1/center1.vue
@@ -1,14 +1,234 @@
 <template>
-    <container3 title="全厂工房作业信息" :width="768" :height="975">
-        <div><img style="width:100%;height:100%" src="./center-bg.png" alt="" srcset=""></div>
-    </container3>
+	<container3 title="全厂工房作业信息" :width="768" :height="975">
+		<div>
+			<img v-if="pic.length"  style="width: 100%; height: 100%" :src="pic" alt="" srcset="" />
+			<img v-else style="width: 100%; height: 100%" src="./center-bg.png" alt="" srcset="" />
+		</div>
+		<el-popover
+			class="icon_img"
+			:style="{ top: item.ordinate + '%', left: item.abscissa + '%' }"
+			v-for="(item, index) in listData"
+			:key="item.id"
+			placement="bottom"
+			width="494"
+			trigger="click"
+			@show="handleShow(index)"
+			@hide="hadleHide"
+		>
+			<div>
+				<div class="box">
+					<div class="tit">
+						<img src="./icon2.png" alt="" />
+						<span>总装车间</span>
+					</div>
+				</div>
+				<div class="cont">
+					<el-row :gutter="10">
+						<el-col :span="11">
+							<!-- <el-image style="width: 100px; height: 100px" :src="item.avAddress" fit="contain"></el-image> -->
+							<video id="videoElement" muted controls autoplay>
+								Your browser is too old which doesn't support HTML5 video.
+							</video>
+						</el-col>
+						<el-col :span="13">
+							<div class="user_box" style="">作业人员</div>
+							<!-- singleWidth: 50 -->
+							<vue-seamless-scroll
+								ref="seamlessScroll"
+								:data="listData2"
+								:class-option="{
+									step: 0.5,
+									direction: 2,
+								}"
+								class="warp"
+							>
+								<ul class="ul-item">
+									<li class="li-item" v-for="(row, index) in listData2" :key="index">
+										<!-- <el-image style="width: 42px; height: 42px" :src="row.avatar" fit="cover"></el-image> -->
+										<img style="width: 42px; height: 42px" :src="row.avatar" />
+										<el-tooltip effect="dark" :content="row.nickname" placement="bottom">
+											<div class="one_hidden">{{ row.nickname }}</div>
+										</el-tooltip>
+									</li>
+								</ul>
+							</vue-seamless-scroll>
+						</el-col>
+						<el-col :span="24">
+							<div class="user_box">
+								<span>作业内容</span>
+								<span>{{ item.errorInfo }}</span>
+							</div>
+							<div style="background-color: #2a437d; padding: 10px 8px; color: #fff">{{ item.jobContent }}</div>
+						</el-col>
+					</el-row>
+				</div>
+			</div>
+			<el-button type="text" style="padding: 0" slot="reference">
+				<img style="width: 100%; height: 100%" src="./icon.png" alt="" />
+			</el-button>
+		</el-popover>
+	</container3>
 </template>
 <script>
+import flvjs from 'flv.js'
+
 import container3 from './components/container3/index.vue'
+import vueSeamlessScroll from 'vue-seamless-scroll'
 import echarts from 'echarts'
 export default {
-  components: {
-    container3,//#endregion,
-  },
+	components: {
+		container3, //#endregion,
+		vueSeamlessScroll,
+	},
+	data() {
+		return {
+      pic:'',
+			listData: [],
+			listData2: [],
+			flvPlayer: null,
+		}
+	},
+	methods: {
+		getList() {
+			this.request({
+				url: '/hx/scientificProduction/getHxWorkHomePic',
+			}).then(({ data }) => {
+				this.listData = data
+			})
+		},
+		handleShow(index) {
+			this.listData2 = this.listData[index]['userList']
+			if (flvjs.isSupported()) {
+				this.flvPlayer = flvjs.createPlayer(
+					{
+						type: 'flv', // 媒体类型 flv 或 mp4
+						isLive: true, // 是否为直播流
+						fluid: true,
+						// hasAudio: true, // 是否开启声音
+						stashInitialSize: 128, // 减少首桢显示等待时长
+						url: this.listData[index]['avAddress'],
+					},
+					{
+						enableStashBuffer: false,
+						fixAudioTimestampGap: false,
+						isLive: true,
+					}
+				)
+				let all = document.querySelectorAll('#videoElement')
+				let videoElement = all[all.length - 1]
+				this.flvPlayer.attachMediaElement(videoElement)
+				this.flvPlayer.load()
+				this.flvPlayer.play()
+			}
+		},
+		hadleHide() {
+			this.flvPlayer.player.pause()
+			this.flvPlayer.player.unload()
+			this.flvPlayer.player.detachMediaElement()
+			this.flvPlayer.player.destroy()
+			this.flvPlayer.player = null
+		},
+	},
+	beforeDestroy() {
+		this.flvPlayer.player.pause()
+		this.flvPlayer.player.unload()
+		this.flvPlayer.player.detachMediaElement()
+		this.flvPlayer.player.destroy()
+		this.flvPlayer.player = null
+	},
+	created() {
+		this.getList()
+    this.request({
+        url: '/hx/bigPic/getByType',
+        method: 'get',
+        params: { type: 2}
+      }).then(res => {
+        if (200 == res.code) {
+          this.pic = res.data.pic;
+        }
+      })
+	},
 }
-</script>
\ No newline at end of file
+</script>
+<style lang="scss" scoped>
+.icon_img {
+	position: absolute;
+}
+.el-popover {
+	.box {
+		width: 177px;
+		height: 0;
+		border-width: 0px 20px 30px 0px;
+		border-style: none solid solid;
+		border-color: transparent transparent rgba(10, 90, 132, 1);
+		.tit {
+			height: 30px;
+			padding-left: 16px;
+			display: flex;
+			align-items: center;
+			span {
+				margin-left: 8px;
+				color: #fff;
+				font-size: 16px;
+			}
+		}
+	}
+	.cont {
+		background-color: #0d1049;
+		padding: 8px 13px 11px 16px;
+		video {
+			width: 100%;
+			height: 143px;
+		}
+		.user_box {
+			color: #fff;
+			font-size: 16px;
+			height: 32px;
+			line-height: 32px;
+			padding: 0 16px;
+			background: linear-gradient(
+				270deg,
+				rgba(10, 16, 75, 0) 0%,
+				rgba(8, 56, 105, 0.11) 0%,
+				rgba(6, 116, 151, 0.91) 60%,
+				#00ffff 146%
+			);
+			span:nth-child(1) {
+				float: left;
+			}
+			span:nth-child(2) {
+				float: right;
+			}
+		}
+		.warp {
+			// height: 100px;
+			margin: 0 auto;
+			margin-top: 25px;
+			overflow: hidden;
+			ul {
+				list-style: none;
+				padding: 0;
+				margin: 0 auto;
+				&.ul-item {
+					display: flex;
+					.li-item {
+						width: 42px;
+						// height: 120px;
+						margin-right: 8px;
+						// line-height: 120px;
+						// background-color: #999;
+						color: #fff;
+						text-align: center;
+						.one_hidden {
+							word-break: keep-all;
+							white-space: nowrap;
+							overflow: hidden;
+							text-overflow: ellipsis;
+						}
+					}
+				}
+			}
+		}
+	}
+}
+</style>
diff --git a/src/views/bigScreen/scientific/tab1/icon.png b/src/views/bigScreen/scientific/tab1/icon.png
new file mode 100644
index 0000000..c5dd663
Binary files /dev/null and b/src/views/bigScreen/scientific/tab1/icon.png differ
diff --git a/src/views/bigScreen/scientific/tab1/icon2.png b/src/views/bigScreen/scientific/tab1/icon2.png
new file mode 100644
index 0000000..065ec21
Binary files /dev/null and b/src/views/bigScreen/scientific/tab1/icon2.png differ
diff --git a/src/views/bigScreen/scientific/tab1/left1.vue b/src/views/bigScreen/scientific/tab1/left1.vue
index 9796933..899c457 100644
--- a/src/views/bigScreen/scientific/tab1/left1.vue
+++ b/src/views/bigScreen/scientific/tab1/left1.vue
@@ -1,118 +1,112 @@
 <template>
-  <container1 title="全厂资源动态">
-    <div class="trends">
-      <el-row>
-        <el-col :span="12">
-          <div class="trends-item">
-            <div class="trends-item-icon">
-              <img src="./img/trends-item-icon1.png" alt="">
-            </div>
-            <div class="trends-item-content">
-              <div class="tit">作业工房/总数</div>
-              <div class="value">46/<span class="small">60</span></div>
-              <div class="progressBar">
-                <progressBar :percentage="70" />
-              </div>
-            </div>
-          </div>
-        </el-col>
-        <el-col :span="12">
-          <div class="trends-item">
-            <div class="trends-item-icon">
-              <img src="./img/trends-item-icon2.png" alt="">
-            </div>
-            <div class="trends-item-content">
-              <div class="tit">人员数量/出勤率</div>
-              <div class="value">754/<span class="small">89%</span></div>
-              <div class="progressBar">
-                <progressBar :percentage="89" />
-              </div>
-            </div>
-          </div>
-        </el-col>
-        <el-col :span="24">
-          <div style="height:27px"></div>
-        </el-col>
+	<container1 title="全厂资源动态">
+		<div class="trends">
+			<el-row>
+				<el-col :span="12">
+					<div class="trends-item">
+						<div class="trends-item-icon">
+							<img src="./img/trends-item-icon1.png" alt="" />
+						</div>
+						<div class="trends-item-content">
+							<div class="tit">作业工房/总数</div>
+							<div class="value">
+								{{ dataInfo.workingWorkshopTotal }}/<span class="small">{{ dataInfo.workshopTotal }}</span>
+							</div>
+							<div class="progressBar">
+								<progressBar :percentage="percentage" v-if="percentage" />
+							</div>
+						</div>
+					</div>
+				</el-col>
+				<el-col :span="12">
+					<div class="trends-item">
+						<div class="trends-item-icon">
+							<img src="./img/trends-item-icon2.png" alt="" />
+						</div>
+						<div class="trends-item-content">
+							<div class="tit">人员数量/出勤率</div>
+							<div class="value">
+								{{ dataInfo.realAttendance }}/<span class="small">{{ (dataInfo.attendanceRate - 0).toFixed(0) }}%</span>
+							</div>
+							<div class="progressBar">
+								<progressBar :percentage="dataInfo.attendanceRate" />
+							</div>
+						</div>
+					</div>
+				</el-col>
+				<el-col :span="24">
+					<div style="height: 27px"></div>
+				</el-col>
 
-        <el-col :span="12">
-          <div class="trends-item">
-            <div class="trends-item-icon">
-              <img src="./img/trends-item-icon3.png" alt="">
-            </div>
-            <div class="trends-item-content">
-              <div class="tit">设备运行数量/运行率</div>
-              <div class="value">324/<span class="small">72%</span></div>
-              <div class="progressBar">
-                <progressBar :percentage="72" />
-              </div>
-            </div>
-          </div>
-        </el-col>
-        <el-col :span="12">
-          <div class="trends-item">
-            <div class="trends-item-icon">
-              <img src="./img/trends-item-icon2.png" alt="">
-            </div>
-            <div class="trends-item-content">
-              <div class="tit">人员数量/出勤率</div>
-              <div class="value">77%</div>
-              <div class="progressBar">
-                <progressBar :percentage="77" />
-              </div>
-            </div>
-          </div>
-        </el-col>
-      </el-row>
-      <div style="height:45px"></div>
-      <div class="car">
-        <div class="car-tit">
-          <div class="left">被使用车辆总数</div>
-          <div class="right">89<span>辆</span></div>
-        </div>
-        <div style="margin: 5px 0 10px 0;">
-          <progressBar :percentage="30" :strokeWidth="12" />
-        </div>
-        <div class="describe">
-          <div class="left">总车辆数：100</div>
-          <div class="right">使用率：89%</div>
-        </div>
-      </div>
-      <vue-seamless-scroll :data="listData" class="warp" :class-option="{
-        singleHeight: 48
-      }">
-        <ul class="item">
-          <li>
-            <el-row>
-              <el-col :span="10"><img src="./img/1.png">车辆一</el-col>
-              <el-col :span="6">
-                <div class="state success">使用中</div>
-              </el-col>
-              <el-col :span="8" style="text-align:right"><img src="./img/2.png">A车库</el-col>
-            </el-row>
-          </li>
-          <li>
-            <el-row>
-              <el-col :span="10"><img src="./img/1.png">车辆二</el-col>
-              <el-col :span="6">
-                <div class="state success">闲置</div>
-              </el-col>
-              <el-col :span="8" style="text-align:right"><img src="./img/2.png">A车库</el-col>
-            </el-row>
-          </li>
-          <li>
-            <el-row>
-              <el-col :span="10"><img src="./img/1.png">车辆三</el-col>
-              <el-col :span="6">
-                <div class="state fault">故障</div>
-              </el-col>
-              <el-col :span="8" style="text-align:right"><img src="./img/2.png">A车库</el-col>
-            </el-row>
-          </li>
-
-        </ul>
-      </vue-seamless-scroll>
-    </div>
-  </container1>
+				<el-col :span="12">
+					<div class="trends-item">
+						<div class="trends-item-icon">
+							<img src="./img/trends-item-icon3.png" alt="" />
+						</div>
+						<div class="trends-item-content">
+							<div class="tit">设备运行数量/运行率</div>
+							<div class="value">
+								{{ dataInfo.equipmentRunTotal }}/<span class="small">{{ dataInfo.equipmentRunRate }}%</span>
+							</div>
+							<div class="progressBar">
+								<progressBar :percentage="dataInfo.equipmentRunRate" />
+							</div>
+						</div>
+					</div>
+				</el-col>
+				<el-col :span="12">
+					<div class="trends-item">
+						<div class="trends-item-icon">
+							<img src="./img/trends-item-icon2.png" alt="" />
+						</div>
+						<div class="trends-item-content">
+							<div class="tit">正常采集率</div>
+							<div class="value">{{ dataInfo.videoCollectionRate }}%</div>
+							<div class="progressBar">
+								<progressBar :percentage="dataInfo.videoCollectionRate" />
+							</div>
+						</div>
+					</div>
+				</el-col>
+			</el-row>
+			<div style="height: 45px"></div>
+			<div class="car">
+				<div class="car-tit">
+					<div class="left">被使用车辆总数</div>
+					<div class="right">{{ carTotal.useTotal }}<span>辆</span></div>
+				</div>
+				<div style="margin: 5px 0 10px 0">
+					<progressBar :percentage="carTotal.useTotal / carTotal.total || 0" :strokeWidth="12" />
+				</div>
+				<div class="describe">
+					<div class="left">总车辆数：{{ carTotal.total }}</div>
+					<div class="right">使用率：{{ carTotal.useTotal / carTotal.total || 0 }}%</div>
+				</div>
+			</div>
+			<vue-seamless-scroll
+				ref="seamlessScroll"
+				:data="listData"
+				class="warp"
+				:class-option="{
+					singleHeight: 48,
+				}"
+			>
+				<ul class="item">
+					<li v-for="item in listData" :key="item.id">
+						<el-row>
+							<el-col :span="10"><img src="./img/1.png" />{{ item.carName }}</el-col>
+							<el-col :span="6">
+								<div class="state success" v-if="item.carStatus == '使用中'">{{ item.carStatus }}</div>
+								<div class="state info" v-if="item.carStatus == '闲置'">{{ item.carStatus }}</div>
+								<div class="state fault" v-if="item.carStatus == '故障'">{{ item.carStatus }}</div>
+							</el-col>
+							<el-col :span="8" style="text-align: right"><img src="./img/2.png" />{{ item.nowAddress }}</el-col>
+						</el-row>
+					</li>
+				</ul>
+			</vue-seamless-scroll>
+		</div>
+	</container1>
 </template>
 
 <script>
@@ -120,166 +114,196 @@ import container1 from './components/container1/index.vue'
 import progressBar from '@/views/bigScreen/components/progress/index.vue'
 import vueSeamlessScroll from 'vue-seamless-scroll'
 export default {
-  components: {
-    container1,//#endregion,
-    progressBar,
-    vueSeamlessScroll,
-  },
-  data () {
-    return {
-      listData: [1, 2, 3, 4, 5, 6, 7, 8],
-    }
-  }
+	components: {
+		container1, //#endregion,
+		progressBar,
+		vueSeamlessScroll,
+	},
+	data() {
+		return {
+			listData: [],
+			dataInfo: {},
+			carTotal: {},
+		}
+	},
+	computed: {
+		percentage() {
+			return (this.dataInfo.workingWorkshopTotal / this.dataInfo.workshopTotal) * 100
+		},
+	},
+	methods: {
+		getList() {
+			this.request({
+				url: '/hx/scientificProduction/getHxFactoryResourcesPic',
+			}).then(({ data }) => {
+				this.dataInfo = data
+			})
+			this.request({
+				url: '/hx/scientificProduction/getHxCarUsePic1',
+			}).then(({ data }) => {
+				this.carTotal = data
+			})
+			this.request({
+				url: '/hx/scientificProduction/getHxCarUsePic2',
+			}).then(({ data }) => {
+				this.listData = data
+				this.$refs.seamlessScroll.reset()
+			})
+		},
+	},
+	created() {
+		this.getList()
+	},
 }
 </script>
 
 <style lang="scss" scoped>
 .trends {
-  padding: 0 25px;
+	padding: 0 25px;
 }
 
 .trends-item {
-  width: 100%;
-  box-sizing: border-box;
-  display: flex;
+	width: 100%;
+	box-sizing: border-box;
+	display: flex;
 }
 .trends-item-icon {
-  width: 50px;
-  height: 111px;
-  background-image: url(./img/trends-item-bg.png);
-  background-size: cover;
-  background-position: center right;
-  background-repeat: no-repeat;
-  display: flex;
-  align-items: center;
-  img {
-    height: 32px;
-  }
+	width: 50px;
+	height: 111px;
+	background-image: url(./img/trends-item-bg.png);
+	background-size: cover;
+	background-position: center right;
+	background-repeat: no-repeat;
+	display: flex;
+	align-items: center;
+	img {
+		height: 32px;
+	}
 }
 .trends-item-content {
-  margin-left: 15px;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-betweens;
-  .progressBar {
-    height: 20px;
-    width: 100px;
-  }
-  .value {
-    flex: 1;
-  }
-  .tit {
-    padding: 0 10px;
-    height: 32px;
-    font-size: 16px;
-    font-family: PingFangSC-Semibold, PingFang SC;
-    font-weight: 600;
-    color: #ffffff;
-    line-height: 32px;
-    background-image: url(./img/tit-bg.png);
-    background-size: 140px 32px;
-    background-repeat: no-repeat;
-  }
-  .value {
-    font-size: 36px;
-    font-family: Roboto-Medium, Roboto;
-    font-weight: 500;
-    color: #55c5a2;
-    .small {
-      font-size: 28px;
-    }
-  }
+	margin-left: 15px;
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-betweens;
+	.progressBar {
+		height: 20px;
+		width: 100px;
+	}
+	.value {
+		flex: 1;
+	}
+	.tit {
+		padding: 0 10px;
+		height: 32px;
+		font-size: 16px;
+		font-family: PingFangSC-Semibold, PingFang SC;
+		font-weight: 600;
+		color: #ffffff;
+		line-height: 32px;
+		background-image: url(./img/tit-bg.png);
+		background-size: 140px 32px;
+		background-repeat: no-repeat;
+	}
+	.value {
+		font-size: 36px;
+		font-family: Roboto-Medium, Roboto;
+		font-weight: 500;
+		color: #55c5a2;
+		.small {
+			font-size: 28px;
+		}
+	}
 }
 
 .car {
-  font-weight: 500;
-  color: #ffffff;
-  .left {
-    float: left;
-  }
-  .right {
-    float: right;
-  }
-  .car-tit {
-    .right {
-      font-size: 25px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #1fe7e5;
-      span {
-        font-size: 14px;
-        font-family: PingFangSC-Regular, PingFang SC;
-        font-weight: 400;
-        color: #f4f4f4;
-      }
-    }
-  }
-  .describe {
-    font-size: 15px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #ffffff;
-  }
-  div {
-    overflow: hidden;
-  }
+	font-weight: 500;
+	color: #ffffff;
+	.left {
+		float: left;
+	}
+	.right {
+		float: right;
+	}
+	.car-tit {
+		.right {
+			font-size: 25px;
+			font-family: PingFangSC-Regular, PingFang SC;
+			font-weight: 400;
+			color: #1fe7e5;
+			span {
+				font-size: 14px;
+				font-family: PingFangSC-Regular, PingFang SC;
+				font-weight: 400;
+				color: #f4f4f4;
+			}
+		}
+	}
+	.describe {
+		font-size: 15px;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #ffffff;
+	}
+	div {
+		overflow: hidden;
+	}
 }
 
 .warp {
-  height: 128px;
-  width: 100%;
-  margin: 10px auto 0 auto;
-  overflow: hidden;
-  ul {
-    list-style: none;
-    padding: 0;
-    margin: 0 auto;
-    li,
-    a {
-      display: block;
-      display: flex;
-      justify-content: space-between;
-      font-size: 15px;
-    }
-    li {
-      font-weight: 400;
-      color: #fff;
-      display: block;
-      height: 32px;
-      line-height: 32px;
-      background: linear-gradient(270deg, rgba(30, 43, 99, 0) 0%, #1e2b63 100%);
-      padding-left: 20px;
-      margin: 0 0 16px 0;
-      img {
-        vertical-align: sub;
-        margin-right: 5px;
-      }
-    }
-    .state {
-      position: relative;
-      &::before {
-        content: "";
-        display: block;
-        position: absolute;
-        left: -16px;
-        top: 12px;
-        width: 8px;
-        height: 8px;
-        background: #a9b8c5;
-        border-radius: 50%;
-      }
-      &.success::before {
-        background: #1890ff;
-      }
+	height: 128px;
+	width: 100%;
+	margin: 10px auto 0 auto;
+	overflow: hidden;
+	ul {
+		list-style: none;
+		padding: 0;
+		margin: 0 auto;
+		li,
+		a {
+			display: block;
+			display: flex;
+			justify-content: space-between;
+			font-size: 15px;
+		}
+		li {
+			font-weight: 400;
+			color: #fff;
+			display: block;
+			height: 32px;
+			line-height: 32px;
+			background: linear-gradient(270deg, rgba(30, 43, 99, 0) 0%, #1e2b63 100%);
+			padding-left: 20px;
+			margin: 0 0 16px 0;
+			img {
+				vertical-align: sub;
+				margin-right: 5px;
+			}
+		}
+		.state {
+			position: relative;
+			&::before {
+				content: '';
+				display: block;
+				position: absolute;
+				left: -16px;
+				top: 12px;
+				width: 8px;
+				height: 8px;
+				background: #a9b8c5;
+				border-radius: 50%;
+			}
+			&.success::before {
+				background: #1890ff;
+			}
 
-      &.fault::before {
-        background: #f75f53;
-      }
-      &.free::before {
-        background: #a9b8c5;
-      }
-    }
-  }
+			&.fault::before {
+				background: #f75f53;
+			}
+			&.free::before {
+				background: #a9b8c5;
+			}
+		}
+	}
 }
 </style>
diff --git a/src/views/bigScreen/scientific/tab1/left2.vue b/src/views/bigScreen/scientific/tab1/left2.vue
index f130ac6..58dbd24 100644
--- a/src/views/bigScreen/scientific/tab1/left2.vue
+++ b/src/views/bigScreen/scientific/tab1/left2.vue
@@ -1,34 +1,53 @@
 <template>
-    <container2 title="本周计划">
-        <div style="height: 100%; width: 100%" ref="chart"></div>
-    </container2>
+	<container2 title="本周计划">
+		<div style="height: 100%; width: 100%" ref="chart"></div>
+	</container2>
 </template>
 <script>
 import container2 from './components/container2/index.vue'
 import echarts from 'echarts'
 export default {
-  components: {
-    container2,//#endregion,
-  },
-  data () {
-    return {
-        			chart: null,
-    }
-  },
-  	mounted() {
+	components: {
+		container2, //#endregion,
+	},
+	data() {
+		return {
+			chart: null,
+		}
+	},
+	mounted() {
 		this.$nextTick(() => {
 			this.initChart()
 		})
 	},
-  	methods: {
+	methods: {
 		initChart() {
-			this.chart = echarts.init(this.$refs.chart)
-			this.setOptions()
+			this.request({
+				url: '/hx/scientificProduction/getHxWeekPlanUsePic',
+			}).then(({ data }) => {
+				this.chart = echarts.init(this.$refs.chart)
+				this.setOptions(data)
+			})
 		},
-		setOptions() {
+		setOptions(resData) {
+			// realCharge // 装药
+			// realDeliver // 交付
+			// realFlawDetection // 探伤
+			// realHousing // 壳体入厂
+			let real = [] // 实际
+			let target = [] // 目标
+			let rate = [] // 率
+			target.push(resData.targetFlawDetection)
+			target.push(resData.targetCharge)
+			target.push(resData.targetDeliver)
+			target.push(resData.targetHousing)
+			real.push(resData.flawDetectionRate)
+			real.push(resData.chargeRate)
+			real.push(resData.deliverRate)
+			real.push(resData.housingRate)
 			this.chart.setOption({
 				tooltip: {
-					// trigger: 'axis',
+					trigger: 'axis',
 					// formatter: '{a1}<br/>{b1}：{c1}',
 				},
 				// legend: {
@@ -46,12 +65,7 @@ export default {
 					bottom: 10,
 				},
 				xAxis: {
-					data: [
-						'探伤',
-						'装药',
-						'交付',
-						'壳体入厂',
-					],
+					data: ['探伤', '装药', '交付', '壳体入厂'],
 					axisLine: {
 						lineStyle: {
 							color: 'rgb(255, 255, 255)',
@@ -65,27 +79,27 @@ export default {
 				// },
 				color: ['#ccc', 'red'],
 				yAxis: {
-						name: '',
-						splitLine: {
-							show: true,
-							//  改变轴线颜色
-							lineStyle: {
-								// 使用深浅的间隔色
-								color: ['rgba(255, 255, 255,.5)'],
-							},
-						},
-						axisLabel: {
-							formatter: '{value}%',
-						},
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
+					name: '',
+					splitLine: {
+						show: true,
+						//  改变轴线颜色
+						lineStyle: {
+							// 使用深浅的间隔色
+							color: ['rgba(255, 255, 255,.5)'],
 						},
 					},
+					// axisLabel: {
+					// 	formatter: '{value}%',
+					// },
+					axisLine: {
+						lineStyle: {
+							color: 'rgb(255, 255, 255)',
+						},
+					},
+				},
 				series: [
 					{
-						name: '完成率',
+						name: '目标',
 						type: 'bar',
 						z: '-1',
 						barGap: '-100%',
@@ -93,7 +107,7 @@ export default {
 						itemStyle: {
 							color: 'rgba(126, 167, 252, .3)',
 						},
-						data: [80, 80, 95, 95, 95, 95, 80, 80, 95, 95, 95, 95],
+						data: target,
 					},
 					{
 						name: '数量',
@@ -103,7 +117,7 @@ export default {
 						itemStyle: {
 							color: '#7EA7FC',
 						},
-						data: [5, 20, 36, 10, 10, 20, 10, 20, 30, 10, 70, 75],
+						data: real,
 					},
 					// {
 					// 	name: '目标',
@@ -120,6 +134,6 @@ export default {
 				],
 			})
 		},
-        }
+	},
 }
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/bigScreen/scientific/tab1/right1.vue b/src/views/bigScreen/scientific/tab1/right1.vue
index d06bb05..06de4bf 100644
--- a/src/views/bigScreen/scientific/tab1/right1.vue
+++ b/src/views/bigScreen/scientific/tab1/right1.vue
@@ -1,311 +1,302 @@
 <template>
-  <container3 title="全厂作业明细" :width="535" :height="975">
-    <vue-seamless-scroll :data="listData" class="warp" :class-option="{
-        singleHeight: 84
-      }">
-      <ul>
-        <li class="item">
-          <div class="item-tit">工房一</div>
-          <div class="item-content">
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间一</span></el-col>
-              <el-col :span="12"><span class="text-tit">工序:</span><span class="text-val">车工</span></el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间一</span></el-col>
-              <el-col :span="12"><span class="text-tit">危险级别:</span><span class="text-val level1">一级</span></el-col>
-            </el-row>
-          </div>
-        </li>
-        <li class="item active">
-          <div class="item-tit">工房二</div>
-          <div class="item-content">
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间二</span></el-col>
-              <el-col :span="12"><span class="text-tit">工序:</span><span class="text-val">车工</span></el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间二</span></el-col>
-              <el-col :span="12"><span class="text-tit">危险级别:</span><span class="text-val level2">二级</span></el-col>
-            </el-row>
-          </div>
-        </li>
-        <li class="item">
-          <div class="item-tit">工房三</div>
-          <div class="item-content">
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间三</span></el-col>
-              <el-col :span="12"><span class="text-tit">工序:</span><span class="text-val">车工</span></el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间一</span></el-col>
-              <el-col :span="12"><span class="text-tit">危险级别:</span><span class="text-val level3">三级</span></el-col>
-            </el-row>
-          </div>
-        </li>
-        <li class="item">
-          <div class="item-tit">工房三</div>
-          <div class="item-content">
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间三</span></el-col>
-              <el-col :span="12"><span class="text-tit">工序:</span><span class="text-val">车工</span></el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间一</span></el-col>
-              <el-col :span="12"><span class="text-tit">危险级别:</span><span class="text-val level3">三级</span></el-col>
-            </el-row>
-          </div>
-        </li>
-        <li class="item">
-          <div class="item-tit">工房三</div>
-          <div class="item-content">
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间三</span></el-col>
-              <el-col :span="12"><span class="text-tit">工序:</span><span class="text-val">车工</span></el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12"><span class="text-tit">车间:</span><span class="text-val">车间一</span></el-col>
-              <el-col :span="12"><span class="text-tit">危险级别:</span><span class="text-val level3">三级</span></el-col>
-            </el-row>
-          </div>
-        </li>
-
-      </ul>
-    </vue-seamless-scroll>
-    <div class="sub">
-      <div class="sub-left">
-        <div class="sub-tit"><img src="./img/sub/sub1.png" alt="">装药当前作业内容</div>
-        <div class="sub-content">
-          <div class="sub-item">
-            <div class="sub-item-tit">编 号：</div>
-            <div class="sub-item-val">12345</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">称 量：</div>
-            <div class="sub-item-val">第一锅</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">混 合：</div>
-            <div class="sub-item-val">第一锅</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">浇 注：</div>
-            <div class="sub-item-val">第一锅</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">总体推迟时间：</div>
-            <div class="sub-item-val">1972-02-04</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">倒班车：</div>
-            <div class="sub-item-val">正在XXX</div>
-          </div>
-        </div>
-      </div>
-      <div class="sub-right">
-        <div class="sub-tit"><img src="./img/sub/sub2.png" alt="">酯生产量</div>
-        <div class="sub-content">
-          <div class="sub-item">
-            <div class="sub-item-tit">XX年XX轮XX生产</div>
-            <div class="sub-item-val">12345</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">开车时间：</div>
-            <div class="sub-item-val">2005-12-12</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">预计结束时间：</div>
-            <div class="sub-item-val">2025-12-12</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">酯生产量：</div>
-            <div class="sub-item-val">XX吨</div>
-          </div>
-          <div class="sub-item">
-            <div class="sub-item-tit">粘合剂干燥量：</div>
-            <div class="sub-item-val">XXX</div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </container3>
+	<container3 title="全厂作业明细" :width="535" :height="975">
+		<vue-seamless-scroll
+			:data="listData"
+			class="warp"
+			:class-option="{
+				singleHeight: 84,
+			}"
+		>
+			<ul>
+				<li class="item" :class="item.dangerLevel == '一级' ? 'active' : ''" v-for="item in listData" :key="item.id">
+					<div class="item-tit">{{ item.workHome }}</div>
+					<div class="item-content">
+						<el-row>
+							<el-col :span="12"
+								><span class="text-tit">车间:</span><span class="text-val">{{ item.workshop }}</span></el-col
+							>
+							<el-col :span="12"
+								><span class="text-tit">产品:</span><span class="text-val">{{ item.product }}</span></el-col
+							>
+						</el-row>
+						<el-row>
+							<el-col :span="12"
+								><span class="text-tit">工序:</span><span class="text-val">{{ item.procedure }}</span></el-col
+							>
+							<el-col :span="12">
+								<span class="text-tit">危险级别:</span>
+								<span class="text-val level1" v-if="item.dangerLevel == '一级'">{{ item.dangerLevel }}</span>
+								<span class="text-val level2" v-if="item.dangerLevel == '二级'">{{ item.dangerLevel }}</span>
+								<span class="text-val level3" v-if="item.dangerLevel == '三级'">{{ item.dangerLevel }}</span>
+							</el-col>
+						</el-row>
+					</div>
+				</li>
+			</ul>
+		</vue-seamless-scroll>
+		<div class="sub">
+			<div class="sub-left">
+				<div class="sub-tit"><img src="./img/sub/sub1.png" alt="" />装药当前作业内容</div>
+				<div class="sub-content">
+					<div class="sub-item">
+						<div class="sub-item-tit">编 号：</div>
+						<div class="sub-item-val">{{ oneData.numberNo }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">称 量：</div>
+						<div class="sub-item-val">{{ oneData.weighing }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">混 合：</div>
+						<div class="sub-item-val">{{ oneData.blend }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">浇 注：</div>
+						<div class="sub-item-val">{{ oneData.pouring }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">总体推迟时间：</div>
+						<div class="sub-item-val">{{ oneData.createTime }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">倒班车：</div>
+						<div class="sub-item-val">{{ oneData.reverseBus }}</div>
+					</div>
+				</div>
+			</div>
+			<div class="sub-right">
+				<div class="sub-tit"><img src="./img/sub/sub2.png" alt="" />酯生产量</div>
+				<div class="sub-content">
+					<div class="sub-item">
+						<div class="sub-item-tit">{{ twoData.jobContent }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">开车时间：</div>
+						<div class="sub-item-val">{{ twoData.driveDate }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">预计结束时间：</div>
+						<div class="sub-item-val">{{ twoData.forecastEndDate }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">酯生产量：</div>
+						<div class="sub-item-val">{{ twoData.esterProduction }}</div>
+					</div>
+					<div class="sub-item">
+						<div class="sub-item-tit">粘合剂干燥量：</div>
+						<div class="sub-item-val">{{ twoData.cleanStatus }}</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</container3>
 </template>
 <script>
 import container3 from './components/container3/index.vue'
 import vueSeamlessScroll from 'vue-seamless-scroll'
 export default {
-  components: {
-    container3,//#endregion,
-    vueSeamlessScroll,
-  },
-  data () {
-    return {
-      listData: [1, 2, 3, 4, 5, 6, 7, 8],
-    }
-  }
+	components: {
+		container3, //#endregion,
+		vueSeamlessScroll,
+	},
+	data() {
+		return {
+			listData: [],
+			oneData: {},
+			twoData: {},
+		}
+	},
+	methods: {
+		getList() {
+			// 全厂作业明细
+			this.request({
+				url: '/hx/scientificProduction/getHxJobDetailsPic',
+			}).then(({ data }) => {
+				this.listData = data
+			})
+			// 装药当前作业内容
+			this.request({
+				url: '/hx/scientificProduction/getChargeJobContentPic',
+			}).then(({ data }) => {
+				this.oneData = data
+			})
+		},
+		getTwoList() {
+			// 酯生产量
+			this.request({
+				url: '/hx/scientificProduction/getHxEsterProductionPic',
+			}).then(({ data }) => {
+				this.twoData = data
+			})
+		},
+	},
+	created() {
+		this.getList()
+		this.getTwoList()
+	},
 }
 </script>
 
 <style lang="scss" scoped>
 .warp {
-  height: 416px;
-  width: 100%;
-  margin: 10px auto 0 auto;
-  overflow: hidden;
-  ul {
-    list-style: none;
-    padding: 0;
-    margin: 0 auto;
-    li,
-    a {
-      display: block;
-      display: flex;
-      justify-content: space-between;
-      font-size: 15px;
-    }
-    li {
-      font-weight: 400;
-      color: #fff;
-      display: block;
-      height: 40px;
-      background: linear-gradient(270deg, rgba(30, 43, 99, 0) 0%, #1e2b63 100%);
-      margin: 0 0 4px 0;
-      img {
-        vertical-align: sub;
-        margin-right: 5px;
-      }
-    }
-    .item {
-      display: flex;
-      box-shadow: inset 0px 0px 20px 0px rgba(0, 255, 255, 0.75);
-      background: #0a1047;
-      height: 80px;
-      &.active {
-        box-shadow: inset 0px 0px 20px 0px #ffd082;
-      }
-      .item-tit {
-        text-align: center;
-        width: 124px;
-        height: 80px;
-        font-size: 18px;
-        font-family: PingFangSC-Medium, PingFang SC;
-        font-weight: 500;
-        color: #00ffff;
-        line-height: 80px;
-        background: rgba(0, 255, 255, 0.14);
-      }
-      &.active .item-tit {
-        color: #ffd082;
-        background: rgba(255, 208, 130, 0.14);
-      }
-      .item-content {
-        flex: 1;
-        line-height: 30px;
-        padding: 10px 25px;
-      }
-      .text-tit {
-        font-size: 16px;
-        font-family: PingFangSC-Regular, PingFang SC;
-        font-weight: 400;
-        color: #00ffff;
-        margin-right: 8px;
-      }
-      .text-val {
-        font-size: 14px;
-        font-family: PingFang-SC-Regular, PingFang-SC;
-        font-weight: 400;
-        color: #ffffff;
-      }
-      &.active .text-tit {
-        color: #ffd082;
-      }
+	height: 416px;
+	width: 100%;
+	margin: 10px auto 0 auto;
+	overflow: hidden;
+	ul {
+		list-style: none;
+		padding: 0;
+		margin: 0 auto;
+		li,
+		a {
+			display: block;
+			display: flex;
+			justify-content: space-between;
+			font-size: 15px;
+		}
+		li {
+			font-weight: 400;
+			color: #fff;
+			display: block;
+			height: 40px;
+			background: linear-gradient(270deg, rgba(30, 43, 99, 0) 0%, #1e2b63 100%);
+			margin: 0 0 4px 0;
+			img {
+				vertical-align: sub;
+				margin-right: 5px;
+			}
+		}
+		.item {
+			display: flex;
+			box-shadow: inset 0px 0px 20px 0px rgba(0, 255, 255, 0.75);
+			background: #0a1047;
+			height: 80px;
+			&.active {
+				box-shadow: inset 0px 0px 20px 0px #ffd082;
+			}
+			.item-tit {
+				text-align: center;
+				width: 124px;
+				height: 80px;
+				font-size: 18px;
+				font-family: PingFangSC-Medium, PingFang SC;
+				font-weight: 500;
+				color: #00ffff;
+				line-height: 80px;
+				background: rgba(0, 255, 255, 0.14);
+			}
+			&.active .item-tit {
+				color: #ffd082;
+				background: rgba(255, 208, 130, 0.14);
+			}
+			.item-content {
+				flex: 1;
+				line-height: 30px;
+				padding: 10px 25px;
+			}
+			.text-tit {
+				font-size: 16px;
+				font-family: PingFangSC-Regular, PingFang SC;
+				font-weight: 400;
+				color: #00ffff;
+				margin-right: 8px;
+			}
+			.text-val {
+				font-size: 14px;
+				font-family: PingFang-SC-Regular, PingFang-SC;
+				font-weight: 400;
+				color: #ffffff;
+			}
+			&.active .text-tit {
+				color: #ffd082;
+			}
 
-      .level1 {
-        display: inline-block;
-        border-radius: 2px;
-        border: 1px solid #f64f58;
-        font-size: 14px;
-        color: #f64f58;
-        line-height: 1;
-        padding: 5px 5px;
-      }
-      .level2 {
-        display: inline-block;
+			.level1 {
+				display: inline-block;
+				border-radius: 2px;
+				border: 1px solid #f64f58;
+				font-size: 14px;
+				color: #f64f58;
+				line-height: 1;
+				padding: 5px 5px;
+			}
+			.level2 {
+				display: inline-block;
 
-        border-radius: 2px;
-        border: 1px solid #fa8c16;
-        font-size: 14px;
-        color: #fa8c16;
-        line-height: 1;
-        padding: 5px 5px;
-      }
-      .level2 {
-        display: inline-block;
+				border-radius: 2px;
+				border: 1px solid #fa8c16;
+				font-size: 14px;
+				color: #fa8c16;
+				line-height: 1;
+				padding: 5px 5px;
+			}
+			.level3 {
+				display: inline-block;
 
-        border-radius: 2px;
-        border: 1px solid #91d5fe;
-        font-size: 14px;
-        color: #91d5fe;
-        line-height: 1;
-        padding: 5px 5px;
-      }
-    }
-  }
+				border-radius: 2px;
+				border: 1px solid #91d5fe;
+				font-size: 14px;
+				color: #91d5fe;
+				line-height: 1;
+				padding: 5px 5px;
+			}
+		}
+	}
 }
 .sub {
-  overflow: hidden;
-  margin-top: 16px;
-  & > div {
-    width: 260px;
-    height: 472px;
-    display: flex;
-    flex-direction: column;
-  }
-  .sub-left {
-    float: left;
-  }
-  .sub-right {
-    float: right;
-  }
-  .sub-tit {
-    img {
-      width: 20px;
-      height: 20px;
-      vertical-align: sub;
-      margin-right: 5px;
-    }
-    width: 100%;
-    padding-left: 20px;
-    height: 40px;
-    line-height: 40px;
-    font-size: 16px;
-    font-family: PingFangSC-Semibold, PingFang SC;
-    font-weight: 600;
-    color: #ffffff;
-    background: linear-gradient(
-      270deg,
-      rgba(10, 16, 75, 0) 0%,
-      rgba(8, 56, 105, 0.11) 33%,
-      rgba(6, 116, 151, 0.91) 75%,
-      #00ffff 100%
-    );
-  }
-  .sub-content {
-    flex: 1;
-    box-shadow: 0px 1px 0px 0px rgba(139, 177, 237, 0.5);
-    background-color: rgba(139, 177, 237, 0.15);
-  }
-  .sub-item {
-    font-size: 16px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #ffffff;
-    line-height: 22px;
-    padding: 0 32px;
-    margin: 16px 0;
-    .sub-item-tit {
-      color: #00ffff;
-    }
-  }
+	overflow: hidden;
+	margin-top: 16px;
+	& > div {
+		width: 260px;
+		height: 472px;
+		display: flex;
+		flex-direction: column;
+	}
+	.sub-left {
+		float: left;
+	}
+	.sub-right {
+		float: right;
+	}
+	.sub-tit {
+		img {
+			width: 20px;
+			height: 20px;
+			vertical-align: sub;
+			margin-right: 5px;
+		}
+		width: 100%;
+		padding-left: 20px;
+		height: 40px;
+		line-height: 40px;
+		font-size: 16px;
+		font-family: PingFangSC-Semibold, PingFang SC;
+		font-weight: 600;
+		color: #ffffff;
+		background: linear-gradient(
+			270deg,
+			rgba(10, 16, 75, 0) 0%,
+			rgba(8, 56, 105, 0.11) 33%,
+			rgba(6, 116, 151, 0.91) 75%,
+			#00ffff 100%
+		);
+	}
+	.sub-content {
+		flex: 1;
+		box-shadow: 0px 1px 0px 0px rgba(139, 177, 237, 0.5);
+		background-color: rgba(139, 177, 237, 0.15);
+	}
+	.sub-item {
+		font-size: 16px;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #ffffff;
+		line-height: 22px;
+		padding: 0 32px;
+		margin: 16px 0;
+		.sub-item-tit {
+			color: #00ffff;
+		}
+	}
 }
-</style>
\ No newline at end of file
+</style>