123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189 |
- <template>
- <div>
- <a-modal
- class="modalBox"
- title="新增绑定"
- v-model="isshow"
- @cancle="cancel"
- :footer="null"
- :width="600"
- :centered="true">
- <a-form-model ref="ruleForm" :model="form" :rules="rules" :labelCol="{span:5}" :wrapperCol="{span:15}">
- <a-form-model-item required label="选择供应商" prop="supplierName">
- <a-select
- id="storeBindModal-supplierName"
- show-search
- allowClear
- placeholder="请输入供应商名称精确搜索"
- :show-arrow="false"
- :filter-option="false"
- option-filter-prop="children"
- @search="handleSupplierSearch"
- v-model="form.supplierName">
- <a-select-option v-for="item in supplierList" :key="item.supplierSn" :value="item.supplierSn">
- {{ item.name }}
- </a-select-option>
- </a-select>
- </a-form-model-item>
- <a-form-model-item label="选择关联客户" prop="storeName">
- <a-select
- id="storeBindModal-storeName"
- show-search
- allowClear
- placeholder="请输入客户名称精确搜索"
- :show-arrow="false"
- :filter-option="false"
- optionLabelProp="value"
- @search="storeSearchRequest"
- @change="storeChange"
- v-model="form.storeName">
- <a-select-option :disabled="item.bindFlag=='BIND'" v-for="item in storeList" :key="item.name" :value="item.name">
- {{ item.name }}
- <span style="float: right;">{{ item.bindFlag=='BIND'?'已绑定':'未绑定' }}</span>
- </a-select-option>
- </a-select>
- </a-form-model-item>
- <a-form-model-item label="门店地址" prop="storeAddress">
- <span>{{ form.storeAddress }}</span>
- </a-form-model-item>
- <a-form-model-item class="submit-cont" :wrapper-col="{ span: 14, offset: 9 }">
- <a-button type="primary" id="storeBindModal-submit" @click="submitForm('ruleForm')">
- 提交
- </a-button>
- <a-button id="storeBindModal-cancle" style="margin-left: 10px" @click="cancel">
- 取消
- </a-button>
- </a-form-model-item>
- </a-form-model>
- </a-modal>
- </div>
- </template>
- <script>
- import {
- supplierStoreBind,
- storeQueryAll
- } from '@/api/storeManagement.js'
- import { supplierQueryAll } from '@/api/supplierManagement.js'
- export default {
- props: {
- openStoreBindModal: {
- type: Boolean,
- default: false
- }
- },
- data () {
- return {
- isshow: this.openStoreBindModal,
- supplierList: [], // 供应商列表
- storeList: [], // 门店列表
- form: {
- supplierName: undefined, // 供应商名称
- storeName: undefined, // 门店名称
- storeAddress: '' // 门店地址
- },
- rules: {
- supplierName: [{
- required: true,
- message: '请选择供应商',
- trigger: ['change', 'blur']
- }],
- storeName: [{
- required: true,
- message: '请选择关联客户',
- trigger: ['change', 'blur']
- }]
- }
- }
- },
- computed: {},
- methods: {
- // 门店搜索查询
- storeSearchRequest (val) {
- if (val) {
- storeQueryAll({
- name: val
- }).then(res => {
- this.storeList = res.data || []
- })
- } else {
- this.storeList = []
- }
- },
- // 供应商搜索查询
- handleSupplierSearch (val) {
- if (val) {
- supplierQueryAll({
- name: val
- }).then(res => {
- this.supplierList = res.data || []
- })
- } else {
- this.supplierList = []
- }
- },
- // 关联客户选择修改
- storeChange (val) {
- console.log(val, 'vvvvvvv')
- if (val) {
- const has = this.storeList.find(item => item.name == val)
- this.form.storeAddress = has ? has.addrProvinceName + has.addrCityName + has.addrDistrictName + has.addrDetail
- : ''
- }
- },
- // 提交
- submitForm (formName) {
- this.$refs[formName].validate(valid => {
- if (valid) {
- const params = {
- supplierSn: this.form.supplierName,
- storeSn: this.storeList.find(item => item.name == this.form.storeName).storeSn
- }
- supplierStoreBind(params).then(res => {
- if (res.status == 200) {
- this.$message.success(res.message)
- this.$emit('refresh')
- setTimeout(() => {
- this.cancel()
- }, 300)
- }
- })
- } else {
- console.log('error submit!!')
- return false
- }
- })
- },
- // 关闭弹窗
- cancel () {
- this.$refs['ruleForm'].resetFields()
- this.$emit('close')
- }
- },
- watch: {
- openStoreBindModal (newValue, oldValue) {
- this.isshow = newValue
- },
- isshow (val) {
- if (!val) {
- this.$emit('close')
- } else {
- setTimeout(() => {
- this.$refs['ruleForm'].resetFields()
- }, 100)
- }
- },
- settleId (newValue, oldValue) {
- if (newValue && this.isshow) {
- this.$refs.table.refresh(newValue)
- }
- }
- }
- }
- </script>
- <style scoped="scoped">
- .submit-cont {
- padding-top: 50px;
- }
- </style>
|