From 05cf6324ea8322164d99a3d3d4161fe374534b3b Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期日, 18 二月 2024 15:22:29 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- platform/src/views/index.vue | 645 ++++++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 573 insertions(+), 72 deletions(-) diff --git a/platform/src/views/index.vue b/platform/src/views/index.vue index cfae4c6..86c30d9 100644 --- a/platform/src/views/index.vue +++ b/platform/src/views/index.vue @@ -1,33 +1,454 @@ <template> <div class="home"> - <!-- <div class="wrap"> - <h2>娆㈣繋浣跨敤浼婂▋鏋侀�熷紑鍙戞鏋�</h2> - <p>鎮ㄤ娇鐢ㄧ殑姝ゅ寮�婧愭鏋舵病鏈変换浣曠増鏉冮棶棰橈紝鍙涔犲彲鍟嗙敤锛岃鏀惧績浣跨敤锛�</p> - <p>浼婂▋鑷村姏浜庢墦閫犵畝娲併�佸悎鐞嗐�侀珮鏁堢殑寮�鍙戜綋楠岋紝涓烘鎴戜滑灏嗕笉鏂崌绾э紝鎰熻阿鎮ㄧ殑鏀寔锛�</p> - <p style="margin-top: 12px;"> - <a href="https://gitee.com/coderd-repos/eva" target="_blank">GITEE</a> - <a href="https://github.com/coderd-repos/eva" target="_blank">GITHUB</a> - </p> - <div class="guide"> - <a href="http://eva.adjustrd.com" target="_blank">鍓嶅線瀹樼綉</a> - <a href="http://coderd.adjustrd.com/template/308/default" target="_blank">鍓嶅線CodeRd</a> + <div class="home_inlet"> + <div class="home_inlet_label">蹇嵎鍏ュ彛</div> + <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> - <img src="@/assets/images/qq.png"> - <p>浣犲彲浠ユ壂鐮佸姞鍏ョ兢鑱婁互鑾峰緱鎶�鏈敮鎸�</p> - <div class="award"> - <h4>婵�鍔变綔鑰呭仛寰楁洿濂�</h4> - <img src="@/assets/images/alipay.jpeg"> - <img src="@/assets/images/wxpay.jpeg"> + <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> </div> - </div> --> + </div> + <div class="home_content"> + <div class="home_content_left"> + <div class="home_content_left_item" ref="picture1"></div> + <div class="home_content_left_item" ref="picture2"></div> + <div class="home_content_left_item" ref="picture3"></div> + </div> + <div class="home_content_right"> + <div class="home_content_right_label" v-if="tabs && tabs.length>0" >浠e姙浜嬮」</div> + <el-tabs v-model="activeName" @tab-click="handleClick" > + <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 tableData0" :key="index"> + <div class="list_item_left"> + <span>{{item.title}}锛坽{ item.typeDetail }}锛�</span> + <span>{{item.info}}锛坽{item.content}}锛�</span> + </div> + <div class="list_item_center"> + <span>{{item.companyName}}</span> + <span>鎻愪氦鏃堕棿 {{item.createDate}}</span> + </div> + <div class="list_item_right"> + <span @click="detail(item)">鏌ョ湅</span> + </div> + </div> + </div> + <div class="home_content_right_page"> + <el-pagination + @current-change="handleCurrentChange0" + :current-page="page0" + :page-size="5" + layout="total, prev, pager, next, jumper" + :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 tableData1" :key="index"> + <div class="list_item_left"> + <span>{{item.title}}锛坽{ item.typeDetail }}锛�</span> + <span>{{item.info}}锛坽{item.content}}锛�</span> + </div> + <div class="list_item_center"> + <span>{{item.companyName}}</span> + <span>鎻愪氦鏃堕棿 {{item.createDate}}</span> + </div> + <div class="list_item_right"> + <span @click="detail(item)">鏌ョ湅</span> + </div> + </div> + </div> + <div class="home_content_right_page"> + <el-pagination + @current-change="handleCurrentChange1" + :current-page="page1" + :page-size="5" + layout="total, prev, pager, next, jumper" + :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 tableData2" :key="index"> + <div class="list_item_left"> + <span>{{item.title}}锛坽{ item.typeDetail }}锛�</span> + <span>{{item.info}}锛坽{item.content}}锛�</span> + </div> + <div class="list_item_center"> + <span>{{item.companyName}}</span> + <span>鎻愪氦鏃堕棿 {{item.createDate}}</span> + </div> + <div class="list_item_right"> + <span @click="detail(item)">鏌ョ湅</span> + </div> + </div> + </div> + <div class="home_content_right_page"> + <el-pagination + @current-change="handleCurrentChange2" + :current-page="page2" + :page-size="5" + layout="total, prev, pager, next, jumper" + :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 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 } from '@/api/business/notices' export default { + components: { + OperaInsuranceApplyWindow, + dispatchUnitDetailsPlat, + OperaTaxesWindow, + OperaSettleClaimsWindow, + OperaApplyChangeDetailWindow, + OperaApplyChangeUnitDetailWindow + }, name: 'Index', data () { - return {} + return { + activeName: '0', + tabs: [], + page0: 1, + page1: 1, + page2: 1, + totalPage2: 0, + totalPage1: 0, + totalPage0: 0, + tableData0: [], + tableData1: [], + tableData2: [], + cate: [ + { + name: '鎶曚繚鐢宠', + url: '/enterprise/insuranceApply', + icon: require('../assets/icons/company/apply.png') + }, + { + name: '鎻愪氦鎶ユ', + url: '/business/settleClaims', + icon: require('../assets/icons/company/settle.png') + }, + { + name: '娣诲姞娲鹃仯鍗曚綅', + url: '/enterprise/dispatchUnit', + icon: require('../assets/icons/company/dipatch_unit.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') + } + ] + } + }, + computed: { + ...mapState(['userInfo']) + }, + mounted () { + this.setPicture1() + this.setPicture2() + this.setPicture3() + this.initPanel() + this.setLoadTimer() + }, + methods: { + 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) { + this.$refs.operaSettleClaimsWindow.open('鐞嗚禂璇︽儏', { id: obj.objId }) + } + }, + 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: '鎶曚繚浠e姙' }) + // this.handleCurrentChange0(0); + } + if (pemissons.includes('business:notice:tax')) { + this.tabs.push({ name: '1', label: '鍙戠エ浠e姙' }) + // this.handleCurrentChange1(0); + } + if (pemissons.includes('business:notice:settle')) { + this.tabs.push({ name: '2', label: '鐞嗚禂浠e姙' }) + // 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) + } + }, + handleCurrentChange0 (page) { + this.page0 = page + this.getNoticeList(0, this.page0) + }, + 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 () { + const chartDom = this.$refs.picture1 + const myChart = echarts.init(chartDom) + let option + option = { + title: { + text: '褰撴湀淇濋櫓閲戦', + left: '5%', + top: '5%' + }, + tooltip: { + trigger: 'item' + }, + series: [ + { + type: 'pie', + radius: '50%', + data: [ + { value: 1048, name: '淇濋殰涓�' }, + { value: 735, name: '涓嶅湪淇�' } + ], + emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: 'rgba(0, 0, 0, 0.5)' + } + } + } + ] + } + + option && myChart.setOption(option) + }, + setPicture2 () { + const chartDom = this.$refs.picture2 + const myChart = echarts.init(chartDom) + let option + option = { + title: { + text: '褰撴湀鍦ㄤ繚浜烘暟', + left: '5%', + top: '5%' + }, + grid: { + left: '3%', + right: '4%', + bottom: '13%', + containLabel: true + }, + tooltip: { + trigger: 'axis' + }, + xAxis: { + type: 'category', + data: ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�'] + }, + yAxis: { + type: 'value' + }, + series: [ + { + data: [10, 30, 25, 16, 21, 18, 5, 30, 30, 30, 30, 30], + type: 'line' + } + ] + } + + option && myChart.setOption(option) + }, + setPicture3 () { + const chartDom = this.$refs.picture3 + const myChart = echarts.init(chartDom) + let option + option = { + title: { + text: '鎬昏禂浠樼巼 78%', + left: '5%', + top: '5%' + }, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'shadow' + } + }, + grid: { + left: '3%', + right: '4%', + bottom: '25%', + containLabel: true + }, + xAxis: { + type: 'value' + // boundaryGap: [0, 0.01] + }, + yAxis: { + type: 'category', + data: ['淇濋櫓A璧斾粯鐜�', '淇濋櫓B璧斾粯鐜�', '鎬昏禂浠樼巼'] + }, + series: [ + { + type: 'bar', + stack: 'total', + barWidth: '60%', + data: [10, 20, 30] + }, + { + type: 'bar', + stack: 'total', + barWidth: '60%', + data: [15, 16, 24] + } + ] + } + + option && myChart.setOption(option) + } } } </script> @@ -35,63 +456,143 @@ <style scoped lang="scss"> @import "@/assets/style/variables.scss"; .home { - text-align: center; - color: #777; - .wrap { - margin-top: 80px; - img { - width: 240px; - } - } - h2 { - font-size: 32px; - color: #555; - margin-bottom: 20px; - } - p { - line-height: 24px; - margin: 0; - } - .start-up { - margin-top: 8px; - } - .guide { - margin: 30px 0 40px 0; - display: flex; - justify-content: center; - a { - margin-right: 12px; - padding: 12px 40px; - border-radius: 30px; - background: $primary-color; - color: #fff; - text-decoration: none; - } - } - em,a { - font-style: normal; - font-weight: bold; - margin: 0 3px; - color: $primary-color; - } - .award { - position: absolute; - right: 20px; - bottom: 60px; + width: 100%; + height: 100%; + .home_inlet { + width: 100%; + height: 160px; display: flex; flex-direction: column; - text-align: left; - padding: 12px; - border: 1px solid #eee; - box-shadow: -1px 1px 10px #ccc; - h4 { + padding: 20px; + box-sizing: border-box; + background: #ffffff; + .home_inlet_label { + width: 100%; + font-size: 18px; font-weight: bold; - margin-bottom: 8px; - } - img { - width: 160px; + color: black; margin-bottom: 20px; - transition: opacity ease .3s; + } + .home_inlet_list { + width: 100%; + display: flex; + align-items: center; + .home_inlet_item { + flex: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + cursor: pointer; + img { + width: 40px; + height: 40px; + } + span { + font-size: 14px; + color: black; + margin-top: 5px; + } + } + } + } + .home_content { + width: 100%; + height: calc(100% - 170px); + margin-top: 10px; + display: flex; + align-items: center; + justify-content: space-between; + .home_content_left { + width: 350px; + height: 100%; + flex-shrink: 0; + display: flex; + flex-direction: column; + justify-content: space-between; + .home_content_left_item { + width: 100%; + height: 32%; + background: #ffffff; + } + } + .home_content_right { + flex: 1; + height: 100%; + background: #ffffff; + margin-left: 10px; + padding: 20px; + box-sizing: border-box; + position: relative; + .home_content_right_label { + font-size: 18px; + color: black; + font-weight: bold; + } + .home_content_right_list { + width: 100%; + display: flex; + flex-direction: column; + .list_item { + padding: 10px; + box-sizing: border-box; + width: 100%; + display: flex; + justify-content: space-between; + border: 1px solid #ececec; + margin-bottom: 15px; + &:last-child { + margin-bottom: 0 !important; + } + .list_item_left { + display: flex; + width: 60%; + flex-direction: column; + span { + &:nth-child(1) { + font-size: 14px; + color: black; + font-weight: bold; + } + &:nth-child(2) { + font-size: 14px; + color: black; + margin-top: 5px; + } + } + } + .list_item_center { + display: flex; + flex-direction: column; + span { + font-size: 14px; + color: black; + &:nth-child(2) { + margin-top: 5px; + } + } + } + .list_item_right { + height: 100%; + display: flex; + align-items: center; + justify-content: center; + span { + font-size: 14px; + color: #1890FF; + margin-top: 10px; + cursor: pointer; + } + } + } + } + .home_content_right_page { + margin-top: 20px; + position: relative; + bottom: 20px; + left: 20px; + box-sizing: border-box; + } } } } -- Gitblit v1.9.3