|
@@ -2,127 +2,102 @@
|
|
|
<div class="page-header-index-wide">
|
|
|
<a-row :gutter="24">
|
|
|
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
|
|
- <chart-card :loading="loading" title="受理量" :total="cardCount.sll | NumberFormat">
|
|
|
- <a-tooltip title="指标说明" slot="action">
|
|
|
- <a-icon type="info-circle-o" />
|
|
|
- </a-tooltip>
|
|
|
- <div>
|
|
|
- <mini-area :data-source="chartData.sll" />
|
|
|
+ <div @click="zhengchang()">
|
|
|
+ <chart-card :loading="loading" total="所有任务" class="suoyou">
|
|
|
+ </chart-card>
|
|
|
+ <span class="recent">[近30天]</span>
|
|
|
+ <div class="numRecent">
|
|
|
+ <div style="font-size:35px; color: #3293f6;">{{listBdc.totalNum}}</div>
|
|
|
+ <div style="font-size:20px; padding-top:10%; padding-left:3px;">项</div>
|
|
|
</div>
|
|
|
- <template slot="footer">今日受理量:<span>{{ todaySll }}</span></template>
|
|
|
- </chart-card>
|
|
|
+ </div>
|
|
|
</a-col>
|
|
|
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
|
|
- <chart-card :loading="loading" title="办结量" :total="cardCount.bjl | NumberFormat">
|
|
|
- <a-tooltip title="指标说明" slot="action">
|
|
|
- <a-icon type="info-circle-o" />
|
|
|
- </a-tooltip>
|
|
|
- <div>
|
|
|
- <mini-area :data-source="chartData.bjl"/>
|
|
|
+ <div @click="zhengchang(0)">
|
|
|
+ <chart-card :loading="loading" total="待办" class="daiban">
|
|
|
+ </chart-card>
|
|
|
+ <span class="recent2">[近30天]</span>
|
|
|
+ <div class="numRecent">
|
|
|
+ <div style="font-size:35px; color: #e91111;">{{listBdc.daibanNum}}</div>
|
|
|
+ <div style="font-size:20px; padding-top:10%; padding-left:3px;">项</div>
|
|
|
</div>
|
|
|
- <template slot="footer">今日办结量:<span>{{ todayBjl }}</span></template>
|
|
|
- </chart-card>
|
|
|
+ </div>
|
|
|
</a-col>
|
|
|
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
|
|
- <chart-card :loading="loading" title="用户受理量" :total="cardCount.isll | NumberFormat">
|
|
|
- <a-tooltip title="指标说明" slot="action">
|
|
|
- <a-icon type="info-circle-o" />
|
|
|
- </a-tooltip>
|
|
|
- <div>
|
|
|
- <mini-bar :datasource="chartData.isll" :height="50"/>
|
|
|
+ <div @click="zhengchang(1)">
|
|
|
+ <chart-card :loading="loading" total="进行中" class="jinxing">
|
|
|
+ </chart-card>
|
|
|
+ <span class="recent3">[近30天]</span>
|
|
|
+ <div class="numRecent">
|
|
|
+ <div style="font-size:35px; color: #f9c04a;">{{listBdc.jinxingNum}}</div>
|
|
|
+ <div style="font-size:20px; padding-top:10%; padding-left:3px;">项</div>
|
|
|
</div>
|
|
|
- <template slot="footer">用户今日受理量:<span>{{ todayISll }}</span></template>
|
|
|
- </chart-card>
|
|
|
+ </div>
|
|
|
</a-col>
|
|
|
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
|
|
- <chart-card :loading="loading" title="用户办结量" :total="cardCount.ibjl | NumberFormat">
|
|
|
- <a-tooltip title="指标说明" slot="action">
|
|
|
- <a-icon type="info-circle-o" />
|
|
|
- </a-tooltip>
|
|
|
- <div>
|
|
|
- <mini-bar :datasource="chartData.ibjl" :height="50"/>
|
|
|
+ <div @click="zhengchang(2)">
|
|
|
+ <chart-card :loading="loading" total="已完成" class="wancheng">
|
|
|
+ </chart-card>
|
|
|
+ <span class="recent3">[近30天]</span>
|
|
|
+ <div class="numRecent">
|
|
|
+ <div style="font-size:35px; color: #18c679;">{{listBdc.wanchengNum}}</div>
|
|
|
+ <div style="font-size:20px; padding-top:10%; padding-left:3px;">项</div>
|
|
|
</div>
|
|
|
- <template slot="footer">用户今日办结量:<span>{{ todayIBjl }}</span></template>
|
|
|
- </chart-card>
|
|
|
+ </div>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
|
|
|
- <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
|
|
|
+ <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}" class="list">
|
|
|
<div class="salesCard">
|
|
|
<a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
|
|
- <div class="extra-wrapper" slot="tabBarExtraContent">
|
|
|
- <div class="extra-item">
|
|
|
- <a>今日</a>
|
|
|
- <a>本周</a>
|
|
|
- <a>本月</a>
|
|
|
- <a>本年</a>
|
|
|
- </div>
|
|
|
- <a-range-picker :style="{width: '256px'}" />
|
|
|
- </div>
|
|
|
-
|
|
|
- <a-tab-pane loading="true" tab="受理监管" key="1">
|
|
|
- <a-row>
|
|
|
- <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <index-bar title="受理量统计" />
|
|
|
- </a-col>
|
|
|
- <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
-
|
|
|
- <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
|
|
- <div class="item-group">
|
|
|
- <a-row>
|
|
|
- <a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
|
|
|
- <a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </div>
|
|
|
- </a-card>
|
|
|
-
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-tab-pane>
|
|
|
-
|
|
|
- <a-tab-pane tab="交互监管" key="2">
|
|
|
+ <a-tab-pane loading="true" :tab="tab" key="1">
|
|
|
<a-row>
|
|
|
- <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <bar-multid :sourceData="jhjgData" :fields="jhjgFields" title="平台与部门交互量统计"></bar-multid>
|
|
|
- </a-col>
|
|
|
- <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
-
|
|
|
- <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
|
|
- <div class="item-group">
|
|
|
- <a-row>
|
|
|
- <a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
|
|
|
- <a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
+ <a-col :xl="18" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
+ <a-table
|
|
|
+ style="padding-left: 20px;"
|
|
|
+ ref="tableBds"
|
|
|
+ size="small"
|
|
|
+ rowKey="id"
|
|
|
+ :scroll="{ y: 'calc(100vh - 490px)' }"
|
|
|
+ :columns="columnsBds"
|
|
|
+ :loading="loading2"
|
|
|
+ :dataSource="tableDataBds"
|
|
|
+ :pagination="ipagination2"
|
|
|
+ @change="tableChange2">
|
|
|
+
|
|
|
+ <div slot="taskStatus" slot-scope="text, record">
|
|
|
+ <!-- <span v-if="record.taskStatus ==0" style="color: #e91111;">待办</span>
|
|
|
+ <span v-if="record.taskStatus ==1" style="color: #f9c04a;">进行中</span>
|
|
|
+ <span v-if="record.taskStatus ==2" style="color: #18c679;">完成</span> -->
|
|
|
+ <span v-if="record.taskStatus ==0">待办</span>
|
|
|
+ <span v-if="record.taskStatus ==1">进行中</span>
|
|
|
+ <span v-if="record.taskStatus ==2">完成</span>
|
|
|
</div>
|
|
|
- </a-card>
|
|
|
-
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-tab-pane>
|
|
|
-
|
|
|
- <a-tab-pane tab="存储监管" key="4">
|
|
|
- <a-row>
|
|
|
- <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <a-row>
|
|
|
- <template v-if="diskInfo && diskInfo.length>0">
|
|
|
- <a-col :span="12" v-for="(item,index) in diskInfo" :key=" 'diskInfo'+index ">
|
|
|
- <dash-chart-demo :title="item.name" :datasource="item.restPPT"></dash-chart-demo>
|
|
|
- </a-col>
|
|
|
+ </a-table>
|
|
|
+ <!-- <itdm-task-list></itdm-task-list> -->
|
|
|
+ <!-- <index-bar title="受理量统计" /> -->
|
|
|
+ <!-- <a-table :dataSource="dataSource2" size="default" rowKey="id" :columns="columns2" :pagination="ipagination2" @change="tableChange2">
|
|
|
+ <template slot="flowRate" slot-scope="text, record">
|
|
|
+ <span style="color: red;">{{ record.flowRate }}小时</span>
|
|
|
</template>
|
|
|
- </a-row>
|
|
|
+ </a-table> -->
|
|
|
</a-col>
|
|
|
-
|
|
|
- <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
-
|
|
|
- <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
|
|
- <div class="item-group">
|
|
|
- <a-row>
|
|
|
- <a-col :class="'more-btn'" :span="10" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
|
|
|
- <a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
+ <a-col :xl="4" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
+ <a-card title="便捷导航" class="daoHang">
|
|
|
+ <div style="margin-bottom: 15px;">
|
|
|
+ <trend flag>
|
|
|
+ <a slot="term" @click="$router.push({path:'/itdmGongdanMaster/itdmGongdanMasterList'})">拆解工单</a>
|
|
|
+ </trend>
|
|
|
+ </div>
|
|
|
+ <div style="margin-bottom: 15px;">
|
|
|
+ <trend flag>
|
|
|
+ <a slot="term" @click="$router.push({path:'/gongdandetail/itdmGongdanDetailList'})">工单确认</a>
|
|
|
+ </trend>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <trend flag>
|
|
|
+ <a slot="term" @click="$router.push({path:'/gongdanshuju/ItdmGongdanShujuList'})">数据确认</a>
|
|
|
+ </trend>
|
|
|
</div>
|
|
|
</a-card>
|
|
|
|
|
@@ -135,41 +110,6 @@
|
|
|
</div>
|
|
|
</a-card>
|
|
|
|
|
|
- <a-row :gutter="12">
|
|
|
- <a-card :loading="loading" :class="{ 'anty-list-cust':true }" :bordered="false" :style="{ marginTop: '24px' }">
|
|
|
-
|
|
|
- <a-tabs v-model="indexBottomTab" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
|
|
- <div class="extra-wrapper" slot="tabBarExtraContent">
|
|
|
- <a-radio-group v-model="indexRegisterType" @change="changeRegisterType">
|
|
|
- <a-radio-button value="转移登记">转移登记</a-radio-button>
|
|
|
- <a-radio-button value="抵押登记">抵押登记</a-radio-button>
|
|
|
- <a-radio-button value="">所有</a-radio-button>
|
|
|
- </a-radio-group>
|
|
|
- </div>
|
|
|
-
|
|
|
- <a-tab-pane loading="true" tab="业务流程限时监管" key="1">
|
|
|
-
|
|
|
- <a-table :dataSource="dataSource1" size="default" rowKey="id" :columns="columns" :pagination="ipagination1" @change="tableChange1">
|
|
|
- <template slot="flowRate" slot-scope="text, record, index">
|
|
|
- <a-progress :strokeColor="getPercentColor(record.flowRate)" :format="getPercentFormat" :percent="getFlowRateNumber(record.flowRate)" style="width:80px" />
|
|
|
- </template>
|
|
|
- </a-table>
|
|
|
- </a-tab-pane>
|
|
|
-
|
|
|
- <a-tab-pane loading="true" tab="业务节点限时监管" key="2">
|
|
|
- <a-table :dataSource="dataSource2" size="default" rowKey="id" :columns="columns2" :pagination="ipagination2" @change="tableChange2">
|
|
|
- <template slot="flowRate" slot-scope="text, record, index">
|
|
|
- <span style="color: red;">{{ record.flowRate }}小时</span>
|
|
|
- </template>
|
|
|
- </a-table>
|
|
|
- </a-tab-pane>
|
|
|
-
|
|
|
- </a-tabs>
|
|
|
-
|
|
|
-
|
|
|
- </a-card>
|
|
|
- </a-row>
|
|
|
-
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -183,6 +123,9 @@
|
|
|
import IndexBar from '@/components/chart/IndexBar'
|
|
|
import BarMultid from '@/components/chart/BarMultid'
|
|
|
import DashChartDemo from '@/components/chart/DashChartDemo'
|
|
|
+ import Trend from '@/components/Trend'
|
|
|
+ import {listBdc, listBdc2} from '@/api/api'
|
|
|
+import ItdmTaskList from '../module-iTDM/itdmFirstPage/ItdmTaskList.vue'
|
|
|
|
|
|
const jhjgData = [
|
|
|
{ type: '房管', '1月': 900, '2月': 1120, '3月': 1380, '4月': 1480, '5月': 1450, '6月': 1100, '7月':1300, '8月':900,'9月':1000 ,'10月':1200 ,'11月':600 ,'12月':900 },
|
|
@@ -300,11 +243,15 @@
|
|
|
MiniBar,
|
|
|
DashChartDemo,
|
|
|
BarMultid,
|
|
|
- IndexBar
|
|
|
+ IndexBar,
|
|
|
+ Trend,
|
|
|
+ ItdmTaskList
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
loading: true,
|
|
|
+ loading2: false,
|
|
|
+ listBdc: {},
|
|
|
cardCount:{
|
|
|
sll:100,
|
|
|
bjl:87,
|
|
@@ -362,21 +309,78 @@
|
|
|
},
|
|
|
ipagination2:{
|
|
|
current: 1,
|
|
|
- pageSize: 5,
|
|
|
+ pageSize: 10,
|
|
|
pageSizeOptions: ['10', '20', '30'],
|
|
|
showTotal: (total, range) => {
|
|
|
return range[0] + "-" + range[1] + " 共" + total + "条"
|
|
|
},
|
|
|
showQuickJumper: true,
|
|
|
- showSizeChanger: true,
|
|
|
+ // showSizeChanger: true,
|
|
|
total: 0,
|
|
|
},
|
|
|
indexRegisterType:"转移登记",
|
|
|
- indexBottomTab:"1"
|
|
|
+ indexBottomTab:"1",
|
|
|
+ // 任务列表
|
|
|
+ columnsBds: [
|
|
|
+ { title:'委托单位', align:"center", dataIndex: 'weituoClient' },
|
|
|
+ { title:'委托编号', align:"center", dataIndex: 'weituoNo' },
|
|
|
+ { title:'内容', align:"center", dataIndex: 'taskContent' },
|
|
|
+ { title:'待办角色', align:"center", dataIndex: 'taskRole' },
|
|
|
+ { title:'待办人员', align:"center", dataIndex: 'taskUser' },
|
|
|
+ { title:'任务状态', align:"center", dataIndex: 'taskStatus', scopedSlots: { customRender: 'taskStatus' } },
|
|
|
+ // { title:'关联委托id', align:"center", dataIndex: 'weituoId_dictText' },
|
|
|
+ ],
|
|
|
+ tableDataBds: [],
|
|
|
+ tab: '所有任务',
|
|
|
+ queryParam: {
|
|
|
+ taskStatus: '',
|
|
|
+ },
|
|
|
|
|
|
}
|
|
|
},
|
|
|
+ created() {
|
|
|
+ this.getListBdc()
|
|
|
+ this.zhengchang()
|
|
|
+ // this.loadDataSource1()
|
|
|
+ // this.loadDataSource2()
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = !this.loading
|
|
|
+ }, 1000)
|
|
|
+ },
|
|
|
methods:{
|
|
|
+ // 获取首页数据
|
|
|
+ getListBdc(){
|
|
|
+ listBdc().then( res => {
|
|
|
+ console.log(11111,res)
|
|
|
+ this.listBdc = res
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取首页列表
|
|
|
+ zhengchang(num){
|
|
|
+ console.log(num)
|
|
|
+ this.loading2 = true
|
|
|
+ if (num == undefined) {
|
|
|
+ this.tab = '所有任务'
|
|
|
+ this.queryParam.taskStatus = ''
|
|
|
+ }
|
|
|
+ if (num == 0) {
|
|
|
+ this.tab = '待办'
|
|
|
+ this.queryParam.taskStatus = 0
|
|
|
+ }
|
|
|
+ if (num == 1) {
|
|
|
+ this.tab = '进行中'
|
|
|
+ this.queryParam.taskStatus = 1
|
|
|
+ }
|
|
|
+ if (num == 2) {
|
|
|
+ this.tab = '完成'
|
|
|
+ this.queryParam.taskStatus = 2
|
|
|
+ }
|
|
|
+ listBdc2(this.queryParam).then( res => {
|
|
|
+ console.log(2222,res)
|
|
|
+ this.tableDataBds = res.result
|
|
|
+ this.loading2 = false
|
|
|
+ })
|
|
|
+ },
|
|
|
goPage(){
|
|
|
this.$message.success("根据业务自行处理跳转页面!")
|
|
|
},
|
|
@@ -391,12 +395,13 @@
|
|
|
tableChange1(pagination){
|
|
|
this.ipagination1.current = pagination.current
|
|
|
this.ipagination1.pageSize = pagination.pageSize
|
|
|
- this.queryTimeoutInfo()
|
|
|
+ // this.queryTimeoutInfo()
|
|
|
},
|
|
|
tableChange2(pagination){
|
|
|
this.ipagination2.current = pagination.current
|
|
|
this.ipagination2.pageSize = pagination.pageSize
|
|
|
- this.queryNodeTimeoutInfo()
|
|
|
+ // this.queryNodeTimeoutInfo()
|
|
|
+ this.zhengchang()
|
|
|
},
|
|
|
getFlowRateNumber(value){
|
|
|
return Number(value)
|
|
@@ -435,18 +440,76 @@
|
|
|
return item.type==this.indexRegisterType
|
|
|
})
|
|
|
}
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.loadDataSource1()
|
|
|
- this.loadDataSource2()
|
|
|
- setTimeout(() => {
|
|
|
- this.loading = !this.loading
|
|
|
- }, 1000)
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
+::v-deep .total{
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+ .recent{
|
|
|
+ position: absolute;
|
|
|
+ top: 25%;
|
|
|
+ left: 42%;
|
|
|
+ }
|
|
|
+ .recent2{
|
|
|
+ position: absolute;
|
|
|
+ top: 25%;
|
|
|
+ left: 26%;
|
|
|
+ }
|
|
|
+ .recent3{
|
|
|
+ position: absolute;
|
|
|
+ top: 25%;
|
|
|
+ left: 34%;
|
|
|
+ }
|
|
|
+ .numRecent{
|
|
|
+ height: 30%;
|
|
|
+ width: 40%;
|
|
|
+ // background-color: aquamarine;
|
|
|
+ position: absolute;
|
|
|
+ top: 12%;
|
|
|
+ right: 10%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ .daoHang {
|
|
|
+ width: 300px;
|
|
|
+ height: 200px;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-left: 40px;
|
|
|
+ }
|
|
|
+ ::v-deep .ant-card{
|
|
|
+ border-radius: 10px !important;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ }
|
|
|
+ ::v-deep .ant-card-head{
|
|
|
+ background-color: #c2e6ff85;
|
|
|
+ border-radius: 10px !important;
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+ .suoyou{
|
|
|
+ box-shadow: 0 10px 15px rgba(212, 211, 212, 0.445);
|
|
|
+ }
|
|
|
+ .daiban{
|
|
|
+ background-color: rgb(255, 246, 246);
|
|
|
+ box-shadow: 0 10px 15px rgba(255, 208, 208, 0.552);
|
|
|
+ }
|
|
|
+ // .daiban:hover {
|
|
|
+ // // box-shadow: 0 16px 32px 0 rgba(48, 55, 66, 0.15);/* 盒子悬浮时阴影 */
|
|
|
+ // // box-shadow: 0 10px 15px rgba(255, 182, 182, 0.552);
|
|
|
+ // }
|
|
|
+ .jinxing{
|
|
|
+ background-color: rgb(255, 253, 244);
|
|
|
+ box-shadow: 0 10px 15px rgba(254, 233, 189, 0.552);
|
|
|
+ }
|
|
|
+ .wancheng{
|
|
|
+ background-color: rgb(250, 253, 244);
|
|
|
+ box-shadow: 0 10px 15px rgba(194, 228, 205, 0.515);
|
|
|
+ }
|
|
|
+ // .list {
|
|
|
+ // height: 480px;
|
|
|
+ // }
|
|
|
.extra-wrapper {
|
|
|
line-height: 55px;
|
|
|
padding-right: 24px;
|