选择自提点

pages/groupbuying/publish_group/index.vue

@@ -44,10 +44,9 @@
 					<view class='item acea-row row-between-wrapper'>
 						<view class='name'>自提点</view>
 						<view @click="openSelfTakeTable()">
-							<input placeholder='请选择提自提点' name="phone" disabled :value='ztd' placeholder-class='placeholder'
+							<input placeholder='请选择提自提点' name="phone" disabled v-model="ztd" :value='ztd' placeholder-class='placeholder'
 								maxlength="11"></input>
 						</view>
-						<u-picker @confirm="confirmZTD()" :show="showZTD" :columns="selfTakeList" keyName="name"></u-picker>
 					</view>
 
 
@@ -95,13 +94,7 @@
 
 
 				<button class='keepBnt' form-type="submit">保存并提交</button>
-				<!-- #ifdef MP -->
-				<!-- <view class="wechatAddress" v-if="!id" @click="getWxAddress">{{ $t(`导入微信地址`) }}</view> -->
-				<!-- #endif -->
-				<!-- #ifdef H5 -->
-				<view class="wechatAddress" v-if="this.$wechat.isWeixin() && !id" @click="getAddress">{{ $t(`导入微信地址`) }}
-				</view>
-				<!-- #endif -->
+
 			</view>
 		</form>
 		<!-- #ifdef MP -->
@@ -116,6 +109,60 @@
 				<publish_good_list @getSelectData="getSelectData" v-if="addGoodPopupShow"></publish_good_list>
 			</view>
 		</u-popup>
+
+		<u-popup :show="selfTakeShow" @close="selfTakeShow = false">
+
+			<view class="box_3 flex-col">
+
+				<view class="flex-row  justify-between">
+					<text class="icon_2" @click="closeFalse()">取消</text>
+					<text class="icon_2" @click="closeTrue()">确定</text>
+				</view>
+				<text class="text_25">选择自提点</text>
+
+				<scroll-view scroll-y="true" class="scroll-y">
+					<view class="list_1 flex-col">
+
+						<view	@click="clickSelfTake(item,index)"
+								 class="list-items_1 flex-row"
+								 v-for="(item, index) in selfTakeList"
+								 :key="index">
+							<view class="flex-col  justify-center">
+
+								<view v-if="item.addressTrue" class="image-view">
+									<image class="image" src="/static/images/v.png"></image>
+								</view>
+								<view v-else class="image-view " >
+									<image class="image" src="/static/images/o.png"></image>
+								</view>
+							</view>
+
+							<view class="dataGroup">
+
+								<view class="group_14 flex-row justify-between">
+									<view class="flex-col">
+										<text class="text_26" >{{item.name}}</text>
+										<text class="text_27" >{{item.address}}</text>
+									</view>
+									<view class="flex-row justify-between">
+										<text class="text-group_9" >距您{{item.distanceDesc}}</text>
+										<image class="icon_3"
+											   src="http://www.gzzzyd.com/groupon/order_details/距离@2x.png"/>
+									</view>
+								</view>
+								<view class="group_15 flex-row">
+									<view class="tag_1 flex-col">
+										<text class="text_28">营业时间: {{item.busStartTimeDesc}}-{{item.busEndTimeDesc}}</text>
+									</view>
+								</view>
+							</view>
+
+						</view>
+					</view>
+				</scroll-view>
+			</view>
+		</u-popup>
+
 	</view>
 </template>
 
@@ -134,6 +181,7 @@ import authorize from '@/components/Authorize';
 import home from '@/components/home';
 import publish_good_list from '../publish_good_list/index.vue';
 import colors from '@/mixins/color.js';
