From ff423f62a2b3626be037ce197bfadd03da021575 Mon Sep 17 00:00:00 2001
From: fengchenchen <fengchenchen>
Date: Tue, 6 Dec 2022 18:01:16 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90ADD=E3=80=91-WP29=20=E5=92=8CISO?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E7=9A=84=E5=A2=9E=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/screen/HomePage.vue                 |  14 +-
 src/views/screen/iso/ExpertChart.vue          | 169 +++++++++
 src/views/screen/iso/LeadingStandardChart.vue | 274 ++++++++++++++
 src/views/screen/iso/MeetingCalendar.vue      | 349 +++++++++++++++++
 src/views/screen/iso/index.vue                | 210 +++++++++++
 src/views/screen/util/LineOptions.js          | 145 ++++++-
 src/views/screen/wp29/ExpertQuantityChart.vue |  89 +++++
 src/views/screen/wp29/MeetingCalendar.vue     | 356 ++++++++++++++++++
 .../screen/wp29/MeetingInformationChart.vue   | 297 +++++++++++++++
 .../screen/wp29/RegulationQuantityChart.vue   | 131 +++++++
 src/views/screen/wp29/index.vue               | 216 +++++++++++
 11 files changed, 2228 insertions(+), 22 deletions(-)
 create mode 100644 src/views/screen/iso/ExpertChart.vue
 create mode 100644 src/views/screen/iso/LeadingStandardChart.vue
 create mode 100644 src/views/screen/iso/MeetingCalendar.vue
 create mode 100644 src/views/screen/iso/index.vue
 create mode 100644 src/views/screen/wp29/ExpertQuantityChart.vue
 create mode 100644 src/views/screen/wp29/MeetingCalendar.vue
 create mode 100644 src/views/screen/wp29/MeetingInformationChart.vue
 create mode 100644 src/views/screen/wp29/RegulationQuantityChart.vue
 create mode 100644 src/views/screen/wp29/index.vue

diff --git a/src/views/screen/HomePage.vue b/src/views/screen/HomePage.vue
index 6acd9f8..163f360 100644
--- a/src/views/screen/HomePage.vue
+++ b/src/views/screen/HomePage.vue
@@ -20,13 +20,13 @@
     <!-- 中国汽车国际法规工作平台-ISO-->
     <template>
       <div class="sub-title"><span>中国汽车国际标准工作平台-ISO</span></div>
-<!--      <preparation-revision-screen></preparation-revision-screen>-->
+      <i-s-o-screen></i-s-o-screen>
     </template>
 
     <!-- 中国汽车国际法规工作平台-WP.29  -->
     <template>
       <div class="sub-title"><span>中国汽车国际法规工作平台-WP.29</span></div>
-<!--      <w-p-screen></w-p-screen>-->
+      <w-p-screen></w-p-screen>
     </template>
   </div>
 </template>
@@ -36,17 +36,15 @@
 import IncomePaymentScreen from './incomePayments/index'
 import PreparationRevisionScreen from './preparationRevision/index'
 import WPScreen from './wp29/index'
+import ISOScreen from './iso/index'
 
 export default {
   name: 'HomePage',
   components: {
     IncomePaymentScreen,
-    PreparationRevisionScreen
-  },
-  created() {
-    // StanderProjectGeneralSituation().then(res => {
-    //   console.log(res)
-    // })
+    PreparationRevisionScreen,
+    WPScreen,
+    ISOScreen
   },
 }
 </script>
