web-africa-h5/pages/prefecture/part/welfare.vue

<template>
	<view>
		<view class="form-title redtitle">
			<!-- 会员信息 -->
			{{$t('MN_F_T_8')}}
		</view>
		<view class="prefecture form-group mb20">
			<view class="form-item">
				<view class="form-label">
					<text class="domation mr10">*</text>
					<!-- 会员编号 -->
					{{$t('MN_T_1')}}
				</view>
				<input @blur="changeInput('upgradeMemberCode')" class="form-input" type="text"
					v-model="form.upgradeMemberCode" :placeholder="$t('w_0046')" />
			</view>
			<view class="form-item">
				<view class="form-label">
					<text class="domation mr10">*</text>
					<!-- 会员姓名 -->
					{{$t('CK_KS_14')}}
				</view>
				<view class="disabled-input">{{form.upgradeMemberName}}</view>
			</view>
			<picker :range="deliveryList" :disabled="userCountry==1" range-key="label" @change="changeDelivery">
				<view class="form-item" style="border-bottom: 1rpx solid #eee;" v-if="deliveryList[deliveryIndex]">
					<view class="form-label">
						<text class="domation mr10">*</text>
						<!-- 发货方式 -->
						{{$t('w_0061')}}
					</view>
					<view class="disabled-input">{{deliveryList[deliveryIndex].label}}</view>
					<text class="icon iconfont icon-jiantou" v-if="userCountry != 1"></text>
				</view>
			</picker>
						<!-- 运输方式 -->
			<!-- <picker :range="transportType" :disabled="userCountry==1" range-key="label" @change="changeTransport">
				<view class="form-item" v-if="transportType[transportIndex]">
					<view class="form-label">
						<text class="domation mr10">*</text>
						{{$t('w_0063')}}
					</view>
					<view class="disabled-input">{{transportType[transportIndex].label}}</view>
					<text class="icon iconfont icon-jiantou" v-if="userCountry != 1"></text>
				</view>
			</picker> -->
			<picker :range="storeList" v-if="userCountry!=1" range-key="storeName" @change="changeStore">
				<view class="form-item" style="border-bottom: 1rpx solid #eee;">
					<view class="form-label">
						<text class="white mr10">*</text>
						<!-- 会员店铺 -->
						{{$t('w_0100')}}
					</view>
					<input class="disabled-input" disabled type="text"
						:value="storeList&&storeList[storeIndex]&&storeList[storeIndex].storeName || ''"
						placeholder="" />
					<text class="icon iconfont icon-jiantou"></text>
				</view>
			</picker>
			<!-- <picker :range="storehouse" v-if="userCountry!=1" range-key="name" @change="changeStorehouse">
				<view class="form-item">
					<view class="form-label">
						<text class="white mr10">*</text>
						{{$t('w_0102')}}
					</view>
					<input class="disabled-input" disabled type="text"
						:value="storehouse&&storehouse[storehouseIndex]&&storehouse[storehouseIndex].name || ''"
						placeholder="" />
					<text class="icon iconfont icon-jiantou"></text>
				</view>
			</picker> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				deliveryIndex: 0,
				transportIndex: 0,
				storeIndex: '',
				storehouseIndex: '',
			};
		},
		inject: ['form'],
		props: ['deliveryList', 'transportType', 'userCountry', 'storeList', 'storehouse'],
		created() {

		},
		methods: {
			changeStore(e) {
				this.storeIndex = e.detail.value;
				this.form.pkMemberStore = this.storeList[this.storeIndex].pkId;
			},
			changeStorehouse(e) {
				this.storehouseIndex = e.detail.value;
				this.form.pkStorehouse = this.storehouse[this.storehouseIndex].pkId;
			},
			changeInput(e) {
				this.$emit('changeInput', e)
			},
			changeDelivery(e) {
				this.deliveryIndex = e.detail.value;
				this.form.deliveryWay = this.deliveryList[this.deliveryIndex].value;
				this.$emit('queryOrderPostage');
			},
			changeTransport(e) {
				this.transportIndex = e.detail.value;
				this.form.transType = this.transportType[this.transportIndex].value;
				this.$emit('queryOrderPostage');
			},
			changeAccount(e) {
				this.bank_index = e.detail.value;
				console.log(this.bank_index);
				this.form.pkBank = this.accountList[this.bank_index].value;
			},
			changeType(n) {
				this.registType = n;
			},
			changePlaceDept(e) {
				this.form.placeDept = e.detail.value + 1;
				this.changeInput('placeDept')
			},
			closeQuery() {
				this[this.poptype] = this.queryValue;
				if (this.poptype == 'pkSettleCountry') {
					this.form.pkSettleCountry = this.countryList[this.pkSettleCountry].pkId;
				} else {
					this.form.pkCountry = this.countryList[this.pkCountry].pkId;
				}
				this.isQuery = false;
			},
			changeQuery(e) {
				this.queryValue = e.detail.value[0];
			},
			moveHandle() {
				return false;
			},
			openCPop(name) {
				this.poptype = name;
				this.isQuery = true;
			}
		}
	};
</script>

<style lang="scss">
	.form-title {
		width: 750rpx;
		height: 106rpx;
		background: #fb3024;
		padding-left: 44rpx;
		padding-right: 25rpx;
		position: relative;
		box-sizing: border-box;
		font-size: 28rpx;
		color: #ffffff;
		line-height: 106rpx;
		font-weight: bold;
		z-index: 1;
	}

	.form-title.redtitle {
		width: 750rpx;
		height: 106rpx;
		background: #fb3024;
		padding-left: 44rpx;
		position: relative;
		box-sizing: border-box;
		font-size: 28rpx;
		color: #fff;
		line-height: 106rpx;
		font-weight: bold;
		z-index: 1;
	}

	.form-title::before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		left: 25rpx;
		width: 6rpx;
		height: 24rpx;
		background-color: #fb3024;
		z-index: 1;
	}

	.redtitle.form-title::before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		left: 25rpx;
		width: 6rpx;
		height: 24rpx;
		background-color: #fff;
		z-index: 1;
	}
</style>