Commit 88e156d1 authored by “yiyousong”'s avatar “yiyousong”

fix:修复页面

parent 0bc6ad56
...@@ -56,7 +56,7 @@ export default { ...@@ -56,7 +56,7 @@ export default {
} }
menuList(obj).then((res) => { menuList(obj).then((res) => {
// console.log(res); // console.log(res);
let { code, data, dict } = res.data; let { code, data, dict } = res;
if (code == 1) { if (code == 1) {
data.data = data.data.map((item) => { data.data = data.data.map((item) => {
this.menuRouterList.forEach((v) => { this.menuRouterList.forEach((v) => {
......
...@@ -31,13 +31,16 @@ ...@@ -31,13 +31,16 @@
/> />
</a-form-model-item> </a-form-model-item>
<a-form-model-item> <a-form-model-item>
<a-button type="primary" class="addclass" @click="getList"> 开始分析 </a-button> <a-button type="primary" class="addclass" @click="getList">
开始分析
</a-button>
</a-form-model-item> </a-form-model-item>
</a-form-model> </a-form-model>
<div class="mt20"> <div class="mt20">
<a-table <a-table
:columns="columns" :columns="columns"
:data-source="data" :data-source="data"
:loading="loading"
:scroll="{ y: 590 }" :scroll="{ y: 590 }"
:pagination="false" :pagination="false"
> >
...@@ -49,9 +52,9 @@ ...@@ -49,9 +52,9 @@
<script> <script>
import { getEventCensus } from "@/api/dataActuary.js"; import { getEventCensus } from "@/api/dataActuary.js";
import moment from "moment"; import moment from "moment";
import product from "../mixins/product" import product from "../mixins/product";
export default { export default {
mixins:[product], mixins: [product],
data() { data() {
return { return {
queryform: { queryform: {
...@@ -101,6 +104,7 @@ export default { ...@@ -101,6 +104,7 @@ export default {
}, },
], ],
data: [], data: [],
loading: false,
}; };
}, },
mounted() { mounted() {
...@@ -108,10 +112,12 @@ export default { ...@@ -108,10 +112,12 @@ export default {
}, },
methods: { methods: {
getList() { getList() {
this.loading = true;
this.queryform.dateTimeStart = this.time ? this.time[0] : null; this.queryform.dateTimeStart = this.time ? this.time[0] : null;
this.queryform.dateTimeStart = this.time ? this.time[1] : null; this.queryform.dateTimeStart = this.time ? this.time[1] : null;
getEventCensus(this.queryform).then((res) => { getEventCensus(this.queryform).then((res) => {
this.data = res.data.data; this.data = res.data.data;
this.loading = false;
}); });
}, },
}, },
......
<template> <template>
<!-- 信息流分析 --> <!-- 信息流分析 -->
<div class="page"> <div class="page">
<a-form-model :model="queryform" :label-col="labelCol" :wrapper-col="wrapperCol" layout="inline"> <a-form-model
<a-form-model-item> :model="queryform"
<a-select v-model="queryform.productId" style="width: 200px" placeholder="选择产品"> :label-col="labelCol"
<a-select-option :value="item.id" v-for="(item,index) in product" :key="index"> :wrapper-col="wrapperCol"
{{item.title}} layout="inline"
</a-select-option> >
</a-select> <a-form-model-item>
</a-form-model-item> <a-select
<a-form-model-item> v-model="queryform.productId"
<a-date-picker valueFormat="yyyy-MM-DD" v-model="time" style="width: 200px" :allowClear="false"/> style="width: 200px"
</a-form-model-item> placeholder="选择产品"
<a-form-model-item> >
<a-select v-model="queryform.particleType" style="width: 200px" placeholder="选择时间粒度"> <a-select-option
<a-select-option value="1">10分钟</a-select-option> :value="item.id"
<a-select-option value="2">30分钟</a-select-option> v-for="(item, index) in product"
<a-select-option value="3">1小时</a-select-option> :key="index"
</a-select> >
</a-form-model-item> {{ item.title }}
<a-form-model-item> </a-select-option>
<a-select v-model="queryform.value" style="width: 200px" placeholder="选择一级场景"> </a-select>
</a-form-model-item>
</a-select> <a-form-model-item>
</a-form-model-item> <a-date-picker
<a-form-model-item> valueFormat="yyyy-MM-DD"
<a-select v-model="queryform.value" style="width: 200px" placeholder="选择二级场景"> v-model="time"
style="width: 200px"
</a-select> :allowClear="false"
</a-form-model-item> />
<a-form-model-item> </a-form-model-item>
<a-select v-model="queryform.value" style="width: 200px" placeholder="选择三级场景"> <a-form-model-item>
<a-select
</a-select> v-model="queryform.particleType"
</a-form-model-item> style="width: 200px"
<a-form-model-item> placeholder="选择时间粒度"
<a-button type="primary" class="addclass" @click="getData"> >
开始分析 <a-select-option value="1">10分钟</a-select-option>
</a-button> <a-select-option value="2">30分钟</a-select-option>
</a-form-model-item> <a-select-option value="3">1小时</a-select-option>
</a-form-model> </a-select>
<div class="table-box"> </a-form-model-item>
<div class="mb"> <a-form-model-item>
<span style="margin-right: 30px;">指标筛选</span> <a-select
<a-checkbox-group @change="changeIndex" v-model="indexList"> v-model="queryform.value"
<a-checkbox value="accessCount">访问人数</a-checkbox> style="width: 200px"
<a-checkbox value="accessCount1">打开次数</a-checkbox> placeholder="选择一级场景"
<a-checkbox value="pageDepth">访问页面数</a-checkbox> >
</a-checkbox-group> </a-select>
</div> </a-form-model-item>
<div class="mb"> <a-form-model-item>
<span style="margin-right: 30px;">对比筛选</span> <a-select
<a-checkbox @change="onChange"> v-model="queryform.value"
日对比 style="width: 200px"
</a-checkbox> placeholder="选择二级场景"
</div> >
<a-table :columns="columns" :data-source="data" :scroll="{ y: 590 }" :pagination="false"> </a-select>
<template slot="访问人数" slot-scope="text, record, index"> </a-form-model-item>
<div>{{record.accessCount}}</div> <a-form-model-item>
<div v-show="queryform.isRatio == 1">日对比:{{(record.accessRatio * 100).toFixed(2)}}%</div> <a-select
</template> v-model="queryform.value"
<template slot="打开次数" slot-scope="text, record, index"> style="width: 200px"
<div>{{record.accessCount}}</div> placeholder="选择三级场景"
<div v-show="queryform.isRatio == 1">日对比:{{(record.accessRatio * 100).toFixed(2)}}%</div> >
</template> </a-select>
<template slot="访问页面数" slot-scope="text, record, index"> </a-form-model-item>
<div>{{record.pageDepth}}</div> <a-form-model-item>
<div v-show="queryform.isRatio == 1">日对比:{{(record.depthRatio * 100).toFixed(2)}}%</div> <a-button type="primary" class="addclass" @click="getData">
</template> 开始分析
</a-table> </a-button>
</div> </a-form-model-item>
</a-form-model>
</div> <div class="table-box">
<div class="mb">
<span style="margin-right: 30px">指标筛选</span>
<a-checkbox-group @change="changeIndex" v-model="indexList">
<a-checkbox value="accessCount">访问人数</a-checkbox>
<a-checkbox value="accessCount1">打开次数</a-checkbox>
<a-checkbox value="pageDepth">访问页面数</a-checkbox>
</a-checkbox-group>
</div>
<div class="mb">
<span style="margin-right: 30px">对比筛选</span>
<a-checkbox @change="onChange"> 日对比 </a-checkbox>
</div>
<a-table
:columns="columns"
:data-source="data"
:scroll="{ y: 590 }"
:pagination="false"
:loading="loading"
>
<template slot="访问人数" slot-scope="text, record, index">
<div>{{ record.accessCount }}</div>
<div v-show="queryform.isRatio == 1">
日对比:{{ (record.accessRatio * 100).toFixed(2) }}%
</div>
</template>
<template slot="打开次数" slot-scope="text, record, index">
<div>{{ record.accessCount }}</div>
<div v-show="queryform.isRatio == 1">
日对比:{{ (record.accessRatio * 100).toFixed(2) }}%
</div>
</template>
<template slot="访问页面数" slot-scope="text, record, index">
<div>{{ record.pageDepth }}</div>
<div v-show="queryform.isRatio == 1">
日对比:{{ (record.depthRatio * 100).toFixed(2) }}%
</div>
</template>
</a-table>
</div>
</div>
</template> </template>
<script> <script>
import {getInformationFlow} from '@/api/dataActuary.js' import { getInformationFlow } from "@/api/dataActuary.js";
import moment from 'moment'; import moment from "moment";
import product from "../mixins/product" import product from "../mixins/product";
export default { export default {
mixins:[product], mixins: [product],
data() { data() {
return { return {
queryform: { queryform: {
productId: 1, productId: 1,
dateTimeStart:moment().format('yyyy-MM-DD'), dateTimeStart: moment().format("yyyy-MM-DD"),
dateTimeEnd:moment().format('yyyy-MM-DD'), dateTimeEnd: moment().format("yyyy-MM-DD"),
particleType:'1', particleType: "1",
isRatio:0 isRatio: 0,
}, },
time:moment().format('yyyy-MM-DD'), time: moment().format("yyyy-MM-DD"),
product:[{ product: [
title:'排队机', {
id:1 title: "排队机",
}], id: 1,
indexList:['accessCount','accessCount1','pageDepth'], },
labelCol: { ],
span: 1 indexList: ["accessCount", "accessCount1", "pageDepth"],
}, labelCol: {
wrapperCol: { span: 1,
span: 14 },
}, wrapperCol: {
columns: [{ span: 14,
title: "序号", },
width: "70px", columns: [
dataIndex: 'index', {
customRender: (text, record, index) => `${index+1}`, title: "序号",
align: "center", width: "70px",
}, dataIndex: "index",
{ customRender: (text, record, index) => `${index + 1}`,
title: "时间", align: "center",
dataIndex: "dateStr", },
align: "center", {
}, title: "时间",
{ dataIndex: "dateStr",
title: '产品名称', align: "center",
dataIndex: 'productName', },
align: "center", {
}, title: "产品名称",
{ dataIndex: "productName",
title: '一级场景', align: "center",
dataIndex: 'firstName', },
align: "center", {
}, title: "一级场景",
{ dataIndex: "firstName",
title: '二级场景', align: "center",
dataIndex: 'secondName', },
align: "center", {
}, title: "二级场景",
{ dataIndex: "secondName",
title: '三级场景', align: "center",
dataIndex: 'thirdName', },
align: "center", {
},{ title: "三级场景",
title: '访问人数', dataIndex: "thirdName",
dataIndex: 'accessCount', align: "center",
align: "center", },
scopedSlots: { {
customRender: "访问人数", title: "访问人数",
}, dataIndex: "accessCount",
},{ align: "center",
title: '打开次数', scopedSlots: {
dataIndex: 'accessCount1', customRender: "访问人数",
align: "center", },
scopedSlots: { },
customRender: "打开次数", {
}, title: "打开次数",
},{ dataIndex: "accessCount1",
title: '访问页面数', align: "center",
dataIndex: 'pageDepth', scopedSlots: {
align: "center", customRender: "打开次数",
scopedSlots: { },
customRender: "访问页面数", },
}, {
} title: "访问页面数",
], dataIndex: "pageDepth",
data: [], align: "center",
pagination: { scopedSlots: {
total: 0, customRender: "访问页面数",
pageSize: 10, //每页中显示10条数据 },
showSizeChanger: true, },
pageSizeOptions: ["10", "20", "50", "100"], //每页中显示的数据 ],
showTotal: total => `共有 ${total} 条数据`, //分页中显示总的数据 data: [],
}, pagination: {
filterColumns:[] total: 0,
} pageSize: 10, //每页中显示10条数据
}, showSizeChanger: true,
mounted() { pageSizeOptions: ["10", "20", "50", "100"], //每页中显示的数据
this.filterColumns = this.columns showTotal: (total) => `共有 ${total} 条数据`, //分页中显示总的数据
this.getData() },
}, filterColumns: [],
methods:{ loading: false,
onChange(e){ };
this.queryform.isRatio = e.target.checked ? 1 : 0 },
this.getData() mounted() {
}, this.filterColumns = this.columns;
changeIndex(e) { this.getData();
e = e.concat(['index','dateStr','productName','firstName','secondName','thirdName']) },
let columns = JSON.parse(JSON.stringify(this.filterColumns)) methods: {
this.columns = columns.filter(item=> e.some(items=> item.dataIndex == items)) onChange(e) {
}, this.queryform.isRatio = e.target.checked ? 1 : 0;
getData() { this.getData();
this.queryform.dateTimeStart = this.time ? this.time : null },
this.queryform.dateTimeStart = this.time ? this.time : null changeIndex(e) {
getInformationFlow(this.queryform).then(res=>{ e = e.concat([
this.data = res.data "index",
}) "dateStr",
}, "productName",
} "firstName",
}; "secondName",
"thirdName",
]);
let columns = JSON.parse(JSON.stringify(this.filterColumns));
this.columns = columns.filter((item) =>
e.some((items) => item.dataIndex == items)
);
},
getData() {
this.loading = true;
this.queryform.dateTimeStart = this.time ? this.time : null;
this.queryform.dateTimeStart = this.time ? this.time : null;
getInformationFlow(this.queryform).then((res) => {
this.data = res.data;
this.loading = false;
});
},
},
};
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.page { .page {
height: calc(100% - 50px); height: calc(100% - 50px);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/deep/.ant-form { /deep/.ant-form {
padding: 15px; padding: 15px;
} }
.table-box { .table-box {
padding: 0 15px; padding: 0 15px;
.mb{ .mb {
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
} }
</style> </style>
\ No newline at end of file
...@@ -53,7 +53,8 @@ export default { ...@@ -53,7 +53,8 @@ export default {
<style lang="less" scoped> <style lang="less" scoped>
@headerH: 4.5rem; @headerH: 4.5rem;
.Container { .Container {
height: 100% !important; width: 100%;
height: auto !important;
// background: #fac; // background: #fac;
background: #f5f5f5; background: #f5f5f5;
display: flex; display: flex;
...@@ -103,8 +104,8 @@ export default { ...@@ -103,8 +104,8 @@ export default {
margin-left: 0.7rem !important; margin-left: 0.7rem !important;
} }
} }
/deep/.ant-tabs-bar{ /deep/.ant-tabs-bar {
margin: 0; margin: 0;
} }
} }
</style> </style>
......
...@@ -167,11 +167,9 @@ export default { ...@@ -167,11 +167,9 @@ export default {
}); });
}, },
getList() { getList() {
this.queryform.dateTimeStart = this.time ? this.time[0] : null; this.queryform.dateTimeStart = this.time ? this.time[0] : null;
this.queryform.dateTimeStart = this.time ? this.time[1] : null; this.queryform.dateTimeStart = this.time ? this.time[1] : null;
getProductHotCensus(this.queryform).then((res) => { getProductHotCensus(this.queryform).then((res) => {
console.log(res);
this.clickSum = res.data.clickSum; this.clickSum = res.data.clickSum;
this.data = res.data.top10List; this.data = res.data.top10List;
this.img = this.img =
......
<template> <template>
<div> <div>
<a-card :bordered="false" class="mb_15"> <a-card :bordered="false" class="mb_15">
<template slot="title"> <template slot="title">
<div class="head"> <div class="head">
<div class="head_title">整体情况</div> <div class="head_title">整体情况</div>
<div class="head_desc">更新时间:{{ nowDate }}</div> <div class="head_desc">更新时间:{{ nowDate }}</div>
</div> </div>
</template> </template>
<a-row type="flex" align="middle"> <a-row type="flex" align="middle">
<a-col :span="4"> <a-col :span="4">
<div class="f_40 f_center warning">{{ situation.lev1_nums }}</div> <div class="f_40 f_center warning">{{ situation.lev1_nums }}</div>
<div class="f_center">一级业务总量</div> <div class="f_center">一级业务总量</div>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-row type="flex" align="middle"> <a-row type="flex" align="middle">
<a-col :span="12"> <a-col :span="12">
<div class="f_40 f_center success">{{ situation.lev1_not_child_nums }}</div> <div class="f_40 f_center success">
<div class="f_center">一级业务(无子业务)</div> {{ situation.lev1_not_child_nums }}
</a-col> </div>
<a-col :span="12"> <div class="f_center">一级业务(无子业务)</div>
<Pie </a-col>
:id="`one_pie`" <a-col :span="12">
:height=200 <Pie
:width=200 :id="`one_pie`"
:datas="firstPie" :height="200"
/> :width="200"
</a-col> :datas="firstPie"
</a-row> />
</a-col> </a-col>
<a-col :span="12"> </a-row>
<a-row type="flex" align="middle"> </a-col>
<a-col :span="8"> <a-col :span="12">
<div class="f_40 f_center prima">{{ situation.lev1_has_child_nums }}</div> <a-row type="flex" align="middle">
<div class=" f_center">一级业务(有子业务)</div> <a-col :span="8">
</a-col> <div class="f_40 f_center prima">
<a-col :span="8"> {{ situation.lev1_has_child_nums }}
<div class="f_40 f_center prima">{{ situation.child_nums }}</div> </div>
<div class=" f_center">子级业务</div> <div class="f_center">一级业务(有子业务)</div>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<Pie <div class="f_40 f_center prima">{{ situation.child_nums }}</div>
:id="`two_pie`" <div class="f_center">子级业务</div>
:height=200 </a-col>
:width=200 <a-col :span="8">
:datas="secondPie" <Pie
/> :id="`two_pie`"
</a-col> :height="200"
</a-row> :width="200"
</a-col> :datas="secondPie"
</a-row> />
</a-card> </a-col>
<a-card :bordered="false" class="mb_15"> </a-row>
<template slot="title"> </a-col>
<div class="head"> </a-row>
<div class="head_title">排队取号情况</div> </a-card>
<div class="head_desc"></div> <a-card :bordered="false" class="mb_15">
</div> <template slot="title">
</template> <div class="head">
<a-row type="flex" align="middle"> <div class="head_title">排队取号情况</div>
<a-col :span="4"> <div class="head_desc"></div>
<a-row> </div>
<a-col :span="12"> </template>
<div class="f_20 f_center success">{{ takeLineTotal }}</div> <a-row type="flex" align="middle">
<div class="f_center">排队业务总量</div> <a-col :span="4">
</a-col> <a-row>
<a-col :span="12"> <a-col :span="12">
<div class="f_20 f_center success">{{ noTakeLine }}</div> <div class="f_20 f_center success">{{ takeLineTotal }}</div>
<div class="f_center">未排队业务</div> <div class="f_center">排队业务总量</div>
</a-col> </a-col>
</a-row> <a-col :span="12">
<Pie <div class="f_20 f_center success">{{ noTakeLine }}</div>
:id="`three_pie`" <div class="f_center">未排队业务</div>
:height="200" </a-col>
:width="280" </a-row>
:datas="thirdPie" <Pie :id="`three_pie`" :height="200" :width="280" :datas="thirdPie" />
/> </a-col>
</a-col> <a-col :span="20">
<a-col :span="20"> <div class="table_title">排队业务分布情况</div>
<div class="table_title">排队业务分布情况</div> <a-table
<a-table :row-key="(record,index) => index" :dataSource="lineUp" :columns="lineUpColumns" :pagination="false" :scroll="{ x: 1400, y: 0 }"/> :row-key="(record, index) => index"
</a-col> :dataSource="lineUp"
</a-row> :columns="lineUpColumns"
</a-card> :pagination="false"
<a-card :bordered="false" class="mb_15"> :scroll="{ x: 1400, y: 0 }"
<template slot="title"> />
<div class="head"> </a-col>
<div class="head_title">预约情况</div> </a-row>
<div class="head_desc"></div> </a-card>
</div> <a-card :bordered="false" class="mb_15">
</template> <template slot="title">
<a-row type="flex" align="middle"> <div class="head">
<a-col :span="4"> <div class="head_title">预约情况</div>
<a-row> <div class="head_desc"></div>
<a-col :span="12"> </div>
<div class="f_20 f_center success">{{ appointmentTotal }}</div> </template>
<div class="f_center">预约业务总量</div> <a-row type="flex" align="middle">
</a-col> <a-col :span="4">
<a-col :span="12"> <a-row>
<div class="f_20 f_center success">{{ noAppointment }}</div> <a-col :span="12">
<div class="f_center">未预约业务</div> <div class="f_20 f_center success">{{ appointmentTotal }}</div>
</a-col> <div class="f_center">预约业务总量</div>
</a-row> </a-col>
<Pie <a-col :span="12">
:id="`four_pie`" <div class="f_20 f_center success">{{ noAppointment }}</div>
:height="200" <div class="f_center">未预约业务</div>
:width="280" </a-col>
:datas="fourthPie" </a-row>
/> <Pie :id="`four_pie`" :height="200" :width="280" :datas="fourthPie" />
</a-col> </a-col>
<a-col :span="20"> <a-col :span="20">
<div>预约业务分布情况</div> <div>预约业务分布情况</div>
<a-table :row-key="(record,index) => index" :dataSource="appointment" :columns="appointmentColumns" :pagination="false" :scroll="{ x: 1400, y: 0 }"/> <a-table
</a-col> :row-key="(record, index) => index"
</a-row> :dataSource="appointment"
</a-card> :columns="appointmentColumns"
<a-row> :pagination="false"
<a-col :span="12"> :scroll="{ x: 1400, y: 0 }"
<a-card :bordered="false" class="mb_15" style="margin-right: .625rem; min-height: 44.125rem"> />
<template slot="title"> </a-col>
<div class="head"> </a-row>
<div class="head_title">取号最多业务Top10</div> </a-card>
</div> <a-row>
</template> <a-col :span="12">
<template #extra> <a-card
<a-select :bordered="false"
ref="select" class="mb_15"
v-model="takeNumberTopDate" style="margin-right: 0.625rem; min-height: 44.125rem"
:options="options" >
style="width: 120px" <template slot="title">
@change="changeTakeNumberTopDate" <div class="head">
> <div class="head_title">取号最多业务Top10</div>
</a-select> </div>
</template> </template>
<a-table :row-key="(record,index) => index" :dataSource="takeNumberTop" :columns="takeNumberTopColumns" :pagination="false"> <template #extra>
<span slot="index" slot-scope="text, record, index"> <a-select
{{ index + 1 }} ref="select"
</span> v-model="takeNumberTopDate"
<span slot="nums" slot-scope="text, record, index" style="display: flex;"> :options="options"
<a-progress :percent="text" :showInfo="false" strokeColor="#87d068"/> style="width: 120px"
<div style="min-width: 3.125rem;text-align: right;">{{ text }}件</div> @change="changeTakeNumberTopDate"
</span> >
</a-table> </a-select>
</a-card> </template>
</a-col> <a-table
<a-col :span="12"> :row-key="(record, index) => index"
<a-card :bordered="false" class="mb_15" style="margin-left: .625rem; min-height: 44.125rem"> :dataSource="takeNumberTop"
<template slot="title"> :columns="takeNumberTopColumns"
<div class="head"> :pagination="false"
<div class="head_title">预约最多业务Top10</div> >
</div> <span slot="index" slot-scope="text, record, index">
</template> {{ index + 1 }}
<template #extra> </span>
<a-select <span
ref="select" slot="nums"
v-model="appointmentTopDate" slot-scope="text, record, index"
:options="options" style="display: flex"
style="width: 120px" >
@change="changeAppointmentTopDate" <a-progress
> :percent="text"
</a-select> :showInfo="false"
</template> strokeColor="#87d068"
<a-table :row-key="(record,index) => index" :dataSource="appointmentTop" :columns="appointmentTopColumns" :pagination="false"> />
<span slot="index" slot-scope="text, record, index"> <div style="min-width: 3.125rem; text-align: right">
{{ index + 1 }} {{ text }}件
</span> </div>
<span slot="nums" slot-scope="text, record, index" style="display: flex;"> </span>
<a-progress :percent="text" :showInfo="false" strokeColor="#87d068"/> </a-table>
<div style="min-width: 3.125rem;text-align: right;">{{ text }}件</div> </a-card>
</span> </a-col>
</a-table> <a-col :span="12">
</a-card> <a-card
</a-col> :bordered="false"
</a-row> class="mb_15"
<a-row> style="margin-left: 0.625rem; min-height: 44.125rem"
<a-col :span="12"> >
<a-card :bordered="false" class="mb_15" style="margin-right: .625rem; min-height: 44.125rem"> <template slot="title">
<template slot="title"> <div class="head">
<div class="head"> <div class="head_title">预约最多业务Top10</div>
<div class="head_title">取号最少业务Top10</div> </div>
</div> </template>
</template> <template #extra>
<template #extra> <a-select
<a-select ref="select"
ref="select" v-model="appointmentTopDate"
v-model="takeNumberLessDate" :options="options"
:options="options" style="width: 120px"
style="width: 120px" @change="changeAppointmentTopDate"
@change="changeTakeNumberLessDate" >
> </a-select>
</a-select> </template>
</template> <a-table
<a-table :row-key="(record,index) => index" :dataSource="takeNumberLess" :columns="takeNumberLessColumns" :pagination="false"> :row-key="(record, index) => index"
<span slot="index" slot-scope="text, record, index"> :dataSource="appointmentTop"
{{ index + 1 }} :columns="appointmentTopColumns"
</span> :pagination="false"
<span slot="nums" slot-scope="text, record, index" style="display: flex;"> >
<a-progress :percent="text" :showInfo="false" strokeColor="#87d068"/> <span slot="index" slot-scope="text, record, index">
<div style="min-width: 3.125rem;text-align: right;">{{ text }}件</div> {{ index + 1 }}
</span> </span>
</a-table> <span
</a-card> slot="nums"
</a-col> slot-scope="text, record, index"
<a-col :span="12"> style="display: flex"
<a-card :bordered="false" class="mb_15" style="margin-left: .625rem; min-height: 44.125rem"> >
<template slot="title"> <a-progress
<div class="head"> :percent="text"
<div class="head_title">预约最少业务Top10</div> :showInfo="false"
</div> strokeColor="#87d068"
</template> />
<template #extra> <div style="min-width: 3.125rem; text-align: right">
<a-select {{ text }}件
ref="select" </div>
v-model="appointmentLessDate" </span>
:options="options" </a-table>
style="width: 120px" </a-card>
@change="changeAppointmentLessDate" </a-col>
> </a-row>
</a-select> <a-row>
</template> <a-col :span="12">
<a-table :row-key="(record,index) => index" :dataSource="appointmentLess" :columns="appointmentLessColumns" :pagination="false"> <a-card
<span slot="index" slot-scope="text, record, index"> :bordered="false"
{{ index + 1 }} class="mb_15"
</span> style="margin-right: 0.625rem; min-height: 44.125rem"
<span slot="nums" slot-scope="text, record, index" style="display: flex;"> >
<a-progress :percent="text" :showInfo="false" strokeColor="#87d068"/> <template slot="title">
<div style="min-width: 3.125rem;text-align: right;">{{ text }}件</div> <div class="head">
</span> <div class="head_title">取号最少业务Top10</div>
</a-table> </div>
</a-card> </template>
</a-col> <template #extra>
</a-row> <a-select
</div> ref="select"
v-model="takeNumberLessDate"
:options="options"
style="width: 120px"
@change="changeTakeNumberLessDate"
>
</a-select>
</template>
<a-table
:row-key="(record, index) => index"
:dataSource="takeNumberLess"
:columns="takeNumberLessColumns"
:pagination="false"
>
<span slot="index" slot-scope="text, record, index">
{{ index + 1 }}
</span>
<span
slot="nums"
slot-scope="text, record, index"
style="display: flex"
>
<a-progress
:percent="text"
:showInfo="false"
strokeColor="#87d068"
/>
<div style="min-width: 3.125rem; text-align: right">
{{ text }}件
</div>
</span>
</a-table>
</a-card>
</a-col>
<a-col :span="12">
<a-card
:bordered="false"
class="mb_15"
style="margin-left: 0.625rem; min-height: 44.125rem"
>
<template slot="title">
<div class="head">
<div class="head_title">预约最少业务Top10</div>
</div>
</template>
<template #extra>
<a-select
ref="select"
v-model="appointmentLessDate"
:options="options"
style="width: 120px"
@change="changeAppointmentLessDate"
>
</a-select>
</template>
<a-table
:row-key="(record, index) => index"
:dataSource="appointmentLess"
:columns="appointmentLessColumns"
:pagination="false"
>
<span slot="index" slot-scope="text, record, index">
{{ index + 1 }}
</span>
<span
slot="nums"
slot-scope="text, record, index"
style="display: flex"
>
<a-progress
:percent="text"
:showInfo="false"
strokeColor="#87d068"
/>
<div style="min-width: 3.125rem; text-align: right">
{{ text }}件
</div>
</span>
</a-table>
</a-card>
</a-col>
</a-row>
</div>
</template> </template>
<script > <script >
import Pie from "../Component/emptyPie/index.vue" import Pie from "../Component/emptyPie/index.vue";
import axios from 'axios' import axios from "axios";
import {getAllInfo,getBusinessInfo,getWyInfo,getTopBusiness,getTopWy} from '@/api/dataActuary.js' import {
import moment from "moment" getAllInfo,
export default { getBusinessInfo,
components:{ getWyInfo,
Pie getTopBusiness,
}, getTopWy,
data(){ } from "@/api/dataActuary.js";
return{ import moment from "moment";
nowDate: '', export default {
// 基本情况 components: {
situation: {}, Pie,
// 第一个饼状图 },
firstPie: {}, data() {
// 第二个饼状图 return {
secondPie: {}, nowDate: "",
// 第三个饼状图 // 基本情况
thirdPie: {}, situation: {},
// 第四个饼状图 // 第一个饼状图
fourthPie: {}, firstPie: {},
takeLineTotal: '', // 排队业务总数 // 第二个饼状图
noTakeLine: '', // 未排队业务 secondPie: {},
appointmentTotal: '', // 预约业务总数 // 第三个饼状图
noAppointment: '', // 未预约业务 thirdPie: {},
// 下拉框选项 // 第四个饼状图
options:[ fourthPie: {},
{ takeLineTotal: "", // 排队业务总数
value: '0', noTakeLine: "", // 未排队业务
label: '今天', appointmentTotal: "", // 预约业务总数
}, noAppointment: "", // 未预约业务
{ // 下拉框选项
value: '1', options: [
label: '近7日', {
}, value: "0",
{ label: "今天",
value: '2', },
label: '近30日', {
}, value: "1",
{ label: "近7日",
value: '3', },
label: '近3个月', {
}, value: "2",
{ label: "近30日",
value: '4', },
label: '本年度', {
}, value: "3",
], label: "近3个月",
// 排队表格数据 },
lineUp:[ {
{ value: "4",
key: '1', label: "本年度",
info: '绑定一级业务数量', },
title: '排队机名称', ],
}, // 排队表格数据
{ lineUp: [
key: '2', {
info: '占比', key: "1",
title: '排队机名称', info: "绑定一级业务数量",
}, title: "排队机名称",
{ },
key: '3', {
info: '绑定二级业务数量', key: "2",
title: '排队机名称', info: "占比",
}, title: "排队机名称",
{ },
key: '4', {
info: '占比', key: "3",
title: '排队机名称', info: "绑定二级业务数量",
}, title: "排队机名称",
], },
// 排队表格列 {
lineUpColumns:[ key: "4",
{ info: "占比",
key: 'key', title: "排队机名称",
title: '排队机名称', },
width: 200, ],
dataIndex: 'info', // 排队表格列
fixed: 'left' lineUpColumns: [
}, {
], key: "key",
// 预约表格数据 title: "排队机名称",
appointment:[ width: 200,
{ dataIndex: "info",
key: '1', fixed: "left",
info: '预约一级业务数量', },
title: '排队机名称', ],
}, // 预约表格数据
{ appointment: [
key: '2', {
info: '占比', key: "1",
title: '排队机名称', info: "预约一级业务数量",
}, title: "排队机名称",
{ },
key: '3', {
info: '预约二级业务数量', key: "2",
title: '排队机名称', info: "占比",
}, title: "排队机名称",
{ },
key: '4', {
info: '占比', key: "3",
title: '排队机名称', info: "预约二级业务数量",
}, title: "排队机名称",
], },
// 预约表格列 {
appointmentColumns:[ key: "4",
{ info: "占比",
key: 'key', title: "排队机名称",
title: '排队机名称', },
width: 200, ],
dataIndex: 'info', // 预约表格列
fixed: 'left' appointmentColumns: [
}, {
], key: "key",
// 排队TOP title: "排队机名称",
takeNumberTop:[], width: 200,
// 排队TOP列 dataIndex: "info",
takeNumberTopColumns: [ fixed: "left",
{ },
key:'index', ],
title: '排名', // 排队TOP
dataIndex: 'index', takeNumberTop: [],
scopedSlots: { customRender: 'index' }, // 排队TOP列
}, takeNumberTopColumns: [
{ {
key:'businessName', key: "index",
title: '业务名称', title: "排名",
dataIndex: 'name', dataIndex: "index",
}, scopedSlots: { customRender: "index" },
{ },
key:'number', {
title: '办理数量', key: "businessName",
dataIndex: 'nums', title: "业务名称",
scopedSlots: { customRender: 'nums' }, dataIndex: "name",
}, },
], {
// 预约TOP数据 key: "number",
appointmentTop:[], title: "办理数量",
// 预约TOP列 dataIndex: "nums",
appointmentTopColumns: [ scopedSlots: { customRender: "nums" },
{ },
key:'index', ],
title: '排名', // 预约TOP数据
dataIndex: 'index', appointmentTop: [],
scopedSlots: { customRender: 'index' }, // 预约TOP列
}, appointmentTopColumns: [
{ {
key:'businessName', key: "index",
title: '业务名称', title: "排名",
dataIndex: 'name', dataIndex: "index",
}, scopedSlots: { customRender: "index" },
{ },
key:'number', {
title: '办理数量', key: "businessName",
dataIndex: 'nums', title: "业务名称",
scopedSlots: { customRender: 'nums' }, dataIndex: "name",
}, },
], {
// 排队Less key: "number",
takeNumberLess:[], title: "办理数量",
// 排队Less列 dataIndex: "nums",
takeNumberLessColumns: [ scopedSlots: { customRender: "nums" },
{ },
key:'index', ],
title: '排名', // 排队Less
dataIndex: 'index', takeNumberLess: [],
scopedSlots: { customRender: 'index' }, // 排队Less列
}, takeNumberLessColumns: [
{ {
key:'businessName', key: "index",
title: '业务名称', title: "排名",
dataIndex: 'name', dataIndex: "index",
}, scopedSlots: { customRender: "index" },
{ },
key:'number', {
title: '办理数量', key: "businessName",
dataIndex: 'nums', title: "业务名称",
scopedSlots: { customRender: 'nums' }, dataIndex: "name",
}, },
], {
// 预约Less数据 key: "number",
appointmentLess:[], title: "办理数量",
// 预约Less列 dataIndex: "nums",
appointmentLessColumns: [ scopedSlots: { customRender: "nums" },
{ },
key:'index', ],
title: '排名', // 预约Less数据
dataIndex: 'index', appointmentLess: [],
// scopedSlots: { customRender: 'index' }, // 预约Less列
}, appointmentLessColumns: [
{ {
key:'businessName', key: "index",
title: '业务名称', title: "排名",
dataIndex: 'name', dataIndex: "index",
}, // scopedSlots: { customRender: 'index' },
{ },
key:'number', {
title: '办理数量', key: "businessName",
dataIndex: 'nums', title: "业务名称",
// scopedSlots: { customRender: 'nums' }, dataIndex: "name",
}, },
], {
takeNumberTopDate: '0', key: "number",
appointmentTopDate: '0', title: "办理数量",
takeNumberLessDate: '0', dataIndex: "nums",
appointmentLessDate: '0', // scopedSlots: { customRender: 'nums' },
siteid:localStorage.getItem("siteId") },
} ],
}, takeNumberTopDate: "0",
mounted(){ appointmentTopDate: "0",
this.$bus.$on("changeSite", () => { takeNumberLessDate: "0",
this.siteid = localStorage.getItem("siteId") appointmentLessDate: "0",
}); siteid: localStorage.getItem("siteId"),
this.getAllData() };
this.getTakeLineData() },
this.getAppointmentData() mounted() {
this.getTakeNumberTop() this.$bus.$on("changeSite", () => {
this.getAppointmentTop() this.siteid = localStorage.getItem("siteId");
this.getTakeNumberLess() });
this.getAppointmentLess() this.getAllData();
}, this.getTakeLineData();
watch:{ this.getAppointmentData();
siteid(){ this.getTakeNumberTop();
this.getAllData() this.getAppointmentTop();
this.getTakeLineData() this.getTakeNumberLess();
this.getAppointmentData() this.getAppointmentLess();
this.getTakeNumberTop() },
this.getAppointmentTop() watch: {
this.getTakeNumberLess() siteid() {
this.getAppointmentLess() this.getAllData();
} this.getTakeLineData();
}, this.getAppointmentData();
methods:{ this.getTakeNumberTop();
//获取全部基本数据 this.getAppointmentTop();
async getAllData() { this.getTakeNumberLess();
this.nowDate= moment(new Date()).format('YYYY-MM-DD h:mm:ss') this.getAppointmentLess();
const res = await getAllInfo({siteid:this.siteid}) },
if(res.code == 1){ },
this.situation= res.data methods: {
this.firstPie= { //获取全部基本数据
name: '占比', async getAllData() {
val: res.data.lev1_nums, this.nowDate = moment(new Date()).format("YYYY-MM-DD h:mm:ss");
total: res.data.lev1_not_child_nums, const res = await getAllInfo({ siteid: this.siteid });
color: '#04CA8F' if (res.code == 1) {
} this.situation = res.data;
this.secondPie= { this.firstPie = {
name: '占比', name: "占比",
val: res.data.lev1_has_child_nums, val: res.data.lev1_nums,
total: res.data.child_nums, total: res.data.lev1_not_child_nums,
color: '#6394f9' color: "#04CA8F",
} };
} this.secondPie = {
}, name: "占比",
// 排队取号 val: res.data.lev1_has_child_nums,
async getTakeLineData() { total: res.data.child_nums,
const res = await getBusinessInfo({siteid:this.siteid}) color: "#6394f9",
if(res.code == 1){ };
let arr= res.data.info }
let newArr= [] },
arr.forEach((item ,index)=>{ // 排队取号
let obj={ async getTakeLineData() {
id: item.id, const res = await getBusinessInfo({ siteid: this.siteid });
dataIndex: item.id, if (res.code == 1) {
title: item.name, let arr = res.data.info;
} let newArr = [];
newArr.push(obj) arr.forEach((item, index) => {
this.lineUp[0][item.id]= item.lev1_nums let obj = {
this.lineUp[1][item.id]= (item.lev1_rate * 100).toFixed(2) + '%' id: item.id,
this.lineUp[2][item.id]= item.lev2_nums dataIndex: item.id,
this.lineUp[3][item.id]= (item.lev2_rate * 100).toFixed(2) + '%' title: item.name,
}) };
this.lineUpColumns= [...this.lineUpColumns, ...newArr] newArr.push(obj);
this.takeLineTotal=res.data.use_bus_nums this.lineUp[0][item.id] = item.lev1_nums;
this.noTakeLine=res.data.not_use_bus_nums this.lineUp[1][item.id] = (item.lev1_rate * 100).toFixed(2) + "%";
this.thirdPie= { this.lineUp[2][item.id] = item.lev2_nums;
name: '占比', this.lineUp[3][item.id] = (item.lev2_rate * 100).toFixed(2) + "%";
val: res.data.not_use_bus_nums, });
total: res.data.use_bus_nums, this.lineUpColumns = [...this.lineUpColumns, ...newArr];
color: '#04CA8F' this.takeLineTotal = res.data.use_bus_nums;
} this.noTakeLine = res.data.not_use_bus_nums;
} this.thirdPie = {
}, name: "占比",
// 预约情况 val: res.data.not_use_bus_nums,
async getAppointmentData() { total: res.data.use_bus_nums,
const res = await getWyInfo({siteid:this.siteid}) color: "#04CA8F",
if(res.code == 1){ };
let arr= res.data.info }
let newArr= [] },
arr.forEach((item ,index)=>{ // 预约情况
let obj={ async getAppointmentData() {
id: item.id, const res = await getWyInfo({ siteid: this.siteid });
dataIndex: item.id, if (res.code == 1) {
title: item.name, let arr = res.data.info;
} let newArr = [];
newArr.push(obj) arr.forEach((item, index) => {
this.appointment[0][item.id]= item.lev1_nums let obj = {
this.appointment[1][item.id]= (item.lev1_rate * 100).toFixed(2) + '%' id: item.id,
this.appointment[2][item.id]= item.lev2_nums dataIndex: item.id,
this.appointment[3][item.id]= (item.lev2_rate * 100).toFixed(2) + '%' title: item.name,
}) };
this.appointmentColumns= [...this.appointmentColumns, ...newArr] newArr.push(obj);
this.appointmentTotal=res.data.use_bus_nums this.appointment[0][item.id] = item.lev1_nums;
this.noAppointment=res.data.not_use_bus_nums this.appointment[1][item.id] =
this.fourthPie= { (item.lev1_rate * 100).toFixed(2) + "%";
name: '占比', this.appointment[2][item.id] = item.lev2_nums;
val: res.data.not_use_bus_nums, this.appointment[3][item.id] =
total: res.data.use_bus_nums, (item.lev2_rate * 100).toFixed(2) + "%";
color: '#04CA8F' });
} this.appointmentColumns = [...this.appointmentColumns, ...newArr];
} this.appointmentTotal = res.data.use_bus_nums;
}, this.noAppointment = res.data.not_use_bus_nums;
// 取号TOP this.fourthPie = {
async getTakeNumberTop(val){ name: "占比",
if(val== undefined){ val: res.data.not_use_bus_nums,
val = 0 total: res.data.use_bus_nums,
} color: "#04CA8F",
const res = await getTopBusiness({selected: val,sort: 'DESC',siteid:this.siteid}) };
if(res.code == 1) { }
this.takeNumberTop= res.data },
} // 取号TOP
}, async getTakeNumberTop(val) {
// 取号Less if (val == undefined) {
async getTakeNumberLess(val){ val = 0;
if(val== undefined){ }
val = 0 const res = await getTopBusiness({
} selected: val,
const res = await getTopBusiness({selected: val,sort: 'ASC',siteid:this.siteid}) sort: "DESC",
if(res.code == 1) { siteid: this.siteid,
this.takeNumberLess= res.data });
} if (res.code == 1) {
}, this.takeNumberTop = res.data;
// 预约TOP }
async getAppointmentTop(val){ },
if(val== undefined){ // 取号Less
val = 0 async getTakeNumberLess(val) {
} if (val == undefined) {
const res = await getTopWy({selected: val,sort: 'DESC',siteid:this.siteid}) val = 0;
if(res.code == 1) { }
this.appointmentTop= res.data const res = await getTopBusiness({
} selected: val,
}, sort: "ASC",
// 预约LESS siteid: this.siteid,
async getAppointmentLess(val){ });
if(val== undefined){ if (res.code == 1) {
val = 0 this.takeNumberLess = res.data;
} }
const res = await getTopWy({selected: val,sort: 'ASC',siteid:this.siteid}) },
if(res.code == 1) { // 预约TOP
this.appointmentLess= res.data async getAppointmentTop(val) {
} if (val == undefined) {
}, val = 0;
changeTakeNumberTopDate(val){ }
this.getTakeNumberTop(val) const res = await getTopWy({
}, selected: val,
changeAppointmentTopDate(val){ sort: "DESC",
this.getAppointmentTop(val) siteid: this.siteid,
}, });
changeTakeNumberLessDate(val){ if (res.code == 1) {
this.getTakeNumberLess(val) this.appointmentTop = res.data;
}, }
changeAppointmentLessDate(val){ },
this.getAppointmentLess(val) // 预约LESS
}, async getAppointmentLess(val) {
} if (val == undefined) {
} val = 0;
}
const res = await getTopWy({
selected: val,
sort: "ASC",
siteid: this.siteid,
});
if (res.code == 1) {
this.appointmentLess = res.data;
}
},
changeTakeNumberTopDate(val) {
this.getTakeNumberTop(val);
},
changeAppointmentTopDate(val) {
this.getAppointmentTop(val);
},
changeTakeNumberLessDate(val) {
this.getTakeNumberLess(val);
},
changeAppointmentLessDate(val) {
this.getAppointmentLess(val);
},
},
};
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.head{ .head {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
.head_title{ .head_title {
font-weight: bold; font-weight: bold;
font-style: normal; font-style: normal;
font-size: 16px; font-size: 16px;
color: #333; color: #333;
margin-right: 1.25rem; margin-right: 1.25rem;
} }
.head_desc{ .head_desc {
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
font-size: 14px; font-size: 14px;
color: #888888; color: #888888;
} }
} }
/deep/ .ant-table{ /deep/ .ant-table {
width: 100% !important; width: 100% !important;
} }
.table_title{ .table_title {
color: #333; color: #333;
font-weight: 700; font-weight: 700;
font-style: normal; font-style: normal;
font-size: .875rem; font-size: 0.875rem;
margin-bottom: .625rem; margin-bottom: 0.625rem;
} }
.f_20{ .f_20 {
font-size: 1.25rem; font-size: 1.25rem;
} }
.f_40{ .f_40 {
font-size: 2.5rem; font-size: 2.5rem;
} }
.f_center{ .f_center {
text-align: center; text-align: center;
} }
.warning{ .warning {
color: #FD6805 color: #fd6805;
} }
.primary{ .primary {
color: #0595FD color: #0595fd;
} }
.success{ .success {
color: #04CA8F color: #04ca8f;
} }
.h_200{ .h_200 {
height: 12.5rem; height: 12.5rem;
} }
.mb_15{ .mb_15 {
margin-bottom: .9375rem; margin-bottom: 0.9375rem;
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="Container"> <div class="Container">
<div class="main"> <div class="main">
<div class="first_card"> <div class="first_card">
<div class="breadMenu"> <div class="breadMenu">
<Breadcrumb/> <Breadcrumb />
</div> </div>
<div class="searchBox"> <div class="searchBox">
<a-auto-complete <a-space>
v-model="businessName" <a-auto-complete
:data-source="dataSource" v-model="businessName"
optionLabelProp="value" :data-source="dataSource"
style="width: 35.625rem" optionLabelProp="value"
placeholder="请输入业务名称搜索" style="width: 35.625rem"
@select="onSelect" placeholder="请输入业务名称搜索"
@search="onSearch" @select="onSelect"
/> @search="onSearch"
<a-button type="primary" class="addclass" v-if="!btnShow" @click="startAnalysis">开始分析</a-button> />
<a-button type="primary" class="addclass" v-else @click="backBase">返回</a-button> <a-button
</div> type="primary"
</div> class="addclass"
<div class="content_view"> v-if="!btnShow"
<router-view keep-alive/> @click="startAnalysis"
</div> >开始分析</a-button
</div> >
</div> <a-button type="primary" class="addclass" v-else @click="backBase"
>返回</a-button
>
</a-space>
</div>
</div>
<div class="content_view">
<router-view keep-alive />
</div>
</div>
</div>
</template> </template>
<script> <script>
import _ from 'lodash'; import _ from "lodash";
import axios from 'axios'; import axios from "axios";
import Breadcrumb from "./breadcrumb/index.vue"; import Breadcrumb from "./breadcrumb/index.vue";
import {userSiteBus} from '@/api/dataActuary' import { userSiteBus } from "@/api/dataActuary";
export default { export default {
components:{ components: {
Breadcrumb Breadcrumb,
}, },
data() { data() {
return { return {
// 搜索框 // 搜索框
businessName: '', businessName: "",
dataSource: [], dataSource: [],
sourceList:[], sourceList: [],
// dataList: [], // dataList: [],
btnShow: false, btnShow: false,
} };
},
}, mounted() {
mounted() { // this.getList()
// this.getList() },
}, created() {},
created(){ computed: {},
}, methods: {
computed:{ startAnalysis() {
}, if (!this.businessName) {
methods:{ this.$message.error("请输入业务名称搜索");
startAnalysis() { } else {
if(!this.businessName){ let item = this.sourceList.filter((i) => {
this.$message.error('请输入业务名称搜索') return i.name == this.businessName;
}else{ })[0];
let item = this.sourceList.filter(i=>{return i.name == this.businessName})[0] if (item) {
if(item){ this.$router.push({
this.$router.push({ path: 'analysiscontent', query:{id:item.id}}) path: "analysiscontent",
this.btnShow= true query: { id: item.id },
} });
} this.btnShow = true;
}, }
backBase() { }
this.$router.push({ path: 'basecontent'}) },
this.btnShow= false backBase() {
this.businessName= '' this.$router.push({ path: "basecontent" });
}, this.btnShow = false;
// async getList(){ this.businessName = "";
// await axios.get('http://192.168.0.98:8090/inter/statistic/busList',{params: {siteid: 1}}).then((res)=>{ },
// if(res && res.status==200){ // async getList(){
// res.data.data.forEach(item=>{ // await axios.get('http://192.168.0.98:8090/inter/statistic/busList',{params: {siteid: 1}}).then((res)=>{
// this.dataList.push(item.name) // if(res && res.status==200){
// }) // res.data.data.forEach(item=>{
// } // this.dataList.push(item.name)
// }) // })
// }, // }
onSearch: _.debounce(function(val){ // })
this.dataSource= [] // },
userSiteBus({siteid: localStorage.getItem('siteId'),bus_name:val}).then(res => { onSearch: _.debounce(function (val) {
if (res.code == 1) { this.dataSource = [];
this.sourceList = res.data; userSiteBus({
res.data.forEach(r => { siteid: localStorage.getItem("siteId"),
this.dataSource.push( bus_name: val,
r.name }).then((res) => {
); if (res.code == 1) {
}); this.sourceList = res.data;
} res.data.forEach((r) => {
}) this.dataSource.push(r.name);
},0), });
onSelect(val){ }
this.businessName= val });
} }, 0),
}, onSelect(val) {
} this.businessName = val;
},
},
};
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@headerH: 4.5rem; @headerH: 4.5rem;
.Container { .Container {
height: 100% !important; height: 100% !important;
// background: #fac; // background: #fac;
background: #f5f5f5; background: #f5f5f5;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.main { .main {
// background: #afc; // background: #afc;
border-radius: 6px; border-radius: 6px;
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
}
&::before {
content: "";
display: block;
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: -webkit-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1);
}
/deep/.ant-tabs-nav {
.ant-tabs-tab {
margin: 0 !important;
}
}
/deep/.ant-tabs-tab {
font-size: 14px !important;
& + .ant-tabs-tab {
margin: 0 !important;
margin-left: 0.7rem !important;
}
}
/deep/.ant-tabs-bar{
margin: 0;
}
} }
.first_card{ &::before {
background: #FFF; content: "";
margin-bottom: .9375rem; display: block;
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: -webkit-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1);
} }
.breadMenu{
height: 2.8125rem; /deep/.ant-tabs-nav {
line-height: 2.8125rem; .ant-tabs-tab {
padding: 0 5rem; margin: 0 !important;
border-bottom: 1px solid rgba(226, 226, 226, 1); }
} }
.searchBox{ /deep/.ant-tabs-tab {
height: 6.25rem; font-size: 14px !important;
display: flex; & + .ant-tabs-tab {
justify-content: center; margin: 0 !important;
align-items: center; margin-left: 0.7rem !important;
}
} }
.content_view{ /deep/.ant-tabs-bar {
padding: 0 5rem; margin: 0;
} }
}
.first_card {
background: #fff;
margin-bottom: 0.9375rem;
}
.breadMenu {
height: 2.8125rem;
line-height: 2.8125rem;
padding: 0 5rem;
border-bottom: 1px solid rgba(226, 226, 226, 1);
}
.searchBox {
height: 6.25rem;
display: flex;
justify-content: center;
align-items: center;
}
.content_view {
padding: 0 5rem;
}
</style> </style>
<template> <template>
<div class="Container"> <div class="Container">
<div class="main"> <div class="main">
<div class="first_card"> <div class="first_card">
<div class="breadMenu"> <div class="breadMenu">
<Breadcrumb/> <Breadcrumb />
</div> </div>
<div class="searchBox"> <div class="searchBox">
<!-- <a-auto-complete <!-- <a-auto-complete
v-model="businessName" v-model="businessName"
:data-source="dataSource" :data-source="dataSource"
optionLabelProp="value" optionLabelProp="value"
...@@ -15,155 +15,169 @@ ...@@ -15,155 +15,169 @@
@select="onSelect" @select="onSelect"
@search="onSearch" @search="onSearch"
/> --> /> -->
<!-- <a-select show-search placeholder="请输入业务名称搜索" style="width: 35.625rem" <!-- <a-select show-search placeholder="请输入业务名称搜索" style="width: 35.625rem"
:default-active-first-option="false" :show-arrow="false" :filter-option="false" allowClear :default-active-first-option="false" :show-arrow="false" :filter-option="false" allowClear
:not-found-content="null" :options="peopleArr" @search="peopelListFn" :not-found-content="null" :options="peopleArr" @search="peopelListFn"
@change="handleChange"> @change="handleChange">
</a-select> --> </a-select> -->
<a-button type="primary" class="addclass" v-if="!btnShow" @click="startAnalysis">开始分析</a-button> <a-button
<a-button type="primary" class="addclass" v-else @click="backBase">返回</a-button> type="primary"
</div> class="addclass"
</div> v-if="!btnShow"
<div class="content_view"> @click="startAnalysis"
<router-view keep-alive/> >开始分析</a-button
</div> >
</div> <a-button type="primary" class="addclass" v-else @click="backBase"
</div> >返回</a-button
</template> >
</div>
</div>
<div class="content_view">
<router-view keep-alive />
</div>
</div>
</div>
</template>
<script> <script>
import _ from 'lodash'; import _ from "lodash";
import axios from 'axios'; import axios from "axios";
import Breadcrumb from "./breadcrumb/index.vue"; import Breadcrumb from "./breadcrumb/index.vue";
export default { export default {
components:{ components: {
Breadcrumb Breadcrumb,
}, },
data() { data() {
return { return {
// 搜索框 // 搜索框
businessName: '', businessName: "",
dataSource: [], dataSource: [],
dataList: [], dataList: [],
btnShow: false, btnShow: false,
} };
},
}, mounted() {
mounted() { this.getList();
this.getList() },
}, methods: {
methods:{ startAnalysis() {
startAnalysis() { if (!this.businessName) {
if(!this.businessName){ this.$message.error("请输入业务名称搜索");
this.$message.error('请输入业务名称搜索') } else {
}else{ this.$router.push({
this.$router.push({ path: 'analysiscontent', query:{name: this.businessName}}) path: "analysiscontent",
this.btnShow= true query: { name: this.businessName },
} });
}, this.btnShow = true;
backBase() { }
this.$router.push({ path: 'basecontent'}) },
this.btnShow= false backBase() {
this.businessName= '' this.$router.push({ path: "basecontent" });
}, this.btnShow = false;
async getList(){ this.businessName = "";
await axios.get('http://192.168.0.98:8090/inter/statistic/busList',{params: {siteid: 1}}).then((res)=>{ },
if(res && res.status==200){ async getList() {
res.data.data.forEach(item=>{ await axios
this.dataList.push(item.name) .get("http://192.168.0.98:8090/inter/statistic/busList", {
}) params: { siteid: 1 },
} })
}) .then((res) => {
}, if (res && res.status == 200) {
onSearch: _.debounce(function(val){ res.data.data.forEach((item) => {
this.dataSource= [] this.dataList.push(item.name);
this.dataList.forEach(item=>{ });
if(item.indexOf(val) !== -1){ }
this.dataSource.push(item) });
} },
}) onSearch: _.debounce(function (val) {
}, 1000), this.dataSource = [];
onSelect(val){ this.dataList.forEach((item) => {
this.businessName= val if (item.indexOf(val) !== -1) {
} this.dataSource.push(item);
} }
} });
</script> }, 1000),
onSelect(val) {
this.businessName = val;
},
},
};
</script>
<style lang="less" scoped> <style lang="less" scoped>
@headerH: 4.5rem; @headerH: 4.5rem;
.Container { .Container {
height: 100% !important; height: 100% !important;
// background: #fac; // background: #fac;
background: #f5f5f5; background: #f5f5f5;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.main { .main {
// background: #afc; // background: #afc;
border-radius: 6px; border-radius: 6px;
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
}
&::before {
content: "";
display: block;
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: -webkit-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1);
}
/deep/.ant-tabs-nav {
.ant-tabs-tab {
margin: 0 !important;
}
}
/deep/.ant-tabs-tab {
font-size: 14px !important;
& + .ant-tabs-tab {
margin: 0 !important;
margin-left: 0.7rem !important;
}
}
/deep/.ant-tabs-bar{
margin: 0;
}
} }
.first_card{ &::before {
background: #FFF; content: "";
margin-bottom: .9375rem; display: block;
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: -webkit-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1);
} }
.breadMenu{
height: 2.8125rem; /deep/.ant-tabs-nav {
line-height: 2.8125rem; .ant-tabs-tab {
padding: 0 5rem; margin: 0 !important;
border-bottom: 1px solid rgba(226, 226, 226, 1); }
} }
.searchBox{ /deep/.ant-tabs-tab {
height: 6.25rem; font-size: 14px !important;
display: flex; & + .ant-tabs-tab {
justify-content: center; margin: 0 !important;
align-items: center; margin-left: 0.7rem !important;
}
} }
.content_view{ /deep/.ant-tabs-bar {
padding: 0 5rem; margin: 0;
} }
</style> }
.first_card {
background: #fff;
margin-bottom: 0.9375rem;
}
.breadMenu {
height: 2.8125rem;
line-height: 2.8125rem;
padding: 0 5rem;
border-bottom: 1px solid rgba(226, 226, 226, 1);
}
.searchBox {
height: 6.25rem;
display: flex;
justify-content: center;
align-items: center;
}
.content_view {
padding: 0 5rem;
}
</style>
\ No newline at end of file
<template> <template>
<div class="Container"> <div class="Container">
<div class="main"> <div class="main">
<div class="first_card"> <div class="first_card">
<div class="breadMenu"> <div class="breadMenu">
<Breadcrumb /> <Breadcrumb />
</div> </div>
<div class="searchBox"> <div class="searchBox">
<a-select show-search placeholder="请输入群众名称搜索" style="width: 35.625rem" <a-space>
:default-active-first-option="false" :show-arrow="false" :filter-option="false" allowClear <a-select
:not-found-content="null" :options="peopleArr" @search="peopelListFn" show-search
@change="handleChange"></a-select> placeholder="请输入群众名称搜索"
style="width: 35.625rem"
:default-active-first-option="false"
:show-arrow="false"
:filter-option="false"
allowClear
:not-found-content="null"
:options="peopleArr"
@search="peopelListFn"
@change="handleChange"
></a-select>
<!-- <a-input v-model="peopleName" placeholder="请输入群众名称搜索" style="width: 35.625rem"></a-input> --> <!-- <a-input v-model="peopleName" placeholder="请输入群众名称搜索" style="width: 35.625rem"></a-input> -->
<a-button type="primary" class="addclass" v-if="!btnShow" @click="startAnalysis()">开始分析</a-button> <a-button
<a-button type="primary" class="addclass" v-else @click="backBase()">返回</a-button> type="primary"
</div> class="addclass"
</div> v-if="!btnShow"
<div class="content_view"> @click="startAnalysis()"
<router-view keep-alive /> >开始分析</a-button
</div> >
</div> <a-button type="primary" class="addclass" v-else @click="backBase()"
</div> >返回</a-button
>
</a-space>
</div>
</div>
<div class="content_view">
<router-view keep-alive />
</div>
</div>
</div>
</template> </template>
<script> <script>
import Breadcrumb from "./breadcrumb/index.vue"; import Breadcrumb from "./breadcrumb/index.vue";
import { peopelList } from '@/api/userPortrait' import { peopelList } from "@/api/userPortrait";
export default { export default {
components: { components: {
Breadcrumb Breadcrumb,
}, },
data() { data() {
return { return {
// 搜索框 // 搜索框
peopleId: '', peopleId: "",
peopleArr: [], peopleArr: [],
btnShow: false, btnShow: false,
} };
},
}, methods: {
methods: { //输入框回显
//输入框回显 peopelListFn(val) {
peopelListFn(val) { this.peopleArr = [];
this.peopleArr = [] peopelList({ siteid: localStorage.getItem("siteId"), name: val }).then(
peopelList({ siteid: localStorage.getItem('siteId'), name: val }).then(res => { (res) => {
if (res.code == 1) { if (res.code == 1) {
res.data.forEach(r => { res.data.forEach((r) => {
this.peopleArr.push({ this.peopleArr.push({
value: r.id, value: r.id,
label: r.idcard_Name + '    ' + r.idcard_IDCardNo, label: r.idcard_Name + "    " + r.idcard_IDCardNo,
}); });
}); });
} }
}) }
}, );
handleChange(val) { },
this.peopleId = val; handleChange(val) {
}, this.peopleId = val;
startAnalysis() { },
if (this.peopleId) { startAnalysis() {
this.$router.push({ path: 'portrayalAnalysis', query: { peopleid: this.peopleId } }) if (this.peopleId) {
this.btnShow = true this.$router.push({
} else { path: "portrayalAnalysis",
this.$message.warning('请选择群众后搜索') query: { peopleid: this.peopleId },
} });
this.btnShow = true;
}, } else {
backBase() { this.$message.warning("请选择群众后搜索");
this.peopleArr = [] }
this.$router.push({ path: 'portrayalBase' }) },
this.btnShow = false backBase() {
}, this.peopleArr = [];
} this.$router.push({ path: "portrayalBase" });
} this.btnShow = false;
},
},
};
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@headerH: 4.5rem; @headerH: 4.5rem;
.Container { .Container {
height: 100% !important; height: 100% !important;
// background: #fac; // background: #fac;
background: #f5f5f5; background: #f5f5f5;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.main { .main {
// background: #afc; // background: #afc;
border-radius: 6px; border-radius: 6px;
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
} }
&::before { &::before {
content: ""; content: "";
display: block; display: block;
width: 100%; width: 100%;
height: @headerH; height: @headerH;
background: rgb(59, 135, 255); background: rgb(59, 135, 255);
background: -moz-linear-gradient(174deg, background: -moz-linear-gradient(
rgba(59, 135, 255, 1) 24%, 174deg,
rgba(108, 53, 247, 1) 85%); rgba(59, 135, 255, 1) 24%,
background: -webkit-linear-gradient(174deg, rgba(108, 53, 247, 1) 85%
rgba(59, 135, 255, 1) 24%, );
rgba(108, 53, 247, 1) 85%); background: -webkit-linear-gradient(
background: linear-gradient(174deg, 174deg,
rgba(59, 135, 255, 1) 24%, rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%); rgba(108, 53, 247, 1) 85%
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff", endColorstr="#6c35f7", GradientType=1); );
} background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff", endColorstr="#6c35f7", GradientType=1);
}
/deep/.ant-tabs-nav { /deep/.ant-tabs-nav {
.ant-tabs-tab { .ant-tabs-tab {
margin: 0 !important; margin: 0 !important;
} }
} }
/deep/.ant-tabs-tab { /deep/.ant-tabs-tab {
font-size: 14px !important; font-size: 14px !important;
&+.ant-tabs-tab { & + .ant-tabs-tab {
margin: 0 !important; margin: 0 !important;
margin-left: 0.7rem !important; margin-left: 0.7rem !important;
} }
} }
/deep/.ant-tabs-bar { /deep/.ant-tabs-bar {
margin: 0; margin: 0;
} }
} }
.first_card { .first_card {
background: #FFF; background: #fff;
margin-bottom: .9375rem; margin-bottom: 0.9375rem;
} }
.breadMenu { .breadMenu {
height: 2.8125rem; height: 2.8125rem;
line-height: 2.8125rem; line-height: 2.8125rem;
padding: 0 5rem; padding: 0 5rem;
border-bottom: 1px solid rgba(226, 226, 226, 1); border-bottom: 1px solid rgba(226, 226, 226, 1);
} }
.searchBox { .searchBox {
height: 6.25rem; height: 6.25rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.content_view { .content_view {
padding: 0 5rem; padding: 0 5rem;
} }
</style> </style>
...@@ -4,11 +4,11 @@ ...@@ -4,11 +4,11 @@
<Head :title="'预约热度排名'"> <Head :title="'预约热度排名'">
<template slot="operation"> <template slot="operation">
<a-range-picker <a-range-picker
valueFormat="YYYY-MM-DD" valueFormat="YYYY-MM-DD"
class="range_picker_style" class="range_picker_style"
@change="rangePickerChange" @change="rangePickerChange"
v-model="BegindAndEndTime" v-model="BegindAndEndTime"
v-if="day == 5" v-if="day == 5"
> >
</a-range-picker> </a-range-picker>
<a-select v-model="day"> <a-select v-model="day">
...@@ -20,7 +20,9 @@ ...@@ -20,7 +20,9 @@
<!-- <a-select-option value="5"> 自定义 </a-select-option> --> <!-- <a-select-option value="5"> 自定义 </a-select-option> -->
</a-select> </a-select>
<a-button type="primary" class="addclass" @click="getData">搜索</a-button> <a-button type="primary" class="addclass" @click="getData"
>搜索</a-button
>
</template> </template>
</Head> </Head>
<div class="heat_box" v-if="data"> <div class="heat_box" v-if="data">
...@@ -30,11 +32,14 @@ ...@@ -30,11 +32,14 @@
<i>部门名称</i> <i>部门名称</i>
<b>预约热度</b> <b>预约热度</b>
</li> </li>
<li class="list" v-for="item,index in data.section" :key="index"> <li class="list" v-for="(item, index) in data.section" :key="index">
<span>NO.{{ index+1 }}</span> <span>NO.{{ index + 1 }}</span>
<i>{{item.deptname}}</i> <i>{{ item.deptname }}</i>
<b> <b>
<a-progress :percent="item.count" :show-info="false" status="active" <a-progress
:percent="item.count"
:show-info="false"
status="active"
/></b> /></b>
</li> </li>
</ul> </ul>
...@@ -44,11 +49,14 @@ ...@@ -44,11 +49,14 @@
<i>事项名称</i> <i>事项名称</i>
<b>预约热度</b> <b>预约热度</b>
</li> </li>
<li class="list" v-for="item,index in data.matter" :key="index"> <li class="list" v-for="(item, index) in data.matter" :key="index">
<span>NO.{{ index+1 }}</span> <span>NO.{{ index + 1 }}</span>
<i>{{item.mattername}}</i> <i>{{ item.mattername }}</i>
<b> <b>
<a-progress :percent="item.count" :show-info="false" status="active" <a-progress
:percent="item.count"
:show-info="false"
status="active"
/></b> /></b>
</li> </li>
</ul> </ul>
...@@ -59,37 +67,37 @@ ...@@ -59,37 +67,37 @@
<script> <script>
import Head from "./components/header.vue"; import Head from "./components/header.vue";
import {getOrderRanking} from '@/api/dataAdmin.js' import { getOrderRanking } from "@/api/dataAdmin.js";
export default { export default {
name: "PortalAdminVueHeatRanking", name: "PortalAdminVueHeatRanking",
data() { data() {
return { return {
day:'0', day: "0",
BegindAndEndTime: [], BegindAndEndTime: [],
data:null data: null,
}; };
}, },
components: { components: {
Head, Head,
}, },
watch:{ watch: {
day(val){ day(val) {
if (val != 5) this.BegindAndEndTime = [] if (val != 5) this.BegindAndEndTime = [];
} },
}, },
mounted() { mounted() {
this.getData() this.getData();
}, },
methods: { methods: {
getData(){ getData() {
getOrderRanking({ getOrderRanking({
selected:this.day == 5 ? null : this.day, selected: this.day == 5 ? null : this.day,
time:this.BegindAndEndTime time: this.BegindAndEndTime,
}).then(res=>{ }).then((res) => {
this.data = res.data this.data = res.data;
}) });
}, },
rangePickerChange(val) { rangePickerChange(val) {
console.log(val); console.log(val);
}, },
...@@ -99,6 +107,7 @@ export default { ...@@ -99,6 +107,7 @@ export default {
<style lang="less" scoped> <style lang="less" scoped>
.HeatRanking-Container { .HeatRanking-Container {
width: 100%;
& > .pm { & > .pm {
.heat_box { .heat_box {
display: flex; display: flex;
......
...@@ -94,6 +94,7 @@ export default { ...@@ -94,6 +94,7 @@ export default {
<style lang="less" scoped> <style lang="less" scoped>
@headerH: 4.5rem; @headerH: 4.5rem;
#dataAnalyse-Container { #dataAnalyse-Container {
width: 100%;
height: 100% !important; height: 100% !important;
background: #eee; background: #eee;
display: flex; display: flex;
......
...@@ -149,15 +149,15 @@ export default { ...@@ -149,15 +149,15 @@ export default {
// 获取用户常用站点列表 // 获取用户常用站点列表
async getCollect() { async getCollect() {
let res = await getCollect(); let res = await getCollect();
if (res.data.code == 1) { if (res.code == 1) {
this.collectList = res.data.data; this.collectList = res.data;
} }
}, },
// 获取站点分类列表 // 获取站点分类列表
async appsListInterface() { async appsListInterface() {
let res = await appsListInterface({ siteId: this.siteId }); let res = await appsListInterface({ siteId: this.siteId });
if (res.data.code == 1) { if (res.code == 1) {
let { data } = res.data.data; let { data } = res.data;
this.siteModelList = data; this.siteModelList = data;
} }
}, },
...@@ -208,7 +208,7 @@ export default { ...@@ -208,7 +208,7 @@ export default {
// this.$message.success("设置成功"); // this.$message.success("设置成功");
// this.getCollect(); // this.getCollect();
// } // }
if (res.data.code != 1) { if (res.code != 1) {
this.getCollect(); this.getCollect();
} }
}, },
......
...@@ -38,13 +38,13 @@ ...@@ -38,13 +38,13 @@
listArr[active] ? listArr[active].productName : "--" listArr[active] ? listArr[active].productName : "--"
}}</span> }}</span>
<span class="count primary">{{ <span class="count primary">{{
listArr[active].curInfo.length listArr[active]?.curInfo.length
}}</span> }}</span>
</div> </div>
<div v-if="listArr[active].curInfo.length > 0"> <div v-if="listArr[active]?.curInfo.length > 0">
<div <div
class="list flex aic jcb" class="list flex aic jcb"
v-for="(i, j) in listArr[active].curInfo" v-for="(i, j) in listArr[active]?.curInfo"
:key="j" :key="j"
> >
<div class="app-name">{{ i.appName }}</div> <div class="app-name">{{ i.appName }}</div>
......
...@@ -207,6 +207,7 @@ export default { ...@@ -207,6 +207,7 @@ export default {
}, },
// 获取菜单列表 // 获取菜单列表
async getMenuList() { async getMenuList() {
this.tableLoading = true;
let res = await menuList({ let res = await menuList({
page: this.tablePagination.current, page: this.tablePagination.current,
size: -1, size: -1,
...@@ -218,10 +219,12 @@ export default { ...@@ -218,10 +219,12 @@ export default {
this.firstStair = data.filter((v) => v.parentId === -1); this.firstStair = data.filter((v) => v.parentId === -1);
let childrens = data.filter((v) => v.parentId !== -1); let childrens = data.filter((v) => v.parentId !== -1);
this.menusTreeData = this.fliterEvent(this.firstStair, childrens); this.menusTreeData = this.fliterEvent(this.firstStair, childrens);
this.tableLoading = false;
}, },
// 搜索 // 搜索
async searchData() { async searchData() {
if (this.searchForm.parentId || this.searchForm.name) { if (this.searchForm.parentId || this.searchForm.name) {
this.tableLoading = true;
let obj = { ...this.searchForm }; let obj = { ...this.searchForm };
obj.name = "%" + this.searchForm.name + "%"; obj.name = "%" + this.searchForm.name + "%";
let res = await menuList({ let res = await menuList({
...@@ -232,6 +235,7 @@ export default { ...@@ -232,6 +235,7 @@ export default {
let { data, total } = res.data; let { data, total } = res.data;
this.tablePagination.total = total; this.tablePagination.total = total;
this.menusTreeData = data; this.menusTreeData = data;
this.tableLoading = false;
} else { } else {
this.getMenuList(); this.getMenuList();
} }
......
...@@ -139,6 +139,7 @@ export default { ...@@ -139,6 +139,7 @@ export default {
}, },
methods: { methods: {
async getRoleList() { async getRoleList() {
this.tableLoading = true;
let res = await roleList({ let res = await roleList({
page: this.tablePagination.current, //当前页 page: this.tablePagination.current, //当前页
size: this.tablePagination.pageSize, //每页条数 size: this.tablePagination.pageSize, //每页条数
...@@ -155,6 +156,7 @@ export default { ...@@ -155,6 +156,7 @@ export default {
this.tableSourceData = data.data; this.tableSourceData = data.data;
this.roleDict = dict; this.roleDict = dict;
} }
this.tableLoading = false;
}, },
pagTableChange(pag) { pagTableChange(pag) {
this.tablePagination.current = pag.current; this.tablePagination.current = pag.current;
......
...@@ -197,6 +197,7 @@ export default { ...@@ -197,6 +197,7 @@ export default {
// 获取用户列表 // 获取用户列表
async getUserList() { async getUserList() {
this.tableLoading = true;
let realName = ""; let realName = "";
let mobile = ""; let mobile = "";
if (this.userform.searchVal) { if (this.userform.searchVal) {
...@@ -227,6 +228,7 @@ export default { ...@@ -227,6 +228,7 @@ export default {
this.tablePagination.total = total; this.tablePagination.total = total;
this.userDict = this.transverter(roleId); this.userDict = this.transverter(roleId);
this.tableSourceData = data; this.tableSourceData = data;
this.tableLoading = false;
}, },
// 添加用户 // 添加用户
......
...@@ -174,6 +174,7 @@ export default { ...@@ -174,6 +174,7 @@ export default {
}, },
dict: {}, dict: {},
total: 0, total: 0,
tableLoading: false,
}; };
}, },
components: { components: {
...@@ -184,6 +185,7 @@ export default { ...@@ -184,6 +185,7 @@ export default {
}, },
methods: { methods: {
getList() { getList() {
this.tableLoading = true;
getInterfaceList({ getInterfaceList({
page: this.tablePagination.current, page: this.tablePagination.current,
size: this.tablePagination.pageSize, size: this.tablePagination.pageSize,
...@@ -195,8 +197,8 @@ export default { ...@@ -195,8 +197,8 @@ export default {
this.dict = dict; this.dict = dict;
this.tableSourceData = data; this.tableSourceData = data;
this.tablePagination.total = total; this.tablePagination.total = total;
return data;
} }
this.tableLoading = false;
}); });
}, },
QueueState(type) { QueueState(type) {
......
...@@ -142,6 +142,7 @@ export default { ...@@ -142,6 +142,7 @@ export default {
deveLanguage: {}, deveLanguage: {},
isEnable: {}, isEnable: {},
}, },
tableLoading: false,
}; };
}, },
components: { components: {
...@@ -153,6 +154,7 @@ export default { ...@@ -153,6 +154,7 @@ export default {
}, },
methods: { methods: {
getList(search) { getList(search) {
this.tableLoading = true;
getApps({ getApps({
page: this.tablePagination.current, page: this.tablePagination.current,
size: this.tablePagination.pageSize, size: this.tablePagination.pageSize,
...@@ -164,6 +166,7 @@ export default { ...@@ -164,6 +166,7 @@ export default {
this.dict = dict; this.dict = dict;
this.tableSourceData = data; this.tableSourceData = data;
this.tablePagination.total = total; this.tablePagination.total = total;
this.tableLoading = false;
return data; return data;
} }
}); });
......
...@@ -113,6 +113,7 @@ export default { ...@@ -113,6 +113,7 @@ export default {
current: 1, current: 1,
pageSize: 10, pageSize: 10,
}, },
tableLoading: false,
}; };
}, },
components: { components: {
...@@ -124,6 +125,7 @@ export default { ...@@ -124,6 +125,7 @@ export default {
}, },
methods: { methods: {
getList(search) { getList(search) {
this.tableLoading = true;
getDocument({ getDocument({
page: this.tablePagination.current, page: this.tablePagination.current,
size: this.tablePagination.pageSize, size: this.tablePagination.pageSize,
...@@ -136,6 +138,7 @@ export default { ...@@ -136,6 +138,7 @@ export default {
this.dict = dict; this.dict = dict;
this.tableSourceData = data; this.tableSourceData = data;
this.tablePagination.total = total; this.tablePagination.total = total;
this.tableLoading = false;
return data; return data;
} }
}); });
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment