bigScreenData

This commit is contained in:
shijing 2022-03-15 10:29:23 +08:00
parent d78e871233
commit 0851e0cc84
7 changed files with 453 additions and 51 deletions

View File

@ -6,68 +6,69 @@ import 'nprogress/nprogress.css' // progress bar style
import { getToken } from '@/utils/auth' // get token from cookie
import getPageTitle from '@/utils/get-page-title'
NProgress.configure({ showSpinner: false }) // NProgress Configuration
NProgress.configure({ showSpinner: false }) ;// NProgress Configuration
const whiteList = ['/login'] // no redirect whitelist
const whiteList = ['/login']; // no redirect whitelist
router.beforeEach(async(to, from, next) => {
// start progress bar
NProgress.start()
NProgress.start();
// set page title
document.title = getPageTitle(to.meta.title)
document.title = getPageTitle(to.meta.title);
// determine whether the user has logged in
const hasToken = getToken()
const hasToken = getToken();
if (hasToken) {
if (to.path === '/login') {
// if is logged in, redirect to the home page
next({ path: '/' })
next({ path: '/' });
NProgress.done()
} else {
// determine whether the user has obtained his permission perms through getInfo
const hasPerms = store.getters.perms && store.getters.perms.length > 0
const hasPerms = store.getters.perms && store.getters.perms.length > 0;
if (hasPerms) {
next()
} else {
try {
// get user info
// note: perms must be a object array! such as: ['admin'] or ,['developer','editor']
const { perms } = await store.dispatch('user/getInfo')
const { perms } = await store.dispatch('user/getInfo');
// generate accessible routes map based on perms
const accessRoutes = await store.dispatch('permission/generateRoutes', perms)
const accessRoutes = await store.dispatch('permission/generateRoutes', perms);
// dynamically add accessible routes
router.addRoutes(accessRoutes)
router.addRoutes(accessRoutes);
// hack method to ensure that addRoutes is complete
// set the replace: true, so the navigation will not leave a history record
next({ ...to, replace: true })
} catch (error) {
// remove token and go to login page to re-login
await store.dispatch('user/resetToken')
Message.error(error || 'Has Error')
next(`/login?redirect=${to.path}`)
await store.dispatch('user/resetToken');
Message.error(error || 'Has Error');
next(`/login?redirect=${to.path}`);
NProgress.done()
}
}
}
} else {
/* has no token*/
if (whiteList.indexOf(to.path) !== -1) {
if (to.path === '/index'){
next()
}else if (whiteList.indexOf(to.path) !== -1) {
// in the free login whitelist, go directly
next()
} else {
// other pages that do not have permission to access are redirected to the login page.
next(`/login?redirect=${to.path}`)
next(`/login?redirect=${to.path}`);
NProgress.done()
}
}
})
});
router.afterEach(() => {
// finish progress bar
NProgress.done()
})
});

View File

