mrshi

MrShi

2024-03-08 d2bc6e096f0806b78ea92d4b90a21d3627d406c7

 company/src/views/index.vue

@@ -2,8 +2,14 @@
  <div class="home">
    <div class="home_inlet">
      <div class="home_inlet_label">快捷入口</div>
      <div class="home_inlet_list">
      <div class="home_inlet_list" v-if="userInfo.type==1" >
        <div class="home_inlet_item" v-for="(item, index) in cate" :key="index" @click="jump(item.url)">
          <img :src="item.icon" />
          <span>{{item.name}}</span>
        </div>
      </div>
      <div class="home_inlet_list" v-else >
        <div class="home_inlet_item" v-for="(item, index) in catePlat" :key="index" @click="jump(item.url)">
          <img :src="item.icon" />
          <span>{{item.name}}</span>
        </div>
@@ -18,127 +24,191 @@
      <div class="home_content_right">
        <div class="home_content_right_label" v-if="tabs && tabs.length>0" >代办事项</div>
        <el-tabs v-model="activeName" @tab-click="handleClick" >
          <el-tab-pane v-for="a in tabs" :key="a.path" :label="a.label" :name="a.name"></el-tab-pane>
          <el-tab-pane v-for="a in tabs" :key="a.path" :name="a.name" >
             <span slot="label" title="点击刷新"> {{a.label }}
                        <el-badge v-if="(a.name==0?totalPage0:(a.name==1?totalPage1:totalPage2))  >0" :value="(a.name==0?totalPage0:(a.name==1?totalPage1:totalPage2)) " class="item"></el-badge>
                    </span>
          </el-tab-pane>
        </el-tabs>
        <div v-if="activeName === '0'"  v-permissions="['business:notice:insurance']" >
          <div class="home_content_right_list">
            <div class="list_item" v-for="(item, index) in 1" :key="index">
            <div class="list_item" v-for="(item, index) in tableData0" :key="index">
              <div class="list_item_left">
                <span>投保申请（待签署）</span>
                <span>保险方案（雇主责任险A）</span>
                <span>{{item.title}}（{{ item.typeDetail }}）</span>
                <span>{{item.info}}（{{item.content}}）</span>
              </div>
              <div class="list_item_center">
                <span>安徽平安人力资源有限公司</span>
                <span>提交时间  2023-09-11 00:00:00</span>
                <span>{{item.companyName}}</span>
                <span>提交时间  {{item.createDate}}</span>
              </div>
              <div class="list_item_right">
                <span>查看详情</span>
                <span @click="detail(item)">查看</span>
              </div>
            </div>
          </div>
          <div class="home_content_right_page">
            <el-pagination
                @current-change="handleCurrentChange"
                :current-page="page"
                @current-change="handleCurrentChange0"
                :current-page="page0"
                :page-size="5"
                layout="total, prev, pager, next, jumper"
                :total="0">
                :total="totalPage0">
            </el-pagination>
          </div>
        </div>
        <div v-if="activeName === '1'"  v-permissions="['business:notice:tax']">
          <div class="home_content_right_list">
            <div class="list_item" v-for="(item, index) in 1" :key="index">
            <div class="list_item" v-for="(item, index) in tableData1" :key="index">
              <div class="list_item_left">
                <span>投保申请（待签署1）</span>
                <span>保险方案（雇主责任险A）</span>
                <span>{{item.title}}（{{ item.typeDetail }}）</span>
                <span>{{item.info}}（{{item.content}}）</span>
              </div>
              <div class="list_item_center">
                <span>安徽平安人力资源有限公司</span>
                <span>提交时间  2023-09-11 00:00:00</span>
                <span>{{item.companyName}}</span>
                <span>提交时间  {{item.createDate}}</span>
              </div>
              <div class="list_item_right">
                <span>查看详情</span>
                <span  @click="detail(item)">查看</span>
              </div>
            </div>
          </div>
          <div class="home_content_right_page">
            <el-pagination
                @current-change="handleCurrentChange"
                :current-page="page"
                @current-change="handleCurrentChange1"
                :current-page="page1"
                :page-size="5"
                layout="total, prev, pager, next, jumper"
                :total="0">
                :total="totalPage1">
            </el-pagination>
          </div>
        </div>
        <div v-if="activeName === '2'"  v-permissions="['business:notice:settle']">
          <div class="home_content_right_list">
            <div class="list_item" v-for="(item, index) in 1" :key="index">
            <div class="list_item" v-for="(item, index) in tableData2" :key="index">
              <div class="list_item_left">
                <span>投保申请（待签署2）</span>
                <span>保险方案（雇主责任险A）</span>
                <span>{{item.title}}（{{ item.typeDetail }}）</span>
                <span>{{item.info}}（{{item.content}}）</span>
              </div>
              <div class="list_item_center">
                <span>安徽平安人力资源有限公司</span>
                <span>提交时间  2023-09-11 00:00:00</span>
                <span>{{item.companyName}}</span>
                <span>提交时间  {{item.createDate}}</span>
              </div>
              <div class="list_item_right">
                <span>查看详情</span>
                <span  @click="detail(item)">查看</span>
              </div>
            </div>
          </div>
          <div class="home_content_right_page">
            <el-pagination
                @current-change="handleCurrentChange"
                :current-page="page"
                @current-change="handleCurrentChange2"
                :current-page="page2"
                :page-size="5"
                layout="total, prev, pager, next, jumper"
                :total="0">
                :total="totalPage2">
            </el-pagination>
          </div>
        </div>
      </div>
    </div>
    <OperaInsuranceApplyWindow ref="operaInsuranceApplyWindow" @success="handleCurrentChange0()"/>
    <dispatchUnitDetailsPlat ref="dispatchUnitDetailsPlat" @success="handleCurrentChange0()"/>
    <OperaSettleClaimsWindow ref="operaSettleClaimsWindow" @success="handleCurrentChange2()"/>
    <OperaApplyChangeUnitDetailWindow ref="operaApplyChangeUnitDetailWindow" @success="handleCurrentChange0()"/>
    <OperaApplyChangeDetailWindow ref="operaApplyChangeDetailWindow" @success="handleCurrentChange0()"/>
    <OperaTaxesWindow ref="OperaTaxesWindow" @success="handleCurrentChange1()"/>
  </div>
