前端页面完成

src/assets/common/css/theme.less

@@ -351,6 +351,17 @@
     -moz-osx-font-smoothing: grayscale;
 }
 
+.themeColor {
+    color: @themeColor;
+}
+
+.shadowBox {
+    border: 1px solid #dfdfdf;
+    padding: 12px 24px;
+    box-shadow: 0 4px 9px #dcdcdc;
+    border-radius: 3px;
+}
+
 
 
 

src/components/echarts/lineChart.vue

@@ -0,0 +1,172 @@
+<template>
+    <div class="linechart" id="aa"></div>
+</template>
+
+<script>
+import echarts from "echarts";
+
+export default {
+    name: "lineChart",
+    props: {
+        LineChartData: {
+            text: String, //标题  不需要标题可不传
+            titleSize: {
+                //标题大小
+                type: Number,
+                default: 20,
+            },
+            download: {
+                //是否显示下载按钮
+                type: Boolean,
+                default: false,
+            },
+            data: [],
+        },
+    },
+    data() {
+        return {
+            tipData: [], //线数据
+            showData: [], //展示数据
+            // text: this.LineChartData.text, //大标题
+            // titleSize: this.LineChartData.titleSize, //标题大小
+            // download: this.LineChartData.download,
+        };
+    },
+    computed: {
+        text() {
+            return this.LineChartData.text;
+        },
+        titleSize() {
+            return this.LineChartData.titleSize;
+        },
+        download() {
+            return this.LineChartData.download;
+        },
+    },
+    mounted() {
+        // this.drawLine();
+        // import * as echarts from "echarts";
+
+        // 基于准备好的dom，初始化echarts实例
+        let myChart = this.$echarts.init(document.getElementById("aa"));
+
+        let option = {
+            xAxis: {
+                data: ["A", "B", "C", "D", "E"],
+            },
+            yAxis: {},
+            series: [
+                {
+                    data: [10, 22, 28, 23, 19],
+                    type: "line",
+                    smooth: true,
+                },
+            ],
+        };
+        myChart.setOption(option);
+    },
+    methods: {
+        //绘制图表
+        drawLine() {
+            // 基于准备好的dom，初始化echarts实例
+            let id = "echartBar" + Math.random() * 1000;
+            this.$el.setAttribute("id", id);
+            let myChartContainer = document.getElementById(id);
+            // let myChartChina = echarts.init(myChartContainer);
+            let myChartChina = echarts.init("aa");
+            // 绘制图表
+            let optionMap = {
+                //折线图配置数据
+                color: ["#6cacaf", "#e4a526", "#e4391d", "#a1cb37", "#8c97cb"],
+                title: {
+                    x: "center",
+                    text: this.text,
+                    textStyle: {
+                        fontSize: this.titleSize,
+                    },
+                },
+                tooltip: {
+                    trigger: "axis",
+                },
+                legend: {
+                    top: [30],
+                    data: this.tipData,
+                },
+                grid: {
+                    left: "3%",
+                    right: "4%",
+                    bottom: "3%",
+                    containLabel: true,
+                },
+                toolbox: {
+                    show: this.download,
+                    top: [5],
+                    right: [20],
+                    feature: {
+                        saveAsImage: {},
+                    },
+                },
+                xAxis: {
+                    interval: ["0"], //标签显示间隔
+                    type: "category",
+                    boundaryGap: false,
+                    data: [
+                        "1月",
+                        "2月",
+                        "3月",
+                        "4月",
+                        "5月",
+                        "6月",
+                        "7月",
+                        "8月",
+                        "9月",
+                        "10月",
+                        "11月",
+                        "12月",
+                    ], //x轴数据
+                },
+                yAxis: {
+                    name: "(万元)",
+                    nameGap: [10],
+                    type: "value",
+                },
+                series: this.showData,
+            };
+            myChartChina.setOption(optionMap);
+            window.onresize = function () {
+                myChartChina.resize();
+            };
+        },
+    },
+    watch: {
+        "LineChartData.data": function (val) {
+            this.tipData = [];
+            this.showData = [];
+            for (let i = 0; i < val.length; i++) {
+                let obj = {
+                    //折线图需要的数据结构
+                    name: "",
+                    type: "line",
+                    data: [],
+                };
+                obj.name = val[i].name;
+                this.tipData.push(val[i].name);
+                for (let j = 0; j < val[i].monthlySales.length; j++) {
+                    obj.data.push(parseFloat(val[i].monthlySales[j]));
+                }
+                this.showData.push(obj);
+            }
+            this.drawLine();
+        },
+    },
+};
+</script>
+
+
+<style lang='less' scoped>
+.linechart {
+    width: 100%;
+    height: 300px;
+    margin: 0 auto;
+}
+</style>

src/components/echarts/lineChart1.vue

@@ -0,0 +1,172 @@
+<template>
+    <div class="linechart" id="ee"></div>
+</template>
+
+<script>
+import echarts from "echarts";
+
+export default {
+    name: "lineChart",
+    props: {
+        LineChartData: {
+            text: String, //标题  不需要标题可不传
+            titleSize: {
+                //标题大小
+                type: Number,
+                default: 20,
+            },
+            download: {
+                //是否显示下载按钮
+                type: Boolean,
+                default: false,
+            },
+            data: [],
+        },
+    },
+    data() {
+        return {
+            tipData: [], //线数据
+            showData: [], //展示数据
+            // text: this.LineChartData.text, //大标题
+            // titleSize: this.LineChartData.titleSize, //标题大小
+            // download: this.LineChartData.download,
+        };
+    },
+    computed: {
+        text() {
+            return this.LineChartData.text;
+        },
+        titleSize() {
+            return this.LineChartData.titleSize;
+        },
+        download() {
+            return this.LineChartData.download;
+        },
+    },
+    mounted() {
+        // this.drawLine();
+        // import * as echarts from "echarts";
+
+        // 基于准备好的dom，初始化echarts实例
+        let myChart = this.$echarts.init(document.getElementById("ee"));
+
+        let option = {
+            xAxis: {
+                data: ["A", "B", "C", "D", "E"],
+            },
+            yAxis: {},
+            series: [
+                {
+                    data: [10, 22, 28, 23, 19],
+                    type: "line",
+                    smooth: true,
+                },
+            ],
+        };
+        myChart.setOption(option);
+    },
+    methods: {
+        //绘制图表
+        drawLine() {
+            // 基于准备好的dom，初始化echarts实例
+            let id = "echartBar" + Math.random() * 1000;
+            this.$el.setAttribute("id", id);
+            let myChartContainer = document.getElementById(id);
+            // let myChartChina = echarts.init(myChartContainer);
+            let myChartChina = echarts.init("aa");
+            // 绘制图表
+            let optionMap = {
+                //折线图配置数据
+                color: ["#6cacaf", "#e4a526", "#e4391d", "#a1cb37", "#8c97cb"],
+                title: {
+                    x: "center",
+                    text: this.text,
+                    textStyle: {
+                        fontSize: this.titleSize,
+                    },
+                },
+                tooltip: {
+                    trigger: "axis",
+                },
+                legend: {
+                    top: [30],
+                    data: this.tipData,
+                },
+                grid: {
+                    left: "3%",
+                    right: "4%",
+                    bottom: "3%",
+                    containLabel: true,
+                },
+                toolbox: {
+                    show: this.download,
+                    top: [5],
+                    right: [20],
+                    feature: {
+                        saveAsImage: {},
+                    },
+                },
+                xAxis: {
+                    interval: ["0"], //标签显示间隔
+                    type: "category",
+                    boundaryGap: false,
+                    data: [
+                        "1月",
+                        "2月",
+                        "3月",
+                        "4月",
+                        "5月",
+                        "6月",
+                        "7月",
+                        "8月",
+                        "9月",
+                        "10月",
+                        "11月",
+                        "12月",
+                    ], //x轴数据
+                },
+                yAxis: {
+                    name: "(万元)",
+                    nameGap: [10],
+                    type: "value",
+                },
+                series: this.showData,
+            };
+            myChartChina.setOption(optionMap);
+            window.onresize = function () {
+                myChartChina.resize();
+            };
+        },
+    },
+    watch: {
+        "LineChartData.data": function (val) {
+            this.tipData = [];
+            this.showData = [];
+            for (let i = 0; i < val.length; i++) {
+                let obj = {
+                    //折线图需要的数据结构
+                    name: "",
+                    type: "line",
+                    data: [],
+                };
+                obj.name = val[i].name;
+                this.tipData.push(val[i].name);
+                for (let j = 0; j < val[i].monthlySales.length; j++) {
+                    obj.data.push(parseFloat(val[i].monthlySales[j]));
+                }
+                this.showData.push(obj);
+            }
+            this.drawLine();
+        },
+    },
+};
+</script>
+
+
+<style lang='less' scoped>
+.linechart {
+    width: 900px;
+    height: 300px;
+    margin: 0 auto;
+}
+</style>