+import {forEach} from "../../../uni_modules/uview-ui/libs/luch-request/utils";
 export default {
 	components: {
 		// #ifdef MP
@@ -145,6 +193,8 @@ export default {
 	mixins: [colors],
 	data () {
 		return {
+			ztd:'',
+			selfTakeShow:false,
 			grouponDateTime: '',
 			takeDateTime: '',
 			datetimerange1: '',
@@ -176,7 +226,7 @@ export default {
 			noCoupon: 0,
 			selectGoodList: [],
 			selfTakeList: [],
-			ztd: ''
+			addressIds:[]
 		};
 	},
 	computed: mapGetters(['isLogin']),
@@ -203,6 +253,40 @@ export default {
 		}
 	},
 	methods: {
+
+		closeFalse(){
+			this.selfTakeShow = false;
+		},
+		closeTrue(){
+			this.selfTakeShow = false;
+			console.log(this.grouponReqData.selfTakeIds)
+			this.selfTakeList.forEach(e =>{
+				this.grouponReqData.selfTakeIds.forEach(ee =>{
+					if (e.id === ee){
+						if (this.ztd){
+							this.ztd=this.ztd +','+e.name
+						}else {
+							this.ztd=e.name
+						}
+					}
+				})
+			})
+
+			console.log(this.ztd)
+
+		},
+
+		clickSelfTake(item,index){
+			item.addressTrue = !item.addressTrue;
+			this.$set(this.selfTakeList,index,item)
+			if (this.grouponReqData.selfTakeIds.indexOf(item.id) === -1){
+				this.grouponReqData.selfTakeIds.push(item.id)
+			}else {
+				this.grouponReqData.selfTakeIds = this.grouponReqData.selfTakeIds.filter(iter => iter !== item.id)
+			}
+
+		},
+
 		confirmDate1 (value) {
 			let start = value[0];
 			let end = value[1];
@@ -227,10 +311,10 @@ export default {
 				current: 1,
 				size: 50
 			}).then(res => {
+				this.selfTakeShow = true;
 				console.log(res.data);
-				this.selfTakeList.push(res.data.records);
+				this.selfTakeList=res.data.records;
 				console.log(this.selfTakeList);
-				this.showZTD = true;
 			})
 		},
 		delItem (index) {
@@ -352,6 +436,9 @@ export default {
 </script>
 
 <style scoped lang="scss">
+
+	@import "/static/css/common.css";
+
 .fontcolor {
 	color: var(--view-theme);
 }
@@ -582,4 +669,123 @@ export default {
 		}
 	}
 }
+
+
+
+
+.scroll-y{
+	height: 600rpx;
+}
+
+.box_3 {
+	background-color: rgba(250, 250, 250, 1);
+	border-radius: 4px 4px 0px 0px;
+	padding: 16rpx 16rpx 40rpx 16rpx;
+}
+
+.icon_2 {
+	font-size: 32rpx;
+	font-weight: 500;
+}
+
+.text_25 {
+	overflow-wrap: break-word;
+	color: rgba(17, 17, 17, 1);
+	font-size: 32rpx;
+	font-family: PingFangSC-Medium;
+	font-weight: 500;
+	text-align: left;
+	white-space: nowrap;
+	line-height: 44rpx;
+	margin: 0 278rpx 0 264rpx;
+}
+
+.list_1 {
+	height: 602rpx;
+	margin: 24rpx 16rpx 0 0;
+}
+
+.list-items_1 {
+	background-color: rgba(255, 255, 255, 1);
+	border-radius: 4px;
+	margin-bottom: 16rpx;
+	padding: 24rpx 24rpx 24rpx 24rpx;
+}
+
+.group_14 {
+	width: 638rpx;
+}
+
+
+.text_26 {
+	overflow-wrap: break-word;
+	color: rgba(17, 17, 17, 1);
+	font-size: 28rpx;
+	font-weight: NaN;
+	text-align: left;
+	white-space: nowrap;
+	line-height: 40rpx;
+	margin-right: 184rpx;
+}
+
+.text_27 {
+	overflow-wrap: break-word;
+	color: rgba(153, 153, 153, 1);
+	font-size: 24rpx;
+	font-weight: NaN;
+	text-align: left;
+	white-space: nowrap;
+	line-height: 34rpx;
+	margin-top: 16rpx;
+}
+
+
+.text-group_9 {
+	overflow-wrap: break-word;
+	color: rgba(102, 102, 102, 1);
+	font-size: 20rpx;
+	font-weight: NaN;
+	text-align: left;
+	white-space: nowrap;
+	line-height: 36rpx;
+}
+
+.icon_3 {
+	width: 34rpx;
+	height: 34rpx;
+	margin-left: 10rpx;
+	/*margin: 4rpx 0 4rpx 4rpx;*/
+}
+
+.group_15 {
+	margin: 8rpx 390rpx 0 0;
+}
+
+.tag_1 {
+	background-color: rgba(255, 247, 248, 1);
+	border-radius: 4px;
+	padding: 8rpx 24rpx 8rpx 26rpx;
+}
+
+.text_28 {
+	overflow-wrap: break-word;
+	color: rgba(153, 153, 153, 1);
+	font-size: 20rpx;
+	font-weight: NaN;
+	text-align: left;
+	white-space: nowrap;
+	line-height: 28rpx;
+}
+	.image-view{
+		width: 32rpx;
+		height: 32rpx;
+		.image{
+			width: 28rpx;
+			height: 28rpx;
+		}
+	}
+
+	.dataGroup{
+		margin-left: 20rpx;
+	}
 </style>