</template>

<script>
import * as echarts from 'echarts';
import {mapState} from "vuex";
import * as echarts from 'echarts'
import { mapState } from 'vuex'
import OperaInsuranceApplyWindow from '@/components/business/OperaInsuranceApplyWindow'
import dispatchUnitDetailsPlat from '@/components/business/dispatchUnitDetailsPlat'
import OperaApplyChangeUnitDetailWindow from '@/components/business/OperaApplyChangeUnitDetailWindow'
import OperaSettleClaimsWindow from '@/components/business/OperaSettleClaimsWindow'
import OperaApplyChangeDetailWindow from '@/components/business/OperaApplyChangeDetailWindow'
import OperaTaxesWindow from '@/components/business/OperaTaxesWindow'
import { fetchList as noticeList, deleById } from '@/api/business/notices'
export default {
  components: {
    OperaInsuranceApplyWindow,
    dispatchUnitDetailsPlat,
    OperaTaxesWindow,
    OperaSettleClaimsWindow,
    OperaApplyChangeDetailWindow,
    OperaApplyChangeUnitDetailWindow
  },
  name: 'Index',
  data () {
    return {
      activeName: '0',
      tabs:[],
      page: 1,
      table:null,
      tabs: [],
      page0: 1,
      page1: 1,
      page2: 1,
      totalPage2: 0,
      totalPage1: 0,
      totalPage0: 0,
      tableData0: [],
      tableData1: [],
      tableData2: [],
      cate: [
        {
          name: '投保申请',
          url: '',
          icon: require('../assets/logo.png')
        },
        {
          name: '加保申请',
          url: '',
          icon: require('../assets/logo.png')
        },
        {
          name: '减保申请',
          url: '',
          icon: require('../assets/logo.png')
        },
        {
          name: '合同管理',
          url: '',
          icon: require('../assets/logo.png')
          url: '/enterprise/insuranceApply',
          icon: require('../assets/icons/company/apply.png')
        },
        {
          name: '提交报案',
          url: '',
          icon: require('../assets/logo.png')
          url: '/business/settleClaims',
          icon: require('../assets/icons/company/settle.png')
        },
        {
          name: '添加派遣单位',
          url: '/enterprise/dispatchUnit',
          icon: require('../assets/icons/company/dipatch_unit.png')
        },
        {
          name: '员工管理',
          url: '/business/member',
          icon: require('../assets/icons/company/image.png')
        }
        // {
        //   name: '直保开票',
        //   url: '/enterprise/directInvoicing',
        //   icon: require('../assets/icons/company/tax.png')
        // },
        // {
        //   name: '委托保开票',
        //   url: '/enterprise/entrustedInvoicing',
        //   icon: require('../assets/icons/company/tax.png')
        // }
      ],
      catePlat: [
        {
          name: '投保审核',
          url: '/business/insuranceApply',
          icon: require('../assets/icons/plat/apply_check.png')
        },
        {
          name: '加/减保审核',
          url: '/business/applyChange',
          icon: require('../assets/icons/plat/change_apply_check.png')
        },
        {
          name: '理赔服务',
          url: '/business/settleClaims',
          icon: require('../assets/icons/plat/settle_check.png')
        },
        {
          name: '发票管理',
          url: '/business/taxes',
          icon: require('../assets/icons/plat/tax_check.png')
        },
        {
          name: '新增企业',
          url: '/business/company',
          icon: require('../assets/icons/plat/company_add.png')
        }
      ]
    }
@@ -146,38 +216,138 @@
  computed: {
    ...mapState(['userInfo'])
  },
  mounted() {
  mounted () {
    this.setPicture1()
    this.setPicture2()
    this.setPicture3()
    this.initPanel()
    this.setLoadTimer()
  },
  methods: {
    initPanel(){
      var pemissons = this.userInfo.permissions;
      if(pemissons.includes("business:notice:insurance")){
        this.tabs.push( {name:"0",label:"投保代办"})
      }
      if(pemissons.includes("business:notice:tax")){
        this.tabs.push( {name:"1",label:"发票代办"})
      }
      if(pemissons.includes("business:notice:settle")){
        this.tabs.push( {name:"2",label:"理赔代办"})
    detail (obj) {
      if (obj.objType === 0) {
        this.$refs.operaInsuranceApplyWindow.open('投保申请详情', { id: obj.objId })
      } else if (obj.objType === 1) {
        this.$refs.operaApplyChangeDetailWindow.open('加减保详情', { id: obj.objId, applyId: obj.param1 })
      } else if (obj.objType === 2) {
        this.$refs.operaApplyChangeUnitDetailWindow.open('更换派遣单位申请详情', { id: obj.objId, applyId: obj.param1 })
      } else if (obj.objType === 3) {
        this.$refs.dispatchUnitDetailsPlat.open('派遣单详情', { id: obj.objId })
      } else if (obj.objType === 4) {
        this.$refs.OperaTaxesWindow.open('开票申请详情', { id: obj.objId })
      } else if (obj.objType === 5) {
        deleById(obj.id)
          .then(res => {
            this.tableData2.forEach((item, index) => {
              if (item.id === obj.id) {
                this.tableData2.splice(index, 1)
                this.totalPage2 = this.totalPage2 - 1
              }
            })
            this.$refs.operaSettleClaimsWindow.open('理赔详情', { id: obj.objId })
          })
      }
    },
    handleClick(e) {
    setLoadTimer () {
      var that = this
      this.initLoadData()
      if (window.timer) {
        clearInterval(window.timer)
      }
      window.timer = setInterval(() => {
          that.initLoadData()
      }, 60000)
    },
    initLoadData(){
      var pemissons = this.userInfo.permissions
      if (pemissons.includes('business:notice:insurance')) {
        this.handleCurrentChange0(0)
      }
      if (pemissons.includes('business:notice:tax')) {
        this.handleCurrentChange1(0)
      }
      if (pemissons.includes('business:notice:settle')) {
        this.handleCurrentChange2(0)
      }
    },
    getNoticeList (type, page) {
      noticeList({
        page: page,
        capacity: 5,
        model: { queryType: type },
        sorts: []
      })
        .then(response => {
          if (type === 0) {
            this.tableData0 = response.records
            this.totalPage0 = response.total
          }
          if (type === 1) {
            this.tableData1 = response.records
            this.totalPage1 = response.total
          } if (type === 2) {
            this.tableData2 = response.records
            this.totalPage2 = response.total
          }
        })
        .catch(e => {
          this.$tip.apiFailed(e)
        })
    },
    initPanel () {
      var pemissons = this.userInfo.permissions

      if (pemissons.includes('business:notice:insurance')) {
        this.tabs.push({ name: '0', label: '投保代办' })
        // this.handleCurrentChange0(0);
      }
      if (pemissons.includes('business:notice:tax') && this.userInfo.type !== 1) {
        this.tabs.push({ name: '1', label: '发票代办' })
        // this.handleCurrentChange1(0);
      }
      if (pemissons.includes('business:notice:settle')) {
        this.tabs.push({ name: '2', label: '理赔提醒' })
        // this.handleCurrentChange2(0);
      }
      /* if (pemissons.includes('business:notice:insurance')) {
        this.getNoticeList(0, this.page0)
      }
      if (pemissons.includes('business:notice:tax')) {
        this.getNoticeList(1, this.page1)
      }
      if (pemissons.includes('business:notice:settle')) {
        this.getNoticeList(2, this.page2)
      } */
    },
    handleClick (e) {
      this.activeName = e.name
      if (this.activeName === '0') {
        this.handleCurrentChange0(0)
      } else if (this.activeName === '1') {
        this.handleCurrentChange1(0)
      } else if (this.activeName === '2') {
        this.handleCurrentChange2(0)
      }
    },
    handleCurrentChange(page) {
      this.page = page
    handleCurrentChange0 (page) {
      this.page0 = page
      this.getNoticeList(0, this.page0)
    },
    jump(url) {
      if (!url) return;
      this.$router.push({ path: url });
    handleCurrentChange1 (page) {
      this.page1 = page
      this.getNoticeList(1, this.page1)
    },
    handleCurrentChange2 (page) {
      this.page2 = page
      this.getNoticeList(2, this.page2)
    },
    jump (url) {
      if (!url) return
      this.$router.push({ path: url })
    },
    setPicture1 () {
      let chartDom = this.$refs.picture1;
      let myChart = echarts.init(chartDom);
      const chartDom = this.$refs.picture1
      const myChart = echarts.init(chartDom)
      let option
      option = {
        title: {
@@ -194,7 +364,7 @@
            radius: '50%',
            data: [
              { value: 1048, name: '保障中' },
              { value: 735, name: '不在保' },
              { value: 735, name: '不在保' }
            ],
            emphasis: {
              itemStyle: {
@@ -205,13 +375,13 @@
            }
          }
        ]
      };
      }

      option && myChart.setOption(option);
      option && myChart.setOption(option)
    },
    setPicture2 () {
      let chartDom = this.$refs.picture2;
      let myChart = echarts.init(chartDom);
      const chartDom = this.$refs.picture2
      const myChart = echarts.init(chartDom)
      let option
      option = {
        title: {
@@ -241,13 +411,13 @@
            type: 'line'
          }
        ]
      };
      }

      option && myChart.setOption(option);
      option && myChart.setOption(option)
    },
    setPicture3 () {
      let chartDom = this.$refs.picture3;
      let myChart = echarts.init(chartDom);
      const chartDom = this.$refs.picture3
      const myChart = echarts.init(chartDom)
      let option
      option = {
        title: {
@@ -268,7 +438,7 @@
          containLabel: true
        },
        xAxis: {
          type: 'value',
          type: 'value'
          // boundaryGap: [0, 0.01]
        },
        yAxis: {
@@ -289,9 +459,9 @@
            data: [15, 16, 24]
          }
        ]
      };
      }

      option && myChart.setOption(option);
      option && myChart.setOption(option)
    }
  }
}
@@ -390,6 +560,7 @@
          }
          .list_item_left {
            display: flex;
            width: 60%;
            flex-direction: column;
            span {
              &:nth-child(1) {
@@ -431,7 +602,7 @@
      }
      .home_content_right_page {
        margin-top: 20px;
        position: absolute;
        position: relative;
        bottom: 20px;
        left: 20px;
        box-sizing: border-box;