src/components/echarts/pieChart.vue

@@ -0,0 +1,55 @@
+<template>
+    <div class="linechart" id="bb"></div>
+</template>
+
+<script>
+//import  from '';
+
+export default {
+    name: "pieChart", //
+    components: {},
+    data() {
+        return {};
+    },
+
+    computed: {},
+
+    methods: {},
+
+    mounted() {
+        // 基于准备好的dom，初始化echarts实例
+        let myChart = this.$echarts.init(document.getElementById("bb"));
+
+        let option = {
+            series: [
+                {
+                    type: "pie",
+                    data: [
+                        {
+                            value: 335,
+                            name: "直接访问",
+                        },
+                        {
+                            value: 234,
+                            name: "联盟广告",
+                        },
+                        {
+                            value: 1548,
+                            name: "搜索引擎",
+                        },
+                    ],
+                },
+            ],
+        };
+        myChart.setOption(option);
+    },
+};
+</script>
+
+<style lang='less' scoped>
+.linechart {
+    width: 100%;
+    height: 120px;
+    margin: 0 auto;
+}
+</style>

src/components/echarts/pieChart1.vue

@@ -0,0 +1,55 @@
+<template>
+    <div class="linechart" id="cc"></div>
+</template>
+
+<script>
+//import  from '';
+
+export default {
+    name: "pieChart", //
+    components: {},
+    data() {
+        return {};
+    },
+
+    computed: {},
+
+    methods: {},
+
+    mounted() {
+        // 基于准备好的dom，初始化echarts实例
+        let myChart = this.$echarts.init(document.getElementById("cc"));
+
+        let option = {
+            series: [
+                {
+                    type: "pie",
+                    data: [
+                        {
+                            value: 335,
+                            name: "直接访问",
+                        },
+                        {
+                            value: 234,
+                            name: "联盟广告",
+                        },
+                        {
+                            value: 1548,
+                            name: "搜索引擎",
+                        },
+                    ],
+                },
+            ],
+        };
+        myChart.setOption(option);
+    },
+};
+</script>
+
+<style lang='less' scoped>
+.linechart {
+    width: 100%;
+    height: 120px;
+    margin: 0 auto;
+}
+</style>

src/components/echarts/pieChart2.vue

@@ -0,0 +1,55 @@
+<template>
+    <div class="linechart" id="dd"></div>
+</template>
+
+<script>
+//import  from '';
+
+export default {
+    name: "pieChart", //
+    components: {},
+    data() {
+        return {};
+    },
+
+    computed: {},
+
+    methods: {},
+
+    mounted() {
+        // 基于准备好的dom，初始化echarts实例
+        let myChart = this.$echarts.init(document.getElementById("dd"));
+
+        let option = {
+            series: [
+                {
+                    type: "pie",
+                    data: [
+                        {
+                            value: 335,
+                            name: "直接访问",
+                        },
+                        {
+                            value: 234,
+                            name: "联盟广告",
+                        },
+                        {
+                            value: 1548,
+                            name: "搜索引擎",
+                        },
+                    ],
+                },
+            ],
+        };
+        myChart.setOption(option);
+    },
+};
+</script>
+
+<style lang='less' scoped>
+.linechart {
+    width: 100%;
+    height: 120px;
+    margin: 0 auto;
+}
+</style>

src/components/grid/TableList.vue

@@ -172,7 +172,7 @@
             */
             isUseRowClick:{
                 type:Boolean,
-                default:true
+                default:false
             },
             summaryMtd:Function,
             tableColumnEmpty:{

src/components/toolbar/toolbar.vue

@@ -4,8 +4,8 @@
             <el-button class="leftBtn"  v-if="isShowHBtn" icon="el-icon-arrow-left" @mousedown.native="leftBtnClick" @mouseup.native="clearTimer"></el-button>
             <el-button class="upBtn"  v-if="isShowVBtn" icon="el-icon-arrow-up" @mousedown.native="upBtnClick" @mouseup.native="clearTimer"></el-button>
             <template v-for="item of toolbarItem">
-                <el-button v-if="item.icon" :disabled="item.disabled" :type="item.type" :icon="display==='block' ? item.icon + ' el-block': item.icon" @click="click(item,$event)">{{item.title}}</el-button>
-                <el-button v-else   :disabled="item.disabled"  :type="item.type" @click="click(item,$event)">{{item.title}}</el-button>
+                <el-button v-if="item.icon" :key="item.key" :disabled="item.disabled" :type="item.type" :icon="display==='block' ? item.icon + ' el-block': item.icon" @click="click(item,$event)">{{item.title}}</el-button>
+                <el-button v-else :key="item.key" :disabled="item.disabled"  :type="item.type" @click="click(item,$event)">{{item.title}}</el-button>
             </template>
             <el-button class="rightBtn"  v-if="isShowHBtn" icon="el-icon-arrow-right" @mousedown.native="rightBtnClick" @mouseup.native="clearTimer"></el-button>
             <el-button class="downBtn"  v-if="isShowVBtn" icon="el-icon-arrow-down" @mousedown.native="downBtnClick" @mouseup.native="clearTimer"></el-button>

src/main.js

@@ -16,6 +16,11 @@ import '@/lib/autoTrim'
 
 Vue.config.productionTip = false;
 
+// 引入echarts
+import echarts from 'echarts'
+
+Vue.prototype.$echarts = echarts
+
 
 Vue.use(ElementUI);
 

src/router/filter.js

@@ -7,18 +7,16 @@ Router.prototype.push = function push(location) {
     return originalPush.call(this, location).catch(err => err)
 }
 
-// const disabledRoutes = ['modelLibrary'];
 
 
-/* router.beforeEach((to, from, next) => {
-    // console.log(to);
-    // next();
-
-    if (disabledRoutes.includes(to.name)) {
-        next(false);
+router.beforeEach((to, from, next) => {
+    console.log(to);
+    if (to.fullPath === '/' || to.name === '*') {
+        next({
+            path: "/mainPage",
+            replace: true
+        });
     } else {
         next();
     }
-
-
-}); */
+});

src/router/index.js

@@ -5,6 +5,7 @@ import modelLibrary from "./modelLibrary";
 import algorithmsLibrary from "./algorithmsLibrary";
 import sceneLibrary from "./sceneLibrary";
 import systemManagement from "./systemManagement";
+import workManagement from "./workManagement";
 
 Vue.use(VueRouter);
 
