|
|
@@ -30,7 +30,7 @@
|
|
|
>
|
|
|
<el-option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
</el-select>
|
|
|
- <el-input v-model="submitForm.shopName" placeholder="请输入供应商名称" maxlength="50" show-word-limit :disabled="editType === 'edit'" />
|
|
|
+ <el-input v-else v-model="submitForm.shopName" placeholder="请输入供应商名称" maxlength="50" show-word-limit :disabled="editType === 'edit'" />
|
|
|
</el-form-item>
|
|
|
<!-- 供应商名称END -->
|
|
|
|
|
|
@@ -61,6 +61,7 @@
|
|
|
<el-tag v-for="(brand , index) in supplierBrands" :key="index" closable type="success" @close="handleRemoveBrand(brand)" @click="handleEditBrand(brand)">{{ brand.brandName }}</el-tag>
|
|
|
</template>
|
|
|
<el-tag type="primary" @click="handleAddBrand">添加品牌<span class="el-icon-plus" /></el-tag>
|
|
|
+ <el-input v-show="false" v-model="submitForm.shopInfo" />
|
|
|
</el-form-item>
|
|
|
</transition>
|
|
|
|
|
|
@@ -135,7 +136,7 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 供应商添加品牌的对话框 -->
|
|
|
- <el-dialog title="添加供应商品牌" :visible.sync="dialogAddBrand" width="width" @close="handleDialogAddBrandClosed">
|
|
|
+ <el-dialog :title="editBrandText" :visible.sync="dialogAddBrand" width="width" @close="handleDialogAddBrandClosed">
|
|
|
<el-form ref="subFormRef" :model="subForm" label-width="120px" :rules="formDataRules">
|
|
|
|
|
|
<el-form-item label="选择品牌:" prop="brandId">
|
|
|
@@ -208,7 +209,9 @@
|
|
|
<upload-file
|
|
|
ref="fileUpload"
|
|
|
:auto-upload="false"
|
|
|
+ :data="uploadParams"
|
|
|
:file-list="statementFileList"
|
|
|
+ :before-upload="beforeUploadStatementFile"
|
|
|
@success="uploadStatementFileSuccess"
|
|
|
@remove="removeStatementFile"
|
|
|
@change="changeStatementFile"
|
|
|
@@ -223,8 +226,8 @@
|
|
|
</el-form>
|
|
|
|
|
|
<div slot="footer">
|
|
|
- <el-button @click="dialogAddBrand = false">取 消</el-button>
|
|
|
- <el-button type="primary" :loading="dialogLoading" @click="handleSaveBrand">确 定</el-button>
|
|
|
+ <el-button @click="addBrandSubmitCancel">取 消</el-button>
|
|
|
+ <el-button type="primary" :loading="submitLoading" @click="handleSaveBrand">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
|
|
|
@@ -239,6 +242,7 @@ import { isMobile } from '@/utils/validate'
|
|
|
import { fetchBrandList } from '@/api/brand'
|
|
|
import { deepClone } from '@/utils'
|
|
|
import { addSupplier, getSupplierById } from '@/api/supplier'
|
|
|
+import { Promise } from 'jszip/lib/external'
|
|
|
let uuid = 0
|
|
|
|
|
|
export default {
|
|
|
@@ -250,11 +254,20 @@ export default {
|
|
|
}
|
|
|
return callback()
|
|
|
}
|
|
|
+
|
|
|
+ const validShopInfo = (rule, value, callback) => {
|
|
|
+ console.log(value)
|
|
|
+ if (value <= 0) {
|
|
|
+ return callback(new Error('代理品牌不能为空'))
|
|
|
+ }
|
|
|
+ return callback()
|
|
|
+ }
|
|
|
+
|
|
|
return {
|
|
|
id: '', // 供应商id
|
|
|
editType: '',
|
|
|
isLoading: false,
|
|
|
- dialogLoading: false,
|
|
|
+ submitLoading: false,
|
|
|
dialogAddBrand: false,
|
|
|
brandTagClickType: '', // 品牌表单点击类型
|
|
|
selectedShopType: 1, // 当前选中的供应商类型
|
|
|
@@ -301,7 +314,10 @@ export default {
|
|
|
linkMan: { required: true, message: '联系人不能为空', tigger: 'blur' },
|
|
|
countryId: { required: true, message: '产地不能为空', tigger: 'change', type: 'number' },
|
|
|
brandAuthLogo: { required: true, message: '品牌logo不能为空', tigger: 'change' },
|
|
|
- shopInfo: { required: true, message: '代理品牌不能为空', tigger: 'change', type: 'string' },
|
|
|
+ shopInfo: [
|
|
|
+ { required: true, message: '代理品牌不能为空', tigger: 'change', type: 'number' },
|
|
|
+ { validator: validShopInfo, tigger: 'change' }
|
|
|
+ ],
|
|
|
brandId: { required: true, message: '品牌不能为空', tigger: 'change', type: 'number' },
|
|
|
statementContent: { required: true, message: '声明内容不能为空', tigger: 'change' }, // 声明内容
|
|
|
statementFileId: { required: true, message: '声明文件不能为空', tigger: 'change', type: 'number' }, // 声明文件id
|
|
|
@@ -335,20 +351,36 @@ export default {
|
|
|
}
|
|
|
|
|
|
return this.brandList
|
|
|
+ },
|
|
|
+ // 文件上传参数
|
|
|
+ uploadParams() {
|
|
|
+ return {
|
|
|
+ brandId: this.currentBrand.id,
|
|
|
+ authUserId: this.id
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 文案提示
|
|
|
+ editTypeText() {
|
|
|
+ return this.editType === 'edit' ? '修改' : '添加'
|
|
|
+ },
|
|
|
+ editBrandText() {
|
|
|
+ return this.brandTagClickType === 'edit' ? '修改品牌' : '添加品牌'
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
+ // 根据供应商类型变化获取品牌列表
|
|
|
selectedShopType(nVal) {
|
|
|
this.getBrandList(nVal)
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
- this.editType = this.$route.query.type || 'edit'
|
|
|
+ this.editType = this.$route.query.type || 'add'
|
|
|
this.id = parseInt(this.$route.query.id) || ''
|
|
|
this.getBrandList(this.selectedShopType)
|
|
|
this.fetchSupplierInfo()
|
|
|
},
|
|
|
methods: {
|
|
|
+ /** 数据回显 */
|
|
|
// 获取供应商信息
|
|
|
fetchSupplierInfo() {
|
|
|
if (!this.id) return
|
|
|
@@ -359,7 +391,6 @@ export default {
|
|
|
|
|
|
// 初始化供应商信息
|
|
|
initSupplierInfo(info) {
|
|
|
- // 表单1
|
|
|
for (const key in this.submitForm) {
|
|
|
if (Object.hasOwnProperty.call(info, key)) {
|
|
|
this.submitForm[key] = info[key]
|
|
|
@@ -391,18 +422,25 @@ export default {
|
|
|
if (this.submitForm.logo) {
|
|
|
this.logoList = [{ name: this.submitForm.brandName, url: this.submitForm.logo }]
|
|
|
}
|
|
|
+
|
|
|
+ this.submitForm.shopInfo = this.supplierBrands.length
|
|
|
}
|
|
|
|
|
|
// 微信公众号二维码
|
|
|
if (this.submitForm.qrCodeImage) {
|
|
|
this.qrCodeImageList = [{ name: '', url: this.submitForm.qrCodeImage }]
|
|
|
}
|
|
|
-
|
|
|
- console.log(this.submitForm)
|
|
|
},
|
|
|
+ /** 数据回显END */
|
|
|
|
|
|
// 提交保存
|
|
|
- submit() {
|
|
|
+ async submit() {
|
|
|
+ try {
|
|
|
+ await this.$refs.submitFormRef.validate()
|
|
|
+ } catch (err) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
this.isLoading = true
|
|
|
let params = {}
|
|
|
if (this.selectedShopType === 1) {
|
|
|
@@ -417,7 +455,9 @@ export default {
|
|
|
|
|
|
console.log(params)
|
|
|
addSupplier(params).then(res => {
|
|
|
- this.$message.success('添加供应商成功')
|
|
|
+ this.$message.success(`${this.editTypeText}供应商成功`)
|
|
|
+ this.$store.dispatch('tagsView/delView', this.$route)
|
|
|
+ this.$router.replace('/supplier/list')
|
|
|
}).finally(() => {
|
|
|
this.isLoading = false
|
|
|
})
|
|
|
@@ -503,35 +543,41 @@ export default {
|
|
|
// 添加品牌对话框
|
|
|
handleAddBrand() {
|
|
|
this.brandTagClickType = 'add'
|
|
|
+ // 文件上传参数
|
|
|
this.dialogAddBrand = true
|
|
|
},
|
|
|
// 修改品牌
|
|
|
handleEditBrand(row) {
|
|
|
this.brandTagClickType = 'edit'
|
|
|
- this.editBrandInfo = row
|
|
|
- // 设置选中品牌信息
|
|
|
- this.currentBrand.id = row.brandId
|
|
|
- this.currentBrand.name = row.brandName
|
|
|
- this.currentBrand.authLogo = row.brandAuthLogo
|
|
|
- this.statementFileName = row.statementFileName
|
|
|
-
|
|
|
- if (row.brandAuthLogo) {
|
|
|
- this.brandAuthLogoList = [{ name: row.brandName, url: row.brandAuthLogo }]
|
|
|
- }
|
|
|
+ // 等待dialog表单渲染完成后再设置值
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.editBrandInfo = row
|
|
|
+ // 设置选中品牌信息
|
|
|
+ this.currentBrand.id = row.brandId
|
|
|
+ this.currentBrand.name = row.brandName
|
|
|
+ this.currentBrand.authLogo = row.brandAuthLogo
|
|
|
+ this.statementFileName = row.statementFileName
|
|
|
+
|
|
|
+ if (row.brandAuthLogo) {
|
|
|
+ this.brandAuthLogoList = [{ name: row.brandName, url: row.brandAuthLogo }]
|
|
|
+ }
|
|
|
|
|
|
- if (row.statementImage) {
|
|
|
- this.statementImageList = [{ name: row.brandName, url: row.statementImage }]
|
|
|
- }
|
|
|
+ if (row.statementImage) {
|
|
|
+ this.statementImageList = [{ name: row.brandName, url: row.statementImage }]
|
|
|
+ }
|
|
|
|
|
|
- if (row.statementFileId) {
|
|
|
- this.statementFileList = [{ name: row.statementFileName }]
|
|
|
- }
|
|
|
+ if (row.statementFileId) {
|
|
|
+ this.statementFileList = [{ name: row.statementFileName }]
|
|
|
+ }
|
|
|
|
|
|
- for (const key in this.subForm) {
|
|
|
- if (Object.hasOwnProperty.call(this.editBrandInfo, key)) {
|
|
|
- this.subForm[key] = this.editBrandInfo[key]
|
|
|
+ for (const key in this.subForm) {
|
|
|
+ if (Object.hasOwnProperty.call(this.editBrandInfo, key)) {
|
|
|
+ this.subForm[key] = this.editBrandInfo[key]
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
+
|
|
|
+ console.log(this.subForm)
|
|
|
+ })
|
|
|
|
|
|
this.dialogAddBrand = true
|
|
|
},
|
|
|
@@ -542,12 +588,14 @@ export default {
|
|
|
// 从已添加品牌列表中移除
|
|
|
const findIndex = this.supplierBrands.findIndex(item => item.uuid === row.uuid)
|
|
|
this.supplierBrands.splice(findIndex, 1)
|
|
|
+ this.submitForm.shopInfo = this.supplierBrands.length
|
|
|
},
|
|
|
// 保存品牌
|
|
|
async handleSaveBrand() {
|
|
|
if (this.subForm.statementType === 4) {
|
|
|
console.log('有文件上传')
|
|
|
if (!this.subForm.statementFileId || this.subForm.statementFileId === -1) {
|
|
|
+ this.submitLoading = true
|
|
|
this.$refs.fileUpload.$refs.fileUpload.submit()
|
|
|
return
|
|
|
}
|
|
|
@@ -558,8 +606,18 @@ export default {
|
|
|
} catch (error) {
|
|
|
console.log(error)
|
|
|
}
|
|
|
- console.log(this.supplierBrands)
|
|
|
},
|
|
|
+
|
|
|
+ // 取消保存品牌
|
|
|
+ addBrandSubmitCancel() {
|
|
|
+ // 取消上传文件
|
|
|
+ if (this.$refs.fileUpload) {
|
|
|
+ this.$refs.fileUpload.$refs.fileUpload.abort()
|
|
|
+ this.$message.info('文件上传已取消')
|
|
|
+ }
|
|
|
+ this.dialogAddBrand = false
|
|
|
+ },
|
|
|
+
|
|
|
// 保存品牌操作
|
|
|
handleSaveBrandAction() {
|
|
|
// 深度克隆数据
|
|
|
@@ -593,6 +651,10 @@ export default {
|
|
|
this.statementFileList = []
|
|
|
this.brandAuthLogoList = []
|
|
|
this.currentBrand = {}
|
|
|
+ this.submitForm.shopInfo = this.supplierBrands.length
|
|
|
+ // 按钮loading结束
|
|
|
+ this.submitLoading = false
|
|
|
+ // 初始化表单
|
|
|
this.$refs.subFormRef.resetFields()
|
|
|
console.log(this.subForm)
|
|
|
},
|
|
|
@@ -606,8 +668,6 @@ export default {
|
|
|
this.selectedShopType = type
|
|
|
this.brandAuthLogoList = []
|
|
|
this.statementImageList = []
|
|
|
- // this.supplierBrands = []
|
|
|
- // this.selectedBrandIds = []
|
|
|
this.currentBrand = {}
|
|
|
},
|
|
|
// 获取品牌列表
|
|
|
@@ -619,6 +679,7 @@ export default {
|
|
|
this.brandList = res.data
|
|
|
})
|
|
|
},
|
|
|
+ /** 品牌标签操作END */
|
|
|
|
|
|
// 输入框输入时
|
|
|
handleMobileInput() {
|
|
|
@@ -668,7 +729,7 @@ export default {
|
|
|
this.subForm.statementImage = ''
|
|
|
},
|
|
|
|
|
|
- /** 声明文件上传 */
|
|
|
+ /** 文件上传 */
|
|
|
uploadStatementFileSuccess({ response, file, fileList }) {
|
|
|
this.statementFileList = fileList
|
|
|
this.subForm.statementFileId = response.data.fileId
|
|
|
@@ -686,6 +747,21 @@ export default {
|
|
|
changeStatementFile({ file, fileList }) {
|
|
|
this.statementFileList = fileList
|
|
|
this.subForm.statementFileId = -1
|
|
|
+ },
|
|
|
+ beforeUploadStatementFile(file) {
|
|
|
+ const maxSize = 30
|
|
|
+ if (file.size <= maxSize * 1024 * 1024) return true
|
|
|
+ return this.$confirm(`您上传的文件大于${maxSize}MB，是否继续上传？文件上传过程中请您耐心等待!`, '文件上传提示', {
|
|
|
+ confirmButtonText: '继续',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ return Promise.resolve()
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message.info('已取消上传')
|
|
|
+ this.submitLoading = false
|
|
|
+ return Promise.reject()
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|
喻文俊