From fcc67e542ebaf51c8eed80455646fdb40cf3a68f Mon Sep 17 00:00:00 2001
From: odjbin <1042039504@qq.com>
Date: Wed, 9 Oct 2024 19:46:47 +0800
Subject: [PATCH] =?UTF-8?q?fix=20:=20=E4=BC=98=E5=8C=96=E9=A6=96=E9=A1=B5?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/index-new.vue | 1452 ----------------------------------
 src/views/home/index.vue     |   14 +-
 2 files changed, 7 insertions(+), 1459 deletions(-)
 delete mode 100644 src/views/home/index-new.vue

diff --git a/src/views/home/index-new.vue b/src/views/home/index-new.vue
deleted file mode 100644
index 54edc64..0000000
--- a/src/views/home/index-new.vue
+++ /dev/null
@@ -1,1452 +0,0 @@
-<template>
-  <div class="home-bg" v-if="AuthStore.roles.length">
-    <el-row gutter="10">
-      <el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18">
-        <div class="top-left">
-          <el-card shadow="never">
-            <div class="notice-title">早上好，小i提醒您<span>有<span>{{ taskTabList[0].num }}</span>个审批待立项</span></div>
-            <el-row class="statistics">
-              <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-for="(item,index) in taskTabList" :key="index">
-                <div class="block" :style="{'background-image':'url('+getImgUrl(item.icon)+')'}"
-                     @click="clickGotoListPage(item)">
-                  <div class="block-right">
-                    <span>{{ item.num }}<span>个</span></span>
-                    <span>{{ item.title }}</span>
-                  </div>
-                </div>
-              </el-col>
-            </el-row>
-          </el-card>
-          <el-card shadow="never" class="todo-bg">
-            <el-tabs v-model="activeName" editable>
-              <template #add-icon>
-                刷新一下
-                <div style="width: 31px"></div>
-              </template>
-              <el-tab-pane :label="'待办（'+todoList.length +'）'" name="first">
-                <div class="todo-top">
-                  <div class="bell">
-                    <el-icon size="20" color="#F55815">
-                      <BellFilled/>
-                    </el-icon>
-                    <span>您有{{ todoList.length }}条待办需要处理</span>
-                  </div>
-                  <div class="todo-more">
-                    <span>查看更多</span>
-                    <el-icon color="#1F63E6" size="18">
-                      <ArrowRight/>
-                    </el-icon>
-                  </div>
-                </div>
-                <div class="todo-content">
-                  <div v-if="todoList&&todoList.length==0">
-                    <el-empty image-size="135" description="暂无已办数据~"/>
-                  </div>
-                  <div v-for="item in todoList" class="todo-border">
-                    <div class="status"
-                         :style="{'background-color': item.status == 0 ? '#F55815' : item.status == 1 ? '#20BDA1' : '#4C52EA'}">
-                      {{ item.status == 0 ? '加急' : item.status == 1 ? '正常' : '逾期' }}
-                    </div>
-                    <div class="process-type">流程类型：{{ item.targetState }}</div>
-                    <div class="black-text">发起人：{{ item.initiatorName }}</div>
-                    <div class="black-text">当前节点：{{ item.taskName }}</div>
-                    <div class="gray-time">
-                      <div>
-                        <div class="title">
-                          <svg-icon name="home-time" :class-name="'home-time'"/>
-                          <span>提交时间：</span>
-                        </div>
-                        <div class="time"> {{ item.submitTime }}</div>
-                      </div>
-                      <div class="view">查看</div>
-                    </div>
-                  </div>
-                </div>
-                <!--                <fvTable ref="tableConfigBacklogRef" class="home-table" :tableConfig="tableConfigBacklog"-->
-                <!--                         :pagination="false"-->
-                <!--                         @getTotal="getTotal">-->
-                <!--                  <template #empty>-->
-                <!--                    <el-empty description="暂无待办"/>-->
-                <!--                  </template>-->
-                <!--                </fvTable>-->
-              </el-tab-pane>
-              <el-tab-pane :label="'已办（' + reportNum + '）'" name="second">
-                <div v-if="doneList&&doneList.length==0">
-                  <el-empty image-size="135" description="暂无已办数据~"/>
-                </div>
-                <div v-for="item in doneList" class="todo-border">
-                  <div class="status"
-                       :style="{'background-color': item.status == 0 ? '#F55815' : item.status == 1 ? '#20BDA1' : '#4C52EA'}">
-                    {{ item.status == 0 ? '加急' : item.status == 1 ? '正常' : '逾期' }}
-                  </div>
-                  <div class="process-type">流程类型：{{ item.targetState }}</div>
-                  <div class="black-text">发起人：{{ item.initiatorName }}</div>
-                  <div class="black-text">当前节点：{{ item.taskName }}</div>
-                  <div class="gray-time">
-                    <div>
-                      <div class="title">
-                        <svg-icon name="home-time" :class-name="'home-time'"/>
-                        <span>提交时间：</span>
-                      </div>
-                      <div class="time"> {{ item.submitTime }}</div>
-                    </div>
-                    <div class="view">查看</div>
-                  </div>
-                </div>
-                <!--                <fvTable ref="tableConfigReportRef" :tableConfig="tableConfigReport" @getTotal="getReportNumTotal">-->
-                <!--                  <template #empty>-->
-                <!--                    <el-empty description="暂无数据"/>-->
-                <!--                  </template>-->
-                <!--                </fvTable>-->
-              </el-tab-pane>
-            </el-tabs>
-          </el-card>
-        </div>
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
-        <div class="right">
-          <div class="right-top ">
-            <div class="title-block">
-              <div class="title">
-                <div class="tag"></div>
-                <span>通知公告</span>
-              </div>
-              <div class="more">
-                <span>更多</span>
-                <el-icon color="#1F63E6" size="18">
-                  <ArrowRight/>
-                </el-icon>
-              </div>
-            </div>
-            <div class="notice-block">
-              <div v-for="(item,index) in noticeList" class="notice">
-                <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}
-              </div>
-            </div>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-    <el-row gutter="10" style="margin-top: 10px">
-      <el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6">
-        <div class="right bottom">
-          <div class="right-top ">
-            <div class="title-block">
-              <div class="title">
-                <div class="tag"></div>
-                <span>专项资金项目</span>
-              </div>
-              <div class="more">
-                <span>更多</span>
-                <el-icon color="#1F63E6" size="18">
-                  <ArrowRight/>
-                </el-icon>
-              </div>
-            </div>
-            <div>
-              <div class="container">
-                <div id="fundPie" ref="fundPie"></div>
-              </div>
-            </div>
-            <div class="fund-pie">专项资金项目统计图</div>
-          </div>
-        </div>
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
-        <div class="right  bottom">
-          <div class="right-top ">
-            <div class="title-block">
-              <div class="title">
-                <div class="tag"></div>
-                <span>研发投入资金</span>
-              </div>
-              <div class="more">
-                <span>更多</span>
-                <el-icon color="#1F63E6" size="18">
-                  <ArrowRight/>
-                </el-icon>
-              </div>
-            </div>
-            <div class="money-block">
-              <div class="money-container">
-                <div id="moneyPie" ref="moneyPie"></div>
-              </div>
-              <div>
-                <div class="total-money">总资金：{{ toThousands(totalMoney) }}</div>
-                <div v-for="(item,index) in moneyData" class="legend">
-                  <div class="money-dot" :style="{'background-color': colorList[index]}"></div>
-                  <div class="company-name">{{ item.companyName }}</div>
-                  <div>{{ toThousands(item.money) }}</div>
-                </div>
-              </div>
-            </div>
-            <div class="fund-pie" style="text-align: left;margin-left: 60px;margin-top: 10px">研发投入资金统计图</div>
-          </div>
-        </div>
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10">
-        <el-card shadow="never" class="todo-bg">
-          <el-tabs v-model="docActiveTab" editable>
-            <template #add-icon>
-              更多
-              <el-icon color="#1F63E6" size="18">
-                <ArrowRight/>
-              </el-icon>
-              <div style="width: 15px"></div>
-            </template>
-            <el-tab-pane label="规章制度" name="first">
-              <div class="notice-block rules-block">
-                <div v-for="(item,index) in rulesList" class="notice">
-                  <div>
-                    <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}
-                  </div>
-                  <div>2018-05-06</div>
-                </div>
-              </div>
-            </el-tab-pane>
-            <el-tab-pane label="帮助文档" name="second">
-              <div class="notice-block rules-block">
-                <div v-if="helpDocList&&helpDocList.length==0">
-                  <el-empty image-size="135" description="暂无帮助文档~"/>
-                </div>
-                <div v-for="(item,index) in helpDocList" class="notice">
-                  <div>
-                    <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}
-                  </div>
-                  <div>2018-05-06</div>
-                </div>
-              </div>
-            </el-tab-pane>
-            <el-tab-pane label="常见问题" name="third">
-              <div class="notice-block rules-block">
-                <div v-for="(item,index) in problemList" class="notice">
-                  <div>
-                    <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}
-                  </div>
-                  <!--                  <span class="dot" v-if="item.isRead"></span>-->
-                  <div>2018-05-06</div>
-                </div>
-              </div>
-            </el-tab-pane>
-          </el-tabs>
-        </el-card>
-      </el-col>
-    </el-row>
-  </div>
-  <div v-else style="display: flex; justify-content: center; align-items: center; height: 100%;">
-    您没有任何角色， 请联系管理员！
-  </div>
-</template>
-
-<script setup lang="jsx">
-import 'element-plus/theme-chalk/display.css'
-import {useAuthStore} from '@/stores/userstore.js'
-import * as echarts from 'echarts'
-import {toThousands} from "@/utils/changePrice.js";
-
-const AuthStore = useAuthStore()
-const router = useRouter()
-const activeName = ref('first')
-const docActiveTab = ref('first')
-const totalMoney = ref('45000')
-const tableConfigBacklogRef = ref()
-const tableConfigReportRef = ref()
-const moneyData = ref([
-  {
-    companyName: '智汇未来科技公司',
-    money: '30000',
-  },
-  {
-    companyName: '云航信息技术公司',
-    money: '10000',
-  },
-  {
-    companyName: '融智投资管理公司',
-    money: '5000',
-  },
-])
-const taskTabList = ref([
-  {
-    title: '待立项',
-    color: '#CEE8FA',
-    textColor: '#0043C5',
-    icon: 'home1.png',
-    num: 21,
-    type: 'pending'
-  },
-  {
-    title: '已立项',
-    color: '#DCCEFA',
-    textColor: '#8600C5',
-    icon: 'home2.png',
-    num: 2,
-    type: 'approved'
-  },
-  {
-    title: '实施中',
-    color: '#FAE6CE',
-    textColor: '#F47D0E',
-    icon: 'home3.png',
-    num: 4,
-    type: 'carryout'
-  },
-  {
-    title: '已验收',
-    color: '#CEFAD8',
-    textColor: '#01A089',
-    icon: 'home4.png',
-    num: 1,
-    type: 'check'
-  }
-])
-const todoList = ref([
-  {
-    status: 0,
-    targetState: '项目归档',
-    initiatorName: '胡晓',
-    taskName: '审批人',
-    submitTime: '2024-08-07 19:00:01',
-  },
-  {
-    status: 1,
-    targetState: '项目归档',
-    initiatorName: '胡晓',
-    taskName: '审批人',
-    submitTime: '2024-08-07 19:00:01',
-  },
-  {
-    status: 2,
-    targetState: '项目归档',
-    initiatorName: '胡晓',
-    taskName: '审批人',
-    submitTime: '2024-08-07 19:00:01',
-  },
-  {
-    status: 0,
-    targetState: '项目归档',
-    initiatorName: '胡晓',
-    taskName: '审批人',
-    submitTime: '2024-08-07 19:00:01',
-  },
-  {
-    status: 1,
-    targetState: '项目归档',
-    initiatorName: '胡晓',
-    taskName: '审批人',
-    submitTime: '2024-08-07 19:00:01',
-  },
-  {
-    status: 2,
-    targetState: '项目归档',
-    initiatorName: '胡晓',
-    taskName: '审批人',
-    submitTime: '2024-08-07 19:00:01',
-  },
-])
-const noticeList = ref([
-  {
-    title: '系统升级通知，升级通知，期间部分服务将暂升级通知，期间部分服务将暂升级通知，期间部分服务将暂将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停'
-  }
-])
-const rulesList = ref([
-  {
-    title: '系统升级通知，升级通知，期间部分服务将暂升级通知，期间部分服务将暂升级通知，期间部分服务将暂将暂停',
-    isRead: true
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: true
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: true
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  }
-])
-const helpDocList = ref([])
-const problemList = ref([
-  {
-    title: '常见问题',
-    isRead: true
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: false
-  },
-  {
-    title: '系统升级通知，期间部分服务将暂停',
-    isRead: true
-  }
-
-])
-const doneList = ref([])
-const todoNum = ref(0)
-const reportNum = ref(0)
-const auths = {
-  edit: ['mosr:requirement:resubmit'],
-  detail: ['mosr:requirement:info'],
-  add: ['mosr:requirement:add'],
-  del: ['mosr:requirement:del'],
-  report: ['mosr:collect:reported'],
-}
-const tableConfigBacklog = reactive({
-  columns: [
-    {
-      prop: 'index',
-      type: 'index',
-      label: '序号',
-      align: 'center',
-      width: 85,
-      index: index => {
-        return (tableConfigBacklogRef.value.getQuery().pageNum - 1) * tableConfigBacklogRef.value.getQuery().pageSize + index + 1
-      }
-    },
-    {
-      prop: 'targetName',
-      label: '流程名称',
-      align: 'center',
-    },
-    {
-      prop: 'initiatorName',
-      label: '发起人',
-      align: 'center',
-    },
-    {
-      prop: 'targetState',
-      label: '流程类型',
-      align: 'center',
-      showOverflowTooltip: false,
-      currentRender: ({row, index}) => {
-        if (row.targetState !== null || row.targetState !== undefined) {
-          return (<Tag dictType={'todo_type'} value={row.targetState}/>)
-        } else {
-          return '--'
-        }
-      }
-    },
-    {
-      prop: 'submitTime',
-      label: '提交时间',
-      align: 'center',
-    },
-    {
-      prop: 'taskName',
-      label: '当前节点',
-      align: 'center',
-    },
-    {
-      prop: 'oper',
-      label: '操作',
-      fixed: 'right',
-      width: '150',
-      align: 'center',
-      showOverflowTooltip: false,
-      currentRender: ({row, index}) => {
-        return (
-            <div>
-              <el-button type="primary" link onClick={() => handleView(row)}>查看</el-button>
-            </div>
-        )
-      }
-    }
-  ],
-  api: '/workflow/mosr/process/task',
-  params: {},
-})
-const tableConfigReport = reactive({
-  columns: [
-    // {
-    //   type: 'selection',
-    //   prop: 'selection'
-    // },
-    {
-      prop: 'index',
-      type: 'index',
-      label: '序号',
-      align: 'center',
-      width: 85,
-      index: index => {
-        return (tableConfigReportRef.value.getQuery().pageNum - 1) * tableConfigReportRef.value.getQuery().pageSize + index + 1
-      }
-    },
-    {
-      prop: 'requirementName',
-      label: '征集名称',
-      align: 'center'
-    },
-    {
-      prop: 'collectType',
-      label: '征集类型',
-      align: 'center'
-    },
-    {
-      prop: 'companyName',
-      label: '征集公司',
-      align: 'center',
-      // currentRender: ({row, index}) => (
-      // <div style={{width: '300px', textOverflow: 'ellipsis',textAlign:'center'}}>{row.companyName}</div>)
-    },
-    // {
-    //   prop: 'approveName',
-    //   label: '审批人',
-    //   align: 'center'
-    // },
-    {
-      prop: 'deadline',
-      label: '截止时间',
-      align: 'center'
-    },
-    // {
-    //   prop: 'taskNode',
-    //   label: '当前节点',
-    //   align: 'center'
-    // },
-    {
-      prop: 'state',
-      label: '状态',
-      align: 'center',
-      width: 200,
-      showOverflowTooltip: false,
-      currentRender: ({row, index}) => (<Tag dictType={'demand_collection'} value={row.state}/>)
-    },
-    {
-      prop: 'oper',
-      label: '操作',
-      align: 'center',
-      fixed: 'right',
-      showOverflowTooltip: false,
-      currentRender: ({row, index}) => {
-        let btn = []
-        let buttons = new Set(Array.from(row.buttons))
-        if (buttons.has("details")) {
-          btn.push({label: '详情', prem: auths.detail, func: () => handleDetail(row), type: 'primary'})
-        }
-        if (buttons.has("report")) {
-          btn.push({label: '需求上报', prem: auths.report, func: () => handleReport(row), type: 'primary'})
-        }
-        return (
-            <div style={{width: '100%'}}>
-              {
-                btn.map(item => (
-                    <el-button
-                        type={item.type}
-                        v-perm={item.prem}
-                        onClick={() => item.func()}
-                        link
-                    >
-                      {item.label}
-                    </el-button>
-                ))
-              }
-            </div>
-        )
-      }
-    }
-  ],
-  api: '/workflow/mosr/requirement',
-  params: {
-    state: "4"
-  }
-})
-
-const data = reactive({
-  fundPieCharts: null,
-  moneyPieCharts: null,
-})
-const colorList = ref(['#5c60ca', '#a159da', '#4bd566'])
-const fundPieOption = ref({
-  tooltip: {
-    trigger: 'item'
-  },
-  legend: {
-    top: 'top',
-    orient: 'vertical',
-    left: '0',
-    bottom: '20',
-    align: 'left',
-    icon: 'circle',
-    textStyle: {
-      color: 'rgba(0,0,0,0.6)',
-      fontSize: '14px'
-    },
-    formatter: function (name) {
-      let data = fundPieOption.value.series[0].data
-      let total = 0
-      let tarValue
-      for (let i = 0; i < data.length; i++) {
-        total += data[i].value
-        if (data[i].name == name) {
-          tarValue = data[i].value
-        }
-      }
-      let v = tarValue
-      let p = ((tarValue / total) * 100).toFixed(2)
-      return `${name}     ${v}     ${p}%`
-    },
-  },
-  graphic: {       //图形中间图片
-    elements: [{
-      type: 'image',
-      style: {
-        image: "people.png",//你的图片地址
-        width: 70,
-        height: 70
-      },
-      left: 'center',
-      right: 'center',
-      top: '42%',
-    }]
-  },
-  series: [
-    {
-      type: 'pie',
-      radius: [75, 100],
-      center: ['50%', '50%'],
-      top: '10%',
-      left:'8',
-      label: {
-        show: false,
-      },
-      itemStyle: {
-        normal: {
-          borderWidth: 10,//设置边框粗细
-          borderColor: '#fff',
-          color: function (params) {
-            const colorList = [
-              ['#6101ff', '#a965ff'],
-              ['#5cdcd3', '#5cdcd3'],
-            ];
-            const index = params.dataIndex;
-            return new echarts.graphic.LinearGradient(0, 0, 1, 1,
-                [{
-                  offset: 0,
-                  color: colorList[index][0]
-                },
-                  {
-                    offset: 1,
-                    color: colorList[index][1]
-                  }
-                ]);
-          }
-        }
-      },
-      data: [
-        {value: 75, name: '专项资金',},
-        {value: 20, name: '非专项资金', selected: true},
-      ],
-    },
-    {
-      name: '',
-      type: 'pie',
-      top: '10%',
-      left:'8',
-      clockWise: false,
-      hoverAnimation: false,
-      radius: ['80%', '80%'],//边框大小
-      center: ['50%', '50%'],//边框位置
-      tooltip: {
-        show: false
-      },
-      label: {
-        show: false
-      },
-      emphasis: {
-        show: false
-      },
-      data: [{
-        value: 0,
-        itemStyle: {
-          normal: {
-            borderWidth: 1,//设置边框粗细
-            borderColor: 'rgba(0,0,0,0.1)'//边框颜色
-          }
-        }
-      }]
-    }
-  ]
-})
-const moneyPieOption = ref({
-  tooltip: {
-    show:false,
-    trigger: 'item'
-  },
-  color: colorList,
-  series: [
-    {
-      type: 'pie',
-      radius: [0, 100],
-      center: ['50%', '50%'],
-      label: {
-        normal: {
-          show: true,
-          position: 'inner',
-          formatter: function (data) {
-            return toThousands(data.value)
-          }
-        },
-      },
-      itemStyle: {
-        borderWidth: 10,//设置边框粗细
-        borderColor: '#fff'
-      },
-      data: [
-        {value: 30000, name: '智汇未来科技公司',},
-        {value: 10000, name: '云航信息技术公司'},
-        {value: 5000, name: '融智投资管理公司'},
-      ],
-    },
-  ]
-})
-const init = () => {
-  data.fundPieCharts = echarts.init(document.getElementById('fundPie')).setOption(fundPieOption.value)
-  data.moneyPieCharts = echarts.init(document.getElementById('moneyPie')).setOption(moneyPieOption.value)
-}
-
-onMounted(() => {
-  init()
-})
-
-window.addEventListener('resize', () => {
-  data.fundPieCharts = null
-  data.moneyPieCharts = null
-  init()
-})
-
-const clickGotoListPage = (item) => {
-  console.info("🚀 ~method:clickGotoListPage -----", item.type)
-  if (item.type === 'pending') {
-    router.push({
-      name: 'Initiation',
-      query: {
-        state: 0
-      }
-    })
-  } else if (item.type === 'approved') {
-    router.push({
-      name: 'Initiation',
-      query: {
-        state: 4
-      }
-    })
-  } else if (item.type === 'carryout') {
-    router.push({
-      name: 'Implementation',
-      query: {
-        state: 0
-      }
-    })
-  } else if (item.type === 'check') {
-    router.push({
-      name: 'Implementation',
-      query: {
-        state: 4
-      }
-    })
-  }
-}
-
-const getImgUrl = (name) => {
-  return new URL('/' + name, import.meta.url).href
-}
-
-const handleDetail = (row) => {
-  router.push({
-    name: 'Requirement/detail',
-    query: {
-      id: row.requirementId
-    }
-  })
-}
-const handleReport = (row) => {
-  router.push({
-    name: 'Summary/add',
-    query: {
-      id: row.requirementId
-    }
-  })
-}
-const getTotal = (val) => {
-  todoNum.value = val
-}
-const getReportNumTotal = (val) => {
-  reportNum.value = val
-}
-const handleView = (row) => {
-  if (row.targetState == '00' && row.targetId) {
-    router.push({
-      name: 'Requirement/detail',
-      query: {
-        id: row.targetId,
-        source: 'home'
-      }
-    })
-  } else if (row.targetState == '10' && row.targetId) {
-    router.push({
-      name: 'Summary/detail',
-      query: {
-        projectId: row.targetId,
-        state: row.state,
-        source: 'home'
-      }
-    })
-  } else if (row.targetState == '20' || row.targetState == '40' || row.targetState == '50') {
-    router.push({
-      name: 'Implementation/detail',
-      query: {
-        projectId: row.targetId,
-        state: row.state,
-        step: row.targetState,
-        source: 'home'
-      }
-    })
-  } else if (row.targetState == '70' && row.targetId) {
-    router.push({
-      name: 'Fund/detail',
-      query: {
-        id: row.targetId,
-        state: row.state,
-        source: 'home'
-      }
-    })
-  } else if (row.targetState == '80' && row.targetId) {
-    router.push({
-      name: 'Share/detail',
-      query: {
-        id: row.targetId,
-        state: row.state,
-        source: 'home'
-      }
-    })
-  } else if (row.targetState == '90' && row.targetId) {
-    router.push({
-      name: 'Phase/detail',
-      query: {
-        projectId: row.targetId,
-        source: 'home'
-      }
-    })
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-@media only screen and (max-width: 767px) {
-  .right {
-    margin-top: 10px;
-  }
-  :deep(.el-table) {
-    height: 300px !important;
-  }
-  .todo-bg {
-    margin-top: 10px;
-  }
-}
-
-@media only screen and (max-width: 1000px) {
-  .right {
-    margin-top: 10px;
-  }
-  :deep(.el-table) {
-    height: 300px !important;
-  }
-  .todo-bg {
-    margin-top: 10px;
-  }
-
-}
-
-@media only screen and (max-width: 1200px) {
-  .right {
-    margin-top: 10px;
-  }
-  :deep(.el-table) {
-    height: 300px !important;
-  }
-  .todo-bg {
-    margin-top: 10px;
-  }
-
-}
-* {
-  font-family: Source Sans Pro, Source Sans Pro;
-}
-
-.money-block {
-  display: flex;
-  align-items: center;
-
-  .total-money {
-    height: 25px;
-    font-weight: 400;
-    font-size: 16px;
-    color: #000000;
-    line-height: 18px;
-  }
-
-  .legend {
-    margin-top: 14px;
-    display: flex;
-    align-items: center;
-
-    > div:last-child {
-      font-weight: 400;
-      font-size: 16px;
-      color: #000000;
-      letter-spacing: 1px;
-    }
-
-    .company-name {
-      font-size: 14px;
-      color: rgba(0, 0, 0, 0.6);
-      letter-spacing: 1px;
-      margin-left: 10px;
-      margin-right: 30px;
-      white-space: nowrap;
-    }
-
-    .money-dot {
-      width: 16px;
-      height: 16px;
-      border-radius: 50%;
-    }
-  }
-}
-
-.money-container {
-  //height: calc((100vh / 2) - 200px);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 49px;
-  width: 250px;
-
-  > div {
-    height: 250px;
-    flex: 1;
-  }
-}
-
-.container {
-  //height: calc((100vh / 2) - 200px);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 10px;
-
-  > div {
-    height: 300px;
-    flex: 1;
-  }
-}
-
-:deep(.el-card__body) {
-  padding: 0 5px !important;
-}
-
-:deep(.el-tabs__nav-wrap:after) {
-  background-color: #D9D9D9 !important;
-  height: 1px !important;
-}
-
-:deep(.el-tabs__active-bar) {
-  height: 1px !important;
-  //background-color: #1476E3 !important;
-}
-
-:deep(.el-tabs__new-tab ) {
-  width: auto !important;
-  border: none !important;
-  color: #1476E3;
-  font-size: 14px;
-  line-height: 51px!important;
-  height: 51px!important;
-  margin: 0 0 0 -93px !important;
-  z-index: 99;
-  position: relative;
-  &:hover{
-    text-decoration: underline;
-  }
-}
-
-:deep(.el-card) {
-  border-radius: 10px !important;
-}
-
-:deep(.is-icon-close) {
-  display: none;
-}
-
-:deep(.el-tabs__nav-scroll) {
-  .el-tabs__nav {
-    .el-tabs__item {
-      flex: 1;
-      font-size: 16px;
-      width: 120px;
-      font-weight: 600;
-      height: 51px;
-      color: rgba(0, 0, 0, 0.5);
-    }
-
-    .el-tabs__item.is-active {
-      color: #1476E3;
-    }
-  }
-}
-
-
-.home-bg {
-  height: calc(100vh - 130px);
-  max-height: calc(100vh - 96px);
-  background-color: #EFEFEF;
-  position: absolute;
-  left: 18px;
-  right: 0;
-  overflow-x: hidden;
-  overflow-y: auto;
-
-  .todo-more {
-    display: flex;
-    align-items: center;
-    color: #1476E3;
-    cursor: pointer;
-    margin-right: 10px;
-    line-height: 20px;
-
-    &:hover {
-      text-decoration: underline;
-    }
-
-    > span {
-      margin-left: 10px;
-      margin-right: 3px;
-    }
-  }
-
-  &::-webkit-scrollbar {
-    width: 6px;
-  }
-
-  // 滚动条轨道
-  &::-webkit-scrollbar-track {
-    background: rgb(239, 239, 239);
-    border-radius: 2px;
-  }
-
-  // 小滑块
-  &::-webkit-scrollbar-thumb {
-    background: rgba(80, 81, 82, 0.29);
-    border-radius: 10px;
-  }
-
-  .top-left {
-    //flex: 0.8;
-    .notice-title{
-      margin-top: 10px;margin-left: 14px;color: #000000;letter-spacing: 1px;font-size: 16px;
-      >span{
-        color: #F40E0E;
-        >span{
-          font-weight: bold;
-        }
-      }
-    }
-    .todo-bg {
-      margin-top: 10px;
-
-      .todo-content {
-        overflow-x: auto;
-        margin: 0 12px 0 19px;
-        padding: 0 0 10px 0;
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-
-        &::-webkit-scrollbar {
-          width: 6px;
-          height: 6px;
-        }
-
-        // 滚动条轨道
-        &::-webkit-scrollbar-track {
-          background: rgb(239, 239, 239);
-          border-radius: 2px;
-        }
-
-        // 小滑块
-        &::-webkit-scrollbar-thumb {
-          background: rgba(80, 81, 82, 0.29);
-          border-radius: 10px;
-        }
-
-        .todo-border {
-          padding: 13px;
-          width: 180px;
-          background: rgba(73, 171, 239, 0.05);
-          border-radius: 8px 8px 8px 8px;
-          border: 1px solid #D0D0E3;
-          margin-right: 23px;
-          font-size: 14px;
-
-          &:last-child {
-            margin-right: 0;
-          }
-
-          &:hover {
-            border: 1px solid #F55815;
-          }
-
-          .gray-time {
-            display: flex;
-            align-items: flex-end;
-            font-weight: 400;
-            color: rgba(0, 0, 0, 0.5);
-            letter-spacing: 1px;
-            font-size: 14px;
-
-            .view {
-              float: right;
-              color: #1F63E6;
-              white-space: nowrap;
-              cursor: pointer;
-
-              &:hover {
-                text-decoration: underline;
-              }
-            }
-
-            > div:first-child {
-              display: flex;
-              flex-direction: column;
-
-              .title {
-                display: flex;
-              }
-            }
-
-            .time {
-              margin-left: 23px;
-            }
-          }
-
-          .black-text {
-            white-space: nowrap;
-            color: #000000;
-            margin-bottom: 7px;
-          }
-
-          .process-type {
-            white-space: nowrap;
-            margin-top: 13px;
-            margin-bottom: 7px;
-            color: #1F63E6;
-            letter-spacing: 1px;
-          }
-
-          .status {
-            width: 52px;
-            height: 23px;
-            border-radius: 3px 3px 3px 3px;
-            font-size: 13px;
-            color: #FFFFFF;
-            line-height: 23px;
-            letter-spacing: 1px;
-            text-align: center;
-          }
-        }
-      }
-
-      .todo-top {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        font-size: 14px;
-        margin-bottom: 12px;
-        margin-left: 20px;
-
-
-        .bell {
-          display: flex;
-          align-items: center;
-          color: #F55815;
-          font-size: 15px;
-
-          > span {
-            margin-left: 10px;
-            letter-spacing: 1px;
-          }
-        }
-      }
-    }
-
-    .statistics {
-      .block {
-        cursor: pointer;
-        display: flex;
-        align-items: center;
-        height: 170px;
-        background-size: 100% 100%;
-        background-repeat: no-repeat;
-
-        .block-right {
-          margin-left: 15%;
-          display: flex;
-          flex-direction: column;
-          justify-content: center;
-          color: #fff;
-          font-size: 16px;
-
-          > span:first-child {
-            white-space: nowrap;
-            font-size: 26px;
-            font-weight: bold;
-            margin-bottom: 10px;
-
-            > span {
-              margin-left: 10px;
-              font-size: 16px;
-            }
-          }
-
-          > span:last-child {
-            white-space: nowrap;
-            color: #fff;
-            margin-bottom: 10px;
-          }
-        }
-      }
-    }
-  }
-
-  .bottom {
-
-    .right-top {
-      height: 410px !important;
-    }
-  }
-
-  .rules-block {
-    height: 343px !important;
-    margin-top: 0!important;
-
-    .notice {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      height: 42px !important;
-      line-height: 42px !important;
-      color: rgba(0, 0, 0, 0.5) !important;
-
-      .dot {
-        display: inline-block;
-        width: 6px;
-        height: 6px;
-        border-radius: 25px;
-        background: #DD3B3B;
-        margin-left: -6px;
-        margin-bottom: 5px;
-        margin-right: 4px;
-      }
-
-      div:first-child {
-        width: 80% !important;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        overflow: hidden;
-
-        > span:first-child {
-          margin-right: 10px;
-          color: #1476E3;
-          font-weight: bold;
-          font-size: 16px;
-          margin-left: 0 !important;
-        }
-      }
-
-      div:last-child {
-        font-weight: 400;
-        letter-spacing: 1px;
-        color: rgba(0, 0, 0, 0.5)
-      }
-    }
-  }
-
-  .notice-block {
-    height: 452px;
-    overflow-y: auto;
-    margin-top: 10px;
-
-    &::-webkit-scrollbar {
-      width: 6px;
-      height: 6px;
-    }
-
-    // 滚动条轨道
-    &::-webkit-scrollbar-track {
-      background: rgb(239, 239, 239);
-      border-radius: 2px;
-    }
-
-    // 小滑块
-    &::-webkit-scrollbar-thumb {
-      background: rgba(80, 81, 82, 0.29);
-      border-radius: 10px;
-    }
-
-    .notice {
-      min-width: 300px;
-      height: 65px;
-      line-height: 65px;
-      padding: 0 15px;
-      font-size: 15px;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-
-      > span:first-child {
-        margin-right: 10px;
-        margin-left: 10px;
-        color: #1476E3;
-        font-weight: bold;
-        font-size: 16px;
-      }
-
-      &:hover {
-        color: #1476E3;
-        background: #F6FBFE;
-      }
-    }
-  }
-
-  .right {
-    height: 100%;
-    //height: calc(100vh - 130px);
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-
-    .right-top {
-      height: 100%;
-      //height: 473px;
-      //flex: 0.61;
-      overflow: hidden;
-      border-radius: 10px;
-      background-color: #ffffff;
-
-      .fund-pie {
-        width: 100%;
-        height: 25px;
-        font-size: 14px;
-        color: rgba(0, 0, 0, 0.5);
-        text-align: center;
-        //margin-top: 15px;
-      }
-
-      .title-block {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        padding: 15px;
-        border-bottom: 2px solid #D9D9D9;
-
-        .title {
-          display: flex;
-          align-items: center;
-
-          .tag {
-            width: 7px;
-            height: 18px;
-            background: linear-gradient(#1476E3 0%, #99C9FF 100%);
-            margin-right: 5px;
-            border-radius: 2px;
-            margin-top: 2px;
-          }
-
-          > span {
-            white-space: nowrap;
-            color: #000000;
-            font-weight: 600;
-          }
-        }
-
-        .more {
-          display: flex;
-          align-items: center;
-          white-space: nowrap;
-          color: #1476E3;
-          font-size: 14px;
-          cursor: pointer;
-
-          line-height: 20px;
-
-          &:hover {
-            text-decoration: underline;
-
-          }
-        }
-
-      }
-
-    }
-  }
-}
-
-</style>
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 76a0558..bb62fab 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -159,7 +159,7 @@
       </el-col>
     </el-row>
     <el-row gutter="10" style="margin-top: 10px">
-      <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="6">
+      <el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6">
         <div class="right bottom">
           <div class="right-top ">
             <div class="title-block">
@@ -183,7 +183,7 @@
           </div>
         </div>
       </el-col>
-      <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
+      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
         <div class="right  bottom">
           <div class="right-top ">
             <div class="title-block">
@@ -221,7 +221,7 @@
           </div>
         </div>
       </el-col>
-      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="10">
+      <el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10">
         <el-card shadow="never" class="todo-bg">
           <el-tabs v-model="docActiveTab" editable @tab-add="goToArticleList">
             <template #add-icon>
@@ -748,9 +748,9 @@ const handleView = (row) => {
   //.home-bg .notice-block {
   //  height: 624px !important;
   //}
-  .todo-bg {
-    margin-top: 10px;
-  }
+  //.todo-bg {
+  //  margin-top: 10px;
+  //}
   .block {
     width: 300px !important;
   }
@@ -1224,7 +1224,7 @@ const handleView = (row) => {
         cursor: pointer;
         display: flex;
         align-items: center;
-        width: 344px;
+        width: 324px;
         height: 170px;
         background-size: 100% 100%;
         background-repeat: no-repeat;