You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
250 lines
8.5 KiB
Vue
250 lines
8.5 KiB
Vue
<template>
|
|
<view>
|
|
<u-sticky
|
|
class="sticky"
|
|
:custom-nav-height="0"
|
|
>
|
|
<u-navbar
|
|
title="生产计划"
|
|
bg-color="transparent"
|
|
:auto-back="false"
|
|
left-icon=""
|
|
safe-area-inset-top
|
|
placeholder
|
|
/>
|
|
</u-sticky>
|
|
<uni-notice-bar show-icon scrollable text="安全生产！有序生产！高效生产！" />
|
|
<uni-section title="开工中" type="line" title-color="#18bc37"> </uni-section>
|
|
<el-collapse accordion>
|
|
<el-collapse-item v-for="(item, index) in startList" :name="item.id">
|
|
<template #title>
|
|
<el-icon><Tickets /></el-icon>
|
|
<el-text size="large">{{item.productName}}</el-text> /
|
|
<el-text type="success">计划数:{{ item.planNumber }}</el-text>
|
|
</template>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-text type="success">{{item.code}}</el-text>-
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-text type="success">计划开始:{{ timestampToTime(item.planStartTime) }}</el-text>
|
|
</el-col>
|
|
<el-col v-if="auth.hasPermi('mes:plan:update')" :span="4">
|
|
<el-button type="success" plain @click="updatePlan(item.id, item.code,'end')">完工</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-text type="warning">计划结束:{{ timestampToTime(item.planEndTime) }}</el-text>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-text type="warning">入库数:{{ item.finishNumber }}</el-text>
|
|
</el-col>
|
|
<el-col v-if="auth.hasPermi('mes:plan:update')" :span="4">
|
|
<el-button type="warning" plain @click="updatePlan(item.id,item.code,'pause')">暂停</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="20">
|
|
<el-text>备注:{{ item.remark }}</el-text>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-button type="info" plain @click="planProgress(item)">进度</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
|
|
<!-- 派工中-->
|
|
<uni-section title="派工中" type="line" title-color="#2979ff"></uni-section>
|
|
<el-collapse accordion>
|
|
<el-collapse-item v-for="(item, index) in paigongList" :name="item.id">
|
|
<template #title>
|
|
<el-icon><Tickets /></el-icon>
|
|
<el-text size="large">{{item.productName}}</el-text> /
|
|
<el-text type="success">计划数:{{ item.planNumber }}</el-text>
|
|
</template>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-text type="success">{{item.code}}</el-text>-
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-text type="success">计划开始:{{ timestampToTime(item.planStartTime) }}</el-text>
|
|
</el-col>
|
|
<el-col v-if="auth.hasPermi('mes:plan:update')" :span="4">
|
|
<el-button type="info" plain @click="updatePlan(item.id,item.code, 'start')">开工</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-text type="warning">计划结束:{{ timestampToTime(item.planEndTime) }}</el-text>
|
|
</el-col>
|
|
</el-row>
|
|
<el-text>备注:{{ item.remark }}</el-text>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
<!-- 计划中-->
|
|
<uni-section title="计划中" type="line" title-color="#f3a73f"></uni-section>
|
|
<el-collapse accordion>
|
|
<el-collapse-item v-for="(item, index) in planList" :name="item.id">
|
|
<template #title>
|
|
<el-icon><Tickets /></el-icon>
|
|
<el-text size="large">{{item.productName}}</el-text> /
|
|
<el-text type="success">计划数:{{ item.planNumber }}</el-text>
|
|
</template>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-text type="success">{{item.code}}</el-text>-
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-text type="success">计划开始:{{ timestampToTime(item.planStartTime) }}</el-text>
|
|
</el-col>
|
|
<el-col v-if="auth.hasPermi('mes:plan:update')" :span="4">
|
|
<el-button type="primary" plain>派工</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-text type="warning">计划结束:{{ timestampToTime(item.planEndTime) }}</el-text>
|
|
</el-col>
|
|
</el-row>
|
|
<el-text>备注:{{ item.remark }}</el-text>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
<!-- 暂停中 -->
|
|
<uni-section title="暂停中" type="line" title-color="#e43d33"></uni-section>
|
|
<el-collapse accordion>
|
|
<el-collapse-item v-for="(item, index) in pauseList" :name="item.id">
|
|
<template #title>
|
|
<el-icon><Tickets /></el-icon>
|
|
<el-text size="large">{{item.productName}}</el-text> /
|
|
<el-text type="success">计划数:{{ item.planNumber }}</el-text>
|
|
</template>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-text type="success">{{item.code}}</el-text>-
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-text type="success">计划开始:{{ timestampToTime(item.planStartTime) }}</el-text>
|
|
</el-col>
|
|
<el-col v-if="auth.hasPermi('mes:plan:update')" :span="4">
|
|
<el-button type="success" plain @click="updatePlan(item.id,item.code, 'end')">完工</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-text type="warning">计划结束:{{ timestampToTime(item.planEndTime) }}</el-text>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-text type="warning">入库数:{{ item.finishNumber }}</el-text>
|
|
</el-col>
|
|
<el-col v-if="auth.hasPermi('mes:plan:update')" :span="4">
|
|
<el-button type="info" plain @click="updatePlan(item.id, item.code,'start')">开工</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-text>备注:{{ item.remark }}</el-text>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
<!-- <view class="charts-box">-->
|
|
<!-- <qiun-data-charts :chartData="chartData" type="column"/>-->
|
|
<!-- </view>-->
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {ref, onMounted} from 'vue';
|
|
import useUserStore from '@/store/modules/user'
|
|
import {getPage, getById, paigong, updateStatus, getByStatus} from "@/api/mes/plan"
|
|
import {timestampToTime} from "@/utils/dateUtil";
|
|
import {Tickets} from "@element-plus/icons-vue";
|
|
import modal from "@/plugins/modal";
|
|
import tab from "@/plugins/tab";
|
|
import {showConfirm} from "@/utils/common";
|
|
import auth from "@/plugins/auth";
|
|
const userStore = useUserStore()
|
|
const startList = ref([]);
|
|
const paigongList = ref([]);
|
|
const pauseList = ref([]);
|
|
const planList = ref([]);
|
|
const chartData = ref({});
|
|
|
|
onMounted(() => {
|
|
getServerData()
|
|
getPlanList()
|
|
});
|
|
function getServerData() {
|
|
// 模拟从服务器获取数据时的延时
|
|
setTimeout(() => {
|
|
let res = {
|
|
categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
|
|
series: [
|
|
{
|
|
name: '目标值',
|
|
data: [35, 36, 31, 33, 13, 34],
|
|
},
|
|
{
|
|
name: '完成量',
|
|
data: [18, 27, 21, 24, 6, 28],
|
|
},
|
|
],
|
|
};
|
|
chartData.value = JSON.parse(JSON.stringify(res));
|
|
}, 500);
|
|
}
|
|
// 加载列表数据
|
|
function getPlanList() {
|
|
getByStatus(0).then(response => {
|
|
planList.value = response.data
|
|
})
|
|
getByStatus(1).then(response => {
|
|
paigongList.value = response.data
|
|
})
|
|
getByStatus(2).then(response => {
|
|
startList.value = response.data
|
|
})
|
|
getByStatus(3).then(response => {
|
|
pauseList.value = response.data
|
|
})
|
|
|
|
}
|
|
|
|
/** 开工 */
|
|
function updatePlan(id, planCode, type){
|
|
let content = '确定['
|
|
if(type==='start')content= content+'开工]' + planCode +'?'
|
|
else if(type==='end')content= content+'完工]'+ planCode +'?'
|
|
else if(type==='pause')content= content+'暂停]'+ planCode +'?'
|
|
showConfirm(content).then(res => {
|
|
if (res.confirm) {
|
|
const data = {'id':id, 'code':type}
|
|
updateStatus(data).then(response => {
|
|
console.log(response)
|
|
getPlanList()
|
|
})
|
|
modal.msgSuccess("操作成功")
|
|
}
|
|
})
|
|
}
|
|
//看进度
|
|
function planProgress(plan){
|
|
tab.navigateTo('/page_report/planProgress',plan)
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.sticky {
|
|
background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
|
|
backdrop-filter: blur(27.18px);
|
|
box-shadow: 0 1px 1px 0 rgba(0, 72, 145, 0.1),
|
|
0 0.5px 0 0 rgba(0, 0, 0, 0.1);
|
|
}
|
|
.title {
|
|
font-size: 36rpx;
|
|
color: #8f8f94;
|
|
}
|
|
.charts-box {
|
|
width: 100%;
|
|
height: 300px;
|
|
}
|
|
</style>
|