zhuangpeimespda/pages/materialManagement/preparationByPlan/taskDetail.vue

<template>
	<view>
		<uni-card>
			<text>{{ title }}</text>
		</uni-card>
		<button class="deleteAllButton" type="warn" @click="deleteAll">全部删除</button>
		<uni-list style="width: 100%">
			<uni-list-item v-for="(item, index) in taskList" :key="index" :title="item.title" :note="item.note">
				<template v-slot:footer>
					<view class="slot-box">
						<uni-icons type="compose" size="36" color="#18bc37" @click="update(item)"></uni-icons>
						<uni-icons style="margin-left: 20px;" type="trash" size="36" color="#e43d33" @click="deleteOne(item.id)"></uni-icons>
					</view>
				</template>
			</uni-list-item>
		</uni-list>
		<!-- 删除弹框 -->
		<uni-popup ref="deleteAllPopup" type="dialog" :mask-click="false">
			<uni-popup-dialog mode="base" type="error" title="将删除这个任务全部信息,是否继续?" @confirm="deleteAllConfirm"></uni-popup-dialog>
		</uni-popup>
		<!-- 修改弹框 -->
		<uni-popup ref="updatePopup" type="dialog" :mask-click="false">
			<uni-popup-dialog
				mode="input"
				type="warning"
				title="修改配料数量"
				:value="updateItem.quantity"
				placeholder="请输入配料数量"
				@confirm="updateConfirm"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 删除弹框 -->
		<uni-popup ref="deleteOnePopup" type="dialog" :mask-click="false">
			<uni-popup-dialog mode="base" type="error" title="将删除这条记录,是否继续?" @confirm="deleteOneConfirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
import { getTaskInfosByLine, deleteTask, deletePreparationMaterialInfo, updatePreParationMaterialNum } from '@/api/preparationTask/index.js';
export default {
	onLoad: function (option) {
		this.taskCode = option.taskCode;
		this.title = option.title;
	},
	onShow: function () {
		this.$nextTick(() => {
			this.doGetTaskInfoList();
		});
	},
	data() {
		return {
			title: '',
			taskCode: '',
			taskList: [],
			updateItem: {
				id: '',
				materialCode: '',
				materialName: '',
				specification: '',
				quantity: 0
			},
			deleteId:''
		};
	},
	methods: {
		doGetTaskInfoList() {
			uni.showLoading();
			const params = {
				task_code: this.taskCode
			};
			getTaskInfosByLine(params)
				.then((res) => {
					if (res.code === 200) {
						this.taskList = res.data.map((item) => {
							return {
								id: item.id,
								materialCode: item.materialCode,
								materialName: item.materialName,
								specification: item.specification,
								quantity: item.quantity,
								title: `物料号:${item.materialCode}`,
								note: `描述:${item.materialName ?? ''}\n规格:${item.specification ?? ''}\n配料数量:${item.quantity}`,
								rightText: `配料数量:${item.quantity}`
							};
						});
					}
				})
				.finally(() => {
					uni.hideLoading();
				});
		},
		deleteAll() {
			this.$refs.deleteAllPopup.open();
		},
		deleteAllConfirm() {
			const taskCode = this.taskCode;
			const params = {
				task_code: taskCode
			};
			deleteTask(params).then((res) => {
				if (res.code === 200 && res.data > 0) {
					this.$refs.deleteAllPopup.close();
					uni.navigateBack();
					uni.showToast({
						title: '删除成功',
						icon: 'none'
					});
				} else {
					uni.showToast({
						title: '删除失败',
						icon: 'error'
					});
				}
			});
		},
		update(item) {
			this.updateItem.id = item.id;
			this.updateItem.quantity = item.quantity;
			this.$refs.updatePopup.open();
		},
		updateConfirm(value) {
			const updateItem = this.updateItem;
			const params = {
				id: updateItem.id,
				num: value
			};
			updatePreParationMaterialNum(params).then((res) => {
				if (res.code === 200 && res.data > 0) {
					this.doGetTaskInfoList();
					this.$refs.updatePopup.close();
					uni.showToast({
						title: '修改成功',
						icon: 'none'
					});
				}
			});
		},
		deleteOne(id){
			this.deleteId = id
			this.$refs.deleteOnePopup.open();
		},
		deleteOneConfirm(){
			const params = {
				id:this.deleteId
			}
			deletePreparationMaterialInfo(params).then(res=>{
				if (res.code === 200 && res.data > 0) {
					this.doGetTaskInfoList();
					this.$refs.deleteOnePopup.close();
					uni.showToast({
						title: '删除成功',
						icon: 'none'
					});
				}
			})
		}
	}
};
</script>

<style scoped>
.deleteAllButton {
	width: 96%;
	margin: 0 auto;
	margin-bottom: 10px;
}
.slot-box{
	margin: 5px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}
</style>