@@ -15,13 +16,15 @@ const routes = [{
     tabname: "首页"
   },
   component: () => import('../views/index'),
-  children: [{
-        path: "/about",
-        name: "about",
-        meta: {
-          tabname: "关于"
-        },
-        component: () => import("../views/About.vue")
+  redirect: '/mainPage',
+  children: [
+      {
+        path: "/mainPage",
+        name: "mainPage",
+        // meta: {
+        //   tabname: "首页"
+        // },
+        component: () => import("../views/mainPage.vue")
       },
       {
         path: "/modelLibrary",
@@ -54,6 +57,16 @@ const routes = [{
         children: sceneLibrary,
       },
       {
+        path: "/workManagement",
+        name: "workManagement",
+        meta: {
+          tabname: "工作管理"
+        },
+        component: () => import("@/views/workManagement/index"),
+        redirect: '/index',
+        children: workManagement,
+      },
+      /* {
         path: "/systemManagement",
         name: "systemManagement",
         meta: {
@@ -62,15 +75,15 @@ const routes = [{
         component: () => import("@/views/systemManagement/index"),
         redirect: '/index',
         children: systemManagement,
-      },
+      }, */
     ]
     .concat([{
       path: "*",
       name: "*",
-      meta: {
-        tabname: "关于"
-      },
-      component: () => import("../views/About.vue")
+      // meta: {
+      //   tabname: "关于"
+      // },
+      component: () => import("../views/mainPage.vue")
     }, ]),
 }];
 // {

src/router/sceneLibrary.js

@@ -54,4 +54,12 @@ export default [{
         },
         component: () => import("@/views/sceneLibrary/gradingRule")
     },
+    {
+        path: "/templateView",
+        name: "templateView",
+        meta: {
+            tabname: "模板预览"
+        },
+        component: () => import("@/views/sceneLibrary/templateView")
+    },
 ]

src/router/workManagement.js

@@ -0,0 +1,41 @@
+export default [{
+        path: "/manualRunProjectList",
+        name: "manualRunProjectList",
+        meta: {
+            tabname: "手动运行项目列表"
+        },
+        component: () => import("@/views/workManagement/manualRunProjectList")
+    },
+    {
+        path: "/manualRunProjectDetail",
+        name: "manualRunProjectDetail",
+        meta: {
+            tabname: "手动运行项目"
+        },
+        component: () => import("@/views/workManagement/manualRunProjectDetail")
+    },
+    {
+        path: "/projectInfo",
+        name: "projectInfo",
+        meta: {
+            tabname: "项目详情"
+        },
+        component: () => import("@/views/workManagement/projectInfo")
+    },
+    {
+        path: "/taskInfo",
+        name: "taskInfo",
+        meta: {
+            tabname: "任务详情"
+        },
+        component: () => import("@/views/workManagement/taskInfo")
+    },
+    {
+        path: "/evaluationReport",
+        name: "evaluationReport",
+        meta: {
+            tabname: "评价报告"
+        },
+        component: () => import("@/views/workManagement/evaluationReport")
+    },
+]

src/views/mainPage.vue

@@ -0,0 +1,554 @@
+<template>
+    <div class="mainPagePanel">
+        <div>
+            <toolbarTab
+                :isConnect="true"
+                position="top"
+                :subPageActiveName="subPageActiveName"
+                :toolbarItem="pageBtnList"
+                @toolbarClick="pageControl"
+            >
+            </toolbarTab>
+        </div>
+
+        <div v-if="activitedPageNum === 1" class="tabBox">
+            <div class="boxContent">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">硬件监控</div>
+                </div>
+                <ul class="listPanel">
+                    <li class="shadowBox colorA">
+                        <span></span>
+                        <b>服务器数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox colorB">
+                        <span></span>
+                        <b>内存使用率</b>
+                        <i>10%</i>
+                    </li>
+                    <li class="shadowBox colorC">
+                        <span></span>
+                        <b>磁盘占用率</b>
+                        <i>20%</i>
+                    </li>
+                    <li class="shadowBox colorD">
+                        <span></span>
+                        <b>CPU使用率</b>
+                        <i>30%</i>
+                    </li>
+                    <li class="shadowBox colorE">
+                        <span></span>
+                        <b>GPU使用率</b>
+                        <i>60%</i>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="boxContent">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">服务监控</div>
+                </div>
+                <ul class="listPanel listPanelB">
+                    <li class="shadowBox">
+                        <b>用户数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>当前在线人数</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>仿真节点数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>仿真软件license占用数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>动力学软件license占用数量</b>
+                        <i>1000</i>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="boxContent">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">日访问人数</div>
+                </div>
+                <div>
+                    <line-chart></line-chart>
+                </div>
+            </div>
+
+            <div class="boxContent">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">服务器监控</div>
+                </div>
+                <div>
+                    <tableList
+                        :columns="columns"
+                        :getDataWay="getDataWay"
+                        :pagination="pagination"
+                        index
+                    >
+                    </tableList>
+                </div>
+            </div>
+        </div>
+
+        <div v-if="activitedPageNum === 2" class="tabBox">
+            <div class="boxContent">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">数据橄榄</div>
+                </div>
+                <ul class="listPanel listPanelB listPanelC">
+                    <li class="shadowBox">
+                        <b>场景数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>车辆配置数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>算法文件数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>算法地址数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>最大并发数量</b>
+                        <i>1000</i>
+                    </li>
+                    <li class="shadowBox">
+                        <b>当前并发数量</b>
+                        <i>1000</i>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="boxContent">
+                <div>
+                    <el-tabs
+                        v-model="activitedPageNumA"
+                        type="card"
+                        @tab-click="pageControlA"
+                    >
+                        <el-tab-pane label="运行项目" name="1">
+                            <div>
+                                <line-chart></line-chart>
+                            </div>
+                        </el-tab-pane>
+                        <el-tab-pane label="运行任务" name="2">
+                            <div>
+                                <line-chart1></line-chart1>
+                            </div>
+                        </el-tab-pane>
+                    </el-tabs>
+                </div>
+            </div>
+
+            <div class="boxContent">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">状态统计</div>
+                </div>
+                <div class="pieBox">
+                    <div class="shadowBox">
+                        <div class="title">项目运行状态统计</div>
+                        <pie-chart></pie-chart>
+                    </div>
+                    <div class="shadowBox shadowBoxB">
+                        <div class="title">任务运行状态统计</div>
+                        <pie-chart1></pie-chart1>
+                    </div>
+                    <div class="shadowBox">
+                        <div class="title">评测等级分布</div>
+                        <pie-chart2></pie-chart2>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import toolbarTab from "@/components/toolbar/toolbarTab";
+import tableList from "@/components/grid/TableList";
+import LineChart from "../components/echarts/lineChart";
+import LineChart1 from "../components/echarts/lineChart1";
+import pieChart from "../components/echarts/pieChart";
+import pieChart1 from "../components/echarts/pieChart1";
+import pieChart2 from "../components/echarts/pieChart2";
+
+export default {
+    name: "mainPage", // 首页
+    components: {
+        toolbarTab,
+        tableList,
+        LineChart,
+        LineChart1,
+        pieChart,
+        pieChart1,
+        pieChart2,
+    },
+    data() {
+        return {
+            activitedPageNum: 1,
+            subPageActiveName: 1,
+            activitedPageNumA: "1",
+            subPageActiveNameA: 1,
+            pageBtnList: [
+                {
+                    type: "primary",
+                    title: "系统监控",
+                    key: "all",
+                    fromId: 1,
+                    method: "showAll",
+                    plain: true,
+                    disabled: false,
+                },
+                {
+                    type: "primary",
+                    title: "系统概览",
+                    key: "notRead",
+                    fromId: 2,
+                    method: "showNotRead",
+                    plain: true,
+                    disabled: false,
+                },
+            ],
+            pageBtnListA: [
+                {
+                    type: "primary",
+                    title: "运行项目",
+                    key: "all",
+                    fromId: 1,
+                    method: "showAllA",
+                    plain: true,
+                    disabled: false,
+                },
+                {
+                    type: "primary",
+                    title: "运行任务",
+                    key: "notRead",
+                    fromId: 2,
+                    method: "showNotReadA",
+                    plain: true,
+                    disabled: false,
+                },
+            ],
+            columns: [
+                {
+                    label: "服务器ID",
+                    prop: "id",
+                },
+                {
+                    label: "服务器地址",
+                    prop: "ktName",
+                },
+                {
+                    label: "服务器类型",
+                    prop: "jbSource",
+                },
+                {
+                    label: "CPU使用率",
+                    prop: "startDateStr",
+                },
+                {
+                    label: "内存使用率",
+                    prop: "endDateStr",
+                },
+                {
+                    label: "可用内存",
+                    prop: "projectDateStr",
+                },
+                {
+                    label: "磁盘使用率",
+                    prop: "cgInfos",
+                },
+                {
+                    label: "剩余容量",
+                    prop: "endDateStr",
+                },
+                {
+                    label: "执行任务数量",
+                    prop: "projectDateStr",
+                },
+            ],
+            columnsA: [
+                {
+                    label: "配置ID",
+                    prop: "id",
+                    // width: 110,
+                },
+                {
+                    label: "配置名称",
+                    prop: "ktName",
+                    // template: true,
+                },
+                {
+                    label: "配置描述",
+                    prop: "jbSource",
+                    // width: 130,
+                },
+                {
+                    label: "车辆名称",
+                    prop: "startDateStr",
+                    width: 120,
+                },
+                {
+                    label: "车辆描述",
+                    prop: "endDateStr",
+                    width: 120,
+                },
+                {
+                    label: "传感器配置",
+                    prop: "projectDateStr",
+                    width: 120,
+                },
+                {
+                    label: "操作",
+                    prop: "cgInfos",
+                    template: true,
+                },
+            ],
+            pagination: {
+                //分页使用
+                currentPage: 1,
+                pageSize: 10,
+                position: "right",
+                pageSizes: [10, 30, 50, 100, 200],
+                layout: "sizes, total, prev, pager, next, jumper",
+            },
+            paginationA: {
+                //分页使用
+                currentPage: 1,
+                pageSize: 10,
+                position: "right",
+                pageSizes: [10, 30, 50, 100, 200],
+                layout: "sizes, total, prev, pager, next, jumper",
+            },
+            getDataWay: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: 1,
+                        ktName: "kjdhfkjsdhfkjsjhdfksdjhfkhwoieyrhfisdhfksjhdf",
+                        jbSource: "收到就好付款时间的回复可见收到货覅无痕",
+                    },
+                    { id: 2 },
+                    { id: 3 },
+                    { id: 4 },
+                    { id: 5 },
+                    { id: 6 },
+                ],
+                // data: this.$api.scientificStatistics.typeProjectStatistics,
+                param: {},
+            },
+            getDataWayA: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: 6,
+                        ktName: "沃尔沃二",
+                        jbSource: "收到就好付款时间的回复可见收到货覅无痕",
+                    },
+                    { id: 66 },
+                    {
+                        id: 666,
+                        tName: "沃尔沃二",
+                        jbSource: "收到就好付款时间的回复可见收到货覅无痕",
+                    },
+                    { id: 6666 },
+                    { id: 51 },
+                    { id: 6 },
+                ],
+                // data: this.$api.scientificStatistics.typeProjectStatistics,
+                param: {},
+            },
+        };
+    },
+
+    computed: {},
+
+    methods: {
+        pageControl(data) {
+            this.activitedPageNum = data.fromId;
+        },
+        pageControlA(data) {
+            this.activitedPageNumA = data.name;
+        },
+        addConfig() {
+            this.$router.push({ path: "/addVehicleConfiguration" });
+        },
+        addMarkDia() {},
+    },
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.mainPagePanel {
+    padding: 20px;
+
+    .tabBox {
+        padding: 30px;
+    }
+
+    .boxContent {
+        padding-bottom: 40px;
+
+        .titlePanel {
+            padding-bottom: 20px;
+        }
+
+        .listPanel {
+            display: flex;
+            flex-wrap: wrap;
+            color: @themeColor;
+
+            li {
+                width: 300px;
+                display: flex;
+                height: 120px;
+                padding: 24px;
+                margin-right: 54px;
+                margin-bottom: 20px;
+                justify-content: space-between;
+                align-items: center;
+
+                span,
+                i,
+                b {
+                    display: inline-block;
+                    font-weight: normal;
+                    font-style: normal;
+                }
+
+                b {
+                    font-size: 18px;
+                }
+
+                i {
+                    font-size: 36px;
+                }
+            }
+
+            .colorA {
+                color: @themeColor;
+
+                span {
+                    width: 36px;
+                    height: 38px;
+                    background: url("../assets/common/image/index/hw1.png")
+                        center center no-repeat;
+                    background-size: contain;
+                }
+            }
+            .colorB {
+                color: #8479ff;
+
+                span {
+                    width: 36px;
+                    height: 38px;
+                    background: url("../assets/common/image/index/hw2.png")
+                        center center no-repeat;
+                    background-size: contain;
+                }
+            }
+            .colorC {
+                color: #ffc935;
+
+                span {
+                    width: 36px;
+                    height: 38px;
+                    background: url("../assets/common/image/index/hw3.png")
+                        center center no-repeat;
+                    background-size: contain;
+                }
+            }
+            .colorD {
+                color: #bf5bff;
+
+                span {
+                    width: 36px;
+                    height: 38px;
+                    background: url("../assets/common/image/index/hw4.png")
+                        center center no-repeat;
+                    background-size: contain;
+                }
+            }
+            .colorE {
+                color: #ff6161;
+
+                span {
+                    width: 36px;
+                    height: 38px;
+                    background: url("../assets/common/image/index/hw5.png")
+                        center center no-repeat;
+                    background-size: contain;
+                }
+            }
+        }
+
+        .listPanelB {
+            li {
+                display: block;
+
+                i,
+                b {
+                    display: block;
+                    line-height: 1;
+                    text-align: center;
+                }
+
+                b {
+                    padding-bottom: 15px;
+                }
+            }
+        }
+
+        .listPanelC {
+            li {
+                width: 260px;
+            }
+        }
+
+        .pieBox {
+            display: flex;
+
+            > div {
+                flex: 1;
+                width: 30%;
+
+            }
+                .title {
+                    padding-top: 24px;
+                    padding-bottom: 24px;
+                    text-align: center;
+                    font-size: 18px;
+                    font-weight: bold;
+                }
+
+            .shadowBoxB {
+                margin: 0 50px;
+            }
+        }
+    }
+
+    /deep/ .el-tabs__item.is-active {
+        color: @themeColor;
+    }
+}
+</style>

src/views/modelLibrary/components/handleConfigList.vue

@@ -2,23 +2,24 @@
     <div v-bind:class="{ isActive: isActive }">
         <div class="titlePanel">
             <i class="el-icon el-icon-caret-right" @click="handleChange"></i>
-            <div class="title" @click="handleChange">{{ titleText }}</div>
-            <i class="el-icon el-icon-circle-plus-outline" @click="add"></i>
+            <span class="title" @click="handleChange">{{ titleText }}</span>
+            <i class="el-icon el-icon-circle-plus-outline" @click="add" v-if="showBtns"></i>
         </div>
         <ul class="listPanel">
             <li class="content">
                 <i class="el-icon el-icon-video-camera" @click="configHandle('水电费可接受的李逵负荆')"></i>
-                <div class="name" @click="configHandle('水电费可接受的李逵负荆')">水电费可接受的李逵负荆</div>
-                <i class="el-icon el-icon-delete"></i>
+                <span class="name" @click="configHandle('水电费可接受的李逵负荆')">水电费可接受的李逵负荆</span>
+                <i class="el-icon el-icon-delete"  v-if="showBtns"></i>
             </li>
             <li class="content">
                 <i class="el-icon el-icon-video-camera" @click="configHandle('电饭锅')"></i>
-                <div class="name" @click="configHandle('电饭锅')">电饭锅</div>
-                <i class="el-icon el-icon-delete"></i>
+                <span class="name" @click="configHandle('电饭锅')">电饭锅</span>
+                <i class="el-icon el-icon-delete" v-if="showBtns"></i>
             </li>
         </ul>
 
         <el-dialog
+            v-if="showBtns"
             :title="dialogTitle"
             :visible.sync="dialogVisible"
             width="690px"
@@ -99,6 +100,11 @@ export default {
             default: false,
             type: Boolean,
         },
+        // 是否展示右侧编辑按钮
+        showBtns: {
+            default: true,
+            type: Boolean,
+        },
     },
 
     computed: {

src/views/modelLibrary/vehicleModel.vue

@@ -42,6 +42,26 @@
                             ></el-option>
                         </el-select>
                     </el-form-item>
+                    <el-form-item label="车辆型号:" prop="a">
+                        <el-select v-model="form.a" disabled>
+                            <el-option
+                                v-for="item in typeList"
+                                :label="item.caption"
+                                :value="item.code"
+                                :key="item.code"
+                            ></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="车辆颜色:" prop="b">
+                        <el-select v-model="form.b" disabled>
+                            <el-option
+                                v-for="item in typeList"
+                                :label="item.caption"
+                                :value="item.code"
+                                :key="item.code"
+                            ></el-option>
+                        </el-select>
+                    </el-form-item>
                 </div>
 
                 <div class="titlePanel">
@@ -246,6 +266,8 @@ export default {
                 x: "",
                 y: "1",
                 z: "1",
+                a: "",
+                b: "",
                 type: "",
             },
             rules: {
@@ -254,6 +276,8 @@ export default {
                 x: [{ required: true, message: "请输入", trigger: "blur" }],
                 y: [{ required: true, message: "请选择", trigger: "change" }],
                 z: [{ required: true, message: "请选择", trigger: "change" }],
+                a: [{ required: true, message: "请选择", trigger: "change" }],
+                b: [{ required: true, message: "请选择", trigger: "change" }],
                 type: [
                     { required: true, message: "请选择", trigger: "change" },
                 ],

src/views/page/breadCrumb.vue

@@ -46,19 +46,27 @@ export default {
                 "algorithmsLibrary",
                 "sceneLibrary",
                 "systemManagement",
+                "workManagement",
             ], // 相关页面只为占位，页面是空白，无法展示
         };
     },
     methods: {},
     computed: {
         list() {
-            // console.log(this.$route);
+            let isMainPage = false;
             this.$route.matched.filter((item) => {
                 if (item.name === this.$route.name) {
                     item.fullPath = this.$route.fullPath;
                 }
+                if(item.name==="mainPage") {
+                    isMainPage = true;
+                }
             });
-            return this.$route.matched;
+            if(isMainPage) {
+                return this.$route.matched.slice(0,1);
+            }else {
+                return this.$route.matched;
+            }
         },
     },
 };

src/views/page/pageMenu.vue

@@ -102,25 +102,16 @@
                             >打分规则</el-menu-item
                         >
                     </el-submenu>
-                    <el-submenu index="systemManagement">
+                    <el-submenu index="workManagement">
                         <template slot="title">
                             <i class="my-icon-menuD"></i>
-                            <span>工作台</span>
+                            <span>工作管理</span>
                         </template>
-                        <el-menu-item index="accountManagement"
-                            >账户管理</el-menu-item
+                        <el-menu-item index="manualRunProjectList"
+                            >手动运行项目</el-menu-item
                         >
                     </el-submenu>
-                    <el-submenu index="systemManagement">
-                        <template slot="title">
-                            <i class="my-icon-menuE"></i>
-                            <span>报告管理</span>
-                        </template>
-                        <el-menu-item index="accountManagement"
-                            >账户管理</el-menu-item
-                        >
-                    </el-submenu>
-                    <el-submenu index="systemManagement">
+                    <!-- <el-submenu index="systemManagement">
                         <template slot="title">
                             <i class="my-icon-menuF"></i>
                             <span>系统管理</span>
@@ -128,7 +119,7 @@
                         <el-menu-item index="accountManagement"
                             >账户管理</el-menu-item
                         >
-                    </el-submenu>
+                    </el-submenu> -->
                 </el-menu>
             </div>
         </div>
