123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583 |
- <template>
- <view class="addCustomer-content">
- <view class="flex justify_between align_center content-customerName" v-if="itemId">
- <text>{{customerData?customerData.customerName:''}}</text>
- <u-button size="mini" :hair-line="false" plain type="primary" hover-class="none" @click="goBack" :custom-style="customBtnStyle">重新选择</u-button>
- </view>
- <view class="content-form">
- <u-form :model="form" ref="uForm" label-width="180" :error-type="['toast']">
- <u-form-item label="客户地址" required >
- <u-input v-model="areaInfo.label" :disabled="true" input-align="right" placeholder="请选择客户地址" @click="openAddress"/>
- <u-icon name="arrow-right" color="#C0C4CC" slot="right" @click="openAddress"></u-icon>
- </u-form-item>
- <u-form-item label="详细地址">
- <textarea :auto-height="true" input-align="right" placeholder="请输入详细地址(最多60个字符)" :maxlength="60" v-model="form.shippingAddress" class="receiveAddress" placeholder-style="color:#C0C4CC;font-size:28upx;"/>
- </u-form-item>
- <u-form-item label="联系人">
- <u-input v-model="form.consigneeName" input-align="right" placeholder="请输入联系人(最多30个字符)" :maxlength="11"/>
- </u-form-item>
- <u-form-item label="联系电话">
- <u-input v-model.trim="form.consigneeTel" placeholder="请输入联系电话(最多15个字符)" input-align="right" :maxlength="15"/>
- </u-form-item>
- <u-form-item label="联系手机"><u-input v-model.trim="form.contactMobile" placeholder="请输入联系手机(最多11位字符)" input-align="right" :maxlength="11"/>
- </u-form-item>
- <u-form-item label="价格类型" required >
- <v-select ref="priceType" :disabled="true" placeholder="请选择价格类型" @itemChange="chooseType" code="PRICE_TYPE" style="width: 100%"></v-select>
- <u-icon name="arrow-right" color="#C0C4CC" slot="right"></u-icon>
- </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-icon name="arrow-right" color="#C0C4CC" slot="right"></u-icon>
- </u-form-item>
- <u-form-item label="铺货出库" required v-if="itemId">
- <view style="width: 100%;display:flex;justify-content: flex-end;">
- <u-radio-group v-model="form.distributionFlag" @change="radioChange" >
- <u-radio
- v-for="(item, index) in ckList" :key="index"
- :name="item.code"
- >
- {{item.dispName}}
- </u-radio>
- </u-radio-group>
- </view>
- </u-form-item>
- <u-form-item label="配送方式" >
- <v-select ref="dispatchType" :disabled="true" placeholder="请选择配送方式" @itemChange="choosedispatchType" code="DISPATCH_TYPE" style="width: 100%"></v-select>
- <u-icon name="arrow-right" color="#C0C4CC" slot="right" @click="chooseType(0)"></u-icon>
- </u-form-item>
- <u-form-item label="业务员">
- <u-input v-model="userName" input-align="right" :disabled="true" placeholder="请选择业务员" @click="showUser=true"/>
- <u-icon name="arrow-right" color="#C0C4CC" slot="right" @click="showUser=true"></u-icon>
- </u-form-item>
- <u-form-item label="备注">
- <textarea :auto-height="true" input-align="right" placeholder="请输入备注(最多100个字符)" :maxlength="100" v-model="form.remarks" class="receiveAddress" placeholder-style="color:#C0C4CC;font-size:28upx;"/>
- </u-form-item>
- </u-form>
- </view>
- <view class="form-footer-btn">
- <u-button v-if="!itemId" class="handle-btn" size="medium" shape="circle" hover-class="none" @click="customerSubmit" :custom-style="customBtnStyle">保存</u-button>
- <u-button v-else class="handle-btn" size="medium" shape="circle" hover-class="none" @click="salesSbmit" :custom-style="customBtnStyle">新增销售单</u-button>
- </view>
- <!-- 省市区 -->
- <Address ref="applyAddress" @onConfirm="areaConfirm"></Address>
- <!-- 选择收款方式 -->
- <u-picker v-model="showSettle" title="收款方式" @confirm="settleStyleChange" :range="settleTypeList" range-key="name" mode="selector" :default-selector="JSON.parse(JSON.stringify(defaultSettleIndex))"></u-picker>
- <!-- 客户类型 -->
- <u-picker v-model="showCust" title="客户类型" @confirm="custTypeChange" :range="custTypeList" range-key="name" mode="selector" :default-selector="JSON.parse(JSON.stringify(defaultCustIndex))"></u-picker>
- <!-- 业务员 -->
- <u-picker v-model="showUser" title="业务员" @confirm="userChange" :range="userList" range-key="name" mode="selector"></u-picker>
- </view>
- </template>
- <script>
- import {customerDetail,settleStyleQueryAll,custType,custSave,employeeAllList,salesSave} from '@/api/sales.js'
- import { getLookUpDatas } from '@/api/data'
- import { getArea } from '@/api/data'
- import Address from '@/components/address.vue'
- import vSelect from '@/components/select/v-select.vue'
- export default{
- components:{Address,vSelect},
- data(){
- return{
- title:'',
- customerData:null,
- priceTypeName:'',
- customBtnStyle: {
- margin:0
- },
- showDispatch:false,
- dispatchTypeList:[],
- dispatchTypeName:'',
- showSettle:false,
- settleTypeList:[],
- settleStyleName:'',
- custTypeList:[] ,
- showCust:false,
- custTypeName:'',
- areaInfo: {},
- areaIdArr: [],
- itemId:'',
- ckList:[{dispName: "是",code:1,lookupCode: "FLAG"},{dispName: "否",code:0,lookupCode: "FLAG"}],
- showUser:false,
- userList:[],
- userName:'',
- salesManSn:'',
- defaultSettleIndex:[0] ,
- defaultIndex:[0] ,
- defaultCustIndex:[0],
- defaultUserIndex:[0],
-
- form:{
- buyerName: '',
- buyerSn: undefined,
- consigneeTel: '',
- contactMobile: '',
- consigneeName: '',
- shippingAddressProvinceSn: undefined,
- shippingAddressProvinceName: '',
- shippingAddressCitySn: undefined,
- shippingAddressCityName: '',
- shippingAddressCountySn: undefined,
- shippingAddressCountyName: '',
- shippingAddress: '',
- fax: '',
- dispatchType: undefined,
- satelliteFlag: 0,
- priceType: undefined,
- settleStyleSn: undefined,
- salesManSn: undefined,
- salesManName: '',
- distributionFlag: '0',
- salesTragetType: 'CUSTOMER',
- remarks: '' ,
- addrProvinceList:[],
- addrDistrictList:[],
- addrCityList:[]
- }
- }
- },
-
- onReady() {
- this.$refs.uForm.setRules(this.rules);
- },
- onLoad(option) {
-
- console.log(option.nowId,'option')
-
-
-
- if(option.nowId){
- this.itemId=option.nowId
- this.getCustomerData(this.itemId)
- this.getUserAllList()
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- }
- this.getSettleStyle()
- this.getCustomerList()
- },
- onUnload() {
- this.$u.vuex("vuex_OrderAddress",{})
-
- },
- methods:{
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- getCodeList(code){
- getLookUpDatas({type:code}).then(res=>{
- if(res.status==200){
- this.dispatchTypeList=res.data
- this.showDispatch=true
- }
- })
- },
- getCustomerData(val){
- customerDetail({id:val}).then(res=>{
- if(res.status==200){
- this.customerData=res.data
- if (this.customerData.provinceSn) { this.getArea('city', this.customerData.provinceSn) }
- if (this.customerData.citySn) { this.getArea('district', this.customerData.citySn) }
-
-
- this.form = Object.assign(this.form, {
- buyerName: this.customerData.customerName,
- buyerSn: this.customerData.customerSn,
- consigneeTel: this.customerData.contactTel,
- contactMobile: this.customerData.contactMobile,
- consigneeName: this.customerData.contactName,
- shippingAddressProvinceSn: this.customerData.provinceSn,
- shippingAddressProvinceName: this.customerData.provinceName,
- shippingAddressCitySn: this.customerData.citySn,
- shippingAddressCityName: this.customerData.cityName,
- shippingAddressCountySn: this.customerData.countySn,
- shippingAddressCountyName: this.customerData.countyName,
- shippingAddress: this.customerData.customerAddr,
- fax: this.customerData.fax,
- dispatchType: this.customerData.dispatchType,
- satelliteFlag: this.customerData.satelliteFlag,
- priceType: this.customerData.priceType,
- settleStyleSn: this.customerData.settleStyleSn
- })
- if(this.customerData.priceType || this.customerData.dispatchType){
- setTimeout(()=>{
- this.$refs.priceType.setVal(this.customerData.priceType)
- this.$refs.dispatchType.setVal(this.customerData.dispatchType)
- },200)
-
- }
- this.form=Object.assign(this.form,res.data)
- }else{
- this.customerData=null
- }
- })
- },
-
- getCityList (val) {
- this.addrCityList = []
- this.addrDistrictList = []
- this.form.shippingAddressCitySn = undefined
- this.form.shippingAddressCityName = ''
- this.form.shippingAddressCountySn = undefined
- this.form.shippingAddressCountyName = ''
- if (val) {
- this.getArea('city', val)
- this.form.shippingAddressProvinceName = this.addrProvinceList.find(item => item.areaSn == val).name
- } else {
- this.form.shippingAddressProvinceName = ''
- }
- },
-
- getAreaList (val) {
- this.addrDistrictList = []
- this.form.shippingAddressCountySn = undefined
- this.form.shippingAddressCountyName = ''
- if (val) {
- this.getArea('district', val)
- this.form.shippingAddressCityName = this.addrCityList.find(item => item.areaSn == val).name
- } else {
- this.form.shippingAddressCityName = ''
- }
- },
-
- areaCharged (val) {
- if (val) {
- this.form.shippingAddressCountyName = this.addrDistrictList.find(item => item.areaSn == val).name
- } else {
- this.form.shippingAddressCountyName = ''
- }
- },
-
- getArea (leve, sn) {
- let params
- if (leve == 'province') {
- params = { type: '2' }
- } else {
- params = { parentId: sn, type: leve == 'city' ? '3' : '4' }
- }
- getArea(params).then(res => {
- if (res.status == 200) {
- if (leve == 'province') {
- this.addrProvinceList = res.data || []
- } else if (leve == 'city') {
- this.addrCityList = res.data || []
- } else if (leve == 'district') {
- this.addrDistrictList = res.data || []
- }
- } else {
- if (leve == 'province') {
- this.addrProvinceList = []
- } else if (leve == 'city') {
- this.addrCityList = []
- } else if (leve == 'district') {
- this.addrDistrictList = []
- }
- }
- })
- },
- getCodeByName (dispName) {
- return this.dispatchTypeList.find((item) => {
- return item.dispName == dispName
- })
- },
-
- goBack(){
- uni.navigateBack({})
- },
- radioChange(e) {
- console.log(e);
- this.form.distributionFlag=e
- },
-
- chooseType(val){
- console.log(val,'vai')
- this.form.priceType=val
- },
-
- choosedispatchType(val){
- this.form.dispatchType=val
- },
-
- areaConfirm(e) {
- console.log('已选择的省市区', e)
- this.areaInfo = e
- this.areaIdArr = [ e.provinceCode, e.cityCode, e.areaCode ]
- this.form.shippingAddressProvinceSn=e.provinceCode
- this.form.shippingAddressCitySn=e.cityCode
- this.form.shippingAddressCountySn=e.areaCode
- this.form.shippingAddressProvinceName=e.labelArr[0]
- this.form.shippingAddressCityName=e.labelArr[1]
- this.form.shippingAddressCountyName=e.labelArr[2]
- },
- openAddress(){
-
-
- this.$refs.applyAddress.open(this.areaIdArr)
- },
- brandClean(){
- this.settleStyleName=''
- this.form.settleStyleSn=undefined
- },
-
- getUserAllList () {
- employeeAllList({}).then(res => {
- if (res.status == 200) {
- this.userList = res.data || []
- } else {
- this.userList = []
- }
- })
- },
-
- 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.defaultSettleIndex=[e]
- this.settleStyleName=this.settleTypeList[e].name
- if(this.itemId){
- this.form.settleStyleSn=this.settleTypeList[e].settleStyleSn
- }else{
- this.form.settleStyleSn=this.settleTypeList[e].settleStyleSn
- }
-
-
- },
- custTypeChange(e){
- this.defaultCustIndex=[e]
- this.custTypeName=this.custTypeList[e].name
- this.form.customerTypeSn=this.custTypeList[e].customerTypeSn
- },
- userChange(e){
- this.defaultUserIndex=[e]
- this.custTypeName=this.custTypeList[e].name
- this.form.customerTypeSn=this.custTypeList[e].customerTypeSn
- },
-
- customerSubmit(){
- console.log('保存===========')
- this.$refs.uForm.validate(valid => {
- if (valid) {
- console.log('验证通过');
- if (this.form.customerName ==='') {
- uni.showToast({
- title: '请输入客户名称',
- icon: 'none'
- })
- return false
- }
-
- if(this.areaIdArr.length == 0){
- uni.showToast({icon: 'none',title: '请选择省市区'})
- return
- }
- if (this.form.priceType ==undefined ) {
- uni.showToast({
- title: '请选择价格类型',
- icon: 'none'
- })
- return false
- }
- if (this.form.settleStyleSn ==undefined) {
- uni.showToast({
- title: '请选择收款方式',
- icon: 'none'
- })
- return false
- }
- const params=Object.assign({},this.form,this.areaIdArr)
- console.log(params,'params')
- if(this.form.id) {
- params.id = this.form.id
- }
- custSave(params).then(res=>{
- if(res.status == 200) {
- uni.showToast({
- title: res.message,
- icon: 'none'
- })
- setTimeout(()=>{
- uni.navigateBack()
- },300)
- }
- })
- } else {
- console.log('验证失败');
- }
- })
- },
-
- salesSbmit(){
- console.log('保存===========')
- this.$refs.uForm.validate(valid => {
- if (valid) {
- console.log('验证通过');
- if (this.form.customerName ==='') {
- uni.showToast({
- title: '请输入客户名称',
- icon: 'none'
- })
- return false
- }
-
- if(this.areaIdArr.length == 0){
- uni.showToast({icon: 'none',title: '请选择省市区'})
- return
- }
- if (this.form.priceType ==undefined ||this.form.priceType =='') {
- uni.showToast({
- title: '请选择价格类型',
- icon: 'none'
- })
- return false
- }
- if (this.form.settleStyleSn ==undefined) {
- uni.showToast({
- title: '请选择收款方式',
- icon: 'none'
- })
- return false
- }
- const params={
- buyerName:this.customerData.customerName ,
- buyerSn: this.customerData.customerSn,
- consigneeTel: this.form.consigneeTel?this.form.consigneeTel: this.customerData.contactTel,
- contactMobile:this.form.contactMobile?this.form.contactMobile: this.customerData.contactMobile,
- consigneeName:this.form.consigneeName?this.form.consigneeName: this.customerData.contactName,
- shippingAddressProvinceSn:this.form.shippingAddressProvinceSn?this.form.shippingAddressProvinceSn: this.customerData.provinceSn,
- shippingAddressProvinceName:this.form.shippingAddressProvinceName?this.form.shippingAddressProvinceName: this.customerData.customerName,
- shippingAddressCitySn:this.form.shippingAddressCitySn?this.form.shippingAddressCitySn: this.customerData.citySn,
- shippingAddressCityName:this.form.shippingAddressCityName?this.form.shippingAddressCityName: this.customerData.cityName,
- shippingAddressCountySn:this.form.shippingAddressCountySn?this.form.shippingAddressCountySn: this.customerData.countySn,
- shippingAddressCountyName:this.form.shippingAddressCountyName?this.form.shippingAddressCountyName: this.customerData.countyName,
- shippingAddress:this.form.customerAddr?this.form.customerAddr: this.customerData.customerAddr,
- fax:this.form.fax?this.form.fax: this.customerData.fax,
- dispatchType:this.form.dispatchType?this.form.dispatchType: this.customerData.dispatchType,
- satelliteFlag: 0,
- priceType:this.form.priceType?this.form.priceType: this.customerData.priceType,
- settleStyleSn:this.form.settleStyleSn?this.form.settleStyleSn: this.customerData.settleStyleSn,
- salesManSn:this.salesManSn ||undefined,
- salesManName: '',
- distributionFlag: '0',
- salesTragetType: 'CUSTOMER',
- remarks: this.remarks
- }
- console.log(params,'params')
- salesSave(params).then(res=>{
- if(res.status == 200) {
- uni.showToast({
- title: res.message,
- icon: 'none'
- })
- setTimeout(()=>{
- uni.navigateBack()
- },300)
- }
- })
- } else {
- console.log('验证失败');
- }
- })
- },
- }
- }
- </script>
- <style lang="scss">
- .addCustomer-content{
- width: 100%;
- height: 100vh;
- background-color: #fff;
- padding:0 40upx;
- display: flex;
- flex-direction: column;
- .content-customerName{
-
-
-
- }
- .content-form{
- flex: 1;
-
-
- .receiveAddress{
- width: 100%;
- line-height: 1.5em;
- box-sizing: border-box;
- font-style: normal;
- text-align: end;
- }
- }
- .content-form:not(:last-child){
- border-bottom: none;
- }
- .form-footer-btn{
- background-color: #fff;
- position: fixed;
- bottom: 0;
- left: 0;
- width: 100%;
- padding: 16upx 20upx 12upx;
- z-index: 999;
- .handle-btn{
- width: 100%;
- background-color: rgb(51, 95, 182);
- color: #fff;
- }
- }
- }
- </style>
|