大屏

src/main/java/com/lsw/controller/BigScreenController.java

@@ -1,5 +1,7 @@
 package com.lsw.controller;
 
+import com.alibaba.fastjson.JSONArray;
+import com.alibaba.fastjson.JSONObject;
 import com.jfinal.kit.JsonKit;
 import com.jfinal.kit.Kv;
 import com.jfinal.plugin.activerecord.Db;
@@ -12,15 +14,7 @@ import java.util.stream.Collectors;
 
 public class BigScreenController extends BaseController {
     public void index() {
-/*        String ID = getPara("ID", "ZMMMGm5mnGCE4WvWFeI");//部门ID
-        set("look", getPara("look"));
-        set("ip", getPara("ip", "192.168.0.251"));
-        set("DOMAINID", getPara("DOMAINID", "uumsxrgm1KEEqSZIoHs"));
-        set("ID", ID); //部门ID
-        set("time_name", getPara("time_name", "CLGF220叉装车"));
-
-        set("begin", "2021-06-01");//TimeUtil.getDay("firstDay")
-        set("end", TimeUtil.getDay("lastDay"));//TimeUtil.getDay("lastDay")
+        String ID = "ZMMMGm5mnGCE4WvWFeI";//部门ID
         List<Record> department_list = Db.template("department", Kv.by("ID", ID)).find();
         List<Record> list = department_list.stream().filter(r -> r.get("ID").equals(ID)).collect(Collectors.toList());
         for (Record record : list) {
@@ -42,10 +36,22 @@ public class BigScreenController extends BaseController {
         }
         List<Record> prouname = Db.template("prouname").find();
         set("prouname", JsonKit.toJson(prouname));
-        set("department", JsonKit.toJson(list));*/
+        set("department", JsonKit.toJson(list));
         render("index.html");
     }
 
+    //试验次数
+    public void cs() {
+        List<Record> list = Db.template("cs", getParam()).find();
+        renderJson(Kv.by("data", list));
+    }
+
+    //实验完成率
+    public void finish_s() {
+        List<Record> list = Db.template("finish_s", getParam()).find();
+        renderJson(Kv.by("data", list));
+    }
+
     //待完成试验
     public void no_examine() {
         List<Record> list = Db.template("no_examine", getParam()).find();
@@ -57,4 +63,33 @@ public class BigScreenController extends BaseController {
         List<Record> list = Db.template("examine", getParam()).find();
         renderJson(Kv.by("data", list));
     }
+
+    //样机改装信息
+    public void yj() {
+        List<Record> list = Db.template("yj", getParam()).find();
+        List<Record> logs = Db.find("select ITEM_TLOG,ITEM_KEY from tlk_myjcs where item_tlog is not null");
+        for (Record record : list) {
+            int i = 0;
+            List<Record> records = logs.stream().filter(r -> r.get("ITEM_KEY").equals(record.get("ITEM_KEY"))).collect(Collectors.toList());
+            if (!records.isEmpty()) {
+                for (Record re : records) {
+                    JSONArray array = JSONArray.parseArray(re.get("ITEM_TLOG"));
+                    i += array.size() - 1;
+                }
+            }
+            record.set("num", i);
+        }
+        renderJson(Kv.by("data", list));
+    }
+
+    //已完成试验
+    public void yj_list() {
+        List<Record> list = Db.template("yj_list", getParam()).find();
+        renderJson(Kv.by("data", list));
+    }
+    //设备资产
+    public void zc() {
+        List<Record> list = Db.template("yj_list", getParam()).find();
+        renderJson(Kv.by("data", list));
+    }
 }

src/main/resources/big.sql

@@ -1,13 +1,71 @@
 ###大屏所有sql语句
 
+
+###试验次数
+#sql("cs")
+SELECT COUNT(*)c,
+
+#if(CREATED=='year')
+to_char(e.CREATED,'yyyy')x
+#end
+#if(CREATED=='quarter')
+to_char(e.CREATED,'q')x
+#end
+#if(CREATED=='month')
+to_char(e.CREATED,'mm')x
+#end
+FROM
+    tlk_examine e
+        LEFT OUTER JOIN t_user t ON e.author = t.id
+        LEFT OUTER JOIN t_department d ON t.defaultdepartment = d.id
+        WHERE 1=1
+#if(ID)
+AND e.author_dept_index LIKE #para(ID, "like")
+#end
+#if(item_product)
+AND e.item_product =#para(item_product)
+#end
+#if(CREATED=='year')
+GROUP BY to_char(e.CREATED,'yyyy')
+#end
+ #if(CREATED=='quarter')
+AND to_char(e.CREATED,'yyyy')=to_char(sysdate,'yyyy')
+GROUP BY to_char(e.CREATED,'q')
+#end
+#if(CREATED=='month')
+AND to_char(e.CREATED,'yyyy')=to_char(sysdate,'yyyy')
+GROUP BY to_char(e.CREATED,'mm')
+#end
+ORDER BY x ASC
+#end
+
+###样机改装信息
+#sql("yj")
+SELECT
+    item_name,item_xl_num,item_key
+FROM
+    tlk_myjcs
+WHERE
+    item_upbh IS NULL group by item_name,item_xl_num,item_key
+#end
+
 ###实验完成率
-#sql("finishs")
+#sql("finish_s")
 select count(0)as count, case  when e.STATELABEL = '结束' then '结束' else '未结束' end AS tag  from tlk_examine e
-    left outer join t_user on t_user.ID=author
-    left outer join t_department on t_user.defaultdepartment=t_department.ID
-where e.DOMAINID=#para(DOMAINID) and t_department.ID in (select  ID from t_department start with ID=#para(ID) connect by prior ID=superior)
-   and e.created between to_date(#para(begin),'yyyy-mm-dd hh24:mi:ss') and to_date(#para(end),'yyyy-mm-dd hh24:mi:ss')
-   and e.STATELABEL is not null group by  case  when e.STATELABEL = '结束'  then '结束' else '未结束' end
+left outer join t_user on t_user.ID=author
+left outer join t_department on t_user.defaultdepartment=t_department.ID
+where e.STATELABEL is not null
+
+#if(CREATED=='year')
+AND to_char(e.CREATED,'yyyy')=to_char(sysdate,'yyyy')
+#end
+#if(CREATED=='quarter')
+AND to_char(e.CREATED,'q')=to_char(sysdate,'q') AND to_char(e.CREATED,'yy')=to_char(sysdate,'yy')
+#end
+#if(CREATED=='month')
+AND to_char(e.CREATED,'yyyy-mm')=to_char(sysdate,'yyyy-mm')
+#end
+group by  case  when e.STATELABEL = '结束'  then '结束' else '未结束' end
 #end
 
 
@@ -21,15 +79,63 @@ FROM
     ( SELECT docid, round(SUM(to_number(to_date(to_char(processtime, 'yyyy-mm-dd hh24:mi:ss'), 'yyyy-mm-dd hh24:mi:ss') - to_date(to_char(actiontime, 'yyyy-mm-dd hh24:mi:ss'), 'yyyy-mm-dd hh24:mi:ss')) * 24 * 60)) AS item_vtime
       FROM t_relationhis GROUP BY docid) t ON t.docid=e.id
 WHERE statelabel != '结束' AND statelabel IS NOT NULL
+
+#if(CREATED=='year')
+AND to_char(e.CREATED,'yyyy')=to_char(sysdate,'yyyy')
+#end
+#if(CREATED=='quarter')
+AND to_char(e.CREATED,'q')=to_char(sysdate,'q') AND to_char(e.CREATED,'yy')=to_char(sysdate,'yy')
+#end
+#if(CREATED=='month')
+AND to_char(e.CREATED,'yyyy-mm')=to_char(sysdate,'yyyy-mm')
+#end
+
 #end
 
 ###已完成试验
 #sql("examine")
 SELECT
-    ITEM_TITLE,
-    ITEM_TEST_CONCLUSION
+    e.ITEM_TITLE,
+    e.ITEM_TEST_CONCLUSION
 FROM
-    tlk_examine
-WHERE statelabel = '结束'
+    tlk_examine e
+WHERE e.statelabel = '结束'
+
+#if(CREATED=='year')
+AND to_char(e.CREATED,'yyyy')=to_char(sysdate,'yyyy')
+#end
+#if(CREATED=='quarter')
+AND to_char(e.CREATED,'q')=to_char(sysdate,'q') AND to_char(e.CREATED,'yy')=to_char(sysdate,'yy')
+#end
+#if(CREATED=='month')
+AND to_char(e.CREATED,'yyyy-mm')=to_char(sysdate,'yyyy-mm')
+#end
+
+#end
+
+###设备资产
+#sql("count")
+SELECT
+    ( SELECT count( * ) FROM tlk_equipment ) AS alls,
+    ( SELECT count( * ) FROM tlk_equipment WHERE item_sttxu = '封存' ) AS fc,
+    ( SELECT count( * ) FROM tlk_equipment WHERE item_sttxu = '可用' ) AS ky,
+    ( SELECT count( * ) FROM tlk_equipment WHERE item_toolstate = '2' ) AS sy
+FROM
+    tlk_equipment
+WHERE ROWNUM = 1
+#end
+
+###样机列表
+#sql("yj_list")
+select ITEM_NAME,ITEM_VERSION,ITEM_XL_NUM,CREATED from tlk_myjcs where ITEM_UPBH IS NULL
+order by CREATED desc
+#end
+
+###使用时长条形图
+#sql("zc_time")
+select *from
+(select ITEM_DEVID,ITEM_EQUNR,ITEM_EQKTX,round(NVL(SUM(to_number(to_date(to_char(ITEM_RETURNING_DATE, 'yyyy-mm-dd hh24:mi:ss'), 'yyyy-mm-dd hh24:mi:ss') - to_date(to_char(ITEM_BORROWING_DATE
+GROUP BY ITEM_DEVID,ITEM_EQUNR,ITEM_EQKTX ORDER BY item_vtime DESC)
+where ROWNUM <= 10
 #end
 

src/main/webapp/WEB-INF/view/big-screen/index.html

@@ -6,7 +6,7 @@
     <link rel="stylesheet" href="#(path)/static/big-screen/css/comon0.css">
     <link rel="stylesheet" href="#(path)/static/js/element-ui.css">
 </head>
-<body>
+<body style="background:#000d4a url('#(path)/static/big-screen/images/bg.jpg') center top; background-size:cover;">
 <div id="app">
     <div class="loading">
         <div class="loadbox"><img src="#(path)/static/big-screen/images/loading.gif"> 页面加载中...</div>
@@ -24,29 +24,33 @@
         <ul class="clearfix">
             <li>
                 <!--试验次数-->
-                <div class="boxall" style="height: 3.2rem;">
+                <div class="boxall panel" style="height: 3.2rem;">
                     <div class="mvp">
                         <div class="vtitle">试验次数</div>
                         <el-form :inline="true" label-width="auto" class="inline">
                             <el-form-item prop="state">
-                                <el-cascader v-model="param.value" :options="options" placeholder="实验部门"
-                                             class="els" :props="props" @change="handleChange" :show-all-levels="false"
-                                             clearable></el-cascader>
+                                <el-cascader ref="cs" v-model="param.value" :options="options" placeholder="部门"  class="els" :props="props" @change="handleChange" :show-all-levels="false"  clearable></el-cascader>
                             </el-form-item>
                             <el-form-item>
-                                <el-select placeholder="产品线" v-model="param.item_pro_type" class="els">
-                                    <el-option v-for="(item,index) in prouname" :key="index"
-                                               :value="item.ITEM_DIC_PROUNAME" :label="item.ITEM_DIC_PROUNAME">
-                                    </el-option>
+                                <el-select placeholder="产品线" v-model="param.item_product" class="els" @change="change($event,'cs')" clearable>
+                                    <el-option v-for="(item,index) in prouname" :key="index" :value="item.ITEM_DIC_PROUNAME" :label="item.ITEM_DIC_PROUNAME"></el-option>
                                 </el-select>
                             </el-form-item>
                         </el-form>
+                        <div class="serig">
+                            <span class="sec" :class="{active:cs_index==index}" v-for="(item, index) in date" :key="index" @click="change_date('cs',item.value,cs_index=index,)">{{item.name}}</span>
+                        </div>
                     </div>
                     <div class="allnav" id="chart1"></div>
                 </div>
                 <!--试验完成率-->
                 <div class="boxall" style="height: 3.2rem">
-                    <div class="mvp">试验完成率</div>
+                    <div class="mvp">
+                        <div class="vtitle">试验完成率</div>
+                        <div class="serig">
+                            <span class="sec" :class="{active:finish_s_index==index}" v-for="(item, index) in date" :key="index" @click="change_date('finish_s',item.value,finish_s_index=index,)">{{item.name}}</span>
+                        </div>
+                    </div>
                     <div class="allnav" id="chart2"></div>
                 </div>
             </li>
@@ -59,7 +63,23 @@
                 <!-- 样机改装信息-->
                 <div class="boxall" style="height: 3.2rem;">
                     <div class="mvp"> 样机改装信息</div>
-                    <div class="allnav" id="chart4"></div>
+                    <div class="allnav">
+                        <div class="flex bsd">
+                            <div class="f omit tl">样机名称</div>
+                            <div class="f omit cn" style="flex: 0.4;">序列号</div>
+                            <div class="f omit cn" style="flex: 0.4;">变更次数</div>
+                        </div>
+                        <div id="a3_marquee-view" class="marquee-view">
+                            <div id="a3_comment1">
+                                <div class="row" v-for="(item, index) in yj_data" :key="index">
+                                    <span class="col omit tl">{{item.ITEM_NAME}}</span>
+                                    <span class="col omit cn" style="flex: 0.4;">{{item.ITEM_XL_NUM}}</span>
+                                    <span class="col omit cn" style="flex: 0.4;">{{item.num}}</span>
+                                </div>
+                            </div>
+                            <div id="a3_comment2"></div>
+                        </div>
+                    </div>
                 </div>
             </li>
             <li>
@@ -78,8 +98,26 @@
                 </div>
                 <!--能源管理-->
                 <div class="boxall" style="height: 3.2rem;">
-                    <div class="mvp">能源管理</div>
-                    <div class="allnav" id="chart6"></div>
+                    <div class="mvp">样机列表</div>
+                    <div class="allnav">
+                        <div class="flex bsd">
+                            <div class="f omit tl">样机名称</div>
+                            <div class="f omit cn" style="flex: 0.4;">版本</div>
+                            <div class="f omit cn" style="flex: 0.6;">序列号</div>
+                            <div class="f omit cn" style="flex: 0.6;">创建时间</div>
+                        </div>
+                        <div class="marquee-view">
+                            <div>
+                                <div class="row" v-for="(item, index) in yj_list" :key="index">
+                                    <span class="col omit tl">{{item.ITEM_NAME}}</span>
+                                    <span class="col omit cn" style="flex: 0.4;">{{item.ITEM_VERSION}}</span>
+                                    <span class="col omit cn" style="flex: 0.6;">{{item.ITEM_XL_NUM}}</span>
+                                    <span class="col omit cn" style="flex: 0.6;">{{item.CREATED}}</span>
+                                </div>
+                            </div>
+                            <div></div>
+                        </div>
+                    </div>
                 </div>
             </li>
         </ul>
@@ -87,7 +125,12 @@
             <!--待完成试验-->
             <div class="f">
                 <div class="boxall" style="height:3.2rem">
-                    <div class="mvp">待完成试验</div>
+                    <div class="mvp">
+                        <div class="vtitle">待完成试验({{no_examine_list.length}})</div>
+                        <div class="serig">
+                            <span class="sec" :class="{active:no_examine_index==index}" v-for="(item, index) in date" :key="index" @click="change_date('no_examine',item.value,no_examine_index=index,)">{{item.name}}</span>
+                        </div>
+                    </div>
                     <div class="allnav">
                         <div class="flex bsd">
                             <div class="f omit tl">标题</div>
@@ -112,7 +155,12 @@
             <!--已完成试验-->
             <div class="f">
                 <div class="boxall" style="height:3.2rem">
-                    <div class="mvp">已完成试验</div>
+                    <div class="mvp">
+                        <div class="vtitle">已完成试验({{examine_list.length}})</div>
+                        <div class="serig">
+                            <span class="sec" :class="{active:examine_index==index}" v-for="(item, index) in date" :key="index" @click="change_date('examine',item.value,examine_index=index,)">{{item.name}}</span>
+                        </div>
+                    </div>
                     <div class="allnav">
                         <div class="flex bsd">
                             <div class="f omit tl">标题</div>
@@ -141,46 +189,79 @@
 <script type="text/javascript" src="#(path)/static/big-screen/js/js.js"></script>
 <script type="text/javascript" src="#(path)/static/js/layer/layer.js"></script>
 <script>
+    var options=#(department);
+    var prouname=#(prouname);
     let vm = new Vue({
         el: "#app",
         data: {
             param: {
-                DOMAINID: '#(DOMAINID)',
-                ID: '#(ID)',
                 value: ['#(value)'],
-                begin: '#(begin)',
-                end: '#(end)',
-                created: ['#(begin)', '#(end)']
+                CREATED:'year',
             },
-            prouname: [], //产品线
             props: {
                 value: 'ID',
                 label: 'NAME',
                 checkStrictly: true
             },
-            options: [],
+            date:[{name:'年',value:'year'},{name:'季',value:'quarter'},{name:'月',value:'month'}],
+            finish_s_index:0,
+            no_examine_index:0,
+            examine_index:0,
+            cs_index:0,
+            yj_data:[],//样机改装信息
+            yj_list:[],//样机列表
             no_examine_list: [],//待完成试验
             examine_list: [],//已完成试验
+            options:options, //部门
+            prouname:prouname, //产品线
         },
         mounted() {
             this.getData();
+            //this.finish_s();
+            //this.yj();
             //this.no_examine();
+            //this.yj2();
             //this.examine();
+            this.cs();
         },
         methods: {
             getData() {
                 setTimeout(() => {
-                    chart1();
-                    chart2();
                     chart3();
-                    chart4();
                     chart5();
-                    chart6();
-                    roll(100); //初始化滚动
                 }, 500)
 
 
             },
+            change_date(tag,value){
+                this.param.CREATED=value;
+                if(tag=='cs'){
+                    this.cs();
+                }
+                if(tag=='finish_s'){
+                    this.finish_s();
+                }
+                if(tag=='no_examine'){
+                   this.no_examine();
+               }
+               if(tag=='examine'){
+                    this.examine();
+                }
+            },
+            //试验次数
+            cs() {
+                sendAjax("#(path)/big/cs", this.param, res => {
+                    cancelLoding();
+                    chart1(res.data);
+                })
+            },
+            //实验完成率
+            finish_s() {
+                sendAjax("#(path)/big/finish_s", this.param, res => {
+                    cancelLoding();
+                    chart2(res.data);
+                })
+            },
             //待完成试验
             no_examine() {
                 sendAjax("#(path)/big/no_examine", this.param, res => {
@@ -195,8 +276,31 @@
                     vm.examine_list = res.data;
                 })
             },
+            //样机改装信息
+            yj() {
+                sendAjax("#(path)/big/yj", this.param, res => {
+                    cancelLoding();
+                    vm.yj_data=res.data;
+                })
+            },
+            //样机列表
+            yj2() {
+                sendAjax("#(path)/big/yj_list", this.param, res => {
+                    cancelLoding();
+                    vm.yj_list=res.data;
+                })
+            },
+            //选择部门
             handleChange(value) {
-                this.param.ID = value[value.length - 1]
+                this.param.ID = value[value.length - 1];
+                this.$refs.cs.dropDownVisible = false;
+                this.cs();
+            },
+            //选择产品线
+            change(value,tag){
+                if(tag=='cs'){
+                    this.cs();
+                }
             },
             //设置全屏
             fullScreen() {

src/main/webapp/static/big-screen/css/comon0.css

@@ -1,7 +1,7 @@
 @charset "utf-8";
 *{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
 *,body{padding:0px;	margin:0px;font-family: "微软雅黑";}
-body{ background:#000d4a url('#(path)/static/big-screen/images/bg.jpg') center top; background-size:cover;color:#666;font-size: .1rem;}
+body{color:#666;font-size: .1rem;}
 li{ list-style-type:none;}
 i{ margin:0px; padding:0px; text-indent:0px;}
 img{ border:none; max-width: 100%;}
@@ -28,9 +28,17 @@ a:hover{ color:#06c; text-decoration: none!important}
 .head h1{ color:#b2b2b2; text-align: center; font-size: .4rem; line-height:.8rem;font-family: cursive;}
 .head h1 img{ width:1.5rem; display: inline-block; vertical-align: middle; margin-right: .2rem}
 .mainbox{ padding:.1rem .1rem 0rem .1rem;}
-.mainbox>ul>li{ width: 30%;float: left; padding: 0 .1rem}
-.mainbox>ul>li:nth-child(2){ width: 40%;padding: 0}
-.boxall{border: 0px;overflow: hidden;padding-top: 0.5rem;background-color: rgba(101,132,226,.15);background-size:inherit; position: relative; margin-bottom: .15rem; z-index: 10;}
+.mainbox>ul>li{ width: 33.33%;float: left; padding: 0 .1rem}
+.boxall{
+	border: 0px;
+	overflow: hidden;
+	padding-top: 0.5rem;
+	background-color: rgba(101,132,226,.15);
+	background-size:inherit;
+	position: relative;
+	margin-bottom: .15rem;
+	z-index: 10;
+}
 .boxall:before,.boxall:after{position: absolute;width: .3rem;height: .3rem;content: "";border: 0px!important;}
 .boxall:before,.boxfoot:before{border: 0px!important;}
 .boxall:after,.boxfoot:after{border: 0px!important;}
@@ -81,7 +89,10 @@ a:hover{ color:#06c; text-decoration: none!important}
 .bf{color: white;text-align: center;padding: 0.1rem;}
 .cn{text-align:center;}
 .vtitle{color: white;}
-.inline{float: right;margin-top: -30px;}
+.inline{float: left;margin-top: -30px;margin-left: 1rem}
+.serig{float: right;margin-top: -21px}
+.sec{padding: 3px 10px;cursor: pointer;border-radius: 3px;}
+.sec.active{background-color: #000d4a;}
 .el-input__inner{height: 27px!important;}
 .els{width: 100px;}
 .col {
@@ -209,4 +220,9 @@ body::-webkit-scrollbar {
 .m3{
 	margin-top: -0.3rem;
 }
-.chart{height: 1.8rem;}
+.chart{height: 1.8rem;}
+.el-input__inner{
+	background-color: #1c2b67!important;
+	border: 1px solid #1d2c67!important;
+	color: white!important;
+}

src/main/webapp/static/big-screen/js/js.js

@@ -17,6 +17,20 @@ $(document).ready(function() {
 //试验次数
 function chart1(data) {
 	let myChart = echarts.init(document.getElementById('chart1'));
+	let xAxis=[];
+	let series_data=[];
+	data.forEach(item=>{
+		if(item.X.length==4){
+			xAxis.push(item.X+'年');
+		}
+		if(item.X.length==2){
+			xAxis.push(item.X+'月');
+		}
+		if(item.X.length==1){
+			xAxis.push(item.X+'季度');
+		}
+		series_data.push(item.C);
+	})
 	let option = {
 		tooltip: {
 			trigger: 'axis',
@@ -32,14 +46,13 @@ function chart1(data) {
 			containLabel: true
 		},
 		color: ['#23abca'],
-		xAxis: [{
-			data: ['2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'],
-			axisLine: options().yAxis.axisLine
+		xAxis: [{data: xAxis,
+			axisLine: chart_option().yAxis.axisLine
 		}],
-		yAxis: options().yAxis,
+		yAxis: chart_option().yAxis,
 		series: [{
 				type: 'bar',
-				data: [1235, 2300, 1221, 3420, 2321, 1036, 2567, 1700],
+				data: series_data,
 				barWidth: '35%', //柱子宽度
 				itemStyle: {
 					normal: {
@@ -66,6 +79,10 @@ function chart1(data) {
 //渠道占比
 function chart2(data) {
 	let myChart = echarts.init(document.getElementById('chart2'));
+	let list=[];
+	data.forEach(item=>{
+		list.push({value:item.COUNT,name:item.TAG});
+	});
 	let option = {
 		tooltip: {
 			trigger: 'axis',
@@ -86,13 +103,7 @@ function chart2(data) {
 						}
 					}
 				},
-				data: [{
-					value: 1048,
-					name: '已完成'
-				}, {
-					value: 735,
-					name: '未完成'
-				}]
+				data:list
 			}
 
 		]
@@ -123,59 +134,9 @@ function chart3(data) {
 		color: ['#23abca'],
 		xAxis: [{
 			data: ['2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'],
-			axisLine: options().yAxis.axisLine
-		}],
-		yAxis: options().yAxis,
-		series: [{
-				type: 'bar',
-				data: [1235, 2300, 1221, 3420, 2321, 1036, 2567, 1700],
-				barWidth: '35%', //柱子宽度
-				itemStyle: {
-					normal: {
-						opacity: 1,
-						barBorderRadius: [5, 5, 0, 0],
-						label: {
-							show: true,
-							position: 'top',
-							textStyle: {
-								color: 'rgba(255,255,255,.6)'
-							}
-						}
-					}
-				}
-			}
-
-		]
-	};
-	myChart.setOption(option);
-	window.addEventListener("resize", function() {
-		myChart.resize();
-	});
-}
-//样机改装信息
-function chart4(data) {
-	let myChart = echarts.init(document.getElementById('chart4'));
-	data = [35, 23, 21, 23, 21, 36, 7, 17, 9];
-	let option = {
-		tooltip: {
-			trigger: 'axis',
-			axisPointer: {
-				type: "shadow"
-			}
-		},
-		grid: {
-			left: '5%',
-			top: '20%',
-			right: '5%',
-			bottom: '3%',
-			containLabel: true
-		},
-		color: ['#23abca'],
-		xAxis: [{
-			data: ['2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'],
-			axisLine: options().yAxis.axisLine
+			axisLine: chart_option().yAxis.axisLine
 		}],
-		yAxis: options().yAxis,
+		yAxis: chart_option().yAxis,
 		series: [{
 				type: 'bar',
 				data: [1235, 2300, 1221, 3420, 2321, 1036, 2567, 1700],
@@ -223,9 +184,9 @@ function chart5(data) {
 		color: ['#23abca'],
 		xAxis: [{
 			data: ['2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'],
-			axisLine: options().yAxis.axisLine
+			axisLine: chart_option().yAxis.axisLine
 		}],
-		yAxis: options().yAxis,
+		yAxis: chart_option().yAxis,
 		series: [{
 				type: 'bar',
 				data: [1235, 2300, 1221, 3420, 2321, 1036, 2567, 1700],
@@ -273,9 +234,9 @@ function chart6(data) {
 		color: ['#23abca'],
 		xAxis: [{
 			data: ['2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'],
-			axisLine: options().yAxis.axisLine
+			axisLine: chart_option().yAxis.axisLine
 		}],
-		yAxis: options().yAxis,
+		yAxis: chart_option().yAxis,
 		series: [{
 				type: 'bar',
 				data: [1235, 2300, 1221, 3420, 2321, 1036, 2567, 1700],
@@ -303,36 +264,52 @@ function chart6(data) {
 	});
 }
 //向上滚动
-function roll(t) {
-	//滚动排行1
+function roll(t,tag) {
+	//待完成试验滚动
 	let ul1 = document.getElementById("comment1");
 	let ul2 = document.getElementById("comment2");
 	let ulbox = document.getElementById("marquee-view");
 	ul2.innerHTML = ul1.innerHTML;
 	ulbox.scrollTop = 0; // 开始无滚动时设为0
-	let timer = setInterval(rollStart, t, 1); // 设置定时器，参数t用在这为间隔时间（单位毫秒），参数t越小，滚动速度越快
+	let timer = setInterval(rollStart, t, tag); // 设置定时器，参数t用在这为间隔时间（单位毫秒），参数t越小，滚动速度越快
 	// 鼠标移入div时暂停滚动
 	ulbox.onmouseover = function() {
 		clearInterval(timer);
 	}
 	// 鼠标移出div后继续滚动
 	ulbox.onmouseout = function() {
-		timer = setInterval(rollStart, t, 1);
+		timer = setInterval(rollStart, t, tag);
 	}
-	//滚动排行2
+	//已完成试验滚动
 	var a2_ul1 = document.getElementById("a2_comment1");
 	var a2_ul2 = document.getElementById("a2_comment2");
 	var a2_ulbox = document.getElementById("a2_marquee-view");
 	a2_ul2.innerHTML = a2_ul1.innerHTML;
 	a2_ulbox.scrollTop = 0; // 开始无滚动时设为0
-	var timer2 = setInterval(rollStart, t, 2); // 设置定时器，参数t用在这为间隔时间（单位毫秒），参数t越小，滚动速度越快
+	var timer2 = setInterval(rollStart, t, tag); // 设置定时器，参数t用在这为间隔时间（单位毫秒），参数t越小，滚动速度越快
 	// 鼠标移入div时暂停滚动
 	a2_ulbox.onmouseover = function() {
 		clearInterval(timer2);
 	}
 	// 鼠标移出div后继续滚动
 	a2_ulbox.onmouseout = function() {
-		timer2 = setInterval(rollStart, t, 2);
+		timer2 = setInterval(rollStart, t, tag);
+	}
+
+	//样机改装信息滚动
+	var a3_ul1 = document.getElementById("a3_comment1");
+	var a3_ul2 = document.getElementById("a3_comment2");
+	var a3_ulbox = document.getElementById("a3_marquee-view");
+	a3_ul2.innerHTML = a3_ul1.innerHTML;
+	a3_ulbox.scrollTop = 0; // 开始无滚动时设为0
+	var timer3 = setInterval(rollStart, t, tag); // 设置定时器，参数t用在这为间隔时间（单位毫秒），参数t越小，滚动速度越快
+	// 鼠标移入div时暂停滚动
+	a3_ulbox.onmouseover = function() {
+		clearInterval(timer3);
+	}
+	// 鼠标移出div后继续滚动
+	a3_ulbox.onmouseout = function() {
+		timer3 = setInterval(rollStart, t, tag);
 	}
 }
 // 开始滚动函数
@@ -340,7 +317,6 @@ function rollStart(index) {
 	if (index == 1) {
 		// 上面声明的DOM对象为局部对象需要再次声明
 		let ul1 = document.getElementById("comment1");
-		let ul2 = document.getElementById("comment2");
 		let ulbox = document.getElementById("marquee-view");
 		// 正常滚动不断给scrollTop的值+1,当滚动高度大于列表内容高度时恢复为0
 		if (ulbox.scrollTop >= ul1.scrollHeight) {
@@ -351,7 +327,6 @@ function rollStart(index) {
 	}
 	if (index == 2) {
 		let a2_ul1 = document.getElementById("a2_comment1");
-		let a2_ul2 = document.getElementById("a2_comment2");
 		let a2_ulbox = document.getElementById("a2_marquee-view");
 		// 正常滚动不断给scrollTop的值+1,当滚动高度大于列表内容高度时恢复为0
 		if (a2_ulbox.scrollTop >= a2_ul1.scrollHeight) {
@@ -360,4 +335,14 @@ function rollStart(index) {
 			a2_ulbox.scrollTop++;
 		}
 	}
+	if (index == 3) {
+		let a3_ul1 = document.getElementById("a3_comment1");
+		let a3_ulbox = document.getElementById("a3_marquee-view");
+		// 正常滚动不断给scrollTop的值+1,当滚动高度大于列表内容高度时恢复为0
+		if (a3_ulbox.scrollTop >= a3_ul1.scrollHeight) {
+			a3_ulbox.scrollTop = 0;
+		} else {
+			a3_ulbox.scrollTop++;
+		}
+	}
 }

src/main/webapp/static/js/common.js

@@ -79,7 +79,7 @@ function sendAjax(url, param, callback) {
         }
     });
 }
-var options = function() {
+var chart_option = function() {
     return {
         toolbox: {
             show: true,