yiliangyiyun-app/pages/release/release.vue

<template>
	<view class="center">
		<view class="introduce-section">
			<view class="informations " v-for="(item , index) in procurementPlanInfos" :Key="index">
				<view @click="details(item)">
					<view class="flex">
						<view class="logo flex" v-if="item.type == '买粮'">{{item.type}}</view>
						<view class="logo1 flex" v-if="item.type == '卖粮'">{{item.type}}</view>
						<!-- <view class="logo flex" >买粮{{item.planType}}</view> -->
						<text class="grain">{{item.goodsName}}</text>
						<view class="status">
							<view v-if='item.status=="已驳回"' class='put2'>未通过</view>
							<view v-if='item.status=="待审核"' class='put1'>审核中</view>
							<view v-if='item.status=="已认证"' class='put'>已通过</view>
						</view>
					</view>
					<view class="address">{{item.receivePrivate}}{{item.receiveCity}}{{item.receiveArea}}</view>
					<view class="flex ">
						<view class="weight">{{item.weight > 0 ? item.weight : 0}}吨</view>
						<text class="unitPrice">{{item.unitPrice}} <text class="amount">元/吨</text></text>
					</view>
				</view>
				<hr style="margin: 16px 0; color: #EEEEEE;">
				<view class="flex" style="right: 10px;">
					<view @click='edit(item)' v-if='item.status!="待审核"' class='anniu'>编辑</view>
					<view class='anniu' @click="switch1(item)" v-if="item.showFlag == 0">隐藏</view>
					<view class='anniu' @click="switch1(item)" v-if="item.showFlag == 1">显示</view>
					<view class='anniu' @click="deleteRelease(item)">删除</view>
				</view>
			</view>
		</view>
		<picker style='display:inline-block;width: 100%;' @change="releaseChange" :value="releases"
			:range="releaseType">
			<button type="primary" class="btn">发布</button>
			<view class="picker">
				{{releases>-1?releaseType[releases]:''}}
			</view>
		</picker>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				releaseType: ["我要卖粮", "我要买粮"],
				release: '',
				releases: '',
				receivePrivate: '',
				procurementPlanInfo: {
					pageSize: 10,
					currentPage: 1
				},
				releaseIndex: "",
				pageSize: 10,
				currentPage: 1,
				procurementPlanInfos: [],
			}
		},
		onLoad() {
			this.getList()
		},
		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		methods: {
			switch1(item) {
				if (item.type == "买粮") {
					var that = this
					var tips
					if (item.showFlag == 0) {
						tips = "隐藏后该信息不再展示给其他用户，是否确定隐藏？"
					} else if (item.showFlag == 1) {
						tips = "确定显示该信息？"
					}
					uni.showModal({
						content: tips,
						showCancel: true,
						confirmText: '确定',
						success: function(res) {

							if (res.confirm) {
								that.$api.doRequest('post', '/procurementPlanInfo/api/editStatus', {
										id: item.id,
										flag: 0
									}).then(res => {
										// this.procurementPlanInfos = res.data.data.records
										if (res.data.message == "Success") {
											if (item.showFlag == 0) {
												that.$api.msg('隐藏成功！')
											} else if (item.showFlag == 1) {
												that.$api.msg('显示成功！')
											}
											that.getList()
											return
										}
									})
									.catch(res => {
										uni.showToast({
											title: res.errmsg,
											icon: 'none',
											duration: 2000
										})
									});
							} else if (res.cancel) {
								// console.log('用户点击取消');
							}
						},
					})
				} else if (item.type == "卖粮") {
					var that = this
					var tips
					if (item.showFlag == 0) {
						tips = "隐藏后该信息不再展示给其他用户，是否确定隐藏？"
					} else if (item.showFlag == 1) {
						tips = "确定显示该信息？"
					}
					uni.showModal({
						content: tips,
						showCancel: true,
						confirmText: '确定',
						success: function(res) {
							if (res.confirm) {
								that.$api.doRequest('post', '/salePlanInfo/api/editStatus', {
										id: item.id,
										flag: 0
									}).then(res => {
										// this.procurementPlanInfos = res.data.data.records
										if (res.data.message == "Success") {
											if (item.showFlag == 0) {
												that.$api.msg('隐藏成功！')
											} else if (item.showFlag == 1) {
												that.$api.msg('显示成功！')
											}
											that.getList()
											return
										}
									})
									.catch(res => {
										uni.showToast({
											title: res.errmsg,
											icon: 'none',
											duration: 2000
										})
									});
							} else if (res.cancel) {
								// console.log('用户点击取消');
							}
						},
					})
				}
			},
			edit(item) {
				if (item.type == "买粮") {
					uni.navigateTo({
						url: `/pageD/myRelease/buyEdit?id=${item.id}`
					})
				} else if (item.type == "卖粮") {
					uni.navigateTo({
						url: `/pageD/myRelease/sellEdit?id=${item.id}`
					})
				}
			},
			deleteRelease(item) {
				if (item.type == "买粮") {
					uni.showModal({
						// title: '登录提示',
						content: '确定删除该信息？',
						showCancel: true,
						confirmText: '确定',
						success: function(res) {
							if (res.confirm) {
								this.$api.doRequest('post', '/procurementPlanInfo/api/deleteProcurementPlan', {
										id: item.id
									}).then(res => {
										if (res.data.message == "Success") {
											this.$api.msg('删除成功！')
											this.getList()
											return
										}
									})
									.catch(res => {
										uni.showToast({
											title: res.errmsg,
											icon: 'none',
											duration: 2000
										})
									});
							} else if (res.cancel) {
								// console.log('用户点击取消');
							}
						},
						fail: () => {},
						complete: () => {}
					})
				} else if (item.type == "卖粮") {
					uni.showModal({
						// title: '登录提示',
						content: '确定删除该信息？',
						showCancel: true,
						confirmText: '确定',
						success: function(res) {
							if (res.confirm) {
								this.$api.doRequest('post', '/salePlanInfo/api/deleteSalePlanInfo', {
										id: item.id
									}).then(res => {
										if (res.data.message == "Success") {
											this.$api.msg('删除成功！')
											this.getList()
											return
										}
									})
									.catch(res => {
										uni.showToast({
											title: res.errmsg,
											icon: 'none',
											duration: 2000
										})
									});
							} else if (res.cancel) {
								// console.log('用户点击取消');
							}
						},
						fail: () => {},
						complete: () => {}
					})

				}
			},
			releaseChange(e) {
				this.receivePrivate = e.detail.value
				this.release = this.releaseType[this.receivePrivate];
				this.pageSize = 1

				if (this.release == "我要卖粮") {
					uni.navigateTo({
						url: `/pageD/myRelease/sellGrain`
					})
				} else if (this.release == "我要买粮") {
					uni.navigateTo({
						url: `/pageD/myRelease/buyGrain`
					})
				}
			},
			details(item) {
				if (item.type == "买粮") {
					uni.navigateTo({
						url: `/pageD/myRelease/buyDetails?id=${item.id}`
					})
				} else if (item.type == "卖粮") {
					uni.navigateTo({
						url: `/pageD/myRelease/sellDetails?id=${item.id}`
					})
				}
			},

			getList() {
				// this.procurementPlanInfo.pcFlag = "1"
				this.procurementPlanInfo.commonId = this.userInfo.id
				this.$api.doRequest('get', '/procurementPlanInfo/selectProcurementPlanInfoAPP', this.procurementPlanInfo)
					.then(res => {
						this.procurementPlanInfos = res.data.data.records
					})
					.catch(res => {
						uni.showToast({
							title: res.errmsg,
							icon: 'none',
							duration: 2000
						})
					});
			}

		}
	}