@ -20,7 +20,7 @@ service.interceptors.request.use(
// please modify it according to the actual situation
config.headers['Authorization'] = 'Bearer ' + getToken()
}
let data = config.data;
let data = config.data?config.data:config.params;
/*debugger;
console.log(data)*/
if(data){
@ -28,6 +28,9 @@ service.interceptors.request.use(
if(token){
config.headers['Authorization'] = 'Bearer ' + token
}
if(data.type==='big_screen'){
config.headers['Authorization'] = 'big_screen '
}
}
/* debugger;
console.log(config.headers['Authorization'])*/

View File

@ -7,7 +7,7 @@
:key="item.title"
>
<p class="ml-3 colorBlue fw-b fs-xl">{{ item.title }}</p>
<div>
<div v-if="numberShow">
<dv-digital-flop
class="dv-dig-flop ml-1 mt-2 pl-3"
:config="item.number"
@ -20,7 +20,7 @@
<span>
<el-icon class="el-icon-pie-chart"></el-icon>
</span>
<span class="fs-xl text mx-2 mb-1 pl-3">任务完成进度</span>
<span class="fs-xl text mx-2 mb-1 pl-3">工序生产进度</span>
<dv-scroll-ranking-board class="dv-scr-rank-board mt-1" :config="ranking" />
</div>
<div class="percent">
@ -49,11 +49,20 @@
</template>
<script>
import CenterChart from '@/components/echart/chartRate.vue'
import {getProductionplanList} from "@/api/pm";
import {getContractList, getOrderList} from "@/api/sam";
import CenterChart from '@/components/echart/chartRate.vue'
export default {
data() {
return {
contractTotalCurrent:0,
orderTotalCurrent:0,
planTotalCurrent:0,
selProductCurrent:0,
noProductCurrent:0,
numberShow:true,
/* create_time_start:'',
titleItem: [
{
title: '本月合同数',
@ -198,11 +207,101 @@ export default {
}
}
}
]
]*/
}
},
components: {
CenterChart
},
props: {
titleItem:{
type:Array,
default: () => {
return []
}
} ,
rate:{
type:Array,
default: () => {
return []
}
} ,
water:{
type:Object,
default: () => {
return {}
}
} ,
ranking:{
type:Object,
default: () => {
return {}
}
} ,
},
methods:{
/* getData(){
let that = this;
that.numberShow = false;
let dat = new Date();
that.week = dat.getDay();
that.currentTime = dat.getTime();
that.currentYear = dat.getFullYear();
let month = dat.getMonth() + 1;
that.currentMonth = month > 9 ? month : '0' + month;
that.currentDay = dat.getDate();
that.create_time_start = that.currentYear + '-' + that.currentMonth + '-01';
that.$nextTick(()=>{
})
},*/
getContract(){
let that = this;
//合同
getContractList({type:'big_screen',page: 1, page_size: 1, create_time_start: that.create_time_start}).then((response) => {
if (response.data) {
that.numberShow = false;
that.titleItem[0].number.number[0] = response.data.count;
that.numberShow = true;
}
});
},
getOrder(){
let that = this;
//订单
getOrderList({type:'big_screen',page: 1, page_size: 1, create_time_start: that.create_time_start}).then((response) => {
if (response.data) {
that.numberShow = false;
that.titleItem[1].number.number[0] = response.data.count;
that.numberShow = true;
}
});
},
getProductionplan(){
let that = this;
//已排产任务
getProductionplanList({type:'big_screen',page: 1, page_size: 1, tag: 'working'}).then((response) => {
if (response.data) {
that.numberShow = false;
that.titleItem[2].number.number[0] = response.data.count;
that.numberShow = true;
}
});
},
},
mounted() {
let that = this;
let dat = new Date();
that.week = dat.getDay();
that.currentTime = dat.getTime();
that.currentYear = dat.getFullYear();
let month = dat.getMonth() + 1;
that.currentMonth = month > 9 ? month : '0' + month;
that.currentDay = dat.getDate();
that.create_time_start = that.currentYear + '-' + that.currentMonth + '-01';
that.getContract();
that.getOrder();
that.getProductionplan();
}
}
</script>

View File

@ -10,7 +10,7 @@
</div>
</div>
<div class="d-flex jc-center body-box">
<dv-scroll-board class="dv-scr-board" :config="config" />
<dv-scroll-board class="dv-scr-board" :config="userConfig" />
</div>
</div>
</div>
@ -19,7 +19,7 @@
export default {
data() {
return {
config: {
/* config: {
header: ['姓名', '部门', '到岗情况'],
data: [
['张思', '一车间', "<span class='colorGrass'>已到岗</span>"],
@ -41,9 +41,17 @@ export default {
index: false,
// columnWidth: [50],
align: ['center']
}*/
}
},
props:{
userConfig:{
type:Object,
default:()=>{
return {}
}
}
}
},
}
</script>

View File

@ -19,7 +19,7 @@
export default {
data() {
return {
config: {
/*config: {
data: [
{
name: '冷加工',
@ -50,6 +50,14 @@ export default {
value: 100
}
]
}*/
}
},
props:{
config:{
type:Object,
default:()=>{
return {}
}
}
},

View File

@ -4,9 +4,9 @@
<!--<dv-loading v-show="loading">Loading...</dv-loading>-->
<div class="host-body">
<div class="d-flex jc-center" id="firstLine">
<dv-decoration-10 class="dv-dec-10" />
<dv-decoration-10 class="dv-dec-10"/>
<div class="d-flex jc-center">
<dv-decoration-8 class="dv-dec-8" :color="['#568aea', '#000000']" />
<dv-decoration-8 class="dv-dec-8" :color="['#568aea', '#000000']"/>
<div class="title">
<div class="title-text">
<span style="margin-right: 20px">航玻生产</span><span>管理系统</span>
@ -23,7 +23,7 @@
:color="['#568aea', '#000000']"
/>
</div>
<dv-decoration-10 class="dv-dec-10-s" />
<dv-decoration-10 class="dv-dec-10-s"/>
</div>
<!-- 第二行 -->
<div class="d-flex jc-between px-2">
@ -50,36 +50,45 @@
<!-- 第三行数据 -->
<div id="centerWrap" class="content-box">
<!-- 数据统计 -->
<div>
<center />
<div v-if="numberShow">
<center
:titleItem="titleItem"
:rate="rate"
:water="water"
:ranking="ranking"
/>
</div>
<div>
<centerRight2 />
<div v-if="processRate">
<centerRight2
:config="config"
/>
</div>
<div>
<dv-border-box-1>
<centerLeft1 />
<centerLeft1/>
</dv-border-box-1>
</div>
<div>
<dv-border-box-1>
<centerLeft2 />
<centerLeft2/>
</dv-border-box-1>
</div>
<div>
<div v-if="listUser">
<dv-border-box-13>
<centerRight1 />
<centerRight1
:userConfig="userConfig"
/>
</dv-border-box-13>
</div>
</div>
<!-- 第四行数据 -->
<div class="bototm-box">
<dv-border-box-3>
<bottomRight />
<bottomRight/>
</dv-border-box-3>
<dv-border-box-13>
<bottomLeft />
<bottomLeft/>
</dv-border-box-13>
</div>
</div>
@ -90,18 +99,22 @@
<script>
import drawMixin from "../../utils/drawMixin";
import { formatTimeBigScreen } from '../../utils/index.js'
import {formatTimeBigScreen} from '../../utils/index.js'
import centerLeft1 from './centerLeft1'
import centerLeft2 from './centerLeft2'
import centerRight1 from './centerRight1'
import centerRight2 from './centerRight2'
import center from './center'
import {getEmployee} from "@/api/hrm";
import bottomLeft from './bottomLeft'
import bottomRight from './bottomRight'
import { getPlanGantt } from "@/api/srm";
import {getPlanGantt} from "@/api/srm";
import {getProductionplanList} from "@/api/pm";
import {getProcessYield} from "@/api/srm";
import {getContractList, getOrderList} from "@/api/sam";
export default {
mixins: [ drawMixin ],
mixins: [drawMixin],
data() {
return {
timing: null,
@ -109,7 +122,183 @@
dateDay: null,
dateYear: null,
dateWeek: null,
planGanttList:[],
planGanttList: [],
numberShow: false,
processRate: false,
listUser: false,
create_time_start: '',
titleItem: [
{
title: '本月合同数',
number: {
number: [12],//数字数值
toFixed: 0,//小数位数
textAlign: 'left',//水平对齐方式
content: '{nt}',//内容模版//rowGap行间距
style: {//样式配置
fontSize: 26
}
}
},
{
title: '本月生产订单数',
number: {
number: [12],
toFixed: 0,
textAlign: 'left',
content: '{nt}',
style: {
fontSize: 26
}
}
},
{
title: '本月在制任务数',
number: {
number: [2],
toFixed: 0,
textAlign: 'left',
content: '{nt}',
style: {
fontSize: 26
}
}
},
{
title: '本月交付产品数',
number: {
number: [8],
toFixed: 0,
textAlign: 'left',
content: '{nt}',
style: {
fontSize: 26
}
}
},
{
title: '本月不合格产品数',
number: {
number: [2],
toFixed: 0,
textAlign: 'left',
content: '{nt}',
style: {
fontSize: 26
}
}
},
{
title: '本月军检合格率',
number: {
number: [99],
toFixed: 1,
textAlign: 'left',
content: '{nt}%',
style: {
fontSize: 26
}
}
},
],
ranking: {
data: [
{
name: '冷加工',
value: 100
},
{
name: '热弯成型',
value: 100
},
{
name: '化学钢化',
value: 100
},
{
name: '镀膜',
value: 100
},
{
name: '夹层',
value: 100
},
{
name: '包边',
value: 100
},
{
name: '装框',
value: 100
}
],
carousel: 'single',
unit: '%'
},
water: {
data: [24, 45],
shape: 'roundRect',
formatter: '{value}%',
waveNum: 3
},
// 通过率和达标率的组件复用数据
rate: [
{
id: 'centerRate1',
tips: 98,
colorData: {
textStyle: '#3fc0fb',
series: {
color: ['#00bcd44a', 'transparent'],
dataColor: {
normal: '#03a9f4',
shadowColor: '#97e2f5'
}
}
}
},
{
id: 'centerRate2',
tips: 99,
colorData: {
textStyle: '#67e0e3',
series: {
color: ['#faf3a378', 'transparent'],
dataColor: {
normal: '#ff9800',
shadowColor: '#fcebad'
}
}
}
}
],
config: {
data: []
},
//人员到岗
userConfig: {
header: ['姓名', '部门', '到岗情况'],
data: [
['张思', '一车间', "<span class='colorGrass'>已到岗</span>"],
['李森', '一车间', "<span class='colorGrass'>已到岗</span>"],
['王师', '一车间', "<span class='colorRed'>未到岗</span>"],
['赵迪', '一车间', "<span class='colorGrass'>已到岗</span>"],
['孟津', '一车间', "<span class='colorGrass'>已到岗</span>"],
['孙东课', '一车间', "<span class='colorGrass'>已到岗</span>"],
['周神秘', '二车间', "<span class='colorGrass'>已到岗</span>"],
['吴老弟', '二车间', "<span class='colorRed'>未到岗</span>"],
['郑成功', '二车间', "<span class='colorGrass'>已到岗</span>"],
['冯宝宝', '二车间', "<span class='colorGrass'>已到岗</span>"]
],
rowNum: 7, //表格行数
headerHeight: 35,
headerBGC: '#0f1325', //表头
oddRowBGC: '#0f1325', //奇数行
evenRowBGC: '#171c33', //偶数行
index: false,
// columnWidth: [50],
align: ['center']
},
weekday: ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
}
},
@ -122,21 +311,33 @@
bottomLeft,
bottomRight
},
created(){
created() {
// window.open('http://49.232.14.174:2222/#/index');
// this.$router.go(-1)
},
mounted() {
let that = this;
this.timeFn();
this.cancelLoading();
this.getPageData();
let bigHeight = document.getElementsByClassName('host-body')[0].clientHeight;
let firstHeight = document.getElementById('firstLine').clientHeight;
let secondHeight = document.getElementsByClassName('jc-between')[0].clientHeight;
let domHeight = (bigHeight/2) - firstHeight - secondHeight-30;
let domHeight = (bigHeight / 2) - firstHeight - secondHeight - 30;
document.getElementById('centerWrap').style.height = domHeight + 'px';
let dat = new Date();
that.week = dat.getDay();
that.currentTime = dat.getTime();
that.currentYear = dat.getFullYear();
let month = dat.getMonth() + 1;
that.currentMonth = month > 9 ? month : '0' + month;
that.currentDay = dat.getDate();
that.create_time_start = that.currentYear + '-' + that.currentMonth + '-01';
that.getCenterData();
that.getCenterRight2Data();
that.getUserList();
},
beforeDestroy () {
beforeDestroy() {
clearInterval(this.timing)
},
methods: {
@ -147,9 +348,9 @@
this.dateWeek = this.weekday[new Date().getDay()]
}, 1000)
},
getPageData(){
getPageData() {
let that = this;
getPlanGantt({Authorization:'big_screen'}).then(res => {
getPlanGantt({type: 'big_screen'}).then(res => {
if (res.code === 200) {
this.planGanttList = res.data.results;
} else {
@ -161,7 +362,86 @@
setTimeout(() => {
this.loading = false
}, 500)
}
},
getCenterData() {
let that = this;
that.numberShow = false;
//合同
getContractList({
type: 'big_screen',
page: 1,
page_size: 1,
create_time_start: that.create_time_start
}).then((response) => {
if (response.data) {
that.titleItem[0].number.number[0] = response.data.count;
getOrderList({
type: 'big_screen',
page: 1,
page_size: 1,
create_time_start: that.create_time_start
}).then((response) => {
if (response.data) {
that.titleItem[1].number.number[0] = response.data.count;
getProductionplanList({type: 'big_screen', page: 1, page_size: 1, tag: 'working'}).then((response) => {
if (response.data) {
that.titleItem[2].number.number[0] = response.data.count;
that.numberShow = true;
}
});
}
});
}
});
},
getCenterRight2Data() {
let that = this;
that.processRate = false;
let dat = new Date();
let Year = dat.getFullYear();
let month = dat.getMonth() + 1;
let day = dat.getDate();
let searchTime = Year + '-' + month + '-' + day;
getProcessYield({datetime_start: searchTime, datetime_end: searchTime,type:'big_screen'}).then((response) => {
if (response.data) {
let list = response.data;
let data = [];
list.forEach(item => {
let obj = new Object();
obj.name = item.name;
obj.value = Math.floor(item.rate * 100);
// obj.value = rate.toFixed(2);
data.push(obj)
});
that.config.data = data;
that.processRate = true;
}
});
},
//人员到岗情况列表
getUserList() {
let that = this;
that.listUser = false;
getEmployee({page: 0,type:'big_screen'}).then((response) => {
if (response.data) {
let list = response.data.results;
let data = [];
list.forEach(item => {
let obj = [];
obj.push(item.name);
obj.push(item.dept_.name);
if (item.is_atwork) {
obj.push("<span class='colorGrass'>已到岗</span>")
} else {
obj.push("<span class='colorRed'>未到岗</span>")
}
data.push(obj)
});
that.userConfig.data = data;
that.listUser = true;
}
});
},
}
}
</script>

View File

@ -5,7 +5,7 @@
<img class="faceLoginBtn" src="./../../assets/face.png" @click="takePhoto()">
</div>
<div style="width: 360px;">
<h3 class="title">航玻生产管理系统</h3>
<h3 class="title" @click="toBigScreen">航玻生产管理系统</h3>
<el-tabs v-model="activeName" :stretch="true">
<el-tab-pane label="账号密码登录">
<el-form
@ -135,6 +135,9 @@
},
},
methods: {
toBigScreen(){
this.$router.push('/index')
},
showPwd() {
if (this.passwordType === "password") {
this.passwordType = "";