@@ -166,7 +157,7 @@ export default {
         },
     },
     created() {
-        console.log(this.$route);
+        // console.log(this.$route);
         let { code, ticket } = this.$route.query;
         if (code && ticket) {
             this.$axios({
@@ -179,8 +170,8 @@ export default {
                         "Authorization",
                         "Bearer " + res.info.access_token
                     );
-                }else {
-                    alert(res)
+                } else {
+                    alert(res);
                 }
             });
         } else {

src/views/sceneLibrary/scenePacketList.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="scenePacketListPanel">
         <div class="viewBox">
-            <el-button icon="el-icon-view" @click="view" type="primary"
+            <el-button icon="el-icon-view" @click="viewTree" type="primary"
                 >模板预览</el-button
             >
         </div>
@@ -65,16 +65,6 @@
                     >
                     </el-input>
                 </el-form-item>
-                <el-form-item label="评分规则:" prop="x">
-                    <el-select v-model="form.y">
-                        <el-option
-                            v-for="item in list"
-                            :label="item.caption"
-                            :value="item.code"
-                            :key="item.code"
-                        ></el-option>
-                    </el-select>
-                </el-form-item>
                 <el-form-item label="备注:" prop="des">
                     <el-input
                         v-autoTrim="{
@@ -120,6 +110,16 @@
                         ></el-option>
                     </el-select>
                 </el-form-item>
+                <el-form-item label="评分规则:" prop="y">
+                    <el-select v-model="form.y">
+                        <el-option
+                            v-for="item in list"
+                            :label="item.caption"
+                            :value="item.code"
+                            :key="item.code"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
             </el-form>
             <div class="tips">
                 解释：基于不同环境要素，在前述主题场景及两条路径的框架下进行场景的精确细分。细分维度包括天气、季节、温度、路况、车况等多种元素，所采纳元素的广度和深度既与需求有关，也与汽车智能化程度（感知能力）相关
@@ -521,9 +521,11 @@ export default {
             list: [],
             formA: {
                 x: "",
+                y: "",
             },
             rulesA: {
                 x: [{ required: true, message: "请选择", trigger: "change" }],
+                y: [{ required: true, message: "请选择", trigger: "change" }],
             },
             listA: [],
             searchParamsA: {
@@ -741,7 +743,9 @@ export default {
     computed: {},
 
     methods: {
-        view() {},
+        viewTree() {
+            this.$router.push({ path: "/templateView" });
+        },
         addIndicators(row) {
             this.diaTitle = "添加指标";
             this.indicatorsVisible = true;

src/views/sceneLibrary/templateView.vue

@@ -0,0 +1,66 @@
+<template>
+    <div class="templateViewPanel">
+        <div class="nodeBox">
+            <div class="node">1</div>
+        </div>
+        <div class="nodeBox">
+            <div class="node">2-1</div>
+            <div class="node">2-2</div>
+            <div class="node">2-3</div>
+            <div class="node">2-4</div>
+        </div>
+        <div class="nodeBox">
+            <div class="node">3-1</div>
+            <div class="node">3-2</div>
+            <div class="node">3-3</div>
+            <div class="node">3-4</div>
+            <div class="node">3-1</div>
+            <div class="node">3-2</div>
+            <div class="node">3-3</div>
+            <div class="node">3-4</div>
+        </div>
+    </div>
+</template>
+
+<script>
+//import  from '';
+
+export default {
+    name: "templateView", // 模板预览
+    components: {},
+    data() {
+        return {};
+    },
+
+    computed: {},
+
+    methods: {},
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.templateViewPanel {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 30px;
+    height: calc(90vh);
+
+    .nodeBox {
+        margin-right: 120px;
+    }
+
+    .node {
+        padding: 10px;
+        margin-bottom: 20px;
+        border: 1px solid @gray;
+        border-radius: 3px;
+
+        &:last-child {
+            margin-bottom: 0;
+        }
+    }
+}
+</style>

src/views/workManagement/evaluationReport.vue

@@ -0,0 +1,237 @@
+<template>
+    <div class="evaluationReportPanel">
+        <h1>评价报告</h1>
+        <div class="evaluationInfo">
+            <div class="evaluationBox">
+                <div class="box">
+                    <span>算法名称:</span>
+                    <b>塞德里克福建省李逵负荆</b>
+                </div>
+                <div class="box">
+                    <span>算法得分:</span>
+                    <b>90</b>
+                </div>
+                <div class="box">
+                    <span>测试等级:</span>
+                    <b>优秀</b>
+                </div>
+            </div>
+            <div class="desBox">
+                <span>算法描述:</span>
+                <b
+                    >塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆</b
+                >
+            </div>
+            <div class="evaBox">
+                <span>算法简评:</span>
+                <b
+                    >塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆塞德里克福建省李逵负荆</b
+                >
+            </div>
+        </div>
+
+        <div class="tableBox tableBoxA">
+            <div class="title">测试得分表</div>
+            <tableList :columns="columns" :getDataWay="getDataWay"> </tableList>
+        </div>
+
+        <div class="tableBox tableBoxB">
+            <div class="title">评价等级</div>
+            <tableList :columns="columnsA" :getDataWay="getDataWayA">
+            </tableList>
+        </div>
+    </div>
+</template>
+
+<script>
+import tableList from "@/components/grid/TableList";
+
+export default {
+    name: "evaluationReport", // 评价报告
+    components: { tableList },
+    data() {
+        return {
+            columns: [
+                {
+                    label: "测试项目",
+                    prop: "id",
+                },
+                {
+                    label: "测试权重",
+                    prop: "ktName",
+                },
+                {
+                    label: "测试得分",
+                    prop: "jbSource",
+                },
+                {
+                    label: "得分率",
+                    prop: "jbSource",
+                },
+                {
+                    label: "备注",
+                    prop: "startDateStr",
+                },
+            ],
+            pagination: {
+                //分页使用
+                currentPage: 1,
+                pageSize: 10,
+                position: "right",
+                pageSizes: [10, 30, 50, 100, 200],
+                layout: "sizes, total, prev, pager, next, jumper",
+            },
+            getDataWay: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: 1,
+                        ktName: "kjdhfkjsdhfkjsjhdfksdjhfkhwoieyrhfisdhfksjhdf",
+                        jbSource: "收到就好付款时间的回复可见收到货覅无痕",
+                        asd: true,
+                    },
+                    { id: 2, asd: true },
+                    { id: 3, asd: true },
+                    { id: 4, asd: true },
+                    { id: 5, asd: true },
+                    { id: 6, asd: true },
+                ],
+                param: {},
+            },
+            columnsA: [
+                {
+                    label: "测试项目",
+                    prop: "id",
+                },
+                {
+                    label: "90<总分<100",
+                    prop: "ktName",
+                },
+                {
+                    label: "80<总分<90",
+                    prop: "ktNam1e",
+                },
+                {
+                    label: "70<总分<80",
+                    prop: "ktName2",
+                },
+                {
+                    label: "0<总分<70",
+                    prop: "ktName3",
+                },
+            ],
+            getDataWayA: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: "",
+                        ktName: "优秀(G)",
+                        ktName1: "良好(A)",
+                        ktName2: "一般(M)",
+                        ktName3: "较差(P)",
+                    },
+                    {
+                        id: "",
+                        ktName: "优秀(G)",
+                    },
+                ],
+                param: {},
+            },
+        };
+    },
+
+    computed: {},
+
+    methods: {},
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.evaluationReportPanel {
+    min-width: 900px;
+    width: 60%;
+    margin: 0 auto;
+
+    h1 {
+        padding: 40px 0 60px;
+        font-size: 36px;
+        color: @themeColor;
+        text-align: center;
+    }
+
+    .evaluationInfo {
+        font-size: 16px;
+
+        span,
+        b {
+            display: block;
+            font-weight: normal;
+        }
+
+        span {
+            width: 80px;
+            color: @gray;
+        }
+
+        b {
+            flex: 1;
+        }
+    }
+
+    .evaluationBox {
+        display: flex;
+        justify-content: space-between;
+
+        .box {
+            display: flex;
+            width: 30%;
+
+            span {
+                padding-right: 10px;
+                // color: @color;
+            }
+
+            b {
+                padding-bottom: 3px;
+                border-bottom: 1px solid @gray;
+                text-align: center;
+            }
+        }
+    }
+
+    .desBox,
+    .evaBox {
+        display: flex;
+
+        b {
+            padding: 12px;
+            border: 1px solid @gray;
+        }
+    }
+
+    .desBox {
+        padding: 40px 0;
+    }
+
+    .tableBox {
+        .title {
+            padding-bottom: 20px;
+            font-size: 18px;
+            text-align: center;
+            font-weight: bold;
+        }
+    }
+
+    .tableBoxA {
+        padding: 60px 0 30px;
+    }
+}
+</style>

src/views/workManagement/index.vue

@@ -0,0 +1,26 @@
+<template>
+    <div>
+        <router-view></router-view>
+    </div>
+</template>
+
+<script>
+//import  from '';
+
+export default {
+    name: "workManagement", // 工作管理
+    components: {},
+    data() {
+        return {};
+    },
+
+    computed: {},
+
+    methods: {},
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+</style>

src/views/workManagement/manualRunProjectDetail.vue

@@ -0,0 +1,174 @@
+<template>
+    <div>
+        <el-form
+            ref="form"
+            :model="form"
+            :rules="rules"
+            label-width="120px"
+            class="flexBox"
+        >
+            <div class="formItemBox">
+                <el-form-item label="项目名称:" prop="name">
+                    <el-input
+                        placeholder="请输入"
+                        maxlength="30"
+                        v-autoTrim="{ obj: form, key: 'name' }"
+                        v-model="form.name"
+                    >
+                    </el-input>
+                </el-form-item>
+                <el-form-item label="项目描述:" prop="des">
+                    <el-input
+                        placeholder="请输入"
+                        maxlength="100"
+                        v-autoTrim="{ obj: form, key: 'name' }"
+                        v-model="form.name"
+                    >
+                    </el-input>
+                </el-form-item>
+                <el-form-item label="选择算法:" prop="x">
+                    <el-select v-model="form.des">
+                        <el-option
+                            v-for="item in list"
+                            :label="item.caption"
+                            :value="item.code"
+                            :key="item.code"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="选择车辆:" prop="x">
+                    <el-select v-model="form.des">
+                        <el-option
+                            v-for="item in list"
+                            :label="item.caption"
+                            :value="item.code"
+                            :key="item.code"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="选择场景:" prop="x">
+                    <el-select v-model="form.des">
+                        <el-option
+                            v-for="item in list"
+                            :label="item.caption"
+                            :value="item.code"
+                            :key="item.code"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="运行周期:" prop="x">
+                    <el-input
+                        placeholder="请输入"
+                        maxlength="100"
+                        v-autoTrim="{ obj: form, key: 'x' }"
+                        v-model="form.x"
+                    >
+                    </el-input>
+                </el-form-item>
+                <el-form-item label="并行度:" prop="x">
+                    <el-input
+                        placeholder="请输入"
+                        maxlength="100"
+                        v-autoTrim="{ obj: form, key: 'x' }"
+                        v-model="form.x"
+                    >
+                    </el-input>
+                </el-form-item>
+                <el-form-item label="是否选择GPU:" prop="type">
+                    <el-radio v-model="form.type" label="1">是</el-radio>
+                    <el-radio v-model="form.type" label="2">否</el-radio>
+                </el-form-item>
+            </div>
+
+            <div class="tipBox">
+                <div class="tip tipA">
+                    (传感器1：根据车辆自动带出;传感器2：根据车辆自动带出)
+                </div>
+                <div class="tip">(场景数量：300)</div>
+                <div class="tip flexBox">
+                    <div>(下次运行时间：XX时XX分XX秒)</div>
+                    <div class="tipBtnBox">
+                        <el-button type="primary">规则查看</el-button>
+                    </div>
+                </div>
+                <div class="tip">(最多可用资源XXXX)</div>
+            </div>
+        </el-form>
+        <div class="btns">
+            <el-button type="primary">保存</el-button>
+            <el-button type="primary">提交</el-button>
+            <el-button type="primary">取消</el-button>
+        </div>
+    </div>
+</template>
+
+<script>
+//import  from '';
+
+export default {
+    name: "manualRunProjectDetail", // 手动运行项目详情
+    components: {},
+    data() {
+        return {
+            form: {
+                name: "",
+                des: "",
+                x: "",
+                type: "1",
+            },
+            rules: {
+                name: [{ required: true, message: "请输入", trigger: "blur" }],
+                des: [{ required: true, message: "请输入", trigger: "blur" }],
+                // x: [{ required: true, message: "请输入", trigger: "blur" }],
+            },
+            list: [],
+        };
+    },
+
+    computed: {},
+
+    methods: {},
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.el-form {
+    width: 60%;
+    min-width: 900px;
+    padding-top: 60px;
+    margin: 0 auto;
+
+    .formItemBox {
+        flex: 1;
+
+        /deep/ .el-input,
+        .el-select {
+            width: 100%;
+        }
+    }
+
+    .tipBox {
+        margin-left: 20px;
+
+        .tip {
+            margin-bottom: 22px;
+            line-height: 32px;
+        }
+
+        .tipA {
+            margin-top: 162px;
+        }
+
+        .tipBtnBox {
+            margin-left: 20px;
+        }
+    }
+}
+
+.btns {
+    padding-top: 30px;
+    text-align: center;
+}
+</style>

src/views/workManagement/manualRunProjectList.vue

@@ -0,0 +1,279 @@
+<template>
+    <div>
+        <search-layout :needBox="true">
+            <template slot="searchItem1">
+                <span class="label">项目ID</span>
+                <el-input
+                    v-model="searchParams.id"
+                    size="small"
+                    clearable
+                    placeholder="请输入"
+                    maxlength="60"
+                >
+                </el-input>
+            </template>
+            <template slot="searchItem2">
+                <span class="label">项目名称</span>
+                <el-input
+                    v-model="searchParams.clientOrgName"
+                    size="small"
+                    clearable
+                    placeholder="请输入"
+                    maxlength="60"
+                >
+                </el-input>
+            </template>
+            <template slot="searchItem3">
+                <span class="label">进度</span>
+                <el-select v-model="searchParams.status">
+                    <el-option
+                        v-for="item in list"
+                        :label="item.caption"
+                        :value="item.code"
+                        :key="item.code"
+                    ></el-option>
+                </el-select>
+            </template>
+            <template slot="searchItem4">
+                <span class="label">测评等级</span>
+                <el-select v-model="searchParams.status">
+                    <el-option
+                        v-for="item in list"
+                        :label="item.caption"
+                        :value="item.code"
+                        :key="item.code"
+                    ></el-option>
+                </el-select>
+            </template>
+            <template slot="searchItem5">
+                <span class="label">创建时间</span>
+                <el-date-picker
+                    v-model="searchParams.clientOrgName1"
+                    type="date"
+                    placeholder="选择日期"
+                >
+                </el-date-picker>
+            </template>
+            <template slot="searchItem6">
+                <span class="label">完成时间</span>
+                <el-date-picker
+                    v-model="searchParams.clientOrgName1"
+                    type="date"
+                    placeholder="选择日期"
+                >
+                </el-date-picker>
+            </template>
+
+            <template slot="searchBtn1">
+                <el-button type="primary">查询</el-button>
+            </template>
+            <template slot="searchBtn2">
+                <el-button type="primary">重置</el-button>
+            </template>
+        </search-layout>
+
+        <div class="btnsPanel">
+            <el-button type="primary" plain icon="el-icon-delete"
+                >批量删除</el-button
+            >
+            <el-button
+                type="primary"
+                icon="el-icon-circle-plus-outline"
+                @click="addOne"
+                >创建</el-button
+            >
+        </div>
+
+        <tableList
+            ref="table"
+            style="margin: 0 30px"
+            :columns="columns"
+            :getDataWay="getDataWay"
+            :pagination="pagination"
+            selection
+            index
+        >
+            <!-- <el-table-column label="停/启用" slot="asd" align="center">
+                <template v-slot="scope">
+                    <el-switch
+                        v-model="scope.row.asd"
+                        active-color="#3397FF"
+                        inactive-color="#b2b2b2"
+                    >
+                    </el-switch>
+                </template>
+            </el-table-column> -->
+            <el-table-column label="操作" slot="cgInfos" align="center">
+                <template v-slot="scope">
+                    <i
+                        @click="addMarkDia(scope.row)"
+                        class="el-icon-video-pause elIcon"
+                        title="停用"
+                    ></i>
+                    <i
+                        @click="addMarkDia(scope.row)"
+                        class="el-icon-delete elIcon"
+                        title="删除"
+                    ></i>
+                    <i
+                        @click="viewRow(scope.row)"
+                        class="el-icon-view elIcon"
+                        title="查看"
+                    ></i>
+                    <i
+                        @click="addMarkDia(scope.row)"
+                        class="el-icon-video-play elIcon"
+                        title="运行"
+                    ></i>
+                    <i
+                        @click="addMarkDia(scope.row)"
+                        class="el-icon-edit-outline elIcon"
+                        title="编辑"
+                    ></i>
+                    <i
+                        @click="downRow(scope.row)"
+                        class="el-icon-download elIcon"
+                        title="下载"
+                    ></i>
+                </template>
+            </el-table-column>
+        </tableList>
+
+        <el-dialog
+            title="编辑"
+            :visible.sync="dialogVisible"
+            width="690px"
+            :close-on-click-modal="false"
+            :close-on-press-escape="false"
+        >
+            <div class="checkboxPanel">
+                <el-checkbox-group v-model="downType">
+                    <el-checkbox label="工作报告" class="labelA"></el-checkbox>
+                    <el-checkbox label="任务文件包"></el-checkbox>
+                </el-checkbox-group>
+            </div>
+            <span slot="footer">
+                <el-button type="primary" @click="dialogVisible = false"
+                    >确 定</el-button
+                >
+                <el-button @click="dialogVisible = false">取 消</el-button>
+            </span>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import searchLayout from "@/components/grid/searchLayout";
+import tableList from "@/components/grid/TableList";
+
+export default {
+    name: "manualRunProjectList", // 手动运行项目
+    components: { searchLayout, tableList },
+    data() {
+        return {
+            searchParams: {
+                //搜索参数
+                id: "", //ID
+                clientOrgName: "", //车辆名称
+                clientOrgName1: "", //配置名称
+                clientOrgName2: "", //配置描述
+            },
+            list: [],
+            columns: [
+                {
+                    label: "项目ID",
+                    prop: "id",
+                },
+                {
+                    label: "项目名称",
+                    prop: "ktName",
+                },
+                {
+                    label: "算法名称",
+                    prop: "jbSource",
+                },
+                {
+                    label: "创建时间",
+                    prop: "jbSource",
+                },
+                {
+                    label: "进度",
+                    prop: "startDateStr",
+                },
+                {
+                    label: "测评等级",
+                    prop: "jbSource",
+                },
+                // {
+                //     label: "停/启用",
+                //     prop: "asd",
+                //     template: true,
+                // },
+                {
+                    label: "操作",
+                    prop: "cgInfos",
+                    template: true,
+                },
+            ],
+            pagination: {
+                //分页使用
+                currentPage: 1,
+                pageSize: 10,
+                position: "right",
+                pageSizes: [10, 30, 50, 100, 200],
+                layout: "sizes, total, prev, pager, next, jumper",
+            },
+            getDataWay: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: 1,
+                        ktName: "kjdhfkjsdhfkjsjhdfksdjhfkhwoieyrhfisdhfksjhdf",
+                        jbSource: "收到就好付款时间的回复可见收到货覅无痕",
+                        asd: true,
+                    },
+                    { id: 2, asd: true },
+                    { id: 3, asd: true },
+                    { id: 4, asd: true },
+                    { id: 5, asd: true },
+                    { id: 6, asd: true },
+                ],
+                param: {},
+            },
+            downType: [],
+            dialogVisible: false,
+        };
+    },
+    methods: {
+        addOne() {
+            this.$router.push({ path: "/manualRunProjectDetail" });
+        },
+        viewRow() {
+            this.$router.push({ path: "/projectInfo" });
+        },
+        addMarkDia() {},
+        downRow(row) {
+            this.dialogVisible = true;
+        },
+    },
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.btnsPanel {
+    margin: 45px 40px 15px;
+}
+
+.checkboxPanel {
+    text-align: center;
+
+    .labelA {
+        margin-right: 60px;
+    }
+}
+</style>

src/views/workManagement/projectInfo.vue

@@ -0,0 +1,363 @@
+<template>
+    <div class="projectInfoPanel">
+        <div class="flexBox topPanel">
+            <div class="box panel">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">基本信息</div>
+                </div>
+                <div class="boxContent">
+                    <div class="info">
+                        <span>项目ID:</span>
+                        <b>6546857987654324687</b>
+                    </div>
+                    <div class="info">
+                        <span>项目名称:</span>
+                        <b>仿真云平台系统</b>
+                    </div>
+                    <div class="info">
+                        <span>项目描述:</span>
+                        <b
+                            >仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统</b
+                        >
+                    </div>
+                    <div class="info">
+                        <span>创建时间:</span>
+                        <b>2022-01-01</b>
+                    </div>
+                    <div class="info">
+                        <span>完成时间:</span>
+                        <b>2022-08-01</b>
+                    </div>
+                    <div class="info">
+                        <span>完成进度:</span>
+                        <b>81%</b>
+                    </div>
+                    <div class="info">
+                        <span>结果等级:</span>
+                        <b>优秀</b>
+                    </div>
+                </div>
+            </div>
+            <div class="box panel boxB">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">算法配置</div>
+                </div>
+                <div class="boxContent">
+                    <div class="info">
+                        <span>算法名称:</span>
+                        <b>6546857987654324687</b>
+                    </div>
+                    <div class="info">
+                        <span>算法描述:</span>
+                        <b
+                            >仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统</b
+                        >
+                    </div>
+                </div>
+            </div>
+            <div class="box panel">
+                <div class="titlePanel">
+                    <div class="titlePanelBor">测试报告</div>
+                    <i class="el-icon-download download"></i>
+                </div>
+                <div class="boxContent boxContentC">
+                    <div class="cbox" @click="toReport">
+                        <img
+                            src="../../assets/common/image/car.png"
+                            width="300px"
+                        />
+                        <div>仿真云测试报告</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="centerPanel panel">
+            <div class="titlePanel">
+                <div class="titlePanelBor">车辆配置</div>
+            </div>
+            <div class="box">
+                <div class="boxContentA">
+                    <div class="info">
+                        <span>车辆名称:</span>
+                        <b>6546857987654324687</b>
+                    </div>
+                    <div class="info">
+                        <span>车辆描述:</span>
+                        <b
+                            >仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统</b
+                        >
+                    </div>
+                </div>
+                <div class="boxContentB">
+                    <div class="list">
+                        <handle-config-list
+                            v-for="index in 4"
+                            :isActiveA="index === 1"
+                            :titleCode="index - 1"
+                            :key="index"
+                            :showBtns="false"
+                        ></handle-config-list>
+                    </div>
+                    <div>
+                        <img
+                            src="../../assets/common/image/car.png"
+                            width="300px"
+                        />
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="bottomPanel panel">
+            <div class="titlePanel">
+                <div class="titlePanelBor">任务信息</div>
+            </div>
+            <div class="box">
+                <div class="boxContentA">
+                    <div>
+                        <img
+                            src="../../assets/common/image/car.png"
+                            width="300px"
+                        />
+                    </div>
+                    <div>
+                        <img
+                            src="../../assets/common/image/car.png"
+                            width="300px"
+                        />
+                    </div>
+                </div>
+                <div>
+                    <tableList
+                        ref="table"
+                        style="margin: 0 30px"
+                        :columns="columns"
+                        :getDataWay="getDataWay"
+                        :pagination="pagination"
+                    >
+                        <el-table-column
+                            label="操作"
+                            slot="cgInfos"
+                            align="center"
+                        >
+                            <template v-slot="scope">
+                                <i
+                                    @click="viewRow(scope.row)"
+                                    class="el-icon-view elIcon"
+                                    title="查看"
+                                ></i>
+                            </template>
+                        </el-table-column>
+                    </tableList>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import handleConfigList from "../modelLibrary/components/handleConfigList.vue";
+import tableList from "@/components/grid/TableList";
+
+export default {
+    name: "projectInfo", // 项目详情
+    components: { handleConfigList, tableList },
+    data() {
+        return {
+            columns: [
+                {
+                    label: "ID",
+                    prop: "id",
+                },
+                {
+                    label: "场景名称",
+                    prop: "ktName",
+                },
+                {
+                    label: "运行开始时间",
+                    prop: "jbSource",
+                },
+                {
+                    label: "运行结束时间",
+                    prop: "jbSource",
+                },
+                {
+                    label: "运行状态",
+                    prop: "startDateStr",
+                },
+                {
+                    label: "运行结果",
+                    prop: "jbSource",
+                },
+                {
+                    label: "操作",
+                    prop: "cgInfos",
+                    template: true,
+                },
+            ],
+            pagination: {
+                //分页使用
+                currentPage: 1,
+                pageSize: 10,
+                position: "right",
+                pageSizes: [10, 30, 50, 100, 200],
+                layout: "sizes, total, prev, pager, next, jumper",
+            },
+            getDataWay: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: 1,
+                        ktName: "kjdhfkjsdhfkjsjhdfksdjhfkhwoieyrhfisdhfksjhdf",
+                        jbSource: "收到就好付款时间的回复可见收到货覅无痕",
+                        asd: true,
+                    },
+                    { id: 2, asd: true },
+                    { id: 3, asd: true },
+                    { id: 4, asd: true },
+                    { id: 5, asd: true },
+                    { id: 6, asd: true },
+                ],
+                param: {},
+            },
+        };
+    },
+
+    computed: {},
+
+    methods: {
+        viewRow() {
+            this.$router.push({ path: "/taskInfo" });
+        },
+        toReport() {
+            this.$router.push({ path: "/evaluationReport" });
+        },
+    },
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.projectInfoPanel {
+    padding: 18px;
+
+    .panel {
+        border: 1px solid #dfdfdf;
+        padding: 12px 24px;
+        box-shadow: 0 4px 9px #dcdcdc;
+        border-radius: 3px;
+    }
+
+    .titlePanel {
+        padding-bottom: 6px;
+        border-bottom: 1px dotted @gray;
+    }
+
+    .topPanel {
+        .box {
+            flex: 1;
+        }
+
+        .boxB {
+            margin: 0 18px;
+        }
+
+        .titlePanel {
+            position: relative;
+
+            .download {
+                position: absolute;
+                top: 0;
+                right: 0;
+                color: @themeColor;
+                font-size: 18px;
+                cursor: pointer;
+            }
+        }
+
+        .boxContent {
+            padding: 18px 15px;
+        }
+
+        .info {
+            display: flex;
+            margin-bottom: 12px;
+
+            span {
+                display: block;
+                width: 75px;
+                color: @gray;
+            }
+
+            b {
+                flex: 1;
+                font-weight: normal;
+            }
+        }
+
+        .boxContentC {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100%;
+
+            .cbox {
+                text-align: center;
+                color: @themeColor;
+                cursor: pointer;
+
+                > div {
+                    margin-top: 18px;
+                }
+            }
+        }
+    }
+
+    .centerPanel {
+        margin: 25px 0;
+
+        .boxContentA {
+            padding: 18px 15px;
+
+            .info {
+                display: flex;
+                margin-bottom: 12px;
+
+                span {
+                    display: block;
+                    width: 75px;
+                    color: @gray;
+                }
+
+                b {
+                    flex: 1;
+                    font-weight: normal;
+                }
+            }
+        }
+
+        .boxContentB {
+            display: flex;
+            justify-content: space-around;
+            padding-top: 30px;
+
+            // .list {
+            //     width: 300px;
+            // }
+        }
+    }
+
+    .bottomPanel {
+        .boxContentA {
+            display: flex;
+            justify-content: space-around;
+            padding: 45px 0;
+        }
+    }
+}
+</style>