</script>

<style>
	.center {
		padding: 10px 20px;
		background-color: #F5F6FA;
	}

	.informations {
		background-color: #FFFFFF;
		margin-top: 20px;
		border-radius: 16px;
		padding: 10px;
	}

	.labels {
		display: inline-flex;
		line-height: 20px;
		margin-right: 40px;
	}

	.fabuBut {
		margin-bottom: 0px;
	}

	.logo {
		width: 36px;
		height: 24px;
		background-color: #FEECE6;
		color: #FE6430;
		border-radius: 8px;
		padding: 3px;
		margin-top: 2px;
	}

	.logo1 {
		width: 36px;
		height: 24px;
		background-color: #E9F8F0;
		color: #22C572;
		border-radius: 8px;
		padding: 3px;
		margin-top: 2px;
	}

	.grain {
		font-size: 18px;
		color: #333333;
		font-weight: 600;
		margin-left: 20px;
	}

	.address {
		margin-left: 56px;
		font-size: 14px;
		color: #333333;
	}

	.weight {
		margin-left: 56px;
		font-size: 14px;
		color: #878C9C;
	}

	.unitPrice {

		font-size: 22px;
		font-weight: 600;
		/* 	margin-left: 200px; */
		position: absolute;
		/* text-align: right; */
		right: 40px;

	}

	/* .amount{
		width: 100%;
	} */
	.amount {
		margin-left: 10px;
		font-size: 12px;

	}

	.status {
		position: absolute;
		right: 40px;
	}

	.put {
		color: #22C572;
		font-size: 14px;
	}

	.put1 {
		color: #FE6430;
		font-size: 14px;
	}

	.put2 {
		color: #FB1E1E;
		font-size: 14px;
	}

	.anniu {
		width: 60px;
		height: 30px;
		border: 1px solid #CDCDCD;
		border-radius: 16px;
		text-align: center;
		line-height: 30px;
		margin-left: 10px;
	}

	.btn {
		width: 100%;
		border-radius: 20px;
		background-color: #22C572;
		margin-top: 10px;
	}
</style>