diff --git a/src/views/screen/iso/ExpertChart.vue b/src/views/screen/iso/ExpertChart.vue
new file mode 100644
index 0000000..a916287
--- /dev/null
+++ b/src/views/screen/iso/ExpertChart.vue
@@ -0,0 +1,169 @@
+<!--国际专家统计-->
+<template>
+  <div class="iso-full-box">
+    <div class="box-title">国际专家统计</div>
+    <div class="box-content">
+      <div class="select-info-box">
+        <div class="left-select">
+<!--          <span class="label">技术领域：</span>-->
+          <a-select
+            class="right-select active"
+            style='width: 200px'
+            v-model="searchParams.field"
+            mode="multiple"
+            placeholder="技术领域"
+            :bordered="false"
+            :maxTagCount="1"
+            show-search
+            :filter-option="filterOption"
+            @change="fieldSelectChange"
+            dropdown-class-name="ant-select-screen"
+          >
+            <a-select-option
+              v-for="(item, index) in fieldOptionData"
+              :key="index + item.orgCode"
+              :value="item.orgCode"
+            >
+              {{item.departName}}
+            </a-select-option>
+          </a-select>
+
+        </div>
+
+        <div class="title-right-sub">
+          <span>专家总数：</span>
+          <span class="num">{{totalAll}}</span>
+        </div>
+
+      </div>
+
+      <div class="echarts-box " id="isoExpertChart"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetExpertChartData, GetTechnicalFieldData } from '../../../screenApi/api'
+import { createLineChart } from '../util/LineOptions'
+
+export default {
+  name: 'ExpertChart',
+  data() {
+    return {
+      searchParams: {},
+      totalAll: '',
+      fieldOptionData: [], // 技术领域的下拉框数据
+    }
+  },
+  methods: {
+    getData() {
+      // 技术领域的参数值： orgCode： 后面是逗号分隔
+      let params = {}
+      if(this.searchParams.field && this.searchParams.field.length > 0) {
+        params.orgCode = this.searchParams.field.join()
+      }
+      GetExpertChartData(params).then(res => {
+        if(res.success) {
+          let data = res.result || {}
+          this.$nextTick(() => {
+            this.initChart(data)
+          })
+        }
+      })
+
+    },
+    /**
+     * count: 112
+     leftDate: ["第一季度", "第二季度", "第三季度", "第四季度"]
+     resultMapList: []
+     0: {orgName: "国际注册专家", count: ["89", "102", "108", "111"]}
+     1: {orgName: "国内支撑专家", count: ["0", "1", "1", "1"]}
+     * @param data
+     */
+    initChart(data) {
+      let xData = data.leftDate
+      let echartsData = data.resultMapList || []
+      let totalAll = echartsData.reduce((pre, val) => {
+        // 取最后一个季度的数据算出总数
+        let innerNum = val.count[val.count.length - 1]
+        return Number(pre) + Number(innerNum)
+      }, 0)
+      this.totalAll = totalAll
+      let option = {
+        xAxis: {
+          data: xData,
+        },
+        series: [
+          {
+            data: echartsData[0].count
+          },
+          {
+            data: echartsData[1].count
+          }
+        ]
+      }
+      createLineChart('isoExpertChart', option, true)
+
+    },
+    getOptionData() {
+      /*{departName: "SAG", orgCode: "A01A01"}*/
+      GetTechnicalFieldData().then(res => {
+        if(res.success) {
+          this.fieldOptionData = res.result.departList || []
+          console.log('-------fieldOptionData----', this.fieldOptionData)
+        }
+      })
+    },
+    // 下拉框发生改变
+    fieldSelectChange() {
+      console.log('-------searchParams.field---------', this.searchParams.field)
+      this.getData()
+    },
+    // 下拉框的搜索
+    filterOption(input, option) {
+      return (
+        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+      )
+    },
+  },
+  created() {
+    this.getData()
+    this.getOptionData()
+  }
+}
+</script>
+
+<style scoped lang="less">
+@white: #fff;
+.title-right-sub {
+  text-align: right;
+  margin-top: 5px;
+  span {
+    font-size: 16px;
+    color: @white;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  span.num {
+    font-size: 20px;
+    color: #6CFBCE;
+  }
+}
+
+.select-info-box{
+  width: 75%;
+  margin-left: 25%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  .left-select > span:not(.label) {
+    margin-right: 15px;
+    color: @white;
+  }
+  .label{
+    color: @white;
+  }
+}
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/iso/LeadingStandardChart.vue b/src/views/screen/iso/LeadingStandardChart.vue
new file mode 100644
index 0000000..4d420a7
--- /dev/null
+++ b/src/views/screen/iso/LeadingStandardChart.vue
@@ -0,0 +1,274 @@
+<!--中国牵头标准信息统计-->
+<template>
+  <div class="iso-full-box iso-full-table">
+    <div class="box-title">中国牵头标准信息统计</div>
+    <div class="box-content">
+        <a-table
+          ref="table"
+          size="middle"
+          bordered
+          rowKey="projectId"
+          :columns="columns"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          :loading="loading"
+          :scroll="{x: 1200}"
+          @change="handleTableChange"
+          class="j-table-force-nowrap main-table iso-table">
+
+          <template slot="text" slot-scope="text">
+            <a-tooltip>
+              <template slot="title">{{ text }}</template>
+              <div class="table-text">{{ text }}</div>
+            </a-tooltip>
+          </template>
+
+          <span v-for="item in columns" :slot="item.dataIndex" :key="item.dataIndex">
+           <j-ellipsis :length="7" :value=" item[item.dataIndex] "></j-ellipsis>
+          </span>
+          <template slot="standard-name" slot-scope="text, record">
+            <a-tooltip>
+              <template slot="title">
+                <div>{{ record.standardNameChinese }}</div>
+                <div>{{ record.standardNameEnglish }}</div>
+              </template>
+              <div >
+                <div class="table-text">{{ record.standardNameChinese }}</div>
+                <div class="table-text">{{ record.standardNameEnglish }}</div>
+              </div>
+            </a-tooltip>
+
+          </template>
+        </a-table>
+
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetLeadingStandardData } from '../../../screenApi/api'
+
+const defaultSorter = {
+  column: 'createTime',
+  order: 'desc'
+}
+
+export default {
+  name: 'LeadingStandardChart',
+  data() {
+    return {
+      columns: [
+        {
+          title: '序号',
+          dataIndex: 'rowIndex',
+          width: 70,
+          align: 'center',
+          customRender: function(t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: '标准号',
+          align: 'center',
+          dataIndex: 'standardNumber',
+          width: '200px',
+          scopedSlots: {customRender: 'text'},
+        },
+        {
+          title: '标准名称',
+          align: 'center',
+          width: '444px',
+          dataIndex: 'standardName',
+          scopedSlots: { customRender: 'standard-name' }
+        },
+        {
+          title: '技术领域',
+          align: 'center',
+          dataIndex: 'technosphereSc_dictText',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: '牵头单位',
+          align: 'center',
+          dataIndex: 'unit',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: '目前状态',
+          align: 'center',
+          dataIndex: 'stageDescribe',
+          scopedSlots: { customRender: 'text' }
+        }
+      ],
+      dataSource: [],
+      /* 分页参数 */
+      ipagination: {
+        current: 1,
+        pageSize: 5,
+        pageSizeOptions: ['5', '10'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' 共' + total + '条'
+        },
+        showQuickJumper: true,
+        showSizeChanger: false,
+        total: 0
+      },
+      /* 排序参数 */
+      isorter: {
+        column: 'createTime',
+        order: 'desc'
+      },
+      /* table加载状态 */
+      loading: false
+    }
+  },
+  methods: {
+    getData(arg) {
+      if (arg === 1) {
+        this.ipagination.current = 1
+      }
+      let param = Object.assign({}, this.isorter)
+      param.pageNo = this.ipagination.current
+      param.pageSize = this.ipagination.pageSize
+      this.loading = true
+      GetLeadingStandardData(param).then((res) => {
+        if (res.success) {
+          this.dataSource = res.result.records || res.result
+          if (res.result.total) {
+            this.ipagination.total = res.result.total
+          } else {
+            this.ipagination.total = 0
+          }
+          // this.operateData(this.dataSource)
+        }
+        if (res.code === 510) {
+          this.$message.warning(res.message)
+        }
+        this.loading = false
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    // 操作表格中的数据
+    operateData(data) {
+      // data.map(tt => {
+      //   tt.standardNumber = '0000000000000000000099999999999999999999999999999999999999000000000000000000'
+      //   tt.standardNameChinese = '标准名称中文名标准名称中文名标准名称中文名标准名称中文名标准名称中文名标准名称中文名标准名称中文名'
+      //   tt.technosphereSc_dictText = '技术领域技技术领域技术领域技术领域技术领域技术领域技术领域技术领域技术领域技术领域技术领域术领域'
+      // })
+    },
+    handleTableChange(pagination, filters, sorter) {
+      //分页、排序、筛选变化时触发
+      if (Object.keys(sorter).length > 0) {
+        this.isorter.column = sorter.field
+        if (sorter.order) {
+          //   如果当前有列选中筛选条件
+          this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
+        } else {
+          //   没有筛选值则 isorter 重置为初始值
+          this.isorter.column = defaultSorter.column
+          this.isorter.order = defaultSorter.order
+        }
+
+      } else {
+        this.isorter.column = defaultSorter.column
+        this.isorter.order = defaultSorter.order
+      }
+      this.ipagination = pagination
+      this.getData()
+    }
+  },
+  created() {
+    this.getData()
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+/deep/ .ant-table-body > table{
+  border-color: transparent;
+}
+// 表格样式的修改
+/deep/ .ant-table-thead tr > th {
+  color: #FFFFFF;
+  font-weight: bold;
+  background: transparent;
+  border: none;
+}
+
+/deep/ .ant-table-tbody tr > td {
+  color: #A1E1FD;
+  border: none;
+  //border-bottom: 1px solid rgb(245,245,246);
+}
+
+/deep/ .ant-table-tbody tr > td:first-child {
+  color: #FFFFFF;
+  font-weight: bold;
+}
+
+/deep/ .ant-table-tbody tr:nth-of-type(2n + 1) {
+  background: #233062;
+}
+/deep/ .ant-table-tbody tr:nth-of-type(2n){
+  background: transparent;
+}
+
+/deep/ .ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td {
+  background: #233062;
+}
+
+/deep/ .ant-table-content .ant-table-placeholder {
+  background: transparent;
+  border: none;
+}
+/deep/.ant-empty-description{
+  color: white;
+}
+
+// 高度必须固定否则没有办法出滚动条
+.iso-full-table.iso-full-box{
+  height: 581px;
+  padding-top: 0;
+  background-color: transparent;
+  /deep/* {
+    background-color: transparent;
+  }
+
+}
+.iso-table{
+  margin-top: 60px;
+  width: 100%;
+  height: 100%;
+  //overflow: auto;
+}
+
+// 分页器样式
+::v-deep .ant-pagination,
+::v-deep .ant-table-pagination li,
+::v-deep .ant-table-pagination li a,
+::v-deep .ant-table-pagination li input
+{
+  color: #fff;
+}
+::v-deep .ant-pagination .ant-pagination-item-active{
+  border-color: rgba(86, 113, 231, 0.3);
+}
+
+::v-deep .ant-table-pagination li input{
+  border-color: rgba(86, 113, 231, 0.3);
+  box-shadow: 0 0 0 2px rgba(86, 113, 231, 0.1);
+}
+
+
+.table-text {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+/*表格滚动条*/
+/deep/.ant-table-body {
+  overflow-x: auto!important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/screen/iso/MeetingCalendar.vue b/src/views/screen/iso/MeetingCalendar.vue
new file mode 100644
index 0000000..5cafdf4
--- /dev/null
+++ b/src/views/screen/iso/MeetingCalendar.vue
@@ -0,0 +1,349 @@
+<!--iso-国际会议统计-->
+<template>
+  <div class="iso-full-box calendar-box">
+    <div class="box-title">国际会议统计</div>
+    <div class="box-content">
+      <div class="content-header">
+        <img class="header-img" @click="prev" src="../../../assets/screen/calendar_left_icon.png" alt="">
+        <span class="header-text">{{ time }}主要会议安排</span>
+        <img class="header-img" @click="next" src="../../../assets/screen/calendar_right_icon.png" alt="">
+      </div>
+
+      <div class="header-right">
+        <div class='header-num'>
+          <span>会议总数：</span>
+          <span class='num'>{{this.scheduleList.length}}</span>
+        </div>
+        <div class="header-right-text">
+          <span class="radius" style="background:#5671E7"></span>
+          <span class="text">TC 22</span>
+        </div>
+        <div class="header-right-text">
+          <span class="radius" style="background:#6CFBCE"></span>
+          <span class="text">SC</span>
+        </div>
+        <div class="header-right-text">
+          <span class="radius" style="background:#69C4F3"></span>
+          <span class="text">WG</span>
+        </div>
+      </div>
+      <full-calendar ref="fullCalendar" style="height: 100%" :options="calendarOptions"></full-calendar>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetISOMeetingCalendarData } from "../../../screenApi/api";
+// 引入日历组件
+import FullCalendar from '@fullcalendar/vue'
+import dayGridPlugin from '@fullcalendar/daygrid'
+import interactionPlugin from '@fullcalendar/interaction'
+import tippy from 'tippy.js'
+
+export default {
+  name: 'MeetingCalendar',
+  components: {
+    FullCalendar
+  },
+  data() {
+    return {
+      calendarOptions: {
+        //   timeGridPlugin  可显示每日时间段
+        height: 700,
+        plugins: [dayGridPlugin, interactionPlugin],
+        headerToolbar: null,
+        firstDay: 0,
+        editable: false,
+        selectable: false,
+        navLinks: false,
+        // displayEventEnd: true,//所有视图显示结束时间
+        initialView: 'dayGridMonth', // 设置默认显示月，可选周、日
+        // dateClick: this.handleDateClick,
+        // eventClick: this.handleEventClick,
+        eventMouseEnter: this.eventMouseoverOne,
+        eventMouseLeave: this.eventMouseoutOne,
+        // timezone
+        // 设置日程
+        events: [],
+        eventColor: '#f08f00', // 修改日程背景色
+        weekNumberCalculation: 'ISO', // 周数
+        customButtons: {}
+      },
+      scheduleList: [],
+      time: '',
+      calendarApi: {}
+    }
+  },
+  methods: {
+    getData() {
+      let query = {
+        // orgCode: this.orgCode,
+        // cutTime: ''
+      }
+      GetISOMeetingCalendarData(query).then((res) => {
+        if (res.success) {
+          this.scheduleList = res.result || []
+          this.getReservationList(res.result)
+        } else {
+          this.scheduleList = []
+        }
+      })
+    },
+    prev() {
+      this.calendarApi.prev()
+      let currentDate = new Date(this.calendarApi.currentData.currentDate)
+      this.time = currentDate.getFullYear() + '年' + (currentDate.getMonth() + 1) + '月'
+    },
+    // 切换下一个按钮事件
+    next() {
+      this.calendarApi.next()
+      let currentDate = new Date(this.calendarApi.currentData.currentDate)
+      this.time = currentDate.getFullYear() + '年' + (currentDate.getMonth() + 1) + '月'
+    },
+    // 点击今天按钮
+    today() {
+      this.calendarApi.today()
+    },
+    handleDateClick: function(arg) {
+      this.$forceUpdate()
+      console.log(arg, '事件1')
+    },
+    getReservationList(arrayData) {
+      let newArr = []
+      arrayData.forEach((item) => {
+        if (item.orgType === 'TC22') {
+          item.status = '#5671E7'
+        } else if (item.orgType === 'SC') {
+          item.status = '#6CFBCE'
+        } else {
+          item.status = '#69C4F3'
+        }
+        newArr.push({
+          start: this.dealWithTime(item.time),
+          end: this.addDate(this.dealWithTime(item.endTime), 1),
+          color: item.status,
+          id: item.meetingId,
+          title: `${item.name}`
+        })
+      })
+      this.calendarOptions.events = newArr
+    },
+    getShowTime(beginDate, endDate) {
+      this.form.startDate = this.dealWithTime(beginDate)
+      this.form.startTime = this.getHoursMin(beginDate)
+      this.form.endDate = this.dealWithTime(endDate)
+      this.form.endTime = this.getHoursMin(endDate)
+    },
+    // 获取时分时间
+    getHoursMin(value) {
+      return value.substring(11, 16)
+    },
+    // 处理会议时间格式
+    dealWithTime(date) {
+      let newDate = /\d{4}-\d{1,2}-\d{1,2}/g.exec(date)[0]
+      return newDate
+    },
+
+    // 日期加1天
+    addDate(date, days) {
+      var d = new Date(date)
+      d.setDate(d.getDate() + days)
+      var mon = (d.getMonth() + 1) < 10 ? '0' + (d.getMonth() + 1) : d.getMonth() + 1
+      let endD = d.getDate() < 10 ? '0' + d.getDate() : d.getDate()
+      return `${d.getFullYear()}-${mon}-${endD}`
+    },
+    eventMouseoverOne(data) {
+      let content = this.scheduleList.filter(res => {
+        return res.meetingId == data.event.id
+      })
+      //todo 缺一个type的字段
+      tippy(data.el, {
+        content:
+          '<div class="tippy-content-box" style="">' +
+          '<span style="margin-right: 10px;" class="text-index">' + content[0].orgType + '</span>' + '<span class="text-index">' + content[0].name + '</span>' +
+          '<div class="tippy-content">技术领域: ' + content[0].type + '</div>' + '' +
+          '<div class="tippy-content">时间: ' + content[0].timeAll + '</div>' + '' +
+          '<div class="tippy-content">地点: ' + content[0].place + '</div>' +
+          '<div class="tippy-content">参会人: ' + content[0].meetingPersons + '</div>' + '</div>',
+        interactive: false,
+        // placement: 'top',
+        allowHTML: true
+      })
+    },
+    eventMouseoutOne() {
+
+    },
+    // 获取会议事件title
+    getTitle(date1, date2) {
+      let start = date1.substring(11, 16)
+      let end = date2.substring(11, 16)
+      return `${start}~${end}`
+    }
+  },
+  created() {
+    // 获取用户信息
+    this.$nextTick(() => {
+      this.calendarApi = this.$refs.fullCalendar.getApi()
+      let currentDate = new Date(this.calendarApi.currentData.currentDate)
+      this.time = currentDate.getFullYear() + '年' + (currentDate.getMonth() + 1) + '月'
+    })
+    // this.getReservationList(this.scheduleList)
+    this.getData()
+  },
+}
+</script>
+
+<style scoped lang="less">
+@white: #fff;
+@normal-color: rgba(256, 256, 256, 0.3);
+div.calendar-box{
+  background-image: url("../../../assets/screen/calendar_bg.png");
+  padding-top: 43.4%;
+  .box-title{
+    //34.5 / 高度 814
+    top: 4.24%;
+  }
+}
+.content-header {
+  display: flex;
+  align-items: center;
+  text-align: center;
+  justify-content: center;
+  margin-bottom: 20px;
+}
+
+.header-img {
+  width: 28px;
+  height: 28px;
+  cursor: pointer;
+}
+
+.header-text {
+  font-size: 18px;
+  font-family: PingFang SC;
+  font-weight: 800;
+  color: @white;
+  margin-left: 26px;
+  margin-right: 26px;
+}
+
+.header-right {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  transform: translateY(-35px);
+  height: 0;
+}
+
+.header-right-text {
+  display: flex;
+  align-items: center;
+  margin-left: 28px;
+}
+
+.radius {
+  width: 14px;
+  height: 14px;
+  border-radius: 4px;
+  display: inline-block;
+}
+
+.text {
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: @white;
+  margin-left: 8px;
+}
+
+.header-num{
+  span {
+    font-size: 16px;
+    color: @white;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  span.num {
+    font-size: 20px;
+    color: #6CFBCE;
+  }
+}
+/*日历组件的修改  */
+::v-deep .fc-theme-standard td,
+::v-deep .fc-theme-standard th,
+::v-deep.fc-theme-standard .fc-scrollgrid{
+  border-color: rgba(86, 113, 231, 0.3);
+}
+::v-deep .fc-daygrid-day .fc-daygrid-day-number {
+  font-weight: bold;
+  color: @white;
+  font-size: 14px;
+  margin-right: 6px;
+}
+
+
+::v-deep .fc-day-other .fc-daygrid-day-number {
+  color: @normal-color;
+  font-size: 14px;
+  margin-right: 6px;
+}
+
+::v-deep .fc-col-header-cell-cushion {
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: bold;
+  color: @white;
+}
+
+::v-deep .fc-col-header-cell {
+  height: 38px;
+  line-height: 38px;
+  //background: #FCFBFB;
+}
+
+::v-deep .fc-day-sun .fc-col-header-cell-cushion {
+  //color: #9E0000;
+}
+
+::v-deep .fc-day-sat .fc-col-header-cell-cushion {
+  //color: #9E0000;
+}
+
+::v-deep .fc-event-main {
+  padding: 2px 10px;
+}
+
+::v-deep .fc-toolbar-chunk .fc-button-primary {
+  display: none;
+}
+
+::v-deep .fc .fc-daygrid-day.fc-day-today{
+  background-color: #7599E8;
+}
+
+</style>
+<style lang="less">
+.tippy-content-box {
+  background: #233062;
+  color: #fff;
+  border-radius: 6px;
+  padding: 12px;
+  box-sizing: border-box;
+  box-shadow: 0 0 4px #7599E8 inset;
+  .text-index {
+    font-size: 16px;
+    font-family: PingFang SC;
+    font-weight: 800;
+    color: #fff;
+  }
+
+  .tippy-content {
+    font-size: 14px;
+    font-family: PingFang SC;
+    font-weight: 500;
+    color: #fff;
+    margin-top: 8px;
+  }
+}
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/iso/index.vue b/src/views/screen/iso/index.vue
new file mode 100644
index 0000000..5c69791
--- /dev/null
+++ b/src/views/screen/iso/index.vue
@@ -0,0 +1,210 @@
+<template>
+  <div class="screen-iso">
+    <!-- 中国牵头标准信息统计 -->
+    <leading-standard-chart></leading-standard-chart>
+    <!-- 国际会议统计-->
+    <meeting-calendar></meeting-calendar>
+    <!-- 国际专家统计-->
+    <expert-chart></expert-chart>
+  </div>
+</template>
+
+<script>
+//中国牵头标准信息统计
+import LeadingStandardChart from './LeadingStandardChart'
+
+// //国际会议统计
+import MeetingCalendar from './MeetingCalendar'
+// //国际专家统计
+import ExpertChart from './ExpertChart'
+
+
+export default {
+  name: 'index',
+  components: {
+    // 中国牵头标准信息统计
+    LeadingStandardChart,
+    // 国际会议统计
+    MeetingCalendar,
+    // 国际专家统计
+    ExpertChart
+  }
+}
+</script>
+
+<style scoped lang="less">
+.screen-iso{
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+// 全屏box-有表格 1875 * 587
+.iso-full-box {
+  position: relative;
+  width: 100%;
+  height: 0;
+  padding-top: 31.31%;
+  background-image: url("../../../assets/screen/full_no_table_bg.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+
+  /deep/ .box-title {
+    font-size: 18px;
+    font-family: PingFang SC;
+    font-weight: bold;
+    color: #DDF0FF;
+    position: absolute;
+    // 34.5 / 高度 587
+    top: 5.88%;
+    left: 13.70%;
+    transform: translate(-50%, -50%);
+  }
+
+  /deep/ .box-content {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    display: flex;
+    flex-direction: column;
+    padding: 2.3% 4%;
+    //padding: 4.61% 4%;
+    .echarts-box {
+      width: 100%;
+      flex: 1;
+    }
+  }
+}
+// 50%的box 536 * 931
+/deep/.iso-half-box{
+  width: 50%;
+  height: 0;
+  padding-top: 28.79%;
+  background-image: url("../../../assets/screen/half_bg.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  .box-title {
+    // (25 + 18 / 2) / 635
+    top: 6.34%;
+    // (171 + 149 / 2) / 931
+    left: 26.37%;
+  }
+  .box-content {
+    padding: 4.61% 6%;
+  }
+}
+
+@normal-color: rgba(256, 256, 256, 0.5);
+@white: #fff;
+// 半屏 标题右侧的样式
+/deep/.title-right{
+  width: 50%;
+  margin-left: 50%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: end;
+  span {
+    font-size: 16px;
+    color: @white;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  span.num {
+    font-size: 20px;
+    color: #6CFBCE;
+  }
+}
+
+
+//下拉框样式的修改
+/deep/.ant-select-selection{
+  border: none!important;
+  background: transparent;
+  color: @normal-color;
+}
+/deep/.ant-select.active  .ant-select-selection{
+  color: @white!important;
+}
+
+/deep/.ant-select-focused .ant-select-selection, .ant-select-selection:focus, .ant-select-selection:active{
+  border: none!important;
+  box-shadow: none;
+}
+/deep/.ant-select-arrow{
+  color: @white;
+}
+
+// 时间选择器的样式
+/deep/.ant-calendar-picker,
+/deep/.ant-calendar-picker-input.ant-input,
+/deep/ .ant-calendar-picker-icon{
+  border: none!important;
+  background: transparent;
+  color: @white;
+}
+
+</style>
+<style lang="less">
+@normal-color: rgba(256, 256, 256, 0.2);
+.ant-calendar-dropdown-screen{
+  .ant-calendar{
+    border: none;
+    box-shadow: 0 0 4px #7599E8 inset;
+  }
+  .ant-calendar-month-panel-body,
+  .ant-calendar-month-panel-header,
+  .ant-calendar-year-panel-body,
+  .ant-calendar-year-panel-header
+  {
+    background-color: #181F55;
+    border: none!important;
+    color: #fff;
+  }
+  td a,
+  .ant-calendar-month-panel-year-select-content,
+  .ant-calendar-year-panel-decade-select
+  {
+    color: #fff;
+  }
+  .ant-calendar-month-panel-prev-year-btn::after,
+  .ant-calendar-month-panel-prev-year-btn::before,
+  .ant-calendar-month-panel-next-year-btn::before,
+  .ant-calendar-month-panel-next-year-btn::after
+  {
+    border-color: #fff;
+  }
+  // 选中的效果
+  .ant-calendar-month-panel-selected-cell .ant-calendar-month-panel-month,
+  .ant-calendar-year-panel-selected-cell .ant-calendar-year-panel-year{
+    background-color: #4364C2;
+  }
+
+  .ant-calendar-header a:hover{
+    color: #fff;
+    background-color: #7599E8;
+    //&::after,
+    //&::before{
+    //  color: #fff;
+    //}
+  }
+
+  .ant-calendar-year-panel-last-decade-cell a,
+  .ant-calendar-year-panel-next-decade-cell a
+  {
+    color: @normal-color;
+  }
+  //   年份选择器上面的输入框
+  .ant-calendar-input-wrap{
+    background-color: #181F55;
+    border-color: @normal-color;
+    input{
+      background-color: #181F55;
+      border: none!important;
+      color: #fff;
+    }
+  }
+}
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/util/LineOptions.js b/src/views/screen/util/LineOptions.js
index e2633bf..1ba2abd 100644
--- a/src/views/screen/util/LineOptions.js
+++ b/src/views/screen/util/LineOptions.js
@@ -32,19 +32,7 @@ export const LineOptions = {
 
   legend: {
     data: [ '确认收入金额', '开票金额', '到账金额'],
-    // icon: 'path://M 100, 100 m -75, 0 a 75,75 0 1,0 150,0 a 75,75 0 1,0 -150,0',
     icon: 'path://M 30 10 A 20 20 0 1 0 30 50 A 20 20 0 1 0 30 10 Z M 30 15 A 15 15 0 1 1 30 45 A 15 15 0 1 1 30 15 Z',
-    // 去除图例中的线
-    // lineStyle: {
-    //   // opacity: 0
-    //   join: 'miter',
-    //   color: '#ff0'
-    // },
-    // itemStyle: {
-    //   color: '#f0f',
-    //   borderJoin: 'round',
-    //   opacity: 0.5
-    // },
     //图例的公用文本样式。
     textStyle: {
       color: '#7599E8'
@@ -52,7 +40,6 @@ export const LineOptions = {
     // itemWidth: 14,
     // itemHeight: 14,
     right: '2%',
-
   },
   grid: {
     left: '2.4%',
@@ -105,12 +92,142 @@ export const LineOptions = {
   },
 }
 
+
+export const ISOLineOptions = {
+  color: ['#4471EF', '#00D8F1', '#6CFBCE'],
+  tooltip: {
+    trigger: 'axis',
+    formatter: params => {
+      // 获取xAxis data中的数据
+      let dataStr = ''
+      params.forEach(item => {
+        dataStr += `<div>
+          <div style="margin: 0 8px;">
+            <span style="display:inline-block;margin-right:5px;width:10px;height:10px;background-color:transparent;border: 2px solid ${item.color};border-radius: 50%"></span>
+            <span style="color: #7599E8">${item.seriesName}</span>
+            <span style="float:right;color:#7599E8;margin-left:20px;">${item.data}</span>
+          </div>
+        </div>`
+      })
+      return dataStr
+    },
+    borderWidth: 0,
+    //提示框浮层的背景颜色
+    backgroundColor: '#233062',
+    //额外附加到浮层的 css 样式。如下为浮层添加阴影的示例：
+    extraCssText: 'box-shadow: 0 0 4px #7599E8 inset;'
+  },
+
+  legend: {
+    data: [ '国际注册专家', '国内支撑专家'],
+    icon: 'path://M 30 10 A 20 20 0 1 0 30 50 A 20 20 0 1 0 30 10 Z M 30 15 A 15 15 0 1 1 30 45 A 15 15 0 1 1 30 15 Z',
+    //图例的公用文本样式。
+    textStyle: {
+      color: '#7599E8'
+    },
+    right: '0',
+  },
+  grid: {
+    left: '0',
+    right: '0',
+    bottom: '3%',
+    containLabel: true
+  },
+  toolbox: {},
+  xAxis: {
+    axisLine: {
+      show: true,
+      lineStyle: {
+        color: '#7599E8'
+      }
+    },
+    axisLabel: {
+      show: true,
+      color: '#7FA6FB'
+    },
+    type: 'category',
+    boundaryGap: ['30%','20%'],
+    // 刻度线设置
+    axisTick: {
+      show: false
+    },
+    data: []
+  },
+  yAxis: {
+    axisLine: {
+      show: true,
+      lineStyle: {
+        color: '#7599E8'
+      }
+    },
+    axisLabel: {
+      show: true,
+      color: '#7FA6FB'
+    },
+    splitLine: {
+      lineStyle: {
+        color: '#7599E8',
+        type: 'dashed'
+      }
+    },
+    type: 'value',
+    nameTextStyle: {
+      color: '#7FA6FB'
+    }
+  },
+  series: [
+    {
+      name: '国际注册专家',
+      type: 'line',
+      showSymbol: false,
+      symbolSize: 8,
+      data: [],
+      areaStyle: {
+        opacity: 0.2,
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          {
+            offset: 0,
+            color: '#4471EF'
+          },
+          {
+            offset: 1,
+            color: '#ffffff'
+          }
+        ])
+      },
+    },
+    {
+      name: '国内支撑专家',
+      type: 'line',
+      showSymbol: false,
+      symbolSize: 8,
+      data: [],
+      areaStyle: {
+        opacity: 0.2,
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          {
+            offset: 0,
+            color: '#00D8F1'
+          },
+          {
+            offset: 1,
+            color: '#ffffff'
+          }
+        ])
+      },
+    }
+  ]
+}
+
 // 生成折线图
-export function createLineChart(idName, option) {
+export function createLineChart(idName, option, isISO) {
   const chartDom = document.getElementById(idName)
   echarts.dispose(chartDom)
   // debugger
   let chartOption = deepMerge({}, LineOptions, option)
+  if(isISO) {
+    chartOption = deepMerge({}, ISOLineOptions, option)
+  }
   let myChart = echarts.init(chartDom)
   chartOption && myChart.setOption(chartOption)
   window.addEventListener('resize', () => {
diff --git a/src/views/screen/wp29/ExpertQuantityChart.vue b/src/views/screen/wp29/ExpertQuantityChart.vue
new file mode 100644
index 0000000..5be5cc3
--- /dev/null
+++ b/src/views/screen/wp29/ExpertQuantityChart.vue
@@ -0,0 +1,89 @@
+<!--专家数量统计-->
+<template>
+  <div class="wp-full-box wp-half-box">
+    <div class="box-title">专家数量统计</div>
+    <div class="box-content">
+      <div class="title-right">
+        <span>专家总数：</span>
+        <span class="num">{{totalAll}}</span>
+      </div>
+      <div class="echarts-box" id="expertQuantityChart"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createPieChart } from '../util/PieOptions'
+import { GetExpertQuantityData } from '../../../screenApi/api'
+
+export default {
+  name: 'ExpertQuantityChart',
+  data() {
+    return {
+      totalAll: '' // 法规总数
+    }
+  },
+  methods: {
+    getData() {
+      GetExpertQuantityData().then(res => {
+        if(res.success) {
+          let data = res.result || []
+          if(data.length > 0) {
+            this.totalAll = data[0].total
+          }
+          this.$nextTick(() => {
+            this.initChart(data)
+          })
+        }
+      })
+    },
+    /**
+     * 初始化图表
+     * @param data --{"technicalField":"GRSP","count":"23","total":"52"}
+     */
+    initChart(data) {
+      let echartsData = data.reduce((pre, val) => {
+        return pre.concat({value: val.count, name: val.technicalField, total: val.total})
+      }, [])
+      let option = {
+        legend: {
+          show: true,
+          type: 'scroll',
+          orient: 'vertical',
+          right: 0,
+          top: 'center',
+          itemGap: 10 // 图例之间的间距
+        },
+        grid: {
+          left: '0',
+          right: '0',
+        },
+        tooltip: {
+          formatter: (param) => {
+            return `<div>
+<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${param.color};"></span>
+<span style="color: #7599E8">${param.name}</span>
+<span style="color: #7599E8">${param.value}</span>
+</div>`
+          },
+
+        },
+        series: [
+          {
+            center: ['42%', '50%'],
+            data: echartsData
+          }
+        ]
+      }
+      createPieChart('expertQuantityChart', option)
+    }
+  },
+  created() {
+    this.getData()
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/wp29/MeetingCalendar.vue b/src/views/screen/wp29/MeetingCalendar.vue
new file mode 100644
index 0000000..0f3f03c
--- /dev/null
+++ b/src/views/screen/wp29/MeetingCalendar.vue
@@ -0,0 +1,356 @@
+<!--会议信息日历-->
+<template>
+  <div class="wp-full-box calendar-box">
+    <div class="box-title">会议信息日历</div>
+    <div class="box-content">
+      <div class="content-header">
+        <img class="header-img" @click="prev" src="../../../assets/screen/calendar_left_icon.png" alt="">
+        <span class="header-text">{{ time }}主要会议安排</span>
+        <img class="header-img" @click="next" src="../../../assets/screen/calendar_right_icon.png" alt="">
+      </div>
+
+      <div class="header-right">
+        <div class='header-num'>
+          <span>会议总数：</span>
+          <span class='num'>{{this.scheduleList.length}}</span>
+        </div>
+        <div class="header-right-text">
+          <span class="radius" style="background:#5671E7"></span>
+          <span class="text">WP.29</span>
+        </div>
+        <div class="header-right-text">
+          <span class="radius" style="background:#6CFBCE"></span>
+          <span class="text">GR</span>
+        </div>
+        <div class="header-right-text">
+          <span class="radius" style="background:#69C4F3"></span>
+          <span class="text">IWG</span>
+        </div>
+      </div>
+      <full-calendar ref="fullCalendar" style="height: 100%" :options="calendarOptions"></full-calendar>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetMeetingCalendarData } from '../../../screenApi/api'
+// 引入日历组件
+import FullCalendar from '@fullcalendar/vue'
+import dayGridPlugin from '@fullcalendar/daygrid'
+import interactionPlugin from '@fullcalendar/interaction'
+import tippy from 'tippy.js'
+
+export default {
+  name: 'MeetingCalendar',
+  components: {
+    FullCalendar
+  },
+  data() {
+    return {
+      calendarOptions: {
+        //   timeGridPlugin  可显示每日时间段
+        height: 700,
+        plugins: [dayGridPlugin, interactionPlugin],
+        headerToolbar: null,
+        firstDay: 0,
+        editable: false,
+        selectable: false,
+        navLinks: false,
+        // displayEventEnd: true,//所有视图显示结束时间
+        initialView: 'dayGridMonth', // 设置默认显示月，可选周、日
+        // dateClick: this.handleDateClick,
+        // eventClick: this.handleEventClick,
+        eventMouseEnter: this.eventMouseoverOne,
+        eventMouseLeave: this.eventMouseoutOne,
+        // timezone
+        // 设置日程
+        events: [],
+        eventColor: '#f08f00', // 修改日程背景色
+        weekNumberCalculation: 'ISO', // 周数
+        customButtons: {}
+      },
+      scheduleList: [],
+      time: '',
+      calendarApi: {}
+    }
+  },
+  created() {
+    // 获取用户信息
+    this.$nextTick(() => {
+      this.calendarApi = this.$refs.fullCalendar.getApi()
+      let currentDate = new Date(this.calendarApi.currentData.currentDate)
+      this.time = currentDate.getFullYear() + '年' + (currentDate.getMonth() + 1) + '月'
+    })
+    // this.getReservationList(this.scheduleList)
+    this.getData()
+  },
+  methods: {
+    getData() {
+      let query = {
+        // orgCode: this.orgCode,
+        // cutTime: ''
+      }
+      GetMeetingCalendarData(query).then((res) => {
+        if (res.success) {
+          this.scheduleList = res.result || []
+          this.getReservationList(res.result)
+        } else {
+          this.scheduleList = []
+        }
+      })
+    },
+    prev() {
+      this.calendarApi.prev()
+      let currentDate = new Date(this.calendarApi.currentData.currentDate)
+      this.time = currentDate.getFullYear() + '年' + (currentDate.getMonth() + 1) + '月'
+    },
+    // 切换下一个按钮事件
+    next() {
+      this.calendarApi.next()
+      let currentDate = new Date(this.calendarApi.currentData.currentDate)
+      this.time = currentDate.getFullYear() + '年' + (currentDate.getMonth() + 1) + '月'
+    },
+    // 点击今天按钮
+    today() {
+      this.calendarApi.today()
+    },
+    handleDateClick: function(arg) {
+      this.$forceUpdate()
+      console.log(arg, '事件1')
+    },
+    handleEventClick(calEvent) {
+      let params = { orgCode: calEvent.event.id, thisType: 2, type: 2 }
+      this.$router.push({
+        path: '/meetinginfo',
+        query: params
+      })
+    },
+    getReservationList(arrayData) {
+      let newArr = []
+      arrayData.forEach((item) => {
+        if (item.orgType == 'GR') {
+          item.status = '#5671E7'
+        } else if (item.orgType == 'IWG') {
+          item.status = '#6CFBCE'
+        } else {
+          item.status = '#69C4F3'
+        }
+        newArr.push({
+          start: this.dealWithTime(item.time),
+          end: this.addDate(this.dealWithTime(item.endTime), 1),
+          color: item.status,
+          id: item.meetingId,
+          title: `${item.name}`
+        })
+      })
+      this.calendarOptions.events = newArr
+    },
+    getShowTime(beginDate, endDate) {
+      this.form.startDate = this.dealWithTime(beginDate)
+      this.form.startTime = this.getHoursMin(beginDate)
+      this.form.endDate = this.dealWithTime(endDate)
+      this.form.endTime = this.getHoursMin(endDate)
+    },
+    // 获取时分时间
+    getHoursMin(value) {
+      return value.substring(11, 16)
+    },
+    // 处理会议时间格式
+    dealWithTime(date) {
+      let newDate = /\d{4}-\d{1,2}-\d{1,2}/g.exec(date)[0]
+      return newDate
+    },
+
+    // 日期加1天
+    addDate(date, days) {
+      var d = new Date(date)
+      d.setDate(d.getDate() + days)
+      var mon = (d.getMonth() + 1) < 10 ? '0' + (d.getMonth() + 1) : d.getMonth() + 1
+      let endD = d.getDate() < 10 ? '0' + d.getDate() : d.getDate()
+      return `${d.getFullYear()}-${mon}-${endD}`
+    },
+    eventMouseoverOne(data) {
+      let content = this.scheduleList.filter(res => {
+        return res.meetingId == data.event.id
+      })
+      //todo 缺一个type的字段
+      tippy(data.el, {
+        content:
+          '<div class="tippy-content-box" style="">' +
+          '<span style="margin-right: 10px;" class="text-index">' + content[0].orgType + '</span>' + '<span class="text-index">' + content[0].name + '</span>' +
+          '<div class="tippy-content">技术领域: ' + content[0].type + '</div>' + '' +
+          '<div class="tippy-content">时间: ' + content[0].timeAll + '</div>' + '' +
+          '<div class="tippy-content">地点: ' + content[0].place + '</div>' +
+          '<div class="tippy-content">参会人: ' + content[0].meetingPersons + '</div>' + '</div>',
+        interactive: false,
+        // placement: 'top',
+        allowHTML: true
+      })
+    },
+    eventMouseoutOne(data) {
+
+    },
+    // 获取会议事件title
+    getTitle(date1, date2) {
+      let start = date1.substring(11, 16)
+      let end = date2.substring(11, 16)
+      return `${start}~${end}`
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+@white: #fff;
+@normal-color: rgba(256, 256, 256, 0.3);
+div.calendar-box{
+  background-image: url("../../../assets/screen/calendar_bg.png");
+  padding-top: 43.4%;
+  .box-title{
+      //34.5 / 高度 814
+    top: 4.24%;
+  }
+}
+.content-header {
+  display: flex;
+  align-items: center;
+  text-align: center;
+  justify-content: center;
+  margin-bottom: 20px;
+}
+
+.header-img {
+  width: 28px;
+  height: 28px;
+  cursor: pointer;
+}
+
+.header-text {
+  font-size: 18px;
+  font-family: PingFang SC;
+  font-weight: 800;
+  color: @white;
+  margin-left: 26px;
+  margin-right: 26px;
+}
+
+.header-right {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  transform: translateY(-35px);
+  height: 0;
+}
+
+.header-right-text {
+  display: flex;
+  align-items: center;
+  margin-left: 28px;
+}
+
+.radius {
+  width: 14px;
+  height: 14px;
+  border-radius: 4px;
+  display: inline-block;
+}
+
+.text {
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: @white;
+  margin-left: 8px;
+}
+
+.header-num{
+  span {
+    font-size: 16px;
+    color: @white;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  span.num {
+    font-size: 20px;
+    color: #6CFBCE;
+  }
+}
+/*日历组件的修改  */
+::v-deep .fc-theme-standard td,
+::v-deep .fc-theme-standard th,
+::v-deep.fc-theme-standard .fc-scrollgrid{
+  border-color: rgba(86, 113, 231, 0.3);
+}
+::v-deep .fc-daygrid-day .fc-daygrid-day-number {
+  font-weight: bold;
+  color: @white;
+  font-size: 14px;
+  margin-right: 6px;
+}
+
+
+::v-deep .fc-day-other .fc-daygrid-day-number {
+  color: @normal-color;
+  font-size: 14px;
+  margin-right: 6px;
+}
+
+::v-deep .fc-col-header-cell-cushion {
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: bold;
+  color: @white;
+}
+
+::v-deep .fc-col-header-cell {
+  height: 38px;
+  line-height: 38px;
+  //background: #FCFBFB;
+}
+
+::v-deep .fc-day-sun .fc-col-header-cell-cushion {
+  //color: #9E0000;
+}
+
+::v-deep .fc-day-sat .fc-col-header-cell-cushion {
+  //color: #9E0000;
+}
+
+::v-deep .fc-event-main {
+  padding: 2px 10px;
+}
+
+::v-deep .fc-toolbar-chunk .fc-button-primary {
+  display: none;
+}
+::v-deep .fc .fc-daygrid-day.fc-day-today{
+  background-color: #7599E8;
+}
+
+
+</style>
+<style lang="less">
+.tippy-content-box {
+  background: #233062;
+  color: #fff;
+  border-radius: 6px;
+  padding: 12px;
+  box-sizing: border-box;
+  box-shadow: 0 0 4px #7599E8 inset;
+.text-index {
+  font-size: 16px;
+  font-family: PingFang SC;
+  font-weight: 800;
+  color: #fff;
+}
+
+.tippy-content {
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: #fff;
+  margin-top: 8px;
+}
+}
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/wp29/MeetingInformationChart.vue b/src/views/screen/wp29/MeetingInformationChart.vue
new file mode 100644
index 0000000..15b227d
--- /dev/null
+++ b/src/views/screen/wp29/MeetingInformationChart.vue
@@ -0,0 +1,297 @@
+<!--会议信息统计-->
+<template>
+  <div class="wp-full-box">
+    <div class="box-title">会议信息统计</div>
+    <div class="box-content">
+      <div class="search-box">
+        <div class="select-info-box">
+          <div class="left-select">
+            <span class="label">选择时间：</span>
+            <j-year-date
+              v-if="dimensionValue !== 'month'"
+              format="YYYY"
+              :allowClear="false"
+              style="width:80px"
+              placeholder="请选择年份"
+              v-model="searchParams.year"
+              @change="onYearChange"
+              dropdown-class-name="ant-calendar-dropdown-screen"
+            ></j-year-date>
+
+
+            <a-month-picker
+              v-if="dimensionValue === 'month'"
+              placeholder="请选择月份"
+              format="YYYY-MM"
+              value-format="YYYY-MM"
+              style='width: 100px'
+              :allowClear="false"
+              dropdown-class-name="ant-calendar-dropdown-screen"
+              v-model='searchParams.month'
+              @change="onMonthChange" >
+            </a-month-picker>
+            <a-select
+              v-if="dimensionValue === 'quarter'"
+              class="right-select active"
+              style='width: 120px'
+              v-model="searchParams.quarter"
+              placeholder="季度"
+              :bordered="false"
+              show-search
+              @change="quarterSelectChange"
+              dropdown-class-name="ant-select-screen"
+            >
+              <a-select-option
+                v-for="(item, index) in quarterOptionData"
+                :key="index"
+                :value="item.text"
+              >
+                {{item.text}}
+              </a-select-option>
+            </a-select>
+          </div>
+          <!--        :bordered="false"-->
+          <a-select
+            class="right-select active"
+            style='width: 80px'
+            v-model="dimensionValue"
+            placeholder="维度"
+
+            show-search
+            @change="dimensionSelectChange"
+            dropdown-class-name="ant-select-screen"
+          >
+            <a-select-option
+              v-for="(item, index) in dimensionOptionData"
+              :key="index"
+              :value="item.value"
+            >
+              {{item.text}}
+            </a-select-option>
+          </a-select>
+        </div>
+        <div class="title-right-sub">
+          <span>会议总数：</span>
+          <span class="num">{{totalAll}}</span>
+        </div>
+      </div>
+      <div class="echarts-box " id="meetingInformationChart"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetMeetingInformationData } from '../../../screenApi/api'
+import { createBarChart } from '../util/BarOptions'
+import JYearDate from '../../../components/jero/JYearDate'
+
+export default {
+  name: 'MeetingInformationChart',
+  components: {
+    JYearDate
+  },
+  data() {
+    return {
+      totalAll: '', // 会议总数
+      dimensionValue: 'year', // 查询维度  默认是’year‘
+      // 维度查询的下拉框数据
+      dimensionOptionData: [
+        {text: '年', value: 'year'},
+        {text: '季度', value: 'quarter'},
+        {text: '月', value: 'month'},
+      ],
+      quarterOptionData: [
+        {text: '第一季度', value: '1'},
+        {text: '第二季度', value: '2'},
+        {text: '第三季度', value: '3'},
+        {text: '第四季度', value: '4'},
+      ],
+      // 查询条件
+      searchParams:{},
+      currentDateObj: {
+        year: '',
+        month: '',
+        quarter: ''
+      }
+    }
+  },
+  methods: {
+    getCurrentData() {
+    //  获取当前年份、月份和季度
+      let data = new Date()
+      let year = data.getFullYear()
+      let month = data.getMonth() + 1
+      this.currentDateObj.year = year
+      this.currentDateObj.month = month
+      switch (true) {
+        case (month < 4) :
+          this.currentDateObj.quarter = '第一季度'
+          break
+        case (month < 7) :
+          this.currentDateObj.quarter = '第二季度'
+          break
+        case (month < 10) :
+          this.currentDateObj.quarter = '第三季度'
+          break
+        case (month <= 12) :
+          this.currentDateObj.quarter = '第四季度'
+          break
+        default:
+          break
+      }
+    },
+    dimensionSelectChange() {
+      if(this.dimensionValue === 'year') {
+        this.searchParams.year = this.currentDateObj.year + ''
+      } else if(this.dimensionValue === 'month') {
+        this.searchParams.month = `${this.currentDateObj.year}-${this.currentDateObj.month}`
+      } else if(this.dimensionValue === 'quarter') {
+        this.searchParams.year = this.currentDateObj.year + ''
+        this.searchParams.quarter = this.currentDateObj.quarter
+      }
+      this.getData()
+    },
+    onYearChange() {
+      this.getData()
+    },
+    onMonthChange() {
+      this.getData()
+    },
+    quarterSelectChange() {
+      this.getData()
+    },
+    // 获取查询参数
+    getQueryParams() {
+      let params = {
+        flag: this.dimensionValue,
+      }
+      if(this.dimensionValue === 'year') {
+        params.createTime = this.searchParams.year
+      } else if(this.dimensionValue === 'month') {
+        params.createTime = this.searchParams.month
+      } else if(this.dimensionValue === 'quarter') {
+        params.createTime = this.searchParams.quarter
+        params.year = this.searchParams.year
+      }
+      return params
+    },
+    getData() {
+      let params = this.getQueryParams()
+      GetMeetingInformationData(params).then(res => {
+        if(res.success) {
+          let data = res.result || {}
+          this.totalAll = data.total
+          this.$nextTick(() => {
+            this.initChart(data)
+          })
+        }
+      })
+    },
+    /**
+     * 初始化图表
+     * @param data = {leftData: X轴数据 resultMapList：[] 柱状图数据}
+     */
+    initChart(data) {
+      let xData = data.leftData
+      let echartsData = data.resultMapList[0].count
+      let option = {
+        legend: {
+          show: false
+        },
+        grid: {
+          left: '0',
+          right: '0',
+        },
+        tooltip: {
+          formatter: params => {
+            // 获取xAxis data中的数据
+            let dataStr = ''
+            params.forEach(item => {
+              let color = ''
+              if(typeof item.color === 'string') {
+                color = item.color
+              } else {
+                color = item.color.colorStops[0].color
+              }
+              dataStr += `<div>
+          <div style="margin: 0 8px;">
+            <span style="display:inline-block;margin-right:5px;width:15px;height:10px;background-color:${color};border-radius: 3px"></span>
+            <span style="color:#7599E8">${item.name}</span>
+            <span style="color:#7599E8;">${item.value}</span>
+          </div>
+        </div>`
+            })
+            return dataStr
+          }
+        },
+        xAxis: {
+          data: xData
+        },
+        series: [
+          {
+            name: '数量',
+            type: 'bar',
+            barMaxWidth:20,
+            itemStyle:{
+              borderRadius:[4,4,0,0],
+            },
+            data: echartsData
+          }
+        ]
+      }
+      createBarChart('meetingInformationChart', option)
+
+    },
+    // 初始化查询条件的数据
+    initData() {
+      this.dimensionValue = 'year'
+      this.searchParams = {
+        year: this.currentDateObj.year + ''
+      }
+    }
+  },
+  created() {
+    this.getCurrentData()
+    //初始化数据
+    this.initData()
+    this.getData()
+  }
+}
+</script>
+
+<style scoped lang="less">
+@white: #fff;
+
+.search-box{
+  width: 70%;
+  margin-left: 30%;
+}
+.select-info-box{
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  .left-select > span:not(.label) {
+    margin-right: 15px;
+    color: @white;
+  }
+  .label{
+    color: @white;
+  }
+}
+.title-right-sub {
+  text-align: right;
+  margin-top: 5px;
+  span {
+    font-size: 16px;
+    color: @white;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  span.num {
+    font-size: 20px;
+    color: #6CFBCE;
+  }
+}
+
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/wp29/RegulationQuantityChart.vue b/src/views/screen/wp29/RegulationQuantityChart.vue
new file mode 100644
index 0000000..f611294
--- /dev/null
+++ b/src/views/screen/wp29/RegulationQuantityChart.vue
@@ -0,0 +1,131 @@
+<!--法规数量统计-->
+<template>
+  <div class="wp-full-box wp-half-box">
+    <div class="box-title">法规数量统计</div>
+    <div class="box-content">
+      <div class="title-right">
+        <span>法规总数：</span>
+        <span class="num">{{totalAll}}</span>
+      </div>
+      <div class="echarts-box" id="regulationQuantityChart"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetRegulationQuantityData } from '../../../screenApi/api'
+import { createBarChart } from '../util/BarOptions'
+
+export default {
+  name: 'RegulationQuantityChart',
+  data() {
+    return {
+      totalAll: '' // 法规总数
+    }
+  },
+  methods: {
+    getData() {
+      GetRegulationQuantityData().then(res => {
+        if(res.success) {
+          let data = res.result.data || []
+          this.initData(data)
+          this.$nextTick(() => {
+            this.initChart()
+          })
+        }
+      })
+    },
+    /**
+     *
+     * @param arr --data（数据）, name（类名）, totalAll(数据和), xaxis（x轴字段）
+     */
+    initData(arr) {
+      this.totalAll = arr[0].totalAll
+      this.xAxisData = arr[0].xaxis
+      this.yData = []
+      this.legendData = []
+      arr.map(tt => {
+        this.yData.push(tt.data || [])
+        this.legendData.push(tt.name)
+      })
+    },
+    // 初始化图表
+    initChart() {
+      let option = {
+        grid: {
+          left: '0',
+          right: '0',
+        },
+        legend: {
+          right: 0
+        },
+        tooltip: {
+          formatter: params => {
+            // 获取xAxis data中的数据
+            let dataStr = ''
+            params.forEach(item => {
+              let color = ''
+              if(typeof item.color === 'string') {
+                color = item.color
+              } else {
+                color = item.color.colorStops[0].color
+              }
+              dataStr += `<div>
+          <div style="margin: 0 8px;">
+            <span style="display:inline-block;margin-right:5px;width:15px;height:10px;background-color:${color};border-radius: 3px"></span>
+            <span style="color:#7599E8">${item.seriesName}</span>
+            <span style="color:#7599E8;">${item.value}</span>
+          </div>
+        </div>`
+            })
+            return dataStr
+          }
+        },
+        xAxis: {
+          data: this.xAxisData
+        },
+        series: [
+          {
+            name: this.legendData[0],
+            type: 'bar',
+            stack: 'total',
+            barMaxWidth:20,
+            itemStyle:{
+              borderRadius:[0,0,0,0],
+            },
+            data: this.yData[0]
+          },
+          {
+            name: this.legendData[1],
+            type: 'bar',
+            stack: 'total',
+            barMaxWidth:20,
+            itemStyle:{
+              borderRadius:[0,0,0,0],
+            },
+            data: this.yData[1]
+          },
+          {
+            name: this.legendData[2],
+            type: 'bar',
+            stack: 'total',
+            barMaxWidth:20,
+            itemStyle:{
+              borderRadius:[4,4,0,0],
+            },
+            data: this.yData[2]
+          },
+        ]
+      }
+      createBarChart('regulationQuantityChart', option)
+    }
+  },
+  created() {
+    this.getData()
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/views/screen/wp29/index.vue b/src/views/screen/wp29/index.vue
new file mode 100644
index 0000000..d72f716
--- /dev/null
+++ b/src/views/screen/wp29/index.vue
@@ -0,0 +1,216 @@
+<template>
+  <div class="screen-wp">
+    <!-- 法规数量统计-->
+    <regulation-quantity-chart></regulation-quantity-chart>
+    <!--  专家数量统计-->
+    <expert-quantity-chart></expert-quantity-chart>
+    <!-- 会议信息日历-->
+    <meeting-calendar></meeting-calendar>
+    <!-- 会议信息统计-->
+    <meeting-information-chart></meeting-information-chart>
+  </div>
+</template>
+
+<script>
+//法规数量统计 RegulationQuantityChart
+import RegulationQuantityChart from './RegulationQuantityChart'
+//专家数量统计 ExpertQuantityChart
+import ExpertQuantityChart from './ExpertQuantityChart'
+//会议信息日历 MeetingCalendar
+import MeetingCalendar from './MeetingCalendar'
+//会议信息统计 MeetingInformationChart
+import MeetingInformationChart from './MeetingInformationChart'
+
+
+export default {
+  name: 'index',
+  components: {
+    // 法规数量统计
+    RegulationQuantityChart,
+    // 专家数量统计
+    ExpertQuantityChart,
+    // // 会议信息日历
+    MeetingCalendar,
+    // 会议信息统计
+    MeetingInformationChart
+  }
+}
+</script>
+
+<style scoped lang="less">
+.screen-wp{
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+// 全屏box-有表格 1875 * 587
+.wp-full-box {
+  position: relative;
+  width: 100%;
+  height: 0;
+  padding-top: 31.31%;
+  background-image: url("../../../assets/screen/full_no_table_bg.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+
+  /deep/ .box-title {
+    font-size: 18px;
+    font-family: PingFang SC;
+    font-weight: bold;
+    color: #DDF0FF;
+    position: absolute;
+    // 34.5 / 高度 587
+    top: 5.88%;
+    left: 13.70%;
+    transform: translate(-50%, -50%);
+  }
+
+  /deep/ .box-content {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    display: flex;
+    flex-direction: column;
+    padding: 2.3% 4%;
+    //padding: 4.61% 4%;
+    .echarts-box {
+      width: 100%;
+      flex: 1;
+    }
+  }
+}
+// 50%的box 536 * 931
+/deep/.wp-half-box{
+  width: 50%;
+  height: 0;
+  padding-top: 28.79%;
+  background-image: url("../../../assets/screen/half_bg.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  .box-title {
+    // (25 + 18 / 2) / 635
+    top: 6.34%;
+    // (171 + 149 / 2) / 931
+    left: 26.37%;
+  }
+  .box-content {
+    padding: 4.61% 6%;
+  }
+}
+
+@normal-color: rgba(256, 256, 256, 0.5);
+@white: #fff;
+// 半屏 标题右侧的样式
+/deep/.title-right{
+  width: 50%;
+  margin-left: 50%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: end;
+  span {
+    font-size: 16px;
+    color: @white;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  span.num {
+    font-size: 20px;
+    color: #6CFBCE;
+  }
+}
+
+
+//下拉框样式的修改
+/deep/.ant-select-selection{
+  border: none!important;
+  background: transparent;
+  color: @normal-color;
+}
+/deep/.ant-select.active  .ant-select-selection{
+  color: @white!important;
+}
+
+/deep/.ant-select-focused .ant-select-selection, .ant-select-selection:focus, .ant-select-selection:active{
+  border: none!important;
+  box-shadow: none;
+}
+/deep/.ant-select-arrow{
+  color: @white;
+}
+
+// 时间选择器的样式
+/deep/.ant-calendar-picker,
+/deep/.ant-calendar-picker-input.ant-input,
+/deep/ .ant-calendar-picker-icon{
+  border: none!important;
+  background: transparent;
+  color: @white;
+}
+
+
+</style>
+<style lang="less">
+@normal-color: rgba(256, 256, 256, 0.2);
+.ant-calendar-dropdown-screen{
+  .ant-calendar{
+    border: none;
+    box-shadow: 0 0 4px #7599E8 inset;
+  }
+  .ant-calendar-month-panel-body,
+  .ant-calendar-month-panel-header,
+  .ant-calendar-year-panel-body,
+  .ant-calendar-year-panel-header
+  {
+    background-color: #181F55;
+    border: none!important;
+    color: #fff;
+  }
+  td a,
+  .ant-calendar-month-panel-year-select-content,
+  .ant-calendar-year-panel-decade-select
+  {
+    color: #fff;
+  }
+  .ant-calendar-month-panel-prev-year-btn::after,
+  .ant-calendar-month-panel-prev-year-btn::before,
+  .ant-calendar-month-panel-next-year-btn::before,
+  .ant-calendar-month-panel-next-year-btn::after
+  {
+    border-color: #fff;
+  }
+  // 选中的效果
+  .ant-calendar-month-panel-selected-cell .ant-calendar-month-panel-month,
+  .ant-calendar-year-panel-selected-cell .ant-calendar-year-panel-year{
+    background-color: #4364C2;
+  }
+
+  .ant-calendar-header a:hover{
+    color: #fff;
+    background-color: #7599E8;
+    //&::after,
+    //&::before{
+    //  color: #fff;
+    //}
+  }
+
+  .ant-calendar-year-panel-last-decade-cell a,
+  .ant-calendar-year-panel-next-decade-cell a
+  {
+    color: @normal-color;
+  }
+//   年份选择器上面的输入框
+  .ant-calendar-input-wrap{
+    background-color: #181F55;
+    border-color: @normal-color;
+    input{
+      background-color: #181F55;
+      border: none!important;
+      color: #fff;
+    }
+  }
+}
+
+</style>
\ No newline at end of file