123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348 |
- <template>
- <view class="apply-wrap flex flex_column">
- <view class="login-form">
- <u-form :model="form" label-width="200rpx" :error-type="['toast']" ref="uForm">
- <u-form-item label="门头照片" required prop="storeImage">
- <u-upload
- @on-success="uploadStorePhoto"
- @on-remove="removeStorePhoto"
- :file-list="storePhotoList"
- :action="action"
- :max-size="2 * 1024 * 1024"
- :width="200"
- :height="150"
- upload-text="上传门头照片"
- max-count="1"></u-upload>
- </u-form-item>
- <u-form-item label="营业执照">
- <u-upload
- @on-success="uploadYyzzPhoto"
- @on-remove="removeYyzzPhoto"
- :file-list="yyzzPhotoList"
- :action="action"
- :max-size="2 * 1024 * 1024"
- :width="200"
- :height="150"
- upload-text="上传营业执照"
- max-count="1"></u-upload>
- </u-form-item>
- <u-form-item label="门店名称" required prop="storeName">
- <u-input v-model="form.storeName" :maxlength="30" placeholder="请输入门店名称(最多30个字符)"/>
- </u-form-item>
- <u-form-item label="所在地区" required prop="label">
- <u-input v-model="form.label" placeholder="请选择省市区" type="select" @click="openAddress"/>
- <Address ref="applyAddress" :isJrMini="true" @onConfirm="areaConfirm"></Address>
- </u-form-item>
- <u-form-item label="详细地址" required prop="addrDetail">
- <u-input v-model="form.addrDetail" :maxlength="100" placeholder="请输入详细地址(最多100个字符)"/>
- </u-form-item>
- <u-form-item label="联系人姓名" required prop="contactName">
- <u-input v-model="form.contactName" :maxlength="20" placeholder="请输入联系人姓名(最多20个字符)"/>
- </u-form-item>
- <u-form-item label="联系人手机">
- {{form.contactPhone}}
- </u-form-item>
- <u-form-item label="关联客户" required prop="customerSn">
- <u-input v-model="form.customerName" type="select" placeholder="请输入选择关联客户" @click="chooseCustome" />
- </u-form-item>
- <u-form-item label="结算方式" required prop="settleType">
- <u-input v-model="form.settleTypeDictValue" placeholder="请输入选择结算方式" type="select" @click="settleStyleModal = true" />
- <u-picker v-model="settleStyleModal" @confirm="settleStyleChange" :range="settleStyleList" range-key="dispName" mode="selector"></u-picker>
- </u-form-item>
- <u-form-item label="授信金额" v-if="form.settleType == 'CREDIT'" required prop="creditLimit">
- <u-input :clearable="false" type="digit" :min="100" :maxlength="8" @blur="numberToFixed('creditLimit',2,999999)" v-model.trim="form.creditLimit" placeholder="请输入大于100的数字,最多两位小数"/>
- </u-form-item>
- <view>
- <view style="padding: 1rem 0">价格权限设置</view>
- <view class="flex align_center" style="width: 100%;padding: 0.3rem 0">
- <text style="width: 90px;">货架产品:</text>
- <u-checkbox-group @change="priceSetChange">
- <u-checkbox v-for="item in showPrice" :key="item.paramCode" v-model="item.checked"
- :name="item.paramCode">{{item.text}}</u-checkbox>
- </u-checkbox-group>
- </view>
- <view class="flex align_center" style="width: 100%;padding: 0.3rem 0">
- <text style="width: 90px;">非货架产品:</text>
- <u-checkbox-group @change="nonPriceSetChange">
- <u-checkbox v-for="item in showNoPrice" :key="item.paramCode" v-model="item.checked"
- :name="item.paramCode">{{item.text}}</u-checkbox>
- </u-checkbox-group>
- </view>
- </view>
- </u-form>
- </view>
- <view class="form-btn-con flex justify_center">
- <u-button class="form-btn" shape="circle" :loading="loading" type="info" :custom-style="customBtnStyle" @click="formSubmit">审核通过</u-button>
- </view>
- </view>
- </template>
- <script>
- import Address from '@/components/address.vue'
- import { xprhStoreApplyDetail, xprhStoreApplyAudit } from '@/api/approveStore'
- import {updateShelfPriceShow} from '@/api/shelf'
- import { clzConfirm, numberToFixed } from '@/libs/tools';
- const baseUrl = getApp().globalData.baseUrl
- export default{
- components: {
- Address,
- },
- data(){
- return{
- loading: false,
- theme: '',
- customBtnStyle: { // 自定义按钮样式
- borderColor: this.$config('primaryColor'),
- backgroundColor: this.$config('primaryColor'),
- color: '#fff',
- width: '360rpx'
- },
- form: {
- storeName: '', // 门店名称
- contactPhone: '', // 联系手机
- contactName: '', // 联系人
- label: '',
- addrProvince: undefined, // 省
- addrProvinceName: '',
- addrCity: undefined, // 市
- addrCityName: '',
- addrDistrict: undefined, // 区
- addrDistrictName: '',
- addrDetail: '', // 详细地址
- storeImage: '', // 门头照片
- licenseImage: '', // 营业执照
- settleType: undefined, // 结算方式
- settleTypeDictValue: undefined,
- customerSn: undefined, // 关联客户
- customerName: undefined,
- creditLimit: '', // 授信额度
- delearSn: undefined,
- applySn: undefined,
- auditStatus: 'PASS' // 通过
- },
- rules: {
- storeImage:[{ required: true, message: '请选择门头照片', trigger: 'change' }],
- storeName: [{ required: true, message: '请输入门店名称', trigger: 'change' }],
- contactMobile: [{ required: false, pattern: /^\d{30}$/, message: '请输入正确的手机号', trigger: 'change' }],
- label: [{ required: true, message: '请选择地区', trigger: 'change' }],
- addrDetail: [{ required: true, message: '请输入详细地址', trigger: 'change' }],
- contactName: [{ required: true, message: '请输入联系人姓名', trigger: 'change' }],
- settleType: [{ required: true, message: '请选择收结算方式', trigger: 'change' }],
- customerSn: [{ required: true, message: '请选择关联客户', trigger: 'change' }],
- // creditLimit: [{ required: true, message: '请输入授信金额', trigger: 'change' }],
- },
- areaIdArr: [], // 省市区id数组
- labelArr: [],
- action: baseUrl + 'upload',
- storePhotoList: [],
- yyzzPhotoList: [],
- settleStyleModal: false,
- settleStyleList: [],
- showPrice: [],
- showNoPrice: []
- }
- },
- // 必须要在onReady生命周期,因为onLoad生命周期组件可能尚未创建完毕
- onReady() {
- this.$refs.uForm.setRules(this.rules);
- this.showPrice = [{
- paramCode: 'shelf_price_show',
- paramValue: 1,
- text: '车主价',
- checked: true
- },{
- paramCode: 'shelf_cost_show',
- paramValue: 0,
- text: '结算价',
- checked: false
- }]
- this.showNoPrice = [{
- paramCode: 'non_shelf_price_show',
- paramValue: 1,
- text: '车主价',
- checked: true
- },{
- paramCode: 'non_shelf_cost_show',
- paramValue: 0,
- text: '结算价',
- checked: false
- }]
- },
- onLoad(options) {
- const _this = this
- this.applySn = options.sn
- this.getDetail()
- this.settleStyleList = this.$store.state.vuex_shelfSettleType
-
- // 选择关联客户
- uni.$on("addCustome",function(data){
- _this.form.customerSn = data.customerSn
- _this.form.customerName = data.customerName
- })
- },
- onUnload() {
- uni.$off("addCustome")
- },
- methods: {
- // 小数点后两位
- numberToFixed: function (key, num, max) {
- let val = this.form[key]
- let ret = numberToFixed(val, num, max)
- this.$nextTick(() => {
- this.form[key] = ret < 100 ? 100 : ret
- })
- },
- // 获取详细
- getDetail () {
- xprhStoreApplyDetail({ sn: this.applySn }).then(res => {
- if (res.status == 200) {
- this.form = Object.assign(this.form, res.data)
- this.storePhotoList = this.form.storeImage ? [{url:this.form.storeImage}] : []
- this.yyzzPhotoList = this.form.licenseImage ? [{url:this.form.licenseImage}] : [],
- this.form.addrDetail = this.form.addrDetail || ''
- if(this.form.addrProvinceName&&this.form.addrCityName&&this.form.addrDistrictName){
- this.labelArr = [this.form.addrProvinceName,this.form.addrCityName,this.form.addrDistrictName]
- this.areaIdArr = [this.form.addrProvince,this.form.addrCity,this.form.addrDistrict]
- this.form.label = this.labelArr.join('-')
- }else{
- this.labelArr = []
- this.areaIdArr = []
- this.form.label = ''
- }
- this.form.auditStatus = 'PASS' // 通过
- } else {
- this.$refs.ruleForm.resetFields()
- }
- })
- },
- // 上传门店图片成功
- uploadStorePhoto(res){
- this.form.storeImage = res.data
- },
- // 删除门店图片
- removeStorePhoto(index){
- this.form.storeImage = ''
- },
- // 上传营业执照图片成功
- uploadYyzzPhoto(res){
- this.form.licenseImage = res.data
- },
- // 删除营业执照图片
- removeYyzzPhoto(index){
- this.form.licenseImage = ''
- },
- // 收款方式 change
- settleStyleChange(ind){
- this.form.settleType = this.settleStyleList[ind].code || undefined
- this.form.settleTypeDictValue = this.settleStyleList[ind].dispName || undefined
- this.form.creditLimit = ''
- },
- // 选择关联客户
- chooseCustome(){
- uni.navigateTo({
- url: "/pages/sales/chooseCustomer?backPage=authPass"
- })
- },
- // 表单提交
- formSubmit(){
- const _this = this
- this.$refs.uForm.validate(valid => {
- if (valid) {
- if((_this.form.creditLimit >= 100 && _this.form.settleType == 'CREDIT') || _this.form.settleType !== 'CREDIT'){
- clzConfirm({
- title: '提示',
- content: '审核通过后,即可成为认证门店,确认审核通过吗?',
- success: function(res) {
- if (res.confirm || res.index == 0) {
- _this.submitData()
- }
- }
- })
- }else{
- uni.showToast({
- icon: 'none',
- title: '请输入授信金额'
- })
- }
- } else {
- console.log('验证失败');
- }
- });
- },
- submitData(){
- let obj = this.form
- obj.addrProvince = this.areaIdArr[0] // 省id
- obj.addrCity = this.areaIdArr[1] // 市id
- obj.addrDistrict = this.areaIdArr[2] // 区id
- obj.addrProvinceName = this.labelArr[0] // 省
- obj.addrCityName = this.labelArr[1] // 市
- obj.addrDistrictName = this.labelArr[2] // 区
- this.loading = true
- // 申请试用
- xprhStoreApplyAudit(obj).then(res => {
- console.log(res)
- if(res.status == 200){
- this.savePriceSet(res.data)
- }else{
- uni.showToast({icon: 'none',title: res.message})
- this.loading = false
- }
- })
- },
- // 选择价格显示
- priceSetChange(e) {
- this.showPrice.map(item => {
- item.paramValue = e.includes(item.paramCode) ? 1 : 0
- })
- },
- nonPriceSetChange(e){
- this.showNoPrice.map(item => {
- item.paramValue = e.includes(item.paramCode) ? 1 : 0
- })
- },
- // 价格显示保存
- savePriceSet(data) {
- const params = {
- shelfSn: data.shelfSn,
- paramValue: [...this.showPrice, ...this.showNoPrice]
- }
- console.log(params)
- // 更新价格显示
- updateShelfPriceShow(params).then(res => {
- if (res.status == 200) {
- uni.navigateBack()
- uni.$emit("updateAuthState")
- }
- uni.showToast({icon: 'none',title: res.message})
- this.loading = false
- })
- },
- // 选择省区市
- areaConfirm(e) {
- console.log('已选择的省市区', e)
- this.labelArr = e.labelArr
- this.areaIdArr = [ e.provinceCode, e.cityCode, e.areaCode ]
- this.form.label = e.label
- },
- openAddress(){
- // 省市区 回显 参数为省市区id数组
- this.$refs.applyAddress.open(this.areaIdArr)
- },
- }
- }
- </script>
- <style scoped lang="scss">
- .apply-wrap{
- width:100%;
- height: 100vh;
- background-color: #fff;
- .login-form{
- padding: 0.7rem 1.5rem;
- flex-grow: 1;
- overflow: auto;
- }
- .form-btn-con{
- padding: 1rem;
- }
- }
- </style>
|