新增考评启动的表单填报页面；增加页面面包屑功能

src/components/assessment/evaluationStartFrom.vue

@@ -0,0 +1,348 @@
+<template>
+    <div class="startFrom">
+        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm" :validate-on-rule-change="false">
+            <p class="starttitleSty">单据信息：</p>
+            <el-row class="danjuMsg">
+                <el-col :span="6">
+                    <div class="danjuMsg_data">
+                        <span class="data_tit">业务编号:</span>
+                        <span>VB131315</span>
+                    </div>
+                    <div class="danjuMsg_data">
+                        <span class="data_tit">流程状态:</span>
+                        <span>进行中</span>
+                    </div>
+                </el-col>
+                <el-col :span="6">
+                    <div class="danjuMsg_data">
+                        <span class="data_tit">填报日期:</span>
+                        <span>2023-02-23</span>
+                    </div>
+                    <div class="danjuMsg_data">
+                        <span class="data_tit">制单人员:</span>
+                        <span>XXX</span>
+                    </div>
+                </el-col>
+                <el-col :span="6">
+                    <div class="danjuMsg_data">
+                        <span class="data_tit">业务简述:</span>
+                        <span>国电电力2023年关键业绩指标</span>
+                    </div>
+                    <div class="danjuMsg_data">
+                        <span class="data_tit">填报单位:</span>
+                        <span>XXX</span>
+                    </div>
+                </el-col>
+            </el-row>
+            <p class="starttitleSty">基本信息：</p>
+            <el-row class="danjuMsg">
+                <el-col :span="6">
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit">单位名称:</span>
+                        <el-form-item prop="">
+                            <el-input v-model="input" placeholder="Please input" />
+                        </el-form-item>
+                    </div>
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit" style="display:inline-block;width:60px">年度:</span>
+                        <el-form-item prop="">
+                            <el-input v-model="input" placeholder="Please input" />
+                        </el-form-item>
+                    </div>
+                </el-col>
+                <el-col :span="6">
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit data_tit_wd">业务类别:</span>
+                        <el-form-item prop="">
+                            <el-input v-model="input" placeholder="Please input" />
+                        </el-form-item>
+                    </div>
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit data_tit_wd">年度考评得分:</span>
+                        <el-form-item prop="">
+                            <el-input-number
+                                v-model="num"
+                                :min="1"
+                                :max="10"
+                                size="small"
+                                controls-position="right"
+                                @change="handleChange"
+                            />
+                        </el-form-item>
+                    </div>
+                </el-col>
+                <el-col :span="6">
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit data_tit_wd">考评总分:</span>
+                        <el-form-item prop="">
+                            <el-input-number
+                                v-model="num"
+                                :min="1"
+                                :max="10"
+                                size="small"
+                                controls-position="right"
+                                @change="handleChange"
+                            />
+                        </el-form-item>
+                    </div>
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit data_tit_wd">年度考评级别:</span>
+                        <el-form-item prop="">
+                            <el-input v-model="input" placeholder="Please input" />
+                        </el-form-item>
+                    </div>
+                </el-col>
+                <el-col :span="6">
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit data_tit_wd">任务进度:</span>
+                        <el-form-item prop="">
+                            <el-input v-model="input" placeholder="Please input" />
+                        </el-form-item>
+                    </div>
+                    <div class="danjuMsg_data" style="display:flex;">
+                        <span class="data_tit data_tit_wd">年度考评排名:</span>
+                        <el-form-item prop="">
+                            <el-input v-model="input" placeholder="Please input" />
+                        </el-form-item>
+                    </div>
+                </el-col>
+            </el-row>
+            <p class="starttitleSty">考评目标：</p>
+            <el-table :data="tableData" border style="width: 100%">
+                <el-table-column type="index" label="序号" width="80" />
+                <el-table-column label="指标项" prop="targetindex" width="300" />
+                <el-table-column label="业务分类" prop="type" width="100" />
+                <el-table-column label="填报部门">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.dept}}</span> -->
+                        <el-input v-model="scope.row.dept" placeholder="Please input" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="填报人">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.eidtor}}</span> -->
+                        <el-input v-model="scope.row.eidtor" placeholder="Please input" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="填报日期">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.eidDate}}</span> -->
+                        <el-date-picker
+                            v-model="scope.row.eidDate"
+                            type="date"
+                            placeholder="Pick a day"
+                            :size="size"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column label="审批人">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.approvalor}}</span> -->
+                        <el-input v-model="scope.row.approvalor" placeholder="Please input" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="计划分值">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.plan}}</span> -->
+                        <el-input v-model="scope.row.plan" placeholder="Please input" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="进度分值">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.progress}}</span> -->
+                        <el-input v-model="scope.row.progress" placeholder="Please input" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="综合得分">
+                    <template #default="scope">
+                        <!-- <span>{{scope.row.synthesize}}</span> -->
+                        <el-input v-model="scope.row.synthesize" placeholder="Please input" />
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-form>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            tableData: [],
+            ruleForm: {
+
+            },
+            rules: {
+                // indicatorId: [
+                //     { required: true, message: '请选择指标名称', trigger: 'blur' }
+                // ],
+                // totalScore: [
+                //     { required: true, message: '请输入指标总分', trigger: 'blur' }
+                // ],
+                // evaluateMethod: [
+                //     { required: true, message: '请选择评分方式', trigger: 'change' }
+                // ],
+                // evaluateFormula: [
+                //     { required: true, message: '请输入评分公式', trigger: 'blur' }
+                // ],
+                // mappingFun: [
+                //     { required: true, message: '请选择隐射函数', trigger: 'change' }
+                // ],
+                // desc: [
+                //     { required: true, message: '请输入描述', trigger: 'change' }
+                // ]
+            },
+        }
+    },
+    created() {
+        this.tableData = [
+            {
+                targetindex: '填报部门',
+                type: '基建',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '深化改革（创一流）',
+                type: '重点专项',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '亏损企业治理',
+                type: '重点专项',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '双碳目标落实',
+                type: '重点专项',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '煤矿证照办理',
+                type: '重点专项',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '低效无效资产处置',
+                type: '生产经营',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '智慧电站建设、煤电三改联动、综合能源发展',
+                type: '职业健康',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+            {
+                targetindex: '智慧电站建设、煤电三改联动、综合能源发展',
+                type: '职业健康',
+                dept: '',
+                eidtor: '',
+                eidDate: '',
+                approvalor: '',
+                plan: '',
+                progress: '',
+                synthesize: ''
+            },
+        ]
+    }
+}
+</script>
+
+<style lang="less">
+.startFrom{
+    .starttitleSty{
+        border-left: 4px solid #007aab;
+        padding-left: 5px;
+        font-size: 14px;
+        font-weight: bold;
+        font-family: '微软雅黑';
+        margin: 20px 0;
+    }
+    .el-table{
+        .el-table__body-wrapper{
+            height: 29vh;
+        }
+        .el-table__row{
+            .cell{
+                .el-input{
+                    height: 24px;
+                    .el-input__inner{
+                        height: 24px;
+                    }
+                }
+            }
+        }
+    }
+    .danjuMsg{
+        margin-top: 10px;
+        .danjuMsg_data{
+            margin: 0 0 10px 0;
+            .data_tit{
+                margin-right: 10px;
+                font-weight: bold;
+            }
+            .data_tit_wd{
+                display: inline-block;
+                width: 90px;
+            }
+            .el-form-item--small{
+                .el-input{
+                    height: 25px;
+                    width: 160px;
+                }
+                margin-bottom: 0;
+                .el-input-number{
+                    height: 25px;
+                    .el-input-number__decrease, .el-input-number__increase{
+                        right: -39px;
+                    }
+                }
+            }
+        }
+    }
+    .el-select, .el-input{
+        width: 100%;
+    }
+}
+</style>

