detail.vue 6.53 KB
<template>
	<view>
		<view class="content">
			<view class="top">
				<view class="common u-f plr-10">
					<view class="u-f1">
						仓库
					</view>
					<view class="u-f3 ta-r">
						{{warehouseCodeFormat(detailInfo.warehouseCode)}}
					</view>
				</view>
				<view class="common u-f u-f-jcsb plr-10">
					<view class="">
						货主
					</view>
					<view class="u-f3 ta-r">
						{{companyCodeFormat(detailInfo.companyCode)}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						预警类型
					</view>
					<view class="u-f3 ta-r">
						{{alarmType}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						最大
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.max}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						最小
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.min}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						警戒上限
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.upper}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						警戒下限
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.lower}}
					</view>
				</view>
			</view>
			<view class="center">
				<view class="common u-f plr-10">
					<view class="u-f1">
						物料名称
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.materialName}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						物料编号
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.materialCode}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						物料类型
					</view>
					<view class="u-f3 ta-r">
						{{materialTypeFormat(detailInfo.materialType)}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						规格型号
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.materialSpec}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						单位
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.materialUnit}}
					</view>
				</view>
			</view>
			<view class="bottom">
				<view class="common u-f plr-10">
					<view class="u-f1">
						创建人
					</view>
					<view class="u-f3 ta-r">
						{{detailInfo.createdBy}}
					</view>
				</view>
				<view class="common u-f plr-10">
					<view class="u-f1">
						创建时间
					</view>
					<view class="u-f3 ta-r">
						{{formatTime(detailInfo.created)}}
					</view>
				</view>
			</view>

		</view>
		<view class="footer u-f u-f-aic">
			<button type="default" size="mini" plain class="delBtn" @tap="delMaterial(detailInfo.id,index)">
				<uni-icons type="trash" size="14"></uni-icons>删除
			</button>
			<button type="default" size="mini" plain class="saveBtn" @tap="goEdit(detailInfo.id)">
				<uni-icons type="compose" size="14"></uni-icons>修改
			</button>
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				detailInfo: {},
				companyArr: [],
				warehouseArr: [],
				materialTypeArr: [],
				alarmType: '',
				timer: null,
				index: null,
				flag: false
			}
		},
		onBackPress() {
			if(this.flag == false) {
				this.$prePage().handleEdit(this.index, this.detailInfo);
			}
		},
		onLoad(option) {

			this.index = option.index;
			this.getMaterialWarning(option.id);
			this.$api.dict.getCompaniesByToken().then(res => {

				this.companyArr = res.data
			});

			this.$api.material.getMaterialType().then(res => {

				this.materialTypeArr = res.data.data
			});
			try {
				const value = uni.getStorageSync('historyUser').username;
				if (value) {
					this.$api.dict.getWarehouseByUserCode(value).then(res => {
						this.warehouseArr = res.data.data
					});
				}
			} catch (e) {
				// error
			}
		},

		onUnload() {
			if (this.timer) {
				clearTimeout(this.timer);
				this.timer = null;
			}
		},
		methods: {
			// 获取预警设置详情
			getMaterialWarning(id) {
				this.$api.material.getMaterialWarning(id).then(res => {

					if (res.data.code == 200) {
						this.detailInfo = res.data.data;
						this.$api.material.listAlarmtype().then(response => {

							response.data.rows.forEach(item => {
								if (this.detailInfo.alarmType == item.type) {
									this.alarmType = item.remark
								}
							})
						});
					}
				});
			},

			// 货主字典翻译
			companyCodeFormat(companyCode) {
				return this.selectCommonLabel(this.companyArr, companyCode);
			},
			// 仓库字典翻译
			warehouseCodeFormat(warehouseCode) {
				return this.selectCommonLabel(this.warehouseArr, warehouseCode);
			},

			// 物料类型字典翻译
			materialTypeFormat(type) {
				return this.selectCommonLabel(this.materialTypeArr, type);
			},

			// 删除按钮操作
			delMaterial(id, index) {
				uni.showModal({
					title: '提示',
					content: '确定要删除该物料吗?',
					success: (res) => {
						if (res.confirm) {
							this.$api.material.delMaterialWarning(id).then(res => {
								if (res.data.code == 200) {
									this.flag = true;
									this.$prePage().handleDel(index);
									this.$wx.showToast({
										title: '删除成功!'
									});
									this.timer = setTimeout(() => {
										uni.navigateBack()
									}, 400)
								} else {
									uni.showModal({
										title: '提示',
										content: res.data.msg
									});
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			},
			// 点击修改按钮
			goEdit(id) {
				uni.navigateTo({
					url: 'add-edit?page=detail&type=edit&id=' + id
				})
			}

		}

	}
</script>

<style lang="scss" scoped>
	.content {
		overflow-y: auto;
		padding-bottom: 100rpx;

		.top,
		.center,
		.bottom {
			background-color: $uni-bg-color;

			.common {
				height: 90rpx;
				line-height: 90rpx;
				font-size: $uni-font-size-lg;
				border-bottom: 2rpx solid $uni-border-color;

				.ta-r {
					text-align: right;
				}
			}

		}

		.center {
			margin: $uni-spacing-col-base 0;
		}

		.bottom {
			margin-bottom: $uni-spacing-col-base;
		}

	}

	.footer {
		position: fixed;
		width: 100%;
		bottom: 0;
		height: 100rpx;
		border-top: 2rpx solid $uni-border-color;
		border-bottom: 2rpx solid $uni-border-color;
		background-color: $uni-bg-color;

		.delBtn,
		.saveBtn {
			width: 320rpx;
			border-radius: 90rpx !important;
			margin-left: $uni-spacing-row-base;
			border-color: $uni-border-color;
		}

	}
</style>