jinhui.wang

首页增加文本修正

import request from '@/utils/request'
// 首页数据获取
/**
* @param fltDate * 航班日期
* @param kindId 航班类型
*/
export function getOneDayFlight(data) {
return request({
url: '/index/getOneDayFlight',
method: 'post',
data: data
})
}
......@@ -98,7 +98,7 @@ let ductLabels = {
},
"status": {
"0": "未处理",
"1": "已处理",
"1": "处理成功",
"2": "无需处理",
"3": "处理失败",
"4": "校验不通过",
......
<template>
<div></div>
<div style="padding:10px" v-loading="loading">
<!-- 配舱汇总信息 -->
<el-card class="mb10" ref="card1">
<el-divider content-position="left">今日配舱汇总</el-divider>
<el-row :gutter="10">
<el-col :span="6">
<div class="allInformation">
<div class="informationItem">航班总重量(KG)</div>
<div class="informationNum">{{ totalWeight }}</div>
</div>
</el-col>
<el-col :span="6">
<div class="allInformation">
<div class="informationItem">已配重量(KG)</div>
<div class="informationNum">{{ allocationWeight }}</div>
</div>
</el-col>
<el-col :span="6">
<div class="allInformation">
<div class="informationItem">配舱比例(百分比)</div>
<div class="informationNum">{{ (percentage == 0 ? 0 : ((percentage) * 100).toFixed(2)) + '%' }}</div>
</div>
</el-col>
</el-row>
</el-card>
<!-- 今日航班box -->
<el-card class="mb10" ref="card2">
<el-form ref="indexForm" size="mini" inline @submit.native.prevent>
<el-form-item label="配载航班日期">
<el-date-picker v-model="selectData.fltDate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"
:clearable="false" @change="getFlight">
</el-date-picker>
</el-form-item>
<el-form-item label="航班种类">
<el-select v-model="selectData.kindId" placeholder="不限" @change="getFlight" clearable>
<el-option v-for="item in fltKindIdList" :label="item.englishName" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-refresh" :loading="loading" @click="getFlight"></el-button>
</el-form-item>
</el-form>
<el-row class="card2">
<el-col :span="1" v-for="item in tableData">
<div class="fltBox" @click="rowClick(item)"
:style="{ backgroundColor: (item.percentage * 100).toFixed(2) >= 100 ? '#13ce66' : (item.percentage * 100).toFixed(2) >= 75 ? '#ffba00' : '#ff4949' }">
<div class="fltName">{{ item.fltNo }}</div>
<div class="fltWeight">{{ (item.percentage == 0 ? 0 : ((item.percentage) * 100).toFixed(2)) + '%' }}
</div>
</div>
</el-col>
</el-row>
<!-- 各航班配舱进度详情 -->
<el-divider content-position="left">各航班配舱进度</el-divider>
<Tables ref="indexTable" ductName="indexTable" :order="true" :data="tableData" :headerData="tableHeader"
tableAlign="center" :showOverflowTooltip="false" :height="tableHeight" :totalCount="total"
:page="selectData.page" :limitSize="selectData.size" :pageSizes="[100]" :pagination="false"
@currentChange="currentChange" @rowClick="rowClick">
<template v-slot:percentage="scope">
<el-progress stroke-width="100"
:color="(scope.row.percentage * 100).toFixed(2) >= 100 ? '#13ce66' : (scope.row.percentage * 100).toFixed(2) >= 75 ? '#ffba00' : '#ff4949'"
:stroke-width="18"
:percentage="scope.row.percentage == 0 ? 0 : Number((scope.row.percentage * 100).toFixed(2))">
</el-progress>
</template>
</Tables>
</el-card>
</div>
</template>
<script>
import { delUser } from "@/api/system/user";
import { filghtKindData } from "@/api/flightInfoImport";
import { getOneDayFlight } from '@/api/home.js'
export default {
name: 'Index',
props: {
user: {
type: Object,
},
type: Object
}
},
data() {
return {
// 表单校验
selectData: {
fltDate: null,
kindId: null,
page: 1,
size: 1
},//查询条件
tableData: [],//table数据
tableHeader: this.tableHeaders['index'],//表头
fltKindIdList: [],//航班类型
percentage: 0,//配舱比例
totalWeight: 0,//航班总重量
allocationWeight: 0,//航班已配重量
type: "",
tableHeight: null,
total: 0,
loading: false,
};
},
created() {
this.selectData.fltDate = this.nowDate();
this.getFltKindId()
},
// activated() {
// this.getFlight()
// },
mounted() {
this.tableHeight = window.innerHeight - this.$refs.card1.$el.offsetHeight - this.$refs.indexForm.$el.offsetHeight - 350
this.getFlight()
},
methods: {
submit() {
this.msgSuccess("修改成功");
delUser("112").then((response) => {
this.msgSuccess("修改成功");
});
//获取航班类型
async getFltKindId() {
filghtKindData().then(res => {
if (res.code === 200) {
this.fltKindIdList = res.data
} else {
this.msgWarning(res.msg)
}
}).catch(err => {
console.log(err)
})
},
//获取首页信息(日期查询)
async getFlight() {
this.loading = true
getOneDayFlight(this.selectData).then(res => {
this.loading = false
if (res.code === 200) {
this.tableData = res.data.list
this.percentage = res.data.percentage
this.totalWeight = res.data.totalWeight
this.allocationWeight = res.data.allocationWeight
} else {
this.msgWarning(res.msg)
}
}).catch(err => {
this.loading = false
console.log(err)
})
},
//某行被点击
rowClick(val) {
let obj = {}
obj.fltNo = val.fltNo
obj.fltDate = val.fltDate
this.$router.push({ name: 'QueryCargo', params: obj })
},
//翻页
currentChange(val) { },
},
};
</script>
<style lang="scss" scoped>
.cardTop {
height: 400px;
margin: 10px;
padding: 10px;
overflow: auto;
&::-webkit-scrollbar {
height: 5px;
width: 5px;
}
&::-webkit-scrollbar-track {
background-color: #fff;
}
&::-webkit-scrollbar-thumb {
background-color: #ccc;
}
&::-webkit-scrollbar-thumb:hover {
background-color: #409eff;
}
.label {
font-weight: 700;
}
.totalWeight {
font-size: 12px;
}
}
.progressTab {
height: 100%;
}
.allInformation {
width: 100%;
height: 100px;
padding: 10px 20px;
color: #fff;
background-color: #409eff;
.allInformation {
font-size: 12px;
}
.informationNum {
font-size: 24px;
margin-top: 25px;
}
}
.card2 {
.fltBox {
width: 90%;
height: 60px;
font-size: 12px;
font-weight: 700;
color: #fff;
text-align: center;
position: relative;
border-radius: 10px;
padding: 5px;
line-height: 25px;
margin-bottom: 10px;
overflow: hidden;
.fltWeight {
font-size: 14px;
}
}
}
</style>
......
......@@ -24,8 +24,9 @@
<el-select v-model="selectForm.status" class="formItem" placeholder="不限" clearable>
<el-option label="未处理" value="0"></el-option>
<el-option label="处理成功" value="1"></el-option>
<el-option label="处理" value="2"></el-option>
<el-option label="无需处理" value="2"></el-option>
<el-option label="处理失败" value="3"></el-option>
<el-option label="校验不通过" value="4"></el-option>
<el-option label="处理中" value="9"></el-option>
</el-select>
</el-form-item>
......