src/components/assessment/evaluationStartPage.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="evaluationStart" v-loading="loadingImport">
+    <div class="evaluationStart">
         <div class="evaluationStartBtn">
             <p class="titleSty">考评启动</p>
             <div class="collectSeach">
@@ -29,6 +29,15 @@
             <div style="display:flex;justify-content: space-between;padding: 10px;">
                 <el-row :gutter="10" class="PeriodBtn">
                     <el-col :span="1.5">
+                        <el-col :span="1.5">
+                            <el-button
+                            type="primary"
+                            plain
+                            icon="Plus"
+                            size="mini"
+                            @click="handleAdd"
+                            >新增</el-button>
+                        </el-col>
                         <el-button
                         type="danger"
                         plain
@@ -90,7 +99,7 @@
                     <el-table-column label="综合得分">
                         <template #default="scope">
                             <span>{{scope.row.evaluate_formula}}</span>
-                        </template>
+                        </template> 
                     </el-table-column>
                     <el-table-column label="考评排名">
                         <template #default="scope">
@@ -112,28 +121,37 @@
                     :total="page.total">
                 </el-pagination>
             </div>
+            <el-dialog :title="title" v-model="dialogVisible" width="1400px" :close-on-click-modal="false">
+                <start-from-list></start-from-list>
+                <template #footer>
+                    <span class="dialog-footer">
+                        <el-button type="primary" plain>发 布</el-button>
+                        <el-button type="warning" plain>保 存</el-button>
+                        <el-button >流 程</el-button>
+                        <el-button type="success" plain>导 出</el-button>
+                    </span>
+                </template>
+            </el-dialog>
         </div>
     </div>
 </template>
 
 <script>
+import startFromList from './evaluationStartFrom.vue'
 import {apiGetgetStandardPointManagementList, apiGetdeleteStandardPointManagement} from '../../api/api'
 export default {
+    components: {
+        startFromList
+    },
     data() {
         return {
             dialogVisible: false,
             title: '',
-            indicatoroptions: [],
-            optionNameoptions:[],
-            indicatorIdS: '',
 
             windframradio: {},
             deleteSelect: [],
             changeDateSelect: [],
-            loadingImport: false,
             evaluationStartData:[],
-            single: false,
-            regionaloptions:[],
             page:{
                 pagesize: 12,
                 currentPage: 1,
@@ -142,19 +160,11 @@ export default {
         }
     },
     mounted() {
-        // this.getCollectorwireprojectList()
+
     },
     methods:{
         getSeachData() {
             this.page.currentPage = 1
-            this.getCollectorwireprojectList('seach')
-        },
-        successImport(val) {
-            this.loadingImport = false
-            this.getCollectorwireprojectList()
-        },
-        importLoading(val) {
-            this.loadingImport = true
         },
         handleSizeChange(val){
             this.page.pagesize = val
@@ -189,12 +199,7 @@ export default {
         // 新增区域信息
         handleAdd() {
             this.dialogVisible = true
-            // this.single = false
-            this.title = '新增考评指标'
-            this.$nextTick(() =>{
-                // this.resetForm()
-                // this.$refs['ruleForm'].clearValidate()
-            })
+            this.title = '新建表单填报'
         },
     }
 }
@@ -203,7 +208,7 @@ export default {
 <style lang="less">
 .evaluationStart{
   .evaluationStartBtn{
-      background: #fff;
+    //   background: #fff;
       padding: 10px 20px 0 20px;
       .collectSeach{
           display: flex;
@@ -258,7 +263,7 @@ export default {
       .el-button{
           height: 30px;
           // width:100px;
-          padding: 0 30px ;
+          padding: 0 20px ;
           // padding-top: 8px;
           span{
               margin:0;
@@ -270,7 +275,7 @@ export default {
     .el-table{
         .el-table__body-wrapper{
             .el-table__empty-block{
-            height: 65vh !important;
+            height: 64vh !important;
             }
         }
         .el-input__inner{
@@ -288,12 +293,13 @@ export default {
     }
     .el-overlay{
         .el-dialog{
+            margin-top: 10vh;
             .el-dialog__body{
-                padding: 30px 60px 30px 20px !important;
-                .periodFrom{
-                    .el-select, .el-input{
-                        width: 100%;
-                    }
+                padding: 0px 60px 20px 20px !important;
+            }
+            .el-dialog__footer{
+                .dialog-footer{
+                    text-align: center;
                 }
             }
         }

src/components/evaluationSystem/evaluationIndexPage.vue

@@ -283,7 +283,7 @@ export default {
 <style lang="less">
 .evaluationIndex{
   .evaluationIndexBtn{
-      background: #fff;
+    //   background: #fff;
       padding: 10px 20px 0 20px;
       .collectSeach{
           display: flex;
@@ -343,7 +343,7 @@ export default {
     .el-table{
         .el-table__body-wrapper{
             .el-table__empty-block{
-            height: 65vh !important;
+            height: 64vh !important;
             }
         }
         .el-input__inner{

src/components/evaluationSystem/evaluationRulesPage.vue

@@ -309,7 +309,7 @@ export default {
 <style lang="less">
 .evaluationRules{
   .evaluationRulesBtn{
-      background: #fff;
+    //   background: #fff;
       padding: 10px 20px 0 20px;
       .collectSeach{
           display: flex;
@@ -369,7 +369,7 @@ export default {
     .el-table{
         .el-table__body-wrapper{
             .el-table__empty-block{
-            height: 65vh !important;
+            height: 64vh !important;
             }
         }
         .el-input__inner{

src/views/homePage.vue

@@ -20,16 +20,34 @@
                 <p>全业务域对标考评系统</p>
                 <el-tree ref="tree" :data="forecastDatas" :props="defaultProps" highlight-current node-key="id"
                 :default-expanded-keys="expendData" @node-click="handleNodeClick" @node-expand="handleNodeExpand">
-                    <template #default="{ node }">
+                    <template #default="{ node, data }">
                         <span class="custom-tree-node">
-                            <el-icon size="small" v-if="node.level === 1"><FolderOpened /></el-icon>
-                            <span style="margin-left:5px;font-size:14px;line-height:35px;display:inline-block">{{node.label}}</span>
+                            <el-icon size="small" v-if="node.level === 1 && data.id !== '0'"><FolderOpened /></el-icon>
+                            <span v-if="data.id === '0'" style="margin-left:17px;font-size:14px;line-height:35px;display:inline-block">{{node.label}}</span>
+                            <span v-else style="margin-left:5px;font-size:14px;line-height:35px;display:inline-block">{{node.label}}</span>
                         </span>
                     </template>
                 </el-tree>
             </div>
-            <div class="mainMessage" :style="mainHeight">
-                <router-view></router-view>
+            <div class="homeMain" :style="mainHeight">
+                <div style="height:40px">
+                    <el-tag
+                        v-for="tag in routeTags"
+                        :key="tag.name"
+                        closable
+                        size="large"
+                        class="tagArr"
+                        effect="dark"
+                        :type="tag.type"
+                        @close="handleClose(tag)"
+                        @click="handleShowPage(tag)"
+                    >
+                        <span>{{ tag.name }}</span>
+                    </el-tag>
+                </div>
+                <div class="mainMessage">
+                    <router-view></router-view>
+                </div>
             </div>
         </div>
     </div>
@@ -42,7 +60,8 @@ export default {
         return {
             leftLevelData: [],
             forecastDatas: [],
-            expendData: [],
+            expendData: ['0'],
+            routeTags: [],
             defaultProps: {
                 children: 'children',
                 label: 'label',
@@ -75,9 +94,13 @@ export default {
         ]
         this.forecastDatas = [
             {
+                id: '0',
+                label: '系统首页',
+                path: '/home'
+            },
+            {
                 id: '1',
                 label: '对标业务',
-                icon: 'FolderOpened',
                 children: [
                     {
                         id: '1-1',
@@ -271,20 +294,38 @@ export default {
                 ]
             }
         ]
+        if (window.localStorage.getItem('routeTags')) {
+            this.routeTags = JSON.parse(window.localStorage.getItem('routeTags'))
+        } else {
+            this.routeTags = [
+                {
+                    id: '0',
+                    name: '系统首页',
+                    path: '/home'
+                }
+            ]
+        }
         this.$nextTick(() => {
             if (this.$route?.path) {
                 let path = this.$route.path
                 this.expendData = []
                 for(let i =0; i<this.forecastDatas.length; i++) {
                     let item = this.forecastDatas[i]
-                    for(let j =0; j<item.children.length; j++) {
-                        let it = item.children[j]
-                        if (it.path === path) {
-                            if (this.$refs.tree) {
-                                this.$refs.tree.setCurrentKey(it.id)
-                                this.expendData = [item.id]
+                    if (item.id !== '0') {
+                        for(let j =0; j<item.children.length; j++) {
+                            let it = item.children[j]
+                            if (it.path === path) {
+                                if (this.$refs.tree) {
+                                    this.$refs.tree.setCurrentKey(it.id)
+                                    this.expendData = [item.id]
+                                }
                             }
                         }
+                    } else {
+                        if (this.$refs.tree) {
+                            this.$refs.tree.setCurrentKey(item.id)
+                            this.expendData = [item.id]
+                        }
                     }
                 }
             }
@@ -297,6 +338,7 @@ export default {
         mainHeight() {
             return {
                 // 'height': document.documentElement.clientHeight-50 + 'px'
+                'width': '84%',
                 'height': '95vh'
             }
         },
@@ -308,9 +350,6 @@ export default {
             }
         },
     },
-    mounted() {
-        
-    },
     methods:{
         getBac(val) {
             let strWea = ''
@@ -330,6 +369,24 @@ export default {
         handleNodeClick(val) {
             if (val.path) {
                 this.$router.push({ path: val.path})
+                let showM = 0
+                this.routeTags.forEach(item =>{
+                    if (item.name === val.label) {
+                        showM++
+                    }
+                })
+                if (showM === 0) {
+                    this.routeTags.push({
+                        id: val.id,
+                        name: val.label,
+                        path: val.path
+                    })
+                }
+                window.localStorage.setItem('routeTags', JSON.stringify(this.routeTags))
+            }
+            if (val.id === '0') {
+                let node = this.$refs.tree.getNode(val)
+                this.handleNodeExpand(val, node)
             }
         },
         handleNodeExpand(data, node) {
@@ -338,6 +395,18 @@ export default {
                     item.expanded = false
                 }
             })
+        },
+        handleClose(tag) {
+            if (this.routeTags.length > 1) {
+                this.routeTags.splice(this.routeTags.indexOf(tag), 1)
+            }
+        },
+        handleShowPage(tag) {
+            this.$router.push({ path: tag.path})
+            let node = this.$refs.tree.getNode(tag)
+            this.handleNodeExpand(tag, tag.id === '0'?node:node.parent)
+            this.$refs.tree.setCurrentKey(tag.id)
+            this.expendData = [tag.id]
         }
     }
 }
@@ -416,7 +485,7 @@ export default {
             }
             .el-tree{
                 position: relative;
-                top: 15px;
+                top: 30px;
                 padding: 0 0 0 20px;
                 background: transparent;
                 .el-tree-node{
@@ -445,11 +514,18 @@ export default {
                 border-radius: 5px;
             }
         }
-        .mainMessage{
-            width: 84%;
-            padding-top: 10px;
-            background: #fff;
-            border-radius: 20px;
+        .homeMain{
+            .tagArr{
+                height: 25px;
+                margin-right: 10px;
+                cursor: pointer;
+            }
+            .mainMessage{
+                width: 100%;
+                padding-top: 10px;
+                background: #fff;
+                border-radius: 20px;
+            }
         }
     }
 }