0124
This commit is contained in:
parent
3eb5c6ac76
commit
84ba98925d
|
|
@ -299,6 +299,18 @@
|
|||
}
|
||||
} ,
|
||||
},
|
||||
watch: {
|
||||
'$route.path': function (newVal) {
|
||||
if(newVal==='/dashboard'){
|
||||
this.$refs.leftMenu.handlerSelect(this.list[0]);
|
||||
this.$refs.chart.scrollTo({
|
||||
top: 0,
|
||||
left: this.list[0].left - 30,
|
||||
behavior: "smooth"
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
windowWidth:0,
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div class="CardTitleWrap">
|
||||
<span class="verticalLine"></span><span class="dashboardCardTitle">数据统计</span>
|
||||
</div>
|
||||
<div style="padding: 20px 20px 55px 20px;overflow: hidden;">
|
||||
<div style="padding: 20px;overflow: hidden;">
|
||||
<div class="cardsWrap" @click="toDetail('1')">
|
||||
<div class="svgIconWrap">
|
||||
<svg-icon
|
||||
|
|
@ -18,6 +18,9 @@
|
|||
<span class="totalCount">{{contractTotalCurrent}}</span>
|
||||
<span>个</span>
|
||||
</div>
|
||||
<!--<div style="height: 35px;line-height: 35px;font-size: 16px;color: #333333">
|
||||
<span>本年合同总数：</span>
|
||||
</div>-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="cardsWrap" @click="toDetail('2')">
|
||||
|
|
@ -149,6 +152,8 @@
|
|||
</div>
|
||||
<div class="block">
|
||||
<el-pagination
|
||||
small
|
||||
:pager-count="pageCounts"
|
||||
:current-page.sync="equipmentPage"
|
||||
:page-size="equipmentPageSize"
|
||||
layout="prev, pager, next, jumper"
|
||||
|
|
@ -175,8 +180,6 @@
|
|||
</el-table-column>
|
||||
<el-table-column label="设备名称" prop="name" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column label="规格型号" prop="model" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column label="设备状态" prop="material_">
|
||||
<!--type=1生产设备-->
|
||||
<template slot-scope="scope">
|
||||
|
|
@ -204,6 +207,14 @@
|
|||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="下次校准日期" prop="model">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.next_check_date" :type="setClass(scope.row.next_check_date)">
|
||||
{{scope.row.next_check_date}}
|
||||
</el-tag>
|
||||
<div v-else></div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -217,7 +228,7 @@
|
|||
<div class="block">
|
||||
<el-pagination
|
||||
small
|
||||
pager-count="3"
|
||||
:pager-count="pageCounts"
|
||||
:current-page.sync="userPage"
|
||||
:page-size="userPageSize"
|
||||
layout="prev, pager, next, jumper"
|
||||
|
|
@ -246,11 +257,11 @@
|
|||
</el-table-column>
|
||||
<el-table-column label="到岗情况" prop="dept_name">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.dept===1" type="success">
|
||||
未到
|
||||
<el-tag v-if="scope.row.is_atwork" type="success">
|
||||
到岗
|
||||
</el-tag>
|
||||
<el-tag v-else type="danger">
|
||||
到岗
|
||||
未到
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -269,13 +280,13 @@
|
|||
<div class="block">
|
||||
<el-pagination
|
||||
small
|
||||
pager-count="3"
|
||||
:current-page.sync="remindPage"
|
||||
:page-size="remindPageSize"
|
||||
:pager-count="pageCounts"
|
||||
:current-page.sync="warningPage"
|
||||
:page-size="warningPageSize"
|
||||
layout="prev, pager, next, jumper"
|
||||
:total="remindTotal"
|
||||
@size-change="handleRemindSizeChange"
|
||||
@current-change="handleRemindCurrentChange"
|
||||
:total="warningTotal"
|
||||
@size-change="handleWarningSizeChange"
|
||||
@current-change="handleWarningCurrentChange"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
|
|
@ -286,37 +297,29 @@
|
|||
<el-tab-pane label="库存警告" name="库存警告">
|
||||
<ul :style="{height:cardTabelHeight-47+'px'}" class="lists" :class="{anim:animate}" @mouseenter="Stop()"
|
||||
@mouseleave="Up()">
|
||||
<li v-for="item in list" :key="item.id" class="listItem">
|
||||
<li class="listItem" v-for="item in warningList" :key="item.id">
|
||||
<div class="itemText">
|
||||
<span>{{item.name}}</span><span style="float: right">2021-12-30</span>
|
||||
<span>{{item.name}}({{item.unit}})</span><span>剩余{{item.count}},低于安全库存{{item.count_safe}}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="临近交货" name="临近交货">
|
||||
<ul class="lists">
|
||||
<li class="listItem">
|
||||
<div class="itemText">
|
||||
<span>某某批货临近交货日期</span><span>2021-12-20</span>
|
||||
</div>
|
||||
</li>
|
||||
<ul :style="{height:cardTabelHeight-47+'px'}" class="lists" :class="{anim:animate}" @mouseenter="Stop()"
|
||||
@mouseleave="Up()">
|
||||
<li class="listItem" v-for="item in warningList" :key="item.id">
|
||||
<div class="itemText">
|
||||
<span>{{item}}</span><span>2021-12-20</span>
|
||||
<span>{{item.name}}({{item.number}})</span><span>{{item.delivery_date}}到交货日期</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="过期提醒" name="过期提醒">
|
||||
<ul class="lists">
|
||||
<li class="listItem">
|
||||
<div class="itemText">
|
||||
<span>某某批货临近过期</span><span>2021-11-20</span>
|
||||
</div>
|
||||
</li>
|
||||
<ul :style="{height:cardTabelHeight-47+'px'}" class="lists" :class="{anim:animate}" @mouseenter="Stop()"
|
||||
@mouseleave="Up()">
|
||||
<li class="listItem" v-for="item in warningList" :key="item.id">
|
||||
<div class="itemText">
|
||||
<span>{{item}}</span><span>2021-12-20</span>
|
||||
<span>{{item.name}}({{item.number}})</span><span>{{item.delivery_date}}到期</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -333,16 +336,13 @@
|
|||
import echarts from 'echarts'
|
||||
import {mapGetters} from 'vuex';
|
||||
import {getUserList} from "@/api/user";
|
||||
import {getPlanGantt} from "@/api/srm";
|
||||
import {getProcessYield} from "@/api/srm";
|
||||
import {getMaterialList} from "@/api/mtm";
|
||||
// import {getInventoryList} from "@/api/inm";
|
||||
import {getProductionplanList} from "@/api/pm";
|
||||
import {getmaterialbatchList} from "@/api/inm";
|
||||
import gantt from "@/components/Gantt/dashGantt";
|
||||
import {getpEquipmentList} from "@/api/equipment";
|
||||
import {getContractList, getOrderList} from "@/api/sam";
|
||||
|
||||
import {getProcessYield ,getPlanGantt} from "@/api/srm";
|
||||
import {getContractList , getOrderList} from "@/api/sam";
|
||||
export default {
|
||||
components: {gantt},
|
||||
name: 'Dashboard',
|
||||
|
|
@ -358,22 +358,22 @@
|
|||
currentYear: null,
|
||||
currentMonth: null,
|
||||
currentDay: null,
|
||||
pageCounts: 5,
|
||||
userPage: 1,
|
||||
userPageSize: 10,
|
||||
userTotal: 0,
|
||||
equipmentPage: 1,
|
||||
equipmentPageSize: 10,
|
||||
equipmentTotal: 0,
|
||||
remindPage: 1,
|
||||
remindPageSize: 20,
|
||||
remindTotal: 0,
|
||||
warningPage: 1,
|
||||
warningPageSize: 10,
|
||||
warningTotal: 0,
|
||||
tableIndex: null,
|
||||
chartIndex: null,
|
||||
tableDate: '2021-12',
|
||||
chartDate: [],
|
||||
proList: [],
|
||||
userList: [],
|
||||
remindList: [],
|
||||
warningList: [],
|
||||
equipmentList: [],
|
||||
list: [
|
||||
|
|
@ -427,27 +427,47 @@
|
|||
])
|
||||
},
|
||||
watch: {
|
||||
"$route": {
|
||||
handler(route) {
|
||||
if (route.name === 'dashboard') {
|
||||
// that.handlerCheckList(this.list);
|
||||
}
|
||||
'$route.path': function (newVal) {
|
||||
if(newVal==='/dashboard') {
|
||||
this.getUserList();//用户列表
|
||||
this.getEquipmentList();//设备列表
|
||||
this.getGanttData();//甘特图数据
|
||||
this.getStatisticsData();//统计数据
|
||||
this.getNoticeData();//提醒列表
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setClass:function(check_date) {
|
||||
let obj = {};
|
||||
if(check_date!=null){
|
||||
let dat = new Date();
|
||||
let time = dat.getTime();
|
||||
let check = new Date(check_date).getTime();
|
||||
let timeDiffer = (check-time)/1000/60/60/24;
|
||||
if (4>timeDiffer&&timeDiffer>0) {
|
||||
obj = 'warning';
|
||||
}else if (timeDiffer<0) {
|
||||
obj = "danger";
|
||||
}
|
||||
}
|
||||
return obj;
|
||||
},
|
||||
getNoticeData() {
|
||||
this.ScrollUp();
|
||||
},
|
||||
ScrollUp() {
|
||||
this.intNum = setInterval(() => {
|
||||
this.animate = true;
|
||||
let that = this;
|
||||
that.intNum = setInterval(() => {
|
||||
if(that.warningList.length>3){
|
||||
that.animate = true;
|
||||
setTimeout(() => {
|
||||
this.list.push(this.list[0]);
|
||||
this.list.shift();
|
||||
this.animate = false;
|
||||
}, 500)
|
||||
}, 1000);
|
||||
that.warningList.push(that.warningList[0]);
|
||||
that.warningList.shift();
|
||||
that.animate = false;
|
||||
}, 3000)
|
||||
}
|
||||
}, 3000);
|
||||
},
|
||||
//鼠标移上去停止
|
||||
Stop() {
|
||||
|
|
@ -526,9 +546,11 @@
|
|||
});
|
||||
|
||||
//获取库存警告
|
||||
getMaterialList({tag: 'low_inm'}).then((response) => {
|
||||
getMaterialList({page: 1, page_size:that.warningPageSize,tag: 'low_inm'}).then((response) => {
|
||||
if (response.data) {
|
||||
debugger;
|
||||
that.warningList = response.data.results;
|
||||
that.warningTotal = response.data.count;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
|
@ -561,7 +583,7 @@
|
|||
getUserList() {
|
||||
let that = this;
|
||||
that.listLoadingUser = true;
|
||||
getUserList({page: that.userPage, page_size: that.userPageSize}).then((response) => {
|
||||
getUserList({page: that.userPage, page_size: that.userPageSize, fields: 'id,name,dept_name,is_atwork'}).then((response) => {
|
||||
if (response.data) {
|
||||
that.userList = response.data.results;
|
||||
that.userTotal = response.data.count;
|
||||
|
|
@ -575,7 +597,7 @@
|
|||
let that = this;
|
||||
that.listLoadingUser = true;
|
||||
that.userPage = val;
|
||||
getUserList({page: val, page_size: that.userPageSize}).then((response) => {
|
||||
getUserList({page: val, page_size: that.userPageSize, fields: 'id,name,dept_name,is_atwork'}).then((response) => {
|
||||
if (response.data) {
|
||||
that.userList = response.data.results;
|
||||
that.userTotal = response.data.count;
|
||||
|
|
@ -592,8 +614,8 @@
|
|||
that.userList.push(that.userList[0]);
|
||||
that.userList.shift();
|
||||
that.animateUser = false;
|
||||
}, 500)
|
||||
}, 1000);
|
||||
}, 3000)
|
||||
}, 3000);
|
||||
},
|
||||
//鼠标移上去停止
|
||||
stopScroll() {
|
||||
|
|
@ -767,9 +789,9 @@
|
|||
} else if (index === '3') {
|
||||
this.$router.push({name: 'management', params: {page: 1, page_size: 20}})
|
||||
} else if (index === '4') {
|
||||
this.$router.push({name: 'product', params: {page: 1, page_size: 20, material__type: 1}})
|
||||
this.$router.push({name: 'product'})
|
||||
} else if (index === '5') {
|
||||
this.$router.push({name: 'product', params: {page: 1, page_size: 20, material__type: 1}})
|
||||
this.$router.push({name: 'unproduct'})
|
||||
}
|
||||
},
|
||||
//便捷查询按钮
|
||||
|
|
@ -857,35 +879,39 @@
|
|||
},
|
||||
//提示
|
||||
activeNameClick(tab) {
|
||||
debugger;
|
||||
debugger;
|
||||
let that = this;
|
||||
that.warningPage = 1;
|
||||
that.warningList = [];
|
||||
if (tab.label === '库存警告') {
|
||||
getMaterialList({page: 0, tag: 'low_inm'}).then((response) => {
|
||||
getMaterialList({page: 1, page_size:that.warningPageSize, tag: 'low_inm'}).then((response) => {
|
||||
if (response.data) {
|
||||
that.warningList = response.data;
|
||||
that.remindTotal = response.data.length;
|
||||
that.warningList = response.data.results;
|
||||
that.warningTotal = response.data.count;
|
||||
}
|
||||
});
|
||||
} else if (tab.label === '临近交货') {
|
||||
getmaterialbatchList({page: 0, tag: 'expired'}).then((response) => {
|
||||
getOrderList({page: 1, page_size:that.warningPageSize,tag:'near_delivery'}).then((response) => {
|
||||
if (response.data) {
|
||||
that.warningList = response.data;
|
||||
that.remindTotal = response.data.length;
|
||||
that.warningList = response.data.results;
|
||||
that.warningTotal = response.data.count;
|
||||
}
|
||||
});
|
||||
} else if (tab.label === '过期提醒') {
|
||||
getmaterialbatchList({page: 0, tag: 'expired'}).then((response) => {
|
||||
getmaterialbatchList({page: 1, page_size:that.warningPageSize, tag: 'expired'}).then((response) => {
|
||||
if (response.data) {
|
||||
that.warningList = response.data;
|
||||
that.remindTotal = response.data.length;
|
||||
that.warningList = response.data.results;
|
||||
that.warningTotal = response.data.count;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
handleRemindSizeChange(val) {
|
||||
this.remindPageSize = val;
|
||||
this.remindPage = 1;
|
||||
handleWarningSizeChange(val) {
|
||||
this.warningPageSize = val;
|
||||
this.warningPage = 1;
|
||||
},
|
||||
handleRemindCurrentChange(val) {
|
||||
handleWarningCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`);
|
||||
},
|
||||
getGanttData() {
|
||||
|
|
@ -976,16 +1002,13 @@
|
|||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-card.is-always-shadow {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.dashboard-container {
|
||||
margin: 5px 6px;
|
||||
}
|
||||
|
||||
.dashboardTopCard, .dashboardMiddle, .dashboardBottomRow {
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
|
|
@ -994,15 +1017,12 @@
|
|||
background: #ffffff;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
.dashboardBottomRow {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.dashboardCardPadding {
|
||||
padding: 5px 20px 20px 20px;
|
||||
}
|
||||
|
||||
/**/
|
||||
.cardsWrap {
|
||||
display: flex;
|
||||
|
|
@ -1011,20 +1031,17 @@
|
|||
float: left;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.svgIconWrap {
|
||||
margin-right: 20px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 15px;
|
||||
text-align: center;
|
||||
|
||||
.svgIcon {
|
||||
font-size: 24px;
|
||||
margin-top: 13px
|
||||
}
|
||||
}
|
||||
|
||||
.cardsWrap:nth-child(1) {
|
||||
.svgIconWrap {
|
||||
background: #e9f3ff;
|
||||
|
|
@ -1034,62 +1051,50 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cardsWrap:nth-child(2) {
|
||||
.svgIconWrap {
|
||||
background: #fff1de;
|
||||
|
||||
.svgIcon {
|
||||
color: #ffb23f;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cardsWrap:nth-child(3) {
|
||||
.svgIconWrap {
|
||||
background: #d9f6d8;
|
||||
|
||||
.svgIcon {
|
||||
color: #54cb48;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cardsWrap:nth-child(4) {
|
||||
.svgIconWrap {
|
||||
background: #f0e8fd;
|
||||
|
||||
.svgIcon {
|
||||
color: #a378e4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cardsWrap:nth-child(5) {
|
||||
.svgIconWrap {
|
||||
background: #f7e5ea;
|
||||
|
||||
.svgIcon {
|
||||
color: #f27197;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.totalCountText {
|
||||
height: 20px;
|
||||
line-height: 20px
|
||||
}
|
||||
|
||||
.totalCountNum {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.totalCount {
|
||||
font-size: 25px;
|
||||
font-weight: bold;
|
||||
color: #626262;
|
||||
}
|
||||
|
||||
/**/
|
||||
.CardTitleWrap {
|
||||
display: flex;
|
||||
|
|
@ -1106,7 +1111,6 @@
|
|||
margin-right: 7px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.dashboardCardTitle {
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
|
|
@ -1116,7 +1120,6 @@
|
|||
vertical-align: middle;
|
||||
margin-right: 7px;
|
||||
}
|
||||
|
||||
.stockMore {
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
|
|
@ -1124,15 +1127,12 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
/*成品率筛选条件*/
|
||||
.dashboardCardHand {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.dashboardCardFilter {
|
||||
display: flex;
|
||||
|
||||
.convenientWrap {
|
||||
display: flex;
|
||||
border: 1px solid #DCDFE6;
|
||||
|
|
@ -1141,23 +1141,19 @@
|
|||
line-height: 30px;
|
||||
margin-left: 10px;
|
||||
font-size: 12px;
|
||||
|
||||
.convenientBtn {
|
||||
cursor: pointer;
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
border-right: 1px solid #DCDFE6;
|
||||
}
|
||||
|
||||
.convenientBtn:last-child {
|
||||
border-right: 0;
|
||||
border-radius: 0 6px 6px 0;
|
||||
}
|
||||
|
||||
.convenientBtn:first-child {
|
||||
border-radius: 6px 0 0 6px;
|
||||
}
|
||||
|
||||
.activeIndex {
|
||||
color: #ffffff;
|
||||
background: #409EFF;
|
||||
|
|
@ -1165,12 +1161,10 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.anim {
|
||||
transition: all 0.5s;
|
||||
margin-top: -35px; //高度等于行高
|
||||
}
|
||||
|
||||
.lists {
|
||||
height: 100%;
|
||||
line-height: 35px;
|
||||
|
|
@ -1178,27 +1172,22 @@
|
|||
overflow-y: scroll;
|
||||
padding-right: 40px;
|
||||
margin: 0 !important;
|
||||
|
||||
.listItem {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 16px;
|
||||
|
||||
.itemText {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#chartColumn > div {
|
||||
height: 100% !important;
|
||||
|
||||
canvas {
|
||||
height: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
#dashboardMiddle .el-range-editor--medium.el-input__inner,
|
||||
#dashboardMiddle .el-range-editor.el-input__inner {
|
||||
height: 30px !important;
|
||||
|
|
|
|||
Loading…
Reference in New Issue