src/views/workManagement/taskInfo.vue

@@ -0,0 +1,319 @@
+<template>
+    <div class="taskInfoPanel">
+        <div class="panel boxA">
+            <div class="titlePanel">
+                <div class="titlePanelBor">基本信息</div>
+            </div>
+            <div class="contentBox">
+                <div class="info">
+                    <span>任务ID:</span>
+                    <b>6546857987654324687</b>
+                </div>
+                <div class="info">
+                    <span>开始时间:</span>
+                    <b>2022-01-01</b>
+                </div>
+                <div class="info">
+                    <span>执行状态:</span>
+                    <b>进行中</b>
+                </div>
+                <div class="info">
+                    <span>场景描述:</span>
+                    <b
+                        >仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统仿真云平台系统</b
+                    >
+                </div>
+                <div class="info">
+                    <span>场景名称:</span>
+                    <b>仿真云平台系统</b>
+                </div>
+                <div class="info">
+                    <span>结束时间:</span>
+                    <b>2022-08-01</b>
+                </div>
+                <div class="info">
+                    <span>完成状态:</span>
+                    <b>优秀</b>
+                </div>
+            </div>
+        </div>
+
+        <div class="panel boxB">
+            <div class="titlePanel">
+                <div class="titlePanelBor">三维仿真动画</div>
+            </div>
+            <div class="contentBox">
+                <div class="content">
+                    <img
+                        src="../../assets/common/image/car.png"
+                        width="300px"
+                    />
+                </div>
+            </div>
+        </div>
+
+        <div class="panel boxC">
+            <div class="titlePanel">
+                <div class="titlePanelBor">基本数据</div>
+            </div>
+            <div class="contentBox">
+                <div class="info">
+                    <span>里程(千米):</span>
+                    <b>888</b>
+                </div>
+                <div class="info">
+                    <span>最大速度(千米/小时):</span>
+                    <b>180</b>
+                </div>
+                <div class="info">
+                    <span>最大减速度(千米/小时):</span>
+                    <b>90</b>
+                </div>
+                <div class="info">
+                    <span>平均速度(千米/小时):</span>
+                    <b>81</b>
+                </div>
+                <div class="info">
+                    <span>最小速度(千米/小时):</span>
+                    <b>60</b>
+                </div>
+                <div class="info">
+                    <span>最大摆角速度(弧度/秒):</span>
+                    <b>1.2</b>
+                </div>
+            </div>
+        </div>
+
+        <div class="panel boxD">
+            <div class="titlePanel">
+                <div class="titlePanelBor">舒适性参数</div>
+            </div>
+            <div class="contentBox">
+                <div class="content">
+                    <div class="tip">
+                        自车速度方差:XXXXXXXXXXXXXXXXXXXXXXXXXXX
+                    </div>
+                    <tableList :columns="columns" :getDataWay="getDataWay">
+                    </tableList>
+                </div>
+                <div class="content">
+                    <div class="tip">
+                        自车横摆角速度均方根:XXXXXXXXXXXXXXXXXXXXXXXXXXX
+                    </div>
+                    <tableList :columns="columnsA" :getDataWay="getDataWayA">
+                    </tableList>
+                </div>
+            </div>
+        </div>
+
+        <div class="panel boxE">
+            <div class="titlePanel">
+                <div class="titlePanelBor">变化曲线图</div>
+            </div>
+            <div class="contentBox">
+                <div class="content">
+                    <img
+                        src="../../assets/common/image/car.png"
+                        width="300px"
+                    />
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import tableList from "@/components/grid/TableList";
+
+export default {
+    name: "taskInfo", // 任务详情
+    components: { tableList },
+    data() {
+        return {
+            columns: [
+                {
+                    label: "方差范围",
+                    prop: "id",
+                },
+                {
+                    label: "舒适程度",
+                    prop: "ktName",
+                },
+            ],
+            getDataWay: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: "0<方差值<5",
+                        ktName: "舒适",
+                    },
+                    {
+                        id: "5<方差值<10",
+                        ktName: "不舒适",
+                    },
+                    {
+                        id: "方差值>10",
+                        ktName: "极不舒适",
+                    },
+                ],
+                param: {},
+            },
+            columnsA: [
+                {
+                    label: "均方根范围",
+                    prop: "id",
+                },
+                {
+                    label: "舒适程度",
+                    prop: "ktName",
+                },
+            ],
+            getDataWayA: {
+                //加载表格数据
+                dataType: "data",
+                type: "post",
+                firstRequest: false,
+                data: [
+                    {
+                        id: "0<均方根值<0.02",
+                        ktName: "舒适",
+                    },
+                    {
+                        id: "0.02<均方根值<0.04",
+                        ktName: "不舒适",
+                    },
+                    {
+                        id: "均方根值>0.04",
+                        ktName: "极不舒适",
+                    },
+                ],
+                param: {},
+            },
+        };
+    },
+
+    computed: {},
+
+    methods: {},
+
+    // mounted() {},
+};
+</script>
+
+<style lang='less' scoped>
+.taskInfoPanel {
+    padding: 18px;
+
+    .panel {
+        border: 1px solid #dfdfdf;
+        padding: 12px 24px;
+        margin-bottom: 25px;
+        box-shadow: 0 4px 9px #dcdcdc;
+        border-radius: 3px;
+    }
+
+    .titlePanel {
+        padding-bottom: 6px;
+        border-bottom: 1px dotted @gray;
+    }
+
+    .boxA {
+        .contentBox {
+            display: flex;
+            flex-wrap: wrap;
+            padding: 18px 15px;
+        }
+
+        .info {
+            display: flex;
+            width: 300px;
+            margin: 0 20px 22px 0;
+
+            span {
+                display: block;
+                width: 75px;
+                color: @gray;
+            }
+
+            b {
+                flex: 1;
+                font-weight: normal;
+            }
+        }
+    }
+
+    .boxB,
+    .boxE {
+        .contentBox {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 30px 0;
+        }
+    }
+
+    .boxC {
+        .contentBox {
+            display: flex;
+            flex-wrap: wrap;
+            padding: 18px 15px;
+        }
+
+        .info {
+            display: flex;
+            width: 300px;
+            margin: 0 20px 22px 0;
+
+            span {
+                display: block;
+                width: 168px;
+                padding-right: 10px;
+                color: @gray;
+            }
+
+            b {
+                flex: 1;
+                font-weight: normal;
+            }
+        }
+    }
+
+    .boxD {
+        .contentBox {
+            display: flex;
+            flex-wrap: wrap;
+            padding: 18px 15px;
+        }
+
+        .content {
+            width: 50%;
+
+            /deep/ .el-table {
+                width: 480px;
+
+                .el-table_3_column_6 {
+                    background-color: #a3e432;
+                }
+            }
+        }
+
+        .tip {
+            padding: 20px 0 15px;
+            margin: 0 10px;
+        }
+
+        .bgA {
+            background-color: #a3e432;
+        }
+        .bgB {
+            background-color: #f4e015;
+        }
+        .bgC {
+            background-color: #f56c6c;
+        }
+    }
+}
+</style>