Эх сурвалжийг харах

修改-通栏、组件、广告默认链接

15313670163 18 цаг өмнө
parent
commit
ae6f770010

+ 3 - 1
src/views/advertise/adPlaceList.vue

@@ -122,7 +122,8 @@
                             resize="none">
                         </el-input>
                     </el-form-item>
-                     <el-form-item label="广告位链接:" prop="ad_url">
+                     <el-form-item label="广告位链接:" prop="ad_url" v-if = "disabledFields.adTag">
+
                         <el-input v-model="ruleForm.ad_url" placeholder="请输入广告位链接"
                             resize="none">
                         </el-input>
@@ -433,6 +434,7 @@ export default {
                 adType: shouldDisable,
                 adSize: shouldDisable
             };
+            // console.log('this.disabledFields', this.disabledFields);
 
             //数据回显
             this.website_id = val.website_id

+ 161 - 107
src/views/componentGallery/module.vue

@@ -151,7 +151,7 @@
                             <div class="sizeInputSymbol">*</div>
                             <div class="sizeInput"><el-input v-model="ruleForm.component_height" clearable placeholder="高"></el-input></div>
                     </el-form-item>
-                   <el-form-item label="组件展示字段:" prop="listType" class="custom-align-right" v-if="[1,2,3,4,5,6,7,8,9,14].includes(ruleForm.type_id)">
+                   <el-form-item label="组件展示字段:" prop="listType" class="custom-align-right">
                         <!-- <div class="formLabelFloatBox"> -->
                             <!-- <div class="labelTitleStyle"> -->
                                 
@@ -159,10 +159,10 @@
                                     <i class="el-icon-question"></i>
                                 </el-tooltip> -->
                             <!-- </div> -->
-                            <el-checkbox-group v-model="ruleForm.listType">
-                                <el-checkbox  v-for="item in column_options" :key="item" value="item" disabled>{{item}}</el-checkbox>
+                            <!-- <el-checkbox-group v-model="ruleForm.listType"> -->
+                                <span  v-for="item in column_options" :key="item" value="item" disabled style="margin-right: 20px;">{{item}}</span>
 
-                            </el-checkbox-group>
+                            <!-- </el-checkbox-group> -->
                         <!-- </div> -->
                     </el-form-item>
                      <!-- <el-form-item label="组件所需字段:" prop="listType">
@@ -176,10 +176,10 @@
                     
                     <!-- 组件分类:1:资讯-头条组件;2:资讯-轮播组件;3:资讯-推荐图类组件;4:资讯-最新类组件;5:资讯-推荐类;6:资讯-热点类组件;
                      7:资讯-栏目类组件;8:列表类组件;9:详情类组件;10:二级导航栏类组件;11:广告类;12:静态资源类;13:底部导航类; -->
-                    <el-form-item label="含有图片新闻数量:" prop="img_num" v-if="[1,2,3,4,5,6,7,14].includes(ruleForm.type_id)">
+                    <el-form-item label="含有图片新闻数量:" prop="img_num" v-if="[1,2,3,4,5,6,7,14,15].includes(ruleForm.type_id)">
                         <el-input v-model="ruleForm.img_num" placeholder="请输入含有图片新闻数量"></el-input>
                     </el-form-item>
-                    <el-form-item label="含有文字新闻数量:" prop="text_num" v-if="[1,2,3,4,5,6,7,14].includes(ruleForm.type_id)">
+                    <el-form-item label="含有文字新闻数量:" prop="text_num" v-if="[1,2,3,4,5,6,7,14,15].includes(ruleForm.type_id)">
                         <el-input v-model="ruleForm.text_num" placeholder="请输入含有文字新闻数量"></el-input>
                     </el-form-item>
                     <el-form-item label="含有子级图片新闻数量:" prop="child_imgnum" v-if="ruleForm.type_id == 7 || ruleForm.type_id == 14">
@@ -188,13 +188,14 @@
                     <el-form-item label="含有子级文字新闻数量:" prop="child_textnum" v-if="ruleForm.type_id == 7 || ruleForm.type_id == 14">
                         <el-input v-model="ruleForm.child_textnum" placeholder="请输入含有子级文字新闻数量"></el-input>
                     </el-form-item>
