|
@@ -1,14 +1,72 @@
|
|
|
<template>
|
|
|
<el-card class="form-container" shadow="never">
|
|
|
|
|
|
- <product-info-detail
|
|
|
+ <!-- <product-info-detail
|
|
|
v-model="productParam"
|
|
|
:is-edit="isEdit"
|
|
|
@finishCommit="finishCommit"
|
|
|
@resetForm="resetForm"
|
|
|
:btnLoading="btnLoading"
|
|
|
>
|
|
|
- </product-info-detail>
|
|
|
+ </product-info-detail> -->
|
|
|
+ <div style="" >
|
|
|
+ <el-form :model="productParam" :rules="rules" ref="productInfoForm" label-width="120px" class="form-inner-container" size="small">
|
|
|
+ <el-form-item label="产品分类:" prop="productCategoryId">
|
|
|
+ <el-cascader
|
|
|
+ v-if="show"
|
|
|
+ style="width:100%"
|
|
|
+ :props="categoryProp()"
|
|
|
+ v-model="selectProductCateValue"
|
|
|
+ :options="productCateOptions">
|
|
|
+ </el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="产品名称:" prop="name">
|
|
|
+ <el-input v-model="productParam.name" placeholder="请输入产品名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="是否上架:">
|
|
|
+ <el-switch
|
|
|
+ :active-value="true"
|
|
|
+ :inactive-value="false"
|
|
|
+ v-model="productParam.ifShow">
|
|
|
+ </el-switch>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="产品图:" >
|
|
|
+ <myUpload :file-list="files" @on-change="onChange" @on-remove="onRemove" :autoUpload="true"></myUpload>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="检索条件:">
|
|
|
+ <el-input type="textarea" v-model="productParam.searchCondition" placeholder="请输入检索条件"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="来源:">
|
|
|
+ <el-input v-model="productParam.sourceFrom" placeholder="请输入来源"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="售卖平台:">
|
|
|
+ <el-input v-model="productParam.sellPlatform" placeholder="请输入售卖平台"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="售卖平台链接:">
|
|
|
+ <el-input v-model="productParam.platformLink" placeholder="请输入售卖平台链接"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="销冠品牌:">
|
|
|
+ <el-input v-model="productParam.bestSellingBrand" placeholder="请输入销冠品牌"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="产品介绍:">
|
|
|
+ <el-input
|
|
|
+ :autoSize="true"
|
|
|
+ v-model="productParam.description"
|
|
|
+ type="textarea"
|
|
|
+ placeholder="请输入内容"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="产品价格:">
|
|
|
+ <el-input v-model="productParam.price" placeholder="请输入产品价格"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item label="排序">
|
|
|
+ <el-input v-model="productParam.sort" placeholder="请输入排序"></el-input>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item style="text-align: center">
|
|
|
+ <el-button type="primary" size="medium" @click="submit('productInfoForm')" :loading="btnLoading">确认</el-button>
|
|
|
+ <el-button v-if="!isEdit" @click="resetForm('productCateFrom')">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
|
|
|
</el-card>
|
|
|
</template>
|
|
@@ -21,6 +79,7 @@
|
|
|
description:'',//描述
|
|
|
searchCondition:'',//检索条件
|
|
|
sourceFrom:'',//来源
|
|
|
+ sellPlatform:'',//售卖平台
|
|
|
platformLink:'',//平台链接
|
|
|
price:'',//价格
|
|
|
bestSellingBrand:'',//品牌
|
|
@@ -41,6 +100,17 @@
|
|
|
return {
|
|
|
btnLoading:false,
|
|
|
productParam: Object.assign({}, defaultProductParam),
|
|
|
+ files:[],
|
|
|
+ selectProductCateValue: null,
|
|
|
+ productCateOptions: [],
|
|
|
+ rules: {
|
|
|
+ name: [
|
|
|
+ {required: true, message: '请输入产品名称', trigger: 'blur'},
|
|
|
+ {min: 2, max: 140, message: '长度在 2 到 140 个字符', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ productCategoryId: [{required: true, message: '请选择产品分类', trigger: 'blur'}],
|
|
|
+ },
|
|
|
+ show:true
|
|
|
}
|
|
|
},
|
|
|
computed:{
|
|
@@ -56,20 +126,128 @@
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ //产品类别下拉框
|
|
|
+ categoryProp(){
|
|
|
+ var that = this
|
|
|
+ return {
|
|
|
+ checkStrictly: true,
|
|
|
+ label:'name',
|
|
|
+ value:'id',
|
|
|
+ lazy: true,
|
|
|
+ lazyLoad(node,resolve){
|
|
|
+ if(node.level == 0){
|
|
|
+ that.getProductCateList(0,resolve)
|
|
|
+ }else{
|
|
|
+ that.getProductCateList(node.data.id,resolve)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ //查询产品类别
|
|
|
+ getProductCateList(parentId,fn) {
|
|
|
+ var params = {
|
|
|
+ parentId:parentId
|
|
|
+ }
|
|
|
+ this.$api.queryCategory(params).then(response => {
|
|
|
+ let list = response.data.data;
|
|
|
+ // this.productCateOptions = list
|
|
|
+ if(list.length>0){
|
|
|
+ fn(list)
|
|
|
+ }else{
|
|
|
+ fn(null)
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
//获取产品信息
|
|
|
getProductDetails(){
|
|
|
var params = {
|
|
|
id:this.productId
|
|
|
}
|
|
|
this.$api.queryHotProductDetail(params).then(response=>{
|
|
|
- this.productParam=response.data.data;
|
|
|
+ var productParam=response.data.data;
|
|
|
+ this.files = response.data.data.systemFileList||[]
|
|
|
+ if(productParam.productCategoryId){
|
|
|
+ var data = []
|
|
|
+ if(productParam.path){
|
|
|
+ var arr = productParam.path.split('/')
|
|
|
+ if(arr[arr.length-1] == ''){
|
|
|
+ arr.pop()
|
|
|
+ }
|
|
|
+ // var arr = arr.map(item=>parseInt(item))
|
|
|
+ arr.forEach(item => {
|
|
|
+ data.push(parseInt(item));
|
|
|
+ });
|
|
|
|
|
|
+ }
|
|
|
+ data.push(productParam.productCategoryId);
|
|
|
+ this.$set(this,'selectProductCateValue',data)
|
|
|
+ this.show = false
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.show = true
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.productParam = productParam
|
|
|
});
|
|
|
},
|
|
|
//重置表单
|
|
|
- resetForm(){
|
|
|
+ resetForm(formName) {
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ this.selectProductCateValue=[],
|
|
|
+ this.files=[]
|
|
|
this.productParam = Object.assign({}, defaultProductParam);
|
|
|
},
|
|
|
+ //获取文件
|
|
|
+ onChange(file, fileList){
|
|
|
+ if(!this.files){
|
|
|
+ this.$set(this,'files',[])
|
|
|
+ }
|
|
|
+ if (file.guid) {
|
|
|
+ let index = this.files.findIndex(item => {
|
|
|
+ return item.uid == file.uid
|
|
|
+ })
|
|
|
+ if (index != -1) {
|
|
|
+ this.files.splice(index, 1, file)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.files.push(file.raw)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 删除上传的文件
|
|
|
+ onRemove(file, fileList) {
|
|
|
+ let index = this.files.findIndex(item => {
|
|
|
+ return item.uid == file.uid
|
|
|
+ })
|
|
|
+ if (index != -1) {
|
|
|
+ this.files.splice(index, 1)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ submit(formName){
|
|
|
+ var guids = this.$commonJS.checkUploadFile(this.files)
|
|
|
+ if(!guids){
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.productParam.fileGuids = guids
|
|
|
+ if(this.selectProductCateValue && this.selectProductCateValue.length>0){
|
|
|
+ this.productParam.productCategoryId = this.selectProductCateValue[this.selectProductCateValue.length-1]
|
|
|
+ }else{
|
|
|
+ this.productParam.productCategoryId = null
|
|
|
+ }
|
|
|
+ console.log(this.selectProductCateValue)
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ // this.$emit('finishCommit');
|
|
|
+ this.finishCommit(this.isEdit)
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: '验证失败',
|
|
|
+ type: 'error',
|
|
|
+ duration:1000
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
//提交信息
|
|
|
finishCommit(isEdit) {
|
|
|
this.$confirm('是否要提交该产品', '提示', {
|