pco/app/pages/customer-management/customer-info.vue

<template>
	<view>
		<view class="box">
			<view class="top">
				<text class="title">信息管理</text>
			</view>
			<view class="item">
				<view class="l"><text style="color: red;">*</text>企业名称：</view>
				<view class="r">
					<u-input v-model="form.name" placeholder="输入企业名称" />
				</view>
			</view>
			<view class="item">
				<view class="l"><text style="color: red;">*</text>联系人：</view>
				<view class="r">
					<u-input v-model="form.dutyPeople" placeholder="输入联系人" />
				</view>
			</view>
			<view class="item">
				<view class="l"><text style="color: red;">*</text>联系电话：</view>
				<view class="r">
					<u-input maxlength="11" v-model="form.phone" placeholder="输入电话号码" />
				</view>
			</view>
			<view class="item" v-if="form.type==='0'">
				<view class="l">结算方式：</view>
				<view class="r">
					<radio-group @change="payChange">
						<label class="radio">
							<radio value="1" :disabled="customerId!=='1'" :checked="form.payType==1" />现结
						</label>
						<label class="radio" style="margin-left: 20rpx;">
							<radio value="2" :disabled="customerId!=='1'" :checked="form.payType==2"/>月结
						</label>
					</radio-group>
				</view>
			</view>
			<view class="item">
				<view class="l">营业执照：</view>
				<view class="r">
					<view class="img">
						<uni-file-picker v-model="imageValue" fileMediatype="image" mode="grid" limit="1"
							@select="select"
							@delete="form.businessLicence=''" :image-styles="imageStyles" />
					</view>
				</view>
			</view>
		</view>
		<view class="common-btn" @click="confirm">确认</view>
	</view>
</template>

<script>
	import request from '../../utils/request.js'
	export default {
		data() {
			return {
				imgList: [],
				imageValue: [],
				imageStyles: {
					width: 150,
					height: 100,
					border: {
						color: "#eee",
						width: 1,
						style: 'dashed',
						radius: '5px'
					}
				},
				uploadImageUrl: request.server + '/upload/image',
				form: {
					name: '',
					dutyPeople: '',
					phone: '',
					payType: '1',
					businessLicence: ''
				},
				customerId:''
			}
		},
		mounted() {
			let id = uni.getStorageSync('userInfo').customerId;
			this.customerId=id;
			this.getCustomerById(id);
		},
		methods: {
			select(e) {
				let that = this;
				uni.uploadFile({
					url: that.uploadImageUrl,
					filePath: e.tempFilePaths[0],
					name: 'file',
					success: (resp => {
						console.log(JSON.parse(resp.data).data)
						that.form.businessLicence = JSON.parse(resp.data).data;
					})
				})
			},
			getCustomerById(id) {
				this.$api.getCustomerById({
					id: id
				}).then(resp => {
					this.form = resp.data;
					if(this.form.businessLicence){
						this.imageValue=[{
							'name':'payTicket.png',
							'extname':'.png',
							'url':this.form.businessLicence
						}]
					}
				})
			},
			payChange(e) {
				this.form.payType = e.detail.value
			},
			check() {
				if (!this.form.name) {
					this.$common.toast('请录入名称');
					return false;
				}
				if (!this.form.dutyPeople) {
					this.$common.toast('请录入联系人');
					return false;
				}
				if (!this.$common.isPhone(this.form.phone)) {
					this.$common.toast('联系号码不正确');
					return false;
				}
				return true;
			},
			confirm() {
				if (this.check()) {
					this.$api.editCustomer(this.$common.removeNull(this.form)).then(resp => {
						if (resp.code == 200) {
							this.$common.toast('修改成功');
							setTimeout(()=>{
								this.$common.back();
							},1000)
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}

	@import '@/common/common.scss'
</style>