-                     <el-form-item label="每页新闻数量:" prop="pageSize" v-if="ruleForm.type_id == 8">
+                     <el-form-item label="每页新闻数量:" prop="pageSize" v-if="[8,17].includes(ruleForm.type_id)">
                         <el-input v-model="ruleForm.pageSize" placeholder="请输入每页新闻数量"></el-input>
                     </el-form-item>
                     <el-form-item label="广告类型:" prop="ad_type" v-if="ruleForm.type_id == 11 || ruleForm.type_id == 14">
                          <el-select v-model="ruleForm.ad_type" placeholder="请选择广告类型">
                             <el-option :value="1" label="文字类型">文字类型</el-option>
-                            <el-option :value="2" label="图文类型">图文类型</el-option>
+                            <el-option :value="2" label="图文类型" :disabled="ruleForm.type_id == 14">图文类型</el-option>
+
                         </el-select>
                         <!-- <el-input v-model="ruleForm.ad_type" placeholder="请输入广告类型"></el-input> -->
                     </el-form-item>
@@ -354,22 +355,44 @@ export default {
                 ad_img: '', //广告示例图
                 num: '', //栏目数量
             },
-
             rules: {
                 component_name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
                 component_type: [{ required: true, trigger: 'blur', validator: validateEmpty }],
-                component_keyword: [{ required: true, trigger: 'blur', validator: validateArray }],
+                // component_keyword: [{ required: true, trigger: 'blur', validator: validateArray }],
                 component_width: [{ required: true, trigger: 'blur', validator: validateEmpty }],
                 component_height: [{ required: true, trigger: 'blur', validator: validateEmpty }],
                 component_img: [{ required: true, trigger: 'blur', validator: validateEmpty }],
                 type_id: [{ required: true, trigger: 'blur', validator: validateEmpty }],
-                component_width: [{ required: true, trigger: 'blur', validator: validateEmpty }],
-                component_height: [{ required: true, trigger: 'blur', validator: validateEmpty }],
             },
