2024-05-15 14:52:29 +08:00

304 lines
8.9 KiB
Vue

<!-- 仓库配料 -->
<template>
<view>
<u-line></u-line>
<view class="area">
<u--form labelPosition="left" labelWidth="240" :labelStyle="labelstyle">
<u-form-item label="输入站点" borderBottom>
<u--input
v-model="select_position"
border="surround"
placeholder="填入站点"
suffixIcon="map-fill"
suffixIconStyle="{color: #00aaff;font-size: 30px;}"
></u--input>
</u-form-item>
</u--form>
<u-scroll-list>
<view v-for="(item, index) in start_point_positions" :key="index">
<view style="margin-right: 10px">
<u-button type="primary" icon="map" :text="item" v-if="index % 3 == 0" @click="check_position(item)"></u-button>
<u-button type="success" icon="map" :text="item" v-if="index % 3 == 1" @click="check_position(item)"></u-button>
<u-button
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))"
icon="map"
:text="item"
v-if="index % 3 == 2"
@click="check_position(item)"
></u-button>
</view>
</view>
</u-scroll-list>
</view>
<u-line></u-line>
<view class="area">
<u-row>
<u-col span="8">
<u-button @click="timeshow = true">选择日期</u-button>
<u-datetime-picker :show="timeshow" v-model="workerorder_time" mode="date" @confirm="confirm()" @cancel="timeshow = false"></u-datetime-picker>
</u-col>
<u-col span="4">
<view style="font-size: 1.2rem">{{ workerorder_time | formatDate }}</view>
</u-col>
</u-row>
</view>
<u-line></u-line>
<u-row gutter="30">
<u-col span="4">
<view>毛坯号</view>
</u-col>
<u-col span="2">
<span>计划上件数</span>
</u-col>
<u-col span="2">
<span>已经上件数</span>
</u-col>
<u-col span="4">
<span>选中</span>
</u-col>
</u-row>
<view class="area scrollable-container">
<u-list height="330px">
<u-list-item v-for="(item, index) in workerorder_list" :key="index">
<u-row gutter="30">
<u-col span="4">
<u-tag v-if="containsChinese(item.clientWorkorder)" :text="item.blankNumber" size="large" type="warning"></u-tag>
<u-tag v-else :text="item.blankNumber" size="large"></u-tag>
</u-col>
<u-col span="2">
<u-tag v-if="containsChinese(item.clientWorkorder)" :text="item.previousNumber" size="large" type="warning"></u-tag>
<u-tag v-else :text="item.previousNumber"></u-tag>
</u-col>
<u-col span="2">
<u-tag type="success" :text="item.previousNumbered" plain></u-tag>
</u-col>
<u-col span="4">
<u-switch v-model="item.selected" size="60" asyncChange @change="switch_change(index, item.selected)"></u-switch>
</u-col>
</u-row>
<u-line style="margin-top: 10px"></u-line>
</u-list-item>
</u-list>
</view>
<uni-pagination show-icon="true" :total="page.total" :current="page.pageNum" :pageSize="page.pageSize" @change="changepage"></uni-pagination>
<u-modal :show="show_model" title="确认选中数量" @confirm="ingredient_confirm">
<u--form labelPosition="left" labelWidth="240" :labelStyle="labelstyle">
<u-form-item label="配料数量" borderBottom>
<u--input v-model="ingredient" border="surround" type="number"></u--input>
</u-form-item>
</u--form>
</u-modal>
<u-button style="margin-top: 10px;" type="primary" size="big" text="生成配料任务" @click="generatetask"></u-button>
<u-modal :show="task.show" :title="task.title" :content="task.content" @confirm="task.show = false"></u-modal>
<u-loading-page :loading="loading" loading-text="加载数据中..." loading-color="#00ff00" icon-size="150"></u-loading-page>
<u-notify ref="uNotify" message="Hi uView"></u-notify>
</view>
</template>
<script>
import { achievestartpoints, getworkorderlist, generatetasklist } from '@/api/materialManagement/MaterialProductionInput.js';
import { printDate } from '@/utils/common';
export default {
data() {
return {
start_point_positions: [],
select_position: '', //选中的 站点
timeshow: false,
workerorder_time: Number(new Date()),
page: {
pageNum: 1,
pageSize: 10,
total: 0
},
labelstyle: {
'font-size': '1.2rem'
},
workerorder_list: [],
show_model: false,
ingredient: 100,
selected_index: null,
message: false,
task: {
show: false,
title: '生成配料任务',
content: ''
},
loading: false
};
},
filters: {
formatDate: function (value) {
// 创建一个 Date 对象,并使用时间戳初始化
const date = new Date(value);
// 提取年、月、日信息
const year = date.getFullYear();
const month = date.getMonth() + 1; // 月份从 0 开始,所以要加 1
const day = date.getDate();
return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
}
},
watch: {},
mounted() {
this.get_startpoints();
},
methods: {
containsChinese(str) {
var pattern = /[\u4e00-\u9fa5]/;
return pattern.test(str);
},
// todo 获取上料起点
get_startpoints() {
achievestartpoints().then((res) => {
if (res.code == 200) {
this.start_point_positions = res.data;
}
});
},
check_position(item) {
this.select_position = item;
},
//todo 选择时间
confirm() {
this.timeshow = false;
this.$nextTick(() => {
this.get_workorder_list();
});
},
//todo 下拉更新
changepage({ type, current }) {
this.page.pageNum = current;
this.$nextTick(() => {
this.get_workorder_list();
});
},
//todo 根据日期获取工单
get_workorder_list() {
this.loading = true;
// let date = new Date(this.workerorder_time);
// date = new Date(date.getTime() + date.getTimezoneOffset() * 60 * 1000);
// 使用时间戳创建一个日期对象
let date = new Date(this.workerorder_time);
// 获取上海时区的时间偏移量(以分钟为单位)
let offset = 8 * 60; // 上海时区为 UTC+8
// 计算上海时区的时间
let shanghaiTime = new Date(date.getTime() + offset * 60 * 1000);
const query = {
datetimespan: shanghaiTime,
pageNum: this.page.pageNum,
pageSize: this.page.pageSize
};
getworkorderlist(query).then((res) => {
if (res.code == 200) {
this.loading = false;
//提示
this.$refs.uNotify.show({
top: 100,
type: 'success',
message: '获取工单数据成功,共' + res.data.item1.length + '条。时间为' + printDate(shanghaiTime),
duration: 1000 * 3,
fontSize: 20,
safeAreaInsetTop: true
});
this.workerorder_list = res.data.item1;
this.page.total = res.data.item2;
// this.workerorder_list = res.data;
for (let item = 0; item < this.workerorder_list.length; item++) {
this.workerorder_list[item].selected = false;
this.workerorder_list[item].previousNumbered = 0;
}
console.log('this.workerorder_list', this.workerorder_list);
}
});
},
//todo 选中之后 弹窗
switch_change(index, selected) {
selected = !selected;
if (selected) {
this.show_model = true;
this.ingredient = this.workerorder_list[index].previousNumber;
this.selected_index = index;
} else {
this.workerorder_list[index].previousNumbered = 0;
this.workerorder_list[index].selected = false;
// 使用 Vue.set 方法或 this.$set 方法来添加新的属性
// this.$set(this.workerorder_list[index], 'previousNumbered', 0);
// this.$nextTick(() => {
// this.workerorder_list[index].previousNumbered = 0;
// });
this.$forceUpdate();
}
},
//模态框 确认
ingredient_confirm() {
this.show_model = false;
this.workerorder_list[this.selected_index].previousNumbered = this.ingredient;
this.workerorder_list[this.selected_index].selected = true;
},
// 生成配料任务
generatetask() {
if (this.select_position === '' || this.select_position === null) {
uni.showModal({
title: '提示',
content: '站点未输入,请输入站点',
showCancel: false,
confirmText: '确认',
success: (res) => {}
});
return;
}
let array1 = this.workerorder_list.filter((it) => it.selected);
let array = array1.map((it) => {
return {
workorder: it.clientWorkorder,
blanknumber: it.blankNumber,
previousNumber: it.previousNumber,
previousNumbered: it.previousNumbered
};
});
const query = {
agv_position: this.select_position,
workorders: array
};
generatetasklist(query).then((res) => {
if (res.code == 200) {
this.task.show = true;
this.task.content = '生产配料任务成功' + res.data;
this.reset();
}
});
},
reset() {
this.select_position = '';
this.selected_index = null;
for (let i = 0; i < this.workerorder_list.length; i++) {
(this.workerorder_list[i].previousNumbered = 0), (this.workerorder_list[i].selected = false);
}
this.get_workorder_list();
}
}
};
</script>
<style scoped>
.area {
background-color: white;
}
.scrollable-container {
overflow: auto;
border: 3px solid #9e9b99;
}
.u-item {
}
</style>