zhangdan 3 years ago
parent
commit
f247e7bb1b
1 changed files with 188 additions and 0 deletions
  1. 188 0
      pages/sales/addCustomer.vue

+ 188 - 0
pages/sales/addCustomer.vue

@@ -0,0 +1,188 @@
+<template>
+	<view class="addCustomer-content">
+		<view class="content-form">
+			<u-form :model="form" ref="uForm" :rules="rules" label-width="180">
+				<u-form-item label="客户名称" required prop="customerName"><u-input v-model.trim="form.customerName" placeholder="请输入客户名称" input-align="right" /></u-form-item>
+				<u-form-item label="客户地址" required prop=""><u-input v-model="form.contactName" input-align="right" placeholder="客户地址"/></u-form-item>
+				<u-form-item label="联系电话"><u-input v-model.trim="form.contactTel" placeholder="请输入联系电话" input-align="right" /></u-form-item>
+				<u-form-item label="联系手机"><u-input v-model.trim="form.contactMobile" placeholder="请输入联系手机" input-align="right" /></u-form-item>
+				<u-form-item label="联系人"><u-input v-model="form.contactName" input-align="right" placeholder="请输入联系人"/></u-form-item>
+				<u-form-item label="详细地址"><u-input v-model.trim="form.customerAddr" type="textarea" placeholder="请输入详细地址" input-align="right" /></u-form-item>
+				<u-form-item label="客户传真"><u-input v-model="form.fax" input-align="right" placeholder="请输入客户传真"/></u-form-item>
+				<u-form-item label="配送方式"><v-select ref="dispatchType" :disabled="true" placeholder="请选择配送方式" @itemChange="chooseType" code="DISPATCH_TYPE" style="width: 100%"></v-select></u-form-item>
+				<u-form-item label="客户类型"><u-input v-model="priceTypeName" input-align="right" :disabled="true" placeholder="请选择客户类型" @click="showCust=true"/></u-form-item>
+				<u-form-item label="价格类型" required prop=""></u-form-item>
+				<u-form-item label="收款方式" required prop="settleStyleSn">
+					<u-input v-model="settleStyleName" input-align="right" :disabled="true" placeholder="请选择收款方式" @click="showSettle=true"/>
+				</u-form-item>
+			</u-form>
+		</view>
+		<view class="form-footer-btn">
+			<u-button class="handle-btn" size="medium" shape="circle" hover-class="none" @click="handleSubmit" :custom-style="customBtnStyle">保存</u-button>
+		</view>
+		<!-- 选择收款方式 -->
+		<u-picker v-model="showSettle" title="收款方式"  @confirm="settleStyleChange" :range="settleTypeList" range-key="name" mode="selector"></u-picker>
+		<!-- 客户类型 -->
+		<u-picker v-model="showCust" title="客户类型" @confirm="custTypeChange" :range="custTypeList" range-key="name" mode="selector"></u-picker>
+	</view>
+</template>
+
+<script>
+	import {customerDetail,settleStyleQueryAll,custType} from '@/api/sales.js'
+	import vSelect  from  '@/components/select/v-select.vue'
+	export default{
+		components: { vSelect },
+		data(){
+			return{
+				customerData:null, // 客户信息
+				priceTypeName:'', //客户类型名称
+				customBtnStyle: {  //  自定义按钮样式
+					backgroundColor: this.$config('primaryColor'),
+					color: '#fff'
+				},
+				form:{
+					id: null,
+					customerName: '', // 客户名称
+					contactTel: '', //  联系电话
+					contactMobile: '', //  联系手机
+					contactName: '', //  联系人
+					provinceSn: undefined, //  省
+					provinceName: '',
+					citySn: undefined, // 市
+					cityName: '',
+					countySn: undefined, // 区
+					countyName: '',
+					customerAddr: '', //  详细地址
+					fax: '', //  客户传真
+					dispatchType: undefined, //  配送方式
+					satelliteFlag: 0, //  是否卫星仓客户
+					customerTypeSn: undefined, //  客户类型
+					priceType: '', //  价格类型
+					settleStyleSn: undefined //  收款方式
+				},
+				rules:{
+					customerName: [{ required: true, message: '请输入客户名称', trigger: 'blur' }],
+					contactMobile: [{ required: false, pattern: /^\d{11}$/, message: '请输入正确的手机号', trigger: 'blur' }],
+					provinceSn: [{ required: true, message: '请选择省', trigger: 'change' }],
+					citySn: [{ required: true, message: '请选择市', trigger: 'change' }],
+					countySn: [{ required: true, message: '请选择区/县', trigger: 'change' }],
+					priceType: [{ required: true, message: '请选择价格类型', trigger: 'change' }],
+					settleStyleSn: [{ required: true, message: '请选择收款方式', trigger: 'change' }]
+				},
+				showSettle:false,//结算方式初始值
+				settleTypeList:[],//收款方式列表
+				settleStyleName:'',//收款方式名称
+				custTypeList:[] ,// 客户类型数据
+				showCust:false, //客户类型下拉弹窗初始值
+				custTypeName:'', // 客户类型名称
+			}
+		},
+		onLoad(option) {
+			this.getSettleStyle()
+			this.getCustomerList()
+			
+		},
+		methods:{
+			// 选择配送方式
+			chooseType(v){
+				console.log(v,'---------')
+			},
+			// 下拉选择
+			selete(val){
+				if(val==0){
+					this.drownType='customer'
+				}else{
+					this.drownType='settle'
+				}
+				console.log(val,this.drownType)
+				setTimeout(()=>{
+					this.showSettle=true
+				},300)
+				
+			},
+			brandClean(){
+				this.settleStyleName=''
+				this.form.settleStyleSn=undefined
+			},
+			// 获取客户类型列表
+			getCustomerList(){
+				custType({}).then(res=>{
+					if(res.status==200){
+						this.custTypeList=res.data
+					}else{
+						this.custTypeList=[]
+					}
+				})
+			},
+			// 获取结算方式列表
+			getSettleStyle(){
+				settleStyleQueryAll({}).then(res=>{
+					if(res.status==200){
+						this.settleTypeList=res.data
+					}else{
+						this.settleTypeList=null
+					}
+				})
+			},
+			settleStyleChange(e){
+				console.log(e,'data')
+				this.settleStyleName=this.settleTypeList[e].name
+				this.form.settleStyleSn=this.settleTypeList[e].settleStyleSn
+				
+			},
+			custTypeChange(e){
+				this.priceTypeName=this.custTypeList[e].name
+				this.form.customerTypeSn=this.custTypeList[e].customerTypeSn
+			},
+			// 保存
+			handleSubmit(){
+				console.log('保存===========')
+				this.$refs.uForm.validate().then(res => {
+					if(res){
+						uni.$u.toast('校验通过')
+					}
+					console.log(res,'--------------校验')
+					
+				}).catch(errors => {
+					uni.$u.toast('校验失败')
+				})
+			},
+			// getCustomerData(){
+			// 	customerDetail({id:this.itemId}).then(res=>{
+			// 		if(res.status==200){
+			// 			this.customerData=res.data
+			// 		}else{
+			// 			this.customerData=null
+			// 		}
+			// 	})
+			// }
+		}
+	}
+</script>
+
+<style lang="scss">
+	.addCustomer-content{
+		width: 100%;
+		height: 100vh;
+		background-color: #fff;
+		padding:0 40upx;
+		display: flex;
+		flex-direction: column;
+		.content-form{
+			flex: 1;
+		}
+		.content-form:not(:last-child){
+			border-bottom: none;
+		}
+		.form-footer-btn{
+			position: fixed;
+			bottom: 0;
+			left: 0;
+			width: 100%;
+			padding: 16upx 20upx 12upx;
+			.handle-btn{
+				width: 100%;
+			}
+		}
+	}
+</style>