+
         }
     },
     methods: {
         //1.列表和分页相关 start ------------------------------------------------------------>
+        dynamicRules() {
+            const art_types = [1, 2, 3, 4, 5, 6, 7, 14, 15];
+            const validateEmpty = (rule, value, callback) => {
+            if (value.length == 0) {
+                callback(new Error('该项不能为空!'))
+            } else {
+                callback()
+            }
+        }
+            // 仅当 ruleForm.type_id 存在且在 art_types 数组中时,返回验证规则
+            if (this.ruleForm.type_id && art_types.includes(Number(this.ruleForm.type_id))) {
+                return {
+                    img_num: [{ required: true, trigger: 'blur', validator: this.validateEmpty }],
+                    text_num: [{ required: true, trigger: 'blur', validator: this.validateEmpty }],
+                    // 仅当组件类型为 7 或 14 时,对子级数量添加验证规则
+                    ...(this.ruleForm.type_id === '7' || this.ruleForm.type_id === '14' ? {
+                        child_imgnum: [{ required: true, trigger: 'blur', validator: this.validateEmpty }],
+                        child_textnum: [{ required: true, trigger: 'blur', validator: this.validateEmpty }],
+                    } : {}),
+                };
+            }
+            return {};
+        },
+
         //1.1 开始请求列表信息方法
         getData() {
             const data = {
@@ -503,11 +526,18 @@ export default {
             this.ruleForm.component_keyword = JSON.parse(val.component_keyword) || [] // 解析 JSON 字符串为数组,若解析失败则返回空数组
             this.tags = JSON.parse(val.component_keyword) || []
             this.columns = JSON.parse(val.component_column)
-            this.column_options = this.columns.listType
+            this.ruleForm.type_id = val.type_id //组件分类
+            if(this.ruleForm.type_id == 11){
+                this.column_options = this.columns.ad
+                console.log("广告",this.column_options)
+                console.log("广告类型",this.columns.ad)
+            }else{
+                this.column_options = this.columns.listType
+            }
+            // this.column_options = this.columns.listType
             this.ruleForm.component_width = val.component_width //组件宽度
             this.ruleForm.component_height = val.component_height //组件高度
             this.ruleForm.component_img = val.component_img //组件展示图
-            this.ruleForm.type_id = val.type_id //组件分类
             this.ruleForm.img_num = val.img_num  //含有图片新闻数量
             this.ruleForm.text_num = val.text_num //含有文字新闻数量
             this.ruleForm.child_imgnum = val.child_imgnum //组件子级图片新闻数量
@@ -522,6 +552,8 @@ export default {
             this.adLogoUrl = val.ad_img //广告示例图
             this.ruleForm.ad_imgid = val.ad_imgid
             this.imageInfo = JSON.parse(val.adimg_info)
+            console.log("图片信息",this.column_options);
+
         },
 
 
@@ -530,99 +562,109 @@ export default {
         submitForm(formName) {
             this.$refs[formName].validate((valid) => {
                 if (valid) {
-                    console.log('submit!');
+                    console.log('基础规则验证通过,开始动态规则验证');
+                    // 执行动态规则验证
+                    // this.dynamicValidation().then((isValid) => {
+                        // if (isValid) {
+                            console.log('动态规则验证通过,开始调用接口');
+                            if (this.dialogName === "添加") {
+                                let img_info = JSON.stringify(this.imageInfo);
+                                const data = {
+                                    component_name: this.ruleForm.component_name,
+                                    component_type: this.ruleForm.component_type,
+                                    component_keyword: JSON.stringify(this.ruleForm.component_keyword),
+                                    component_width: this.ruleForm.component_width,
+                                    component_height: this.ruleForm.component_height,
+                                    component_img: this.ruleForm.component_img,
+                                    type_id: this.ruleForm.type_id,
+                                    num: this.ruleForm.listType,
+                                    img_num: this.ruleForm.img_num,
+                                    text_num: this.ruleForm.text_num,
+                                    child_imgnum: this.ruleForm.child_imgnum,
+                                    child_textnum: this.ruleForm.child_textnum,
+                                    pageSize: this.ruleForm.pageSize,
+                                    ad_type: this.ruleForm.ad_type,
+                                    ad_width: this.ruleForm.ad_width,
+                                    ad_height: this.ruleForm.ad_height,
+                                    ad_img: this.ruleForm.ad_img,
+                                    num: this.ruleForm.num,
+                                    ad_imgid: this.ruleForm.ad_imgid,
+                                    // 修正错误,使用之前定义的 img_info 变量
+                                    img_info: img_info,
+                                };
+                                this.$store.dispatch('module/addComponent', data).then(data => {
+                                    if (data.code === 200) {
+                                        this.$message({
+                                            message: '添加成功',
+                                            type: 'success'
+                                        });
+                                        this.dialogTableVisible = false;
+                                        this.getData();
+                                    } else {
+                                        this.$message({
+                                            message: data.message,
+                                            type: 'error'
+                                        });
+                                    }
+                                });
+                            }
+                            if (this.dialogName === "编辑") {
+                                let img_info = JSON.stringify(this.imageInfo);
+                                const edit_data = {
+                                    id: this.activeid,
+                                    component_name: this.ruleForm.component_name,
+                                    component_type: this.ruleForm.component_type,
+                                    component_keyword: JSON.stringify(this.ruleForm.component_keyword),
+                                    component_width: this.ruleForm.component_width,
+                                    component_height: this.ruleForm.component_height,
+                                    component_img: this.ruleForm.component_img,
+                                    type_id: this.ruleForm.type_id,
+                                    num: this.ruleForm.listType,
+                                    img_num: this.ruleForm.img_num,
+                                    text_num: this.ruleForm.text_num,
+                                    child_imgnum: this.ruleForm.child_imgnum,
+                                    child_textnum: this.ruleForm.child_textnum,
+                                    pageSize: this.ruleForm.pageSize,
+                                    ad_type: this.ruleForm.ad_type,
+                                    ad_width: this.ruleForm.ad_width,
+                                    ad_height: this.ruleForm.ad_height,
+                                    ad_img: this.ruleForm.ad_img,
+                                    num: this.ruleForm.num,
+                                    ad_imgid: this.ruleForm.ad_imgid,
+                                    // 修正错误,使用之前定义的 img_info 变量
+                                    img_info: img_info,
+                                };
+                                this.$store.dispatch('module/updateComponent', edit_data).then(data => {
+                                    if (data.code === 200) {
+                                        this.$message({
+                                            message: '编辑成功',
+                                            type: 'success'
+                                        });
+                                        this.dialogTableVisible = false;
+                                        this.getData();
+                                    } else {
+                                        this.$message({
+                                            message: data.message,
+                                            type: 'error'
+                                        });
+                                    }
+                                });
+                            }
+                    //     } else {
+                    //         console.log('动态规则验证失败');
+                    //     }
+                    // }).catch((error) => {
+                    //     console.error('动态规则验证出错:', error);
+                    //     this.$message({
+                    //         message: '验证过程中出现错误,请重试',
+                    //         type: 'error'
+                    //     });
+                    // });
                 } else {
                     console.log('error submit!!');
-                    return false;
+                    return;
                 }
             });
-            if (this.dialogName == "添加") {
-                // console.log("添加", Array.isArray(this.imageInfo));
-                let img_info = JSON.stringify(this.imageInfo)
-                // console.log("添111加",img_info);
-                const data = {
-                    component_name: this.ruleForm.component_name,
-                    component_type: this.ruleForm.component_type,
-                    component_keyword: JSON.stringify(this.ruleForm.component_keyword),
-                    component_width: this.ruleForm.component_width,
-                    component_height: this.ruleForm.component_height,
-                    component_img: this.ruleForm.component_img,
-                    type_id: this.ruleForm.type_id,
-                    num: this.ruleForm.listType,
-                    img_num: this.ruleForm.img_num,
-                    text_num: this.ruleForm.text_num,
-                    child_imgnum: this.ruleForm.child_imgnum,
-                    child_textnum: this.ruleForm.child_textnum,
-                    pageSize: this.ruleForm.pageSize,
-                    ad_type: this.ruleForm.ad_type,
-                    ad_width: this.ruleForm.ad_width,
-                    ad_height: this.ruleForm.ad_height,
-                    ad_img: this.ruleForm.ad_img,
-                    num: this.ruleForm.num,
-                    ad_imgid: this.ruleForm.ad_imgid,
-                    // 修正错误,使用之前定义的 img_info 变量
-                    img_info: img_info,
-                }
-                // console.log("111111111",data);
-                this.$store.dispatch('module/addComponent',data).then(data => {
-                     if (data.code == 200) {
-                        this.$message({
-                            message: '添加成功',
-                            type: 'success'
-                        })
-                        this.dialogTableVisible = false
-                        this.getData()
-                    }else{
-                        this.$message({
-                            message: data.message,
-                            type: 'error'
-                        })
-                    }
-                })
-            }
-            if (this.dialogName == "编辑") {
-                let img_info = JSON.stringify(this.imageInfo)
-                const edit_data = {
-                    id: this.activeid,
-                    component_name: this.ruleForm.component_name,
-                    component_type: this.ruleForm.component_type,
-                    component_keyword: JSON.stringify(this.ruleForm.component_keyword),
-                    component_width: this.ruleForm.component_width,
-                    component_height: this.ruleForm.component_height,
-                    component_img: this.ruleForm.component_img,
-                    type_id: this.ruleForm.type_id,
-                    num: this.ruleForm.listType,
-                    img_num: this.ruleForm.img_num,
-                    text_num: this.ruleForm.text_num,
-                    child_imgnum: this.ruleForm.child_imgnum,
-                    child_textnum: this.ruleForm.child_textnum,
-                    pageSize: this.ruleForm.pageSize,
-                    ad_type: this.ruleForm.ad_type,
-                    ad_width: this.ruleForm.ad_width,
-                    ad_height: this.ruleForm.ad_height,
-                    ad_img: this.ruleForm.ad_img,
-                    num: this.ruleForm.num,
-                    ad_imgid: this.ruleForm.ad_imgid,
-                    // 修正错误,使用之前定义的 img_info 变量
-                    img_info: img_info,
-                }
-                this.$store.dispatch('module/updateComponent',edit_data).then(data => {
-                     if (data.code == 200) {
-                        this.$message({
-                            message: '编辑成功',
-                            type: 'success'
-                        })
-                        this.dialogTableVisible = false
-                        this.getData()
-                    }else{
-                        this.$message({
-                            message: data.message,
-                            type: 'error'
-                        })
-                    }
-                })
-            }
-
         },
          //1.8 添加
         addWebsite() {
@@ -767,7 +809,6 @@ export default {
         },
         getTypeList(){
             this.$store.dispatch('module/getComponentType').then(res => {
-                
                 if (res.code == 200) {
                     this.type_options = res.data
                 }
@@ -779,7 +820,7 @@ export default {
                 });
             })
         },
-          // 关键词标签
+        // 关键词标签
         updateTags(newTags) {            
             this.tags = newTags;
             this.ruleForm.component_keyword = newTags;
@@ -790,6 +831,19 @@ export default {
         this.getData()
         this.getTypeList()
     },
+    // watch: {
+    //     'ruleForm.type_id': {
+    //         handler(newVal, oldVal) {
+    //             // 当 type_id 变化时,检查 ruleForm 引用是否存在,存在则调用动态规则函数
+    //             if (this.$refs.ruleForm) {
+    //                 this.$refs.ruleForm.validate(this.dynamicRules());
+
+    //             }
+    //         },
+    //         immediate: true // 立即调用一次,确保初始化时也会触发验证
+    //     }
+    // }
+
 }
 </script>
 
@@ -1022,14 +1076,14 @@ input[aria-hidden=true] {
     }
 
     ::v-deep .el-form-item {
-        margin-bottom: 50px;
+        margin-bottom: 20px;
     }
 }
 
 // 弹出层按钮
 .dialogBtn {
     text-align: center;
-    margin: 50px auto 20px;
+    margin: 30px auto 20px;
 
     button {
         width: 184px;

+ 92 - 78
src/views/componentGallery/plateDetail.vue

@@ -2,7 +2,7 @@
   <div class="mainBox">
     <div class="layerBox">
       <tableTitle :name="tableDivTitle" />
-      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="170px" class="demo-ruleForm">
+      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm">
                 <div class="dialogText">
                     <el-form-item label="通栏名称:" prop="sectorName">
                         <el-input v-model="ruleForm.sectorName" placeholder="输入通栏名称"></el-input>
@@ -97,7 +97,7 @@
                         <el-row class="layout-3" >
                             <el-row v-if="checkPlace" style="width: 100%;height: 100%;">
                                 <el-col  v-for="(col,index) in JSON.parse(checkPlace.map)" :key="index" :style="{width:col.col_data.col_width,height:'100%',marginRight:'1.2%'}">
-                                    <el-row class="box" v-for="(row,rowIndex) in col.col_data.row_data" :key="rowIndex" :style="{height:row.row_height,width:'100%',marginBottom:'2.35%'}">
+                                    <el-row class="box" v-for="(row,rowIndex) in col.col_data.row_data" :key="rowIndex" :style="{height:row.row_height,width:row.width,marginBottom:'2.35%'}">
                                         {{ component_option.find(item => item.sort_id == row.component_sort) ? `位置${component_option.find(item => item.sort_id == row.component_sort).sort_id}
                                         (${component_option.find(item => item.sort_id == row.component_sort).width}*${component_option.find(item => item.sort_id == row.component_sort).height})` : '' }}
                                     </el-row>
@@ -138,15 +138,20 @@ export default {
         tagInput
     },
     data() {
+        // 验证字符串或数组是否为空
         const validateEmpty = (rule, value, callback) => {
-            if (value.length == 0) {
+            if (typeof value === 'string' && value.trim() === '') {
+                callback(new Error('该项不能为空!'))
+            } else if (typeof value === 'number' && value === null) {
+                // 数字类型不能调用 trim 方法,直接判断是否为 null
                 callback(new Error('该项不能为空!'))
             } else {
                 callback()
             }
         }
+        // 验证数组是否为空
         const validateArray = (rule, value, callback) => {
-            if (value.length == 0) {
+            if (Array.isArray(value) && value.length === 0) {
                 callback(new Error('该项不能为空!'))
             } else {
                 callback()
@@ -294,6 +299,8 @@ export default {
                 sectorPlace: [{ required: true, trigger: 'blur', validator: validateEmpty }],
                 // sectorPlace: [{ required: true, trigger: 'blur', validator: validateEmpty }],
                 component_code: [{ required: true, trigger: 'blur', validator: validateArray }],
+                pageType: [{ required: true, trigger: 'blur', validator: validateArray }],
+
             },
             logoUrl: '',
             hovering: false, // 鼠标悬浮状态 悬浮时显示删除
@@ -548,80 +555,87 @@ export default {
             }else{
                 this.dialogName = this.name
             }
-           console.log('this.ruleForm121', this.dialogName)
-            console.log('this.ruleForm242', this.name)
-            if (this.dialogName == "添加") {
-                const data = {
-                    sector_name: this.ruleForm.sectorName,       //通栏名称
-                    sector_id: this.ruleForm.sectorId,           //通栏编号
-                    template_id: this.ruleForm.templateStyle,    //所属皮肤
-                    // size_id: this.ruleForm.size_id,             //通栏尺寸
-                    sector_type: this.ruleForm.sectorType,       //通栏类别
-                    sector_code: this.ruleForm.plateCode,        //通栏代码
-                    page_type: this.ruleForm.pageType,           //页面类型
-                    component_num: this.ruleForm.component_num,  //组件数量
-                    sector_keyword: JSON.stringify(this.ruleForm.sectorKeyword), //通栏关键词
-                    sector_img: this.logoUrl,           //通栏展示图
-                    place_type: this.ruleForm.sectorPlace,           //通栏版式id
-                    component_code: JSON.stringify(this.ruleForm.component_code),           //通栏所选组件
-                    sector_width: this.ruleForm.sector_width,           //通栏宽度
-                    sector_height: this.ruleForm.sector_height,           //通栏高度
-                }
-                console.log('添加表单--------data', data);
-                this.$store.dispatch('plate/addSector',data).then(data => {
-                    if (data.code == 200) {
-                        this.$message({
-                            message: '添加成功',
-                            type: 'success'
-                        })
-                       this.$router.push({
-                            path: '/plate',
-                        });
-                    }else{
-                        this.$message({
-                            message: data.message,
-                            type: 'error'
+        //    console.log('this.ruleForm121', this.dialogName)
+        //     console.log('this.ruleForm242', this.name)
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    if (this.dialogName == "添加") {
+                        const data = {
+                            sector_name: this.ruleForm.sectorName,       //通栏名称
+                            sector_id: this.ruleForm.sectorId,           //通栏编号
+                            template_id: this.ruleForm.templateStyle,    //所属皮肤
+                            // size_id: this.ruleForm.size_id,             //通栏尺寸
+                            sector_type: this.ruleForm.sectorType,       //通栏类别
+                            sector_code: this.ruleForm.plateCode,        //通栏代码
+                            page_type: this.ruleForm.pageType,           //页面类型
+                            component_num: this.ruleForm.component_num,  //组件数量
+                            sector_keyword: JSON.stringify(this.ruleForm.sectorKeyword), //通栏关键词
+                            sector_img: this.logoUrl,           //通栏展示图
+                            place_type: this.ruleForm.sectorPlace,           //通栏版式id
+                            component_code: JSON.stringify(this.ruleForm.component_code),           //通栏所选组件
+                            sector_width: this.ruleForm.sector_width,           //通栏宽度
+                            sector_height: this.ruleForm.sector_height,           //通栏高度
+                        }
+                        console.log('添加表单--------data', data);
+                        this.$store.dispatch('plate/addSector',data).then(data => {
+                            if (data.code == 200) {
+                                this.$message({
+                                    message: '添加成功',
+                                    type: 'success'
+                                })
+                            this.$router.push({
+                                    path: '/plate',
+                                });
+                            }else{
+                                this.$message({
+                                    message: data.message,
+                                    type: 'error'
+                                })
+                            }
                         })
+                        
                     }
-                })
-                
-            }
-            if (this.dialogName == "编辑") {
-                const data = {
-                    id: this.$route.query.id,
-                    sector_name: this.ruleForm.sectorName,       //通栏名称
-                    sector_id: this.ruleForm.sectorId,           //通栏编号
-                    template_id: this.ruleForm.templateStyle,    //所属皮肤
-                    // size_id: this.ruleForm.size_id,             //通栏尺寸
-                    sector_type: this.ruleForm.sectorType,       //通栏类别
-                    sector_code: this.ruleForm.plateCode,        //通栏代码
-                    page_type: this.ruleForm.pageType,           //页面类型
-                    component_num: this.ruleForm.component_num,  //组件数量
-                    sector_keyword: JSON.stringify(this.ruleForm.sectorKeyword), //通栏关键词
-                    sector_img: this.ruleForm.image,           //通栏展示图
-                    place_type: this.ruleForm.sectorPlace,           //通栏版式id
-                    component_code: JSON.stringify(this.ruleForm.component_code),           //通栏所选组件
-                    sector_width: this.ruleForm.sector_width,           //通栏宽度
-                    sector_height: this.ruleForm.sector_height,           //通栏高度
-                }
-                console.log('编辑表单---data', data);
-                this.$store.dispatch('plate/updateSector', data).then(data => {
-                    if (data.code == 200) {
-                        this.$message({
-                            message: '编辑成功',
-                            type: 'success'
-                        })  
-                        this.$router.push({
-                            path: '/plate',
-                        });
-                    }else{
-                        this.$message({
-                            message: data.message,
-                            type: 'error'
+                    if (this.dialogName == "编辑") {
+                        const data = {
+                            id: this.$route.query.id,
+                            sector_name: this.ruleForm.sectorName,       //通栏名称
+                            sector_id: this.ruleForm.sectorId,           //通栏编号
+                            template_id: this.ruleForm.templateStyle,    //所属皮肤
+                            // size_id: this.ruleForm.size_id,             //通栏尺寸
+                            sector_type: this.ruleForm.sectorType,       //通栏类别
+                            sector_code: this.ruleForm.plateCode,        //通栏代码
+                            page_type: this.ruleForm.pageType,           //页面类型
+                            component_num: this.ruleForm.component_num,  //组件数量
+                            sector_keyword: JSON.stringify(this.ruleForm.sectorKeyword), //通栏关键词
+                            sector_img: this.ruleForm.image,           //通栏展示图
+                            place_type: this.ruleForm.sectorPlace,           //通栏版式id
+                            component_code: JSON.stringify(this.ruleForm.component_code),           //通栏所选组件
+                            sector_width: this.ruleForm.sector_width,           //通栏宽度
+                            sector_height: this.ruleForm.sector_height,           //通栏高度
+                        }
+                        console.log('编辑表单---data', data);
+                        this.$store.dispatch('plate/updateSector', data).then(data => {
+                            if (data.code == 200) {
+                                this.$message({
+                                    message: '编辑成功',
+                                    type: 'success'
+                                })  
+                                this.$router.push({
+                                    path: '/plate',
+                                });
+                            }else{
+                                this.$message({
+                                    message: data.message,
+                                    type: 'error'
+                                })
+                            }
                         })
-                    }
-                })
-            }
+                    } 
+                } else {
+                    console.log(this.$refs[formName]);
+                    return;
+                }
+            });
         },
         //取消添加或编辑
         cancelForm() {
@@ -878,7 +892,7 @@ input[aria-hidden=true] {
     ::v-deep .el-input--medium,
     ::v-deep .el-form-item__label {
         line-height: 36px;
-        font-size: 16px;
+        font-size: 14px;
     }
 
 }
@@ -1102,14 +1116,14 @@ input[aria-hidden=true] {
     }
 
     ::v-deep .el-form-item {
-        margin-bottom: 50px;
+        margin-bottom: 20px;
     }
 }
 
 // 弹出层按钮
 .dialogBtn {
     text-align: center;
-    margin: 50px auto 20px;
+    margin: 30px auto 20px;
     clear: both;
     button {
         width: 184px;