修改商城BUG 广告和商品规划

1

src/components/pageHeader/src/main.vue

@@ -0,0 +1,52 @@
+<template>
+  <div class="el-page-header">
+    <div class="el-page-header__left" @click="$emit('back')">
+      <i class="el-icon-back"></i>
+      <div class="el-page-header__title">
+        <slot name="title">{{ title }}</slot>
+      </div>
+    </div>
+    <div class="el-page-header__content">
+      <slot name="content">{{ content }}</slot>
+    </div>
+  </div>
+</template>
+
+<script>
+import { t } from "element-ui/src/locale";
+export default {
+  name: "ElPageHeader",
+  props: {
+    title: {
+      type: String,
+      default() {
+        return '返回';
+      },
+    },
+    content: String,
+  },
+};
+</script>
+<style lang="scss" scoped>
+.el-page-header {
+  margin-top: 10px;
+  display: flex;
+  line-height: 24px;
+  align-items: center;
+  margin-left: 10px;
+}
+.el-page-header__left {
+    display: flex;
+    cursor: pointer;
+    margin-right: 20px;
+    position: relative;
+     align-items: center;
+     .el-icon-back {
+       margin-right: 10px;
+     }
+}
+.el-page-header__content {
+    font-size: 18px;
+    color: #303133;
+}
+</style>

src/views/pms/product/components/ProductAttrDetail.vue

@@ -1,94 +1,138 @@
 <template>
   <div style="margin-top: 50px">
-    <el-form :model="value" ref="productAttrForm" label-width="120px" style="width: 720px" size="small">
+    <el-form
+      :model="value"
+      ref="productAttrForm"
+      label-width="120px"
+      style="width: 720px"
+      size="small"
+    >
       <el-form-item label="属性类型：">
-        <el-select v-model="value.productAttributeCategoryId"
-        :disabled="!isEdit"
-                   placeholder="请选择属性类型"
-                   @change="handleProductAttrChange">
+        <el-select
+          v-model="value.productAttributeCategoryId"
+          :disabled="!isEdit"
+          placeholder="请选择属性类型"
+          @change="handleProductAttrChange"
+        >
           <el-option
             v-for="item in productAttributeCategoryOptions"
             :key="item.value"
             :label="item.label"
-            :value="item.value">
+            :value="item.value"
+          >
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="商品规格：">
         <el-card shadow="never" class="cardBg">
-          <div v-for="(productAttr,idx) in selectProductAttr">
-            {{productAttr.name}}：
-            <el-checkbox-group v-if="productAttr.handAddStatus===0" v-model="selectProductAttr[idx].values" :disabled="!isEdit">
-              <el-checkbox v-for="item in getInputListArr(productAttr.inputList)" :label="item" :key="item"
+          <div v-for="(productAttr, idx) in selectProductAttr">
+            {{ productAttr.name }}：
+            <el-checkbox-group
+              v-if="productAttr.handAddStatus === 0"
+              v-model="selectProductAttr[idx].values"
               :disabled="!isEdit"
-                           class="littleMarginLeft"></el-checkbox>
+            >
+              <el-checkbox
+                v-for="item in getInputListArr(productAttr.inputList)"
+                :label="item"
+                :key="item"
+                :disabled="!isEdit"
+                class="littleMarginLeft"
+              ></el-checkbox>
             </el-checkbox-group>
             <div v-else>
-              <el-checkbox-group v-model="selectProductAttr[idx].values" :disabled="!isEdit">
-                <div v-for="(item,index) in selectProductAttr[idx].options" style="display: inline-block"
-                     class="littleMarginLeft">
-                  <el-checkbox :label="item" :key="item" :disabled="!isEdit"></el-checkbox>
-                  <el-button :disabled="!isEdit" type="text" class="littleMarginLeft" @click="handleRemoveProductAttrValue(idx,index)">删除
+              <el-checkbox-group
+                v-model="selectProductAttr[idx].values"
+                :disabled="!isEdit"
+              >
+                <div
+                  v-for="(item, index) in selectProductAttr[idx].options"
+                  style="display: inline-block"
+                  class="littleMarginLeft"
+                >
+                  <el-checkbox
+                    :label="item"
+                    :key="item"
+                    :disabled="!isEdit"
+                  ></el-checkbox>
+                  <el-button
+                    :disabled="!isEdit"
+                    type="text"
+                    class="littleMarginLeft"
+                    @click="handleRemoveProductAttrValue(idx, index)"
+                    >删除
                   </el-button>
                 </div>
               </el-checkbox-group>
-              <el-input v-model="addProductAttrValue" :disabled="!isEdit" style="width: 160px;margin-left: 10px" clearable></el-input>
-              <el-button :disabled="!isEdit" class="littleMarginLeft" @click="handleAddProductAttrValue(idx)">增加</el-button>
+              <el-input
+                v-model="addProductAttrValue"
+                :disabled="!isEdit"
+                style="width: 160px; margin-left: 10px"
+                clearable
+              ></el-input>
+              <el-button
+                :disabled="!isEdit"
+                class="littleMarginLeft"
+                @click="handleAddProductAttrValue(idx)"
+                >增加</el-button
+              >
             </div>
           </div>
         </el-card>
-        <el-table style="width: 100%;margin-top: 20px"
-                  :data="value.skuStockList"
-                  border>
+        <el-table
+          style="width: 100%; margin-top: 20px"
+          :data="value.skuStockList"
+          border
+        >
           <el-table-column
-            v-for="(item,index) in selectProductAttr"
+            v-for="(item, index) in selectProductAttr"
             :label="item.name"
             :key="item.id"
-            align="center">
+            align="center"
+          >
             <template slot-scope="scope">
-              {{getProductSkuSp(scope.row,index)}}
+              {{ getProductSkuSp(scope.row, index) }}
             </template>
           </el-table-column>
-          <el-table-column
-            label="销售价格"
-            width="80"
-            align="center">
+          <el-table-column label="销售价格" width="80" align="center">
             <template slot-scope="scope">
-              <el-input v-model="scope.row.price"   :disabled="!isEdit"></el-input>
+              <el-input
+                v-model="scope.row.price"
+                :disabled="!isEdit"
+              ></el-input>
             </template>
           </el-table-column>
-          <el-table-column
-            label="商品库存"
-            width="80"
-            align="center">
+          <el-table-column label="商品库存" width="80" align="center">
             <template slot-scope="scope">
-              <el-input v-model="scope.row.stock"   :disabled="!isEdit"></el-input>
+              <el-input
+                v-model="scope.row.stock"
+                :disabled="!isEdit"
+              ></el-input>
             </template>
           </el-table-column>
-          <el-table-column
-            label="库存预警值"
-            width="80"
-            align="center">
+          <el-table-column label="库存预警值" width="80" align="center">
             <template slot-scope="scope">
-              <el-input v-model="scope.row.lowStock"   :disabled="!isEdit"></el-input>
+              <el-input
+                v-model="scope.row.lowStock"
+                :disabled="!isEdit"
+              ></el-input>
             </template>
           </el-table-column>
-          <el-table-column
-            label="SKU编号"
-            align="center">
+          <el-table-column label="SKU编号" align="center">
             <template slot-scope="scope">
-              <el-input v-model="scope.row.skuCode"  :disabled="!isEdit"></el-input>
+              <el-input
+                v-model="scope.row.skuCode"
+                :disabled="!isEdit"
+              ></el-input>
             </template>
           </el-table-column>
-          <el-table-column
-            label="操作"
-            width="80"
-            align="center">
+          <el-table-column label="操作" width="80" align="center">
             <template slot-scope="scope">
               <el-button
-               :disabled="!isEdit"
+                :disabled="!isEdit"
                 type="text"
-                @click="handleRemoveProductSku(scope.$index, scope.row)">删除
+                @click="handleRemoveProductSku(scope.$index, scope.row)"
+                >删除
               </el-button>
             </template>
           </el-table-column>
@@ -96,544 +140,629 @@
         <el-button
           type="primary"
           style="margin-top: 20px"
-            :disabled="!isEdit"
-          @click="handleRefreshProductSkuList">刷新列表
+          :disabled="!isEdit"
+          @click="handleRefreshProductSkuList"
+          >刷新列表
         </el-button>
         <el-button
           type="primary"
           style="margin-top: 20px"
-           :disabled="!isEdit"
-          @click="handleSyncProductSkuPrice">同步价格
-
+          :disabled="!isEdit"
+          @click="handleSyncProductSkuPrice"
+          >同步价格
         </el-button>
         <el-button
           type="primary"
           style="margin-top: 20px"
-           :disabled="!isEdit"
-          @click="handleSyncProductSkuStock">同步库存
+          :disabled="!isEdit"
+          @click="handleSyncProductSkuStock"
+          >同步库存
         </el-button>
       </el-form-item>
       <el-form-item label="属性图片：" v-if="hasAttrPic">
         <el-card shadow="never" class="cardBg">
-          <div v-for="(item,index) in selectProductAttrPics">
-            <span>{{item.name}}:</span>
-            <single-upload v-model="item.pic"
-             :disabled="!isEdit"
-                           style="width: 300px;display: inline-block;margin-left: 10px"></single-upload>
+          <div v-for="(item, index) in selectProductAttrPics">
+            <span>{{ item.name }}:</span>
+            <single-upload
+              v-model="item.pic"
+              :disabled="!isEdit"
+              style="width: 300px; display: inline-block; margin-left: 10px"
+            ></single-upload>
           </div>
         </el-card>
       </el-form-item>
       <el-form-item label="商品参数：">
         <el-card shadow="never" class="cardBg">
-          <div v-for="(item,index) in selectProductParam" :class="{littleMarginTop:index!==0}">
-            <div class="paramInputLabel">{{item.name}}:</div>
-            <el-select v-if="item.inputType===1"  :disabled="!isEdit" class="paramInput" v-model="selectProductParam[index].value">
+          <div
+            v-for="(item, index) in selectProductParam"
+            :class="{ littleMarginTop: index !== 0 }"
+          >
+            <div class="paramInputLabel">{{ item.name }}:</div>
+            <el-select
+              v-if="item.inputType === 1"
+              :disabled="!isEdit"
+              class="paramInput"
+              v-model="selectProductParam[index].value"
+            >
               <el-option
                 v-for="item in getParamInputList(item.inputList)"
                 :key="item"
                 :label="item"
-                :value="item">
+                :value="item"
+              >
               </el-option>
             </el-select>
-            <el-input v-else class="paramInput"  :disabled="!isEdit" v-model="selectProductParam[index].value"></el-input>
+            <el-input
+              v-else
+              class="paramInput"
+              :disabled="!isEdit"
+              v-model="selectProductParam[index].value"
+            ></el-input>
           </div>
         </el-card>
       </el-form-item>
       <el-form-item label="商品相册：">
-        <multi-upload v-model="selectProductPics"  :disabled="!isEdit"></multi-upload>
+        <multi-upload
+          v-model="selectProductPics"
+          :disabled="!isEdit"
+        ></multi-upload>
       </el-form-item>
       <el-form-item label="规格参数：">
         <el-tabs v-model="activeHtmlName" type="card">
           <el-tab-pane label="电脑端详情" name="pc">
-            <tinymce :width="595" :height="300" v-model="value.detailHtml"  :disabled="!isEdit"></tinymce>
+            <tinymce
+              :width="595"
+              :height="300"
+              v-model="value.detailHtml"
+              :disabled="!isEdit"
+            ></tinymce>
           </el-tab-pane>
           <el-tab-pane label="移动端详情" name="mobile">
-            <tinymce :width="595" :height="300" v-model="value.detailMobileHtml"  :disabled="!isEdit"></tinymce>
+            <tinymce
+              :width="595"
+              :height="300"
+              v-model="value.detailMobileHtml"
+              :disabled="!isEdit"
+            ></tinymce>
           </el-tab-pane>
         </el-tabs>
       </el-form-item>
       <el-form-item style="text-align: center">
-        <el-button size="medium" @click="handlePrev">上一步，填写商品促销</el-button>
-        <el-button type="primary" size="medium" @click="handleNext">下一步，选择商品关联</el-button>
+        <el-button size="medium" @click="handlePrev"
+          >上一步，填写商品促销</el-button
+        >
+        <el-button type="primary" size="medium" @click="handleNext"
+          >下一步，选择商品关联</el-button
+        >
       </el-form-item>
     </el-form>
   </div>
 </template>
 
 <script>
-  import {fetchList as fetchProductAttrCateList} from '@/api/productAttrCate'
-  import {fetchList as fetchProductAttrList} from '@/api/productAttr'
-  import SingleUpload from '@/components/Upload/singleUpload'
-  import MultiUpload from '@/components/Upload/multiUpload'
-  import Tinymce from '@/components/Tinymce'
+import { fetchList as fetchProductAttrCateList } from "@/api/productAttrCate";
+import { fetchList as fetchProductAttrList } from "@/api/productAttr";
+import SingleUpload from "@/components/Upload/singleUpload";
+import MultiUpload from "@/components/Upload/multiUpload";
+import Tinymce from "@/components/Tinymce";
 
-  export default {
-    name: "ProductAttrDetail",
-    components: {SingleUpload, MultiUpload, Tinymce},
-    props: {
-      value: Object,
-      isEdit: {
-        type: Boolean,
-        default: false
-      }
+export default {
+  name: "ProductAttrDetail",
+  components: { SingleUpload, MultiUpload, Tinymce },
+  props: {
+    value: Object,
+    isEdit: {
+      type: Boolean,
+      default: false,
     },
-    data() {
-      return {
-        //编辑模式时是否初始化成功
-        hasEditCreated:false,
-        //商品属性分类下拉选项
-        productAttributeCategoryOptions: [],
-        //选中的商品属性
-        selectProductAttr: [],
-        //选中的商品参数
-        selectProductParam: [],
-        //选中的商品属性图片
-        selectProductAttrPics: [],
-        //可手动添加的商品属性
-        addProductAttrValue: '',
-        //商品富文本详情激活类型
-        activeHtmlName: 'pc'
+  },
+  data() {
+    return {
+      //编辑模式时是否初始化成功
+      hasEditCreated: false,
+      //商品属性分类下拉选项
+      productAttributeCategoryOptions: [],
+      //选中的商品属性
+      selectProductAttr: [],
+      //选中的商品参数
+      selectProductParam: [],
+      //选中的商品属性图片
+      selectProductAttrPics: [],
+      //可手动添加的商品属性
+      addProductAttrValue: "",
+      //商品富文本详情激活类型
+      activeHtmlName: "pc",
+    };
+  },
+  computed: {
+    //是否有商品属性图片
+    hasAttrPic() {
+      if (this.selectProductAttrPics.length < 1) {
+        return false;
       }
+      return true;
     },
-    computed: {
-      //是否有商品属性图片
-      hasAttrPic() {
-        if (this.selectProductAttrPics.length < 1) {
-          return false;
+    //商品的编号
+    productId() {
+      return this.value.id;
+    },
+    //商品的主图和画册图片
+    selectProductPics: {
+      get: function () {
+        let pics = [];
+        if (
+          this.value.pic === undefined ||
+          this.value.pic == null ||
+          this.value.pic === ""
+        ) {
+          return pics;
         }
-        return true;
-      },
-      //商品的编号
-      productId(){
-        return this.value.id;
-      },
-      //商品的主图和画册图片
-      selectProductPics:{
-        get:function () {
-          let pics=[];
-          if(this.value.pic===undefined||this.value.pic==null||this.value.pic===''){
-            return pics;
-          }
-          pics.push(this.value.pic);
-          if(this.value.albumPics===undefined||this.value.albumPics==null||this.value.albumPics===''){
-            return pics;
-          }
-          let albumPics = this.value.albumPics.split(',');
-          for(let i=0;i<albumPics.length;i++){
-            pics.push(albumPics[i]);
-          }
+        pics.push(this.value.pic);
+        if (
+          this.value.albumPics === undefined ||
+          this.value.albumPics == null ||
+          this.value.albumPics === ""
+        ) {
           return pics;
-        },
-        set:function (newValue) {
-          if (newValue == null || newValue.length === 0) {
-            this.value.pic = null;
-            this.value.albumPics = null;
-          } else {
-            this.value.pic = newValue[0];
-            this.value.albumPics = '';
-            if (newValue.length > 1) {
-              for (let i = 1; i < newValue.length; i++) {
-                this.value.albumPics += newValue[i];
-                if (i !== newValue.length - 1) {
-                  this.value.albumPics += ',';
-                }
+        }
+        let albumPics = this.value.albumPics.split(",");
+        for (let i = 0; i < albumPics.length; i++) {
+          pics.push(albumPics[i]);
+        }
+        return pics;
+      },
+      set: function (newValue) {
+        if (newValue == null || newValue.length === 0) {
+          this.value.pic = null;
+          this.value.albumPics = null;
+        } else {
+          this.value.pic = newValue[0];
+          this.value.albumPics = "";
+          if (newValue.length > 1) {
+            for (let i = 1; i < newValue.length; i++) {
+              this.value.albumPics += newValue[i];
+              if (i !== newValue.length - 1) {
+                this.value.albumPics += ",";
               }
             }
           }
         }
-      }
+      },
     },
-    created() {
-      this.getProductAttrCateList();
+  },
+  created() {
+    this.getProductAttrCateList();
+  },
+  watch: {
+    productId: function (newValue) {
+      if (!this.isEdit) return;
+      if (this.hasEditCreated) return;
+      if (newValue === undefined || newValue == null || newValue === 0) return;
+      this.handleEditCreated();
     },
-    watch: {
-      productId:function (newValue) {
-        if(!this.isEdit)return;
-        if(this.hasEditCreated)return;
-        if(newValue===undefined||newValue==null||newValue===0)return;
-        this.handleEditCreated();
+  },
+  methods: {
+    handleEditCreated() {
+      //根据商品属性分类id获取属性和参数
+      if (this.value.productAttributeCategoryId != null) {
+        this.handleProductAttrChange(this.value.productAttributeCategoryId);
       }
+      this.hasEditCreated = true;
     },
-    methods: {
-      handleEditCreated() {
-        //根据商品属性分类id获取属性和参数
-        if(this.value.productAttributeCategoryId!=null){
-          this.handleProductAttrChange(this.value.productAttributeCategoryId);
+    getProductAttrCateList() {
+      let param = { pageNum: 1, pageSize: 100 };
+      fetchProductAttrCateList(param).then((response) => {
+        this.productAttributeCategoryOptions = [];
+        let list = response.data.list;
+        for (let i = 0; i < list.length; i++) {
+          this.productAttributeCategoryOptions.push({
+            label: list[i].name,
+            value: list[i].id,
+          });
         }
-        this.hasEditCreated=true;
-      },
-      getProductAttrCateList() {
-        let param = {pageNum: 1, pageSize: 100};
-        fetchProductAttrCateList(param).then(response => {
-          this.productAttributeCategoryOptions = [];
-          let list = response.data.list;
+      });
+    },
+    getProductAttrList(type, cid) {
+      let param = { pageNum: 1, pageSize: 100, type: type };
+      fetchProductAttrList(cid, param).then((response) => {
+        let list = response.data.list;
+        if (type === 0) {
+          this.selectProductAttr = [];
           for (let i = 0; i < list.length; i++) {
-            this.productAttributeCategoryOptions.push({label: list[i].name, value: list[i].id});
-          }
-        });
-      },
-      getProductAttrList(type, cid) {
-        let param = {pageNum: 1, pageSize: 100, type: type};
-        fetchProductAttrList(cid, param).then(response => {
-          let list = response.data.list;
-          if (type === 0) {
-            this.selectProductAttr = [];
-            for (let i = 0; i < list.length; i++) {
-              let options = [];
-              let values = [];
-              if (this.isEdit) {
-                if (list[i].handAddStatus === 1) {
-                  //编辑状态下获取手动添加编辑属性
-                  options = this.getEditAttrOptions(list[i].id);
-                }
-                //编辑状态下获取选中属性
-                values = this.getEditAttrValues(i);
+            let options = [];
+            let values = [];
+            if (this.isEdit) {
+              if (list[i].handAddStatus === 1) {
+                //编辑状态下获取手动添加编辑属性
+                options = this.getEditAttrOptions(list[i].id);
               }
-              this.selectProductAttr.push({
-                id: list[i].id,
-                name: list[i].name,
-                handAddStatus: list[i].handAddStatus,
-                inputList: list[i].inputList,
-                values: values,
-                options: options
-              });
-            }
-            if(this.isEdit){
-              //编辑模式下刷新商品属性图片
-              this.refreshProductAttrPics();
-            }
-          } else {
-            this.selectProductParam = [];
-            for (let i = 0; i < list.length; i++) {
-              let value=null;
-              if(this.isEdit){
-                //编辑模式下获取参数属性
-                value= this.getEditParamValue(list[i].id);
-              }
-              this.selectProductParam.push({
-                id: list[i].id,
-                name: list[i].name,
-                value: value,
-                inputType: list[i].inputType,
-                inputList: list[i].inputList
-              });
+              //编辑状态下获取选中属性
+              values = this.getEditAttrValues(i);
             }
+            this.selectProductAttr.push({
+              id: list[i].id,
+              name: list[i].name,
+              handAddStatus: list[i].handAddStatus,
+              inputList: list[i].inputList,
+              values: values,
+              options: options,
+            });
           }
-        });
-      },
-      //获取设置的可手动添加属性值
-      getEditAttrOptions(id) {
-        let options = [];
-        for (let i = 0; i < this.value.productAttributeValueList.length; i++) {
-          let attrValue = this.value.productAttributeValueList[i];
-          if (attrValue.productAttributeId === id) {
-            let strArr = attrValue.value.split(',');
-            for (let j = 0; j < strArr.length; j++) {
-              options.push(strArr[j]);
+          if (this.isEdit) {
+            //编辑模式下刷新商品属性图片
+            this.refreshProductAttrPics();
+          }
+        } else {
+          this.selectProductParam = [];
+          for (let i = 0; i < list.length; i++) {
+            let value = null;
+            if (this.isEdit) {
+              //编辑模式下获取参数属性
+              value = this.getEditParamValue(list[i].id);
             }
-            break;
+            this.selectProductParam.push({
+              id: list[i].id,
+              name: list[i].name,
+              value: value,
+              inputType: list[i].inputType,
+              inputList: list[i].inputList,
+            });
           }
         }
-        return options;
-      },
-      //获取选中的属性值
-      getEditAttrValues(index) {
-        let values = new Set();
-        if (index === 0) {
-          for (let i = 0; i < this.value.skuStockList.length; i++) {
-            let sku = this.value.skuStockList[i];
-            let spData = JSON.parse(sku.spData);
-            if (spData!= null && spData.length>=1) {
-              values.add(spData[0].value);
-            }
+      });
+    },
+    //获取设置的可手动添加属性值
+    getEditAttrOptions(id) {
+      let options = [];
+      for (let i = 0; i < this.value.productAttributeValueList.length; i++) {
+        let attrValue = this.value.productAttributeValueList[i];
+        if (attrValue.productAttributeId === id) {
+          let strArr = attrValue.value.split(",");
+          for (let j = 0; j < strArr.length; j++) {
+            options.push(strArr[j]);
           }
-        } else if (index === 1) {
-          for (let i = 0; i < this.value.skuStockList.length; i++) {
-            let sku = this.value.skuStockList[i];
-            let spData = JSON.parse(sku.spData);
-            if (spData!= null && spData.length>=2) {
-              values.add(spData[1].value);
-            }
+          break;
+        }
+      }
+      return options;
+    },
+    //获取选中的属性值
+    getEditAttrValues(index) {
+      let values = new Set();
+      if (index === 0) {
+        for (let i = 0; i < this.value.skuStockList.length; i++) {
+          let sku = this.value.skuStockList[i];
+          let spData = JSON.parse(sku.spData);
+          if (spData != null && spData.length >= 1) {
+            values.add(spData[0].value);
           }
-        } else {
-          for (let i = 0; i < this.value.skuStockList.length; i++) {
-            let sku = this.value.skuStockList[i];
-            let spData = JSON.parse(sku.spData);
-            if (spData!= null && spData.length>=3) {
-              values.add(spData[2].value);
-            }
+        }
+      } else if (index === 1) {
+        for (let i = 0; i < this.value.skuStockList.length; i++) {
+          let sku = this.value.skuStockList[i];
+          let spData = JSON.parse(sku.spData);
+          if (spData != null && spData.length >= 2) {
+            values.add(spData[1].value);
           }
         }
-        return Array.from(values);
-      },
-      //获取属性的值
-      getEditParamValue(id){
-        for(let i=0;i<this.value.productAttributeValueList.length;i++){
-          if(id===this.value.productAttributeValueList[i].productAttributeId){
-            return this.value.productAttributeValueList[i].value;
+      } else {
+        for (let i = 0; i < this.value.skuStockList.length; i++) {
+          let sku = this.value.skuStockList[i];
+          let spData = JSON.parse(sku.spData);
+          if (spData != null && spData.length >= 3) {
+            values.add(spData[2].value);
           }
         }
-      },
-      handleProductAttrChange(value) {
-        this.getProductAttrList(0, value);
-        this.getProductAttrList(1, value);
-      },
-      getInputListArr(inputList) {
-        return inputList.split(',');
-      },
-      handleAddProductAttrValue(idx) {
-        let options = this.selectProductAttr[idx].options;
-        if (this.addProductAttrValue == null || this.addProductAttrValue == '') {
-          this.$message({
-            message: '属性值不能为空',
-            type: 'warning',
-            duration: 1000
-          });
-          return
+      }
+      return Array.from(values);
+    },
+    //获取属性的值
+    getEditParamValue(id) {
+      for (let i = 0; i < this.value.productAttributeValueList.length; i++) {
+        if (id === this.value.productAttributeValueList[i].productAttributeId) {
+          return this.value.productAttributeValueList[i].value;
         }
-        if (options.indexOf(this.addProductAttrValue) !== -1) {
-          this.$message({
-            message: '属性值不能重复',
-            type: 'warning',
-            duration: 1000
-          });
-          return;
+      }
+    },
+    handleProductAttrChange(value) {
+      this.getProductAttrList(0, value);
+      this.getProductAttrList(1, value);
+    },
+    getInputListArr(inputList) {
+      return inputList.split(",");
+    },
+    handleAddProductAttrValue(idx) {
+      let options = this.selectProductAttr[idx].options;
+      if (this.addProductAttrValue == null || this.addProductAttrValue == "") {
+        this.$message({
+          message: "属性值不能为空",
+          type: "warning",
+          duration: 1000,
+        });
+        return;
+      }
+      if (options.indexOf(this.addProductAttrValue) !== -1) {
+        this.$message({
+          message: "属性值不能重复",
+          type: "warning",
+          duration: 1000,
+        });
+        return;
+      }
+      this.selectProductAttr[idx].options.push(this.addProductAttrValue);
+      this.addProductAttrValue = null;
+    },
+    handleRemoveProductAttrValue(idx, index) {
+      this.selectProductAttr[idx].options.splice(index, 1);
+    },
+    getProductSkuSp(row, index) {
+      let spData = JSON.parse(row.spData);
+      if (spData != null && index < spData.length) {
+        return spData[index].value;
+      } else {
+        return null;
+      }
+    },
+    handleRefreshProductSkuList() {
+      this.$confirm("刷新列表将导致sku信息重新生成，是否要刷新", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        this.refreshProductAttrPics();
+        this.refreshProductSkuList();
+      });
+    },
+    handleSyncProductSkuPrice() {
+      this.$confirm("将同步第一个sku的价格到所有sku,是否继续", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        if (
+          this.value.skuStockList !== null &&
+          this.value.skuStockList.length > 0
+        ) {
+          let tempSkuList = [];
+          tempSkuList = tempSkuList.concat(
+            tempSkuList,
+            this.value.skuStockList
+          );
+          let price = this.value.skuStockList[0].price;
+          for (let i = 0; i < tempSkuList.length; i++) {
+            tempSkuList[i].price = price;
+          }
+          this.value.skuStockList = [];
+          this.value.skuStockList = this.value.skuStockList.concat(
+            this.value.skuStockList,
+            tempSkuList
+          );
         }
-        this.selectProductAttr[idx].options.push(this.addProductAttrValue);
-        this.addProductAttrValue = null;
-      },
-      handleRemoveProductAttrValue(idx, index) {
-        this.selectProductAttr[idx].options.splice(index, 1);
-      },
-      getProductSkuSp(row, index) {
-        let spData = JSON.parse(row.spData);
-        if(spData!=null&&index<spData.length){
-          return spData[index].value;
-        }else{
-          return null;
+      });
+    },
+    handleSyncProductSkuStock() {
+      this.$confirm("将同步第一个sku的库存到所有sku,是否继续", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        if (
+          this.value.skuStockList !== null &&
+          this.value.skuStockList.length > 0
+        ) {
+          let tempSkuList = [];
+          tempSkuList = tempSkuList.concat(
+            tempSkuList,
+            this.value.skuStockList
+          );
+          let stock = this.value.skuStockList[0].stock;
+          let lowStock = this.value.skuStockList[0].lowStock;
+          for (let i = 0; i < tempSkuList.length; i++) {
+            tempSkuList[i].stock = stock;
+            tempSkuList[i].lowStock = lowStock;
+          }
+          this.value.skuStockList = [];
+          this.value.skuStockList = this.value.skuStockList.concat(
+            this.value.skuStockList,
+            tempSkuList
+          );
         }
-      },
-      handleRefreshProductSkuList() {
-        this.$confirm('刷新列表将导致sku信息重新生成，是否要刷新', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(() => {
-          this.refreshProductAttrPics();
-          this.refreshProductSkuList();
-        });
-      },
-      handleSyncProductSkuPrice(){
-        this.$confirm('将同步第一个sku的价格到所有sku,是否继续', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(() => {
-          if(this.value.skuStockList!==null&&this.value.skuStockList.length>0){
-            let tempSkuList = [];
-            tempSkuList = tempSkuList.concat(tempSkuList,this.value.skuStockList);
-            let price=this.value.skuStockList[0].price;
-            for(let i=0;i<tempSkuList.length;i++){
-              tempSkuList[i].price=price;
-            }
-            this.value.skuStockList=[];
-            this.value.skuStockList=this.value.skuStockList.concat(this.value.skuStockList,tempSkuList);
+      });
+    },
+    refreshProductSkuList() {
+      this.value.skuStockList = [];
+      let skuList = this.value.skuStockList;
+      //只有一个属性时
+      if (this.selectProductAttr.length === 1) {
+        let attr = this.selectProductAttr[0];
+        for (let i = 0; i < attr.values.length; i++) {
+          skuList.push({
+            spData: JSON.stringify([{ key: attr.name, value: attr.values[i] }]),
+          });
+        }
+      } else if (this.selectProductAttr.length === 2) {
+        let attr0 = this.selectProductAttr[0];
+        let attr1 = this.selectProductAttr[1];
+        for (let i = 0; i < attr0.values.length; i++) {
+          if (attr1.values.length === 0) {
+            skuList.push({
+              spData: JSON.stringify([
+                { key: attr0.name, value: attr0.values[i] },
+              ]),
+            });
+            continue;
           }
-        });
-      },
-      handleSyncProductSkuStock(){
-        this.$confirm('将同步第一个sku的库存到所有sku,是否继续', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(() => {
-          if(this.value.skuStockList!==null&&this.value.skuStockList.length>0){
-            let tempSkuList = [];
-            tempSkuList = tempSkuList.concat(tempSkuList,this.value.skuStockList);
-            let stock=this.value.skuStockList[0].stock;
-            let lowStock=this.value.skuStockList[0].lowStock;
-            for(let i=0;i<tempSkuList.length;i++){
-              tempSkuList[i].stock=stock;
-              tempSkuList[i].lowStock=lowStock;
-            }
-            this.value.skuStockList=[];
-            this.value.skuStockList=this.value.skuStockList.concat(this.value.skuStockList,tempSkuList);
+          for (let j = 0; j < attr1.values.length; j++) {
+            let spData = [];
+            spData.push({ key: attr0.name, value: attr0.values[i] });
+            spData.push({ key: attr1.name, value: attr1.values[j] });
+            skuList.push({
+              spData: JSON.stringify(spData),
+            });
           }
-        });
-      },
-      refreshProductSkuList() {
-        this.value.skuStockList = [];
-        let skuList = this.value.skuStockList;
-        //只有一个属性时
-        if (this.selectProductAttr.length === 1) {
-          let attr = this.selectProductAttr[0];
-          for (let i = 0; i < attr.values.length; i++) {
+        }
+      } else {
+        let attr0 = this.selectProductAttr[0];
+        let attr1 = this.selectProductAttr[1];
+        let attr2 = this.selectProductAttr[2];
+        for (let i = 0; i < attr0.values.length; i++) {
+          if (attr1.values.length === 0) {
             skuList.push({
-              spData: JSON.stringify([{key:attr.name,value:attr.values[i]}])
+              spData: JSON.stringify([
+                { key: attr0.name, value: attr0.values[i] },
+              ]),
             });
+            continue;
           }
-        } else if (this.selectProductAttr.length === 2) {
-          let attr0 = this.selectProductAttr[0];
-          let attr1 = this.selectProductAttr[1];
-          for (let i = 0; i < attr0.values.length; i++) {
-            if (attr1.values.length === 0) {
+          for (let j = 0; j < attr1.values.length; j++) {
+            if (attr2.values.length === 0) {
+              let spData = [];
+              spData.push({ key: attr0.name, value: attr0.values[i] });
+              spData.push({ key: attr1.name, value: attr1.values[j] });
               skuList.push({
-                spData: JSON.stringify([{key:attr0.name,value:attr0.values[i]}])
+                spData: JSON.stringify(spData),
               });
               continue;
             }
-            for (let j = 0; j < attr1.values.length; j++) {
+            for (let k = 0; k < attr2.values.length; k++) {
               let spData = [];
-              spData.push({key:attr0.name,value:attr0.values[i]});
-              spData.push({key:attr1.name,value:attr1.values[j]});
-              skuList.push({
-                spData: JSON.stringify(spData)
-              });
-            }
-          }
-        } else {
-          let attr0 = this.selectProductAttr[0];
-          let attr1 = this.selectProductAttr[1];
-          let attr2 = this.selectProductAttr[2];
-          for (let i = 0; i < attr0.values.length; i++) {
-            if (attr1.values.length === 0) {
+              spData.push({ key: attr0.name, value: attr0.values[i] });
+              spData.push({ key: attr1.name, value: attr1.values[j] });
+              spData.push({ key: attr2.name, value: attr2.values[k] });
               skuList.push({
-                spData: JSON.stringify([{key:attr0.name,value:attr0.values[i]}])
+                spData: JSON.stringify(spData),
               });
-              continue;
-            }
-            for (let j = 0; j < attr1.values.length; j++) {
-              if (attr2.values.length === 0) {
-                let spData = [];
-                spData.push({key:attr0.name,value:attr0.values[i]});
-                spData.push({key:attr1.name,value:attr1.values[j]});
-                skuList.push({
-                  spData: JSON.stringify(spData)
-                });
-                continue;
-              }
-              for (let k = 0; k < attr2.values.length; k++) {
-                let spData = [];
-                spData.push({key:attr0.name,value:attr0.values[i]});
-                spData.push({key:attr1.name,value:attr1.values[j]});
-                spData.push({key:attr2.name,value:attr2.values[k]});
-                skuList.push({
-                  spData: JSON.stringify(spData)
-                });
-              }
-            }
-          }
-        }
-      },
-      refreshProductAttrPics() {
-        this.selectProductAttrPics = [];
-        if (this.selectProductAttr.length >= 1) {
-          let values = this.selectProductAttr[0].values;
-          for (let i = 0; i < values.length; i++) {
-            let pic=null;
-            if(this.isEdit){
-              //编辑状态下获取图片
-              pic=this.getProductSkuPic(values[i]);
             }
-            this.selectProductAttrPics.push({name: values[i], pic: pic})
           }
         }
-      },
-      //获取商品相关属性的图片
-      getProductSkuPic(name){
-        for(let i=0;i<this.value.skuStockList.length;i++){
-          let spData = JSON.parse(this.value.skuStockList[i].spData);
-          if(name===spData[0].value){
-            return this.value.skuStockList[i].pic;
+      }
+    },
+    refreshProductAttrPics() {
+      this.selectProductAttrPics = [];
+      if (this.selectProductAttr.length >= 1) {
+        let values = this.selectProductAttr[0].values;
+        for (let i = 0; i < values.length; i++) {
+          let pic = null;
+          if (this.isEdit) {
+            //编辑状态下获取图片
+            pic = this.getProductSkuPic(values[i]);
           }
+          this.selectProductAttrPics.push({ name: values[i], pic: pic });
         }
-        return null;
-      },
-      //合并商品属性
-      mergeProductAttrValue() {
-        this.value.productAttributeValueList = [];
-        for (let i = 0; i < this.selectProductAttr.length; i++) {
-          let attr = this.selectProductAttr[i];
-          if (attr.handAddStatus === 1 && attr.options != null && attr.options.length > 0) {
-            this.value.productAttributeValueList.push({
-              productAttributeId: attr.id,
-              value: this.getOptionStr(attr.options)
-            });
-          }
+      }
+    },
+    //获取商品相关属性的图片
+    getProductSkuPic(name) {
+      for (let i = 0; i < this.value.skuStockList.length; i++) {
+        let spData = JSON.parse(this.value.skuStockList[i].spData);
+        if (name === spData[0].value) {
+          return this.value.skuStockList[i].pic;
         }
-        for (let i = 0; i < this.selectProductParam.length; i++) {
-          let param = this.selectProductParam[i];
+      }
+      return null;
+    },
+    //合并商品属性
+    mergeProductAttrValue() {
+      this.value.productAttributeValueList = [];
+      for (let i = 0; i < this.selectProductAttr.length; i++) {
+        let attr = this.selectProductAttr[i];
+        if (
+          attr.handAddStatus === 1 &&
+          attr.options != null &&
+          attr.options.length > 0
+        ) {
           this.value.productAttributeValueList.push({
-            productAttributeId: param.id,
-            value: param.value
+            productAttributeId: attr.id,
+            value: this.getOptionStr(attr.options),
           });
         }
-      },
-      //合并商品属性图片
-      mergeProductAttrPics() {
-        for (let i = 0; i < this.selectProductAttrPics.length; i++) {
-          for (let j = 0; j < this.value.skuStockList.length; j++) {
-            let spData = JSON.parse(this.value.skuStockList[j].spData);
-            if (spData[0].value === this.selectProductAttrPics[i].name) {
-              this.value.skuStockList[j].pic = this.selectProductAttrPics[i].pic;
-            }
-          }
-        }
-      },
-      getOptionStr(arr) {
-        let str = '';
-        for (let i = 0; i < arr.length; i++) {
-          str += arr[i];
-          if (i != arr.length - 1) {
-            str += ',';
+      }
+      for (let i = 0; i < this.selectProductParam.length; i++) {
+        let param = this.selectProductParam[i];
+        this.value.productAttributeValueList.push({
+          productAttributeId: param.id,
+          value: param.value,
+        });
+      }
+    },
+    //合并商品属性图片
+    mergeProductAttrPics() {
+      for (let i = 0; i < this.selectProductAttrPics.length; i++) {
+        for (let j = 0; j < this.value.skuStockList.length; j++) {
+          let spData = JSON.parse(this.value.skuStockList[j].spData);
+          if (spData[0].value === this.selectProductAttrPics[i].name) {
+            this.value.skuStockList[j].pic = this.selectProductAttrPics[i].pic;
           }
         }
-        return str;
-      },
-      handleRemoveProductSku(index, row) {
-        let list = this.value.skuStockList;
-        if (list.length === 1) {
-          list.pop();
-        } else {
-          list.splice(index, 1);
+      }
+    },
+    getOptionStr(arr) {
+      let str = "";
+      for (let i = 0; i < arr.length; i++) {
+        str += arr[i];
+        if (i != arr.length - 1) {
+          str += ",";
         }
-      },
-      getParamInputList(inputList) {
-        return inputList.split(',');
-      },
-      handlePrev() {
-        this.$emit('prevStep')
-      },
-      handleNext() {
-        this.mergeProductAttrValue();
-        this.mergeProductAttrPics();
-        this.$emit('nextStep')
       }
-    }
-  }
+      return str;
+    },
+    handleRemoveProductSku(index, row) {
+      let list = this.value.skuStockList;
+      if (list.length === 1) {
+        list.pop();
+      } else {
+        list.splice(index, 1);
+      }
+    },
+    getParamInputList(inputList) {
+      return inputList.split(",");
+    },
+    handlePrev() {
+      this.$emit("prevStep");
+    },
+    handleNext() {
+      console.log(this.skuStockList, this.value.skuStockList);
+      if (
+        !this.value.skuStockList ||
+        this.value.skuStockList.length <= 0 ||
+        !this.value.skuStockList[0].price ||
+        !this.value.skuStockList[0].stock ||
+        !this.value.skuStockList[0].lowStock ||
+        !this.value.skuStockList[0].skuCode
+      ) {
+        this.$message.error("请编辑商品规格");
+        return;
+      }
+
+      this.mergeProductAttrValue();
+      this.mergeProductAttrPics();
+      this.$emit("nextStep");
+    },
+  },
+};
 </script>
 
 <style scoped>
-  .littleMarginLeft {
-    margin-left: 10px;
-  }
+.littleMarginLeft {
+  margin-left: 10px;
+}
 
-  .littleMarginTop {
-    margin-top: 10px;
-  }
+.littleMarginTop {
+  margin-top: 10px;
+}
 
-  .paramInput {
-    width: 250px;
-  }
+.paramInput {
+  width: 250px;
+}
 
-  .paramInputLabel {
-    display: inline-block;
-    width: 100px;
-    text-align: right;
-    padding-right: 10px
-  }
+.paramInputLabel {
+  display: inline-block;
+  width: 100px;
+  text-align: right;
+  padding-right: 10px;
+}
 
-  .cardBg {
-    background: #F8F9FC;
-  }
+.cardBg {
+  background: #f8f9fc;
+}
 </style>

src/views/pms/product/components/ProductInfoDetail.vue

@@ -111,12 +111,14 @@
     },
     watch: {
       productId:function(newValue){
-        if(!this.isEdit)return;
+        console.log('productId',newValue,this.isEdit)
+        // if(!this.isEdit)return;
         if(this.hasEditCreated)return;
         if(newValue===undefined||newValue==null||newValue===0)return;
         this.handleEditCreated();
       },
       selectProductCateValue: function (newValue) {
+        console.log(newValue,'newValue')
         if (newValue != null && newValue.length === 2) {
           this.value.productCategoryId = newValue[1];
           this.value.productCategoryName= this.getCateNameById(this.value.productCategoryId);
@@ -136,6 +138,7 @@
         this.hasEditCreated=true;
       },
       getProductCateList() {
+        console.log('获取商品分类')
         fetchListWithChildren().then(response => {
           let list = response.data;
           this.productCateOptions = [];

src/views/sms/advertise/add.vue

@@ -1,12 +1,12 @@
-<template> 
+<template>
   <home-advertise-detail :isEdit="false"></home-advertise-detail>
 </template>
 <script>
-  import HomeAdvertiseDetail from './components/HomeAdvertiseDetail'
-  export default {
-    name: 'addHomeAdvertise',
-    components: { HomeAdvertiseDetail }
-  }
+import HomeAdvertiseDetail from "./components/HomeAdvertiseDetail";
+export default {
+  name: "addHomeAdvertise",
+  components: { HomeAdvertiseDetail },
+};
 </script>
 <style></style>
 

src/views/sms/advertise/components/HomeAdvertiseDetail.vue

@@ -1,185 +1,211 @@
-<template> 
-  <el-card class="form-container" shadow="never">
-    <el-form :model="homeAdvertise"
-             :rules="rules"
-             ref="homeAdvertiseFrom"
-             label-width="150px"
-             size="small">
-      <el-form-item label="广告名称：" prop="name">
-        <el-input v-model="homeAdvertise.name" class="input-width"></el-input>
-      </el-form-item>
-      <el-form-item label="广告位置：">
-        <el-select v-model="homeAdvertise.type">
-          <el-option
-            v-for="type in typeOptions"
-            :key="type.value"
-            :label="type.label"
-            :value="type.value">
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="开始时间：" prop="startTime">
-        <el-date-picker
-          type="datetime"
-          placeholder="选择日期"
-          v-model="homeAdvertise.startTime"></el-date-picker>
-      </el-form-item>
-      <el-form-item label="到期时间：" prop="endTime">
-        <el-date-picker
-          type="datetime"
-          placeholder="选择日期"
-          v-model="homeAdvertise.endTime"></el-date-picker>
-      </el-form-item>
-      <el-form-item label="上线/下线：">
-        <el-radio-group v-model="homeAdvertise.status">
-          <el-radio :label="0">下线</el-radio>
-          <el-radio :label="1">上线</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item label="广告图片：">
-        <single-upload v-model="homeAdvertise.pic"></single-upload>
-      </el-form-item>
-      <el-form-item label="排序：">
-        <el-input v-model="homeAdvertise.sort" class="input-width"></el-input>
-      </el-form-item>
-      <el-form-item label="广告链接：" prop="url">
-        <el-input v-model="homeAdvertise.url" class="input-width"></el-input>
-      </el-form-item>
-      <el-form-item label="广告备注：">
-        <el-input
-          class="input-width"
-          type="textarea"
-          :rows="5"
-          placeholder="请输入内容"
-          v-model="homeAdvertise.note">
-        </el-input>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit('homeAdvertiseFrom')">提交</el-button>
-        <el-button v-if="!isEdit" @click="resetForm('homeAdvertiseFrom')">重置</el-button>
-      </el-form-item>
-    </el-form>
-  </el-card>
+<template>
+   
+  <div>
+    <!-- <el-page-header @back="goBack" content="新增广告"> </el-page-header> -->
+    <pageHeader @back="goBack" :content="!isEdit?'新增广告':homeAdvertise.name"/>
+    <el-card class="form-container" shadow="never">
+      <el-form
+        :model="homeAdvertise"
+        :rules="rules"
+        ref="homeAdvertiseFrom"
+        label-width="150px"
+        size="small"
+      >
+        <el-form-item label="广告名称：" prop="name">
+          <el-input v-model="homeAdvertise.name" class="input-width"></el-input>
+        </el-form-item>
+        <el-form-item label="广告位置：">
+          <el-select v-model="homeAdvertise.type">
+            <el-option
+              v-for="type in typeOptions"
+              :key="type.value"
+              :label="type.label"
+              :value="type.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始时间：" prop="startTime">
+          <el-date-picker
+            type="datetime"
+            placeholder="选择日期"
+            v-model="homeAdvertise.startTime"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="到期时间：" prop="endTime">
+          <el-date-picker
+            type="datetime"
+            placeholder="选择日期"
+            v-model="homeAdvertise.endTime"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="上线/下线：">
+          <el-radio-group v-model="homeAdvertise.status">
+            <el-radio :label="0">下线</el-radio>
+            <el-radio :label="1">上线</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="广告图片：">
+          <single-upload v-model="homeAdvertise.pic"></single-upload>
+        </el-form-item>
+        <el-form-item label="排序：">
+          <el-input v-model="homeAdvertise.sort" class="input-width"></el-input>
+        </el-form-item>
+        <el-form-item label="广告链接：" prop="url">
+          <el-input v-model="homeAdvertise.url" class="input-width"></el-input>
+        </el-form-item>
+        <el-form-item label="广告备注：">
+          <el-input
+            class="input-width"
+            type="textarea"
+            :rows="5"
+            placeholder="请输入内容"
+            v-model="homeAdvertise.note"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit('homeAdvertiseFrom')"
+            >提交</el-button
+          >
+          <el-button v-if="!isEdit" @click="resetForm('homeAdvertiseFrom')"
+            >重置</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-card>
+  </div>
 </template>
 <script>
-  import SingleUpload from '@/components/Upload/singleUpload'
-  import {createHomeAdvertise, getHomeAdvertise, updateHomeAdvertise} from '@/api/homeAdvertise'
-  const defaultTypeOptions = [
-    {
-      label: 'PC首页轮播',
-      value: 0
+import SingleUpload from "@/components/Upload/singleUpload";
+import pageHeader from '@/components/pageHeader/src/main'
+import {
+  createHomeAdvertise,
+  getHomeAdvertise,
+  updateHomeAdvertise,
+} from "@/api/homeAdvertise";
+const defaultTypeOptions = [
+  {
+    label: "PC首页轮播",
+    value: 0,
+  },
+  {
+    label: "APP首页轮播",
+    value: 1,
+  },
+];
+const defaultHomeAdvertise = {
+  name: null,
+  type: 1,
+  pic: null,
+  startTime: null,
+  endTime: null,
+  status: 0,
+  url: null,
+  note: null,
+  sort: 0,
+};
+export default {
+  name: "HomeAdvertiseDetail",
+  components: { SingleUpload,pageHeader },
+  props: {
+    isEdit: {
+      type: Boolean,
+      default: false,
     },
-    {
-      label: 'APP首页轮播',
-      value: 1
+  },
+  data() {
+    return {
+      homeAdvertise: null,
+      rules: {
+        name: [
+          { required: true, message: "请输入广告名称", trigger: "blur" },
+          {
+            min: 2,
+            max: 140,
+            message: "长度在 2 到 140 个字符",
+            trigger: "blur",
+          },
+        ],
+        url: [{ required: true, message: "请输入广告链接", trigger: "blur" }],
+        startTime: [
+          { required: true, message: "请选择开始时间", trigger: "blur" },
+        ],
+        endTime: [
+          { required: true, message: "请选择到期时间", trigger: "blur" },
+        ],
+        pic: [{ required: true, message: "请选择广告图片", trigger: "blur" }],
+      },
+      typeOptions: Object.assign({}, defaultTypeOptions),
+    };
+  },
+  created() {
+    if (this.isEdit) {
+      getHomeAdvertise(this.$route.query.id).then((response) => {
+        this.homeAdvertise = response.data;
+      });
+    } else {
+      this.homeAdvertise = Object.assign({}, defaultHomeAdvertise);
     }
-  ];
-  const defaultHomeAdvertise = {
-    name: null,
-    type: 1,
-    pic: null,
-    startTime: null,
-    endTime: null,
-    status: 0,
-    url: null,
-    note: null,
-    sort: 0
-  };
-  export default {
-    name: 'HomeAdvertiseDetail',
-    components:{SingleUpload},
-    props: {
-      isEdit: {
-        type: Boolean,
-        default: false
-      }
+  },
+  methods: {
+    onSubmit(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.$confirm("是否提交数据", "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          }).then(() => {
+            if (this.isEdit) {
+              updateHomeAdvertise(
+                this.$route.query.id,
+                this.homeAdvertise
+              ).then((response) => {
+                this.$refs[formName].resetFields();
+                this.$message({
+                  message: "修改成功",
+                  type: "success",
+                  duration: 1000,
+                });
+                this.$router.back();
+              });
+            } else {
+              createHomeAdvertise(this.homeAdvertise).then((response) => {
+                this.$refs[formName].resetFields();
+                this.homeAdvertise = Object.assign({}, defaultHomeAdvertise);
+                this.$message({
+                  message: "提交成功",
+                  type: "success",
+                  duration: 1000,
+                });
+              });
+            }
+          });
+        } else {
+          this.$message({
+            message: "验证失败",
+            type: "error",
+            duration: 1000,
+          });
+          return false;
+        }
+      });
     },
-    data() {
-      return {
-        homeAdvertise: null,
-        rules: {
-          name: [
-            {required: true, message: '请输入广告名称', trigger: 'blur'},
-            {min: 2, max: 140, message: '长度在 2 到 140 个字符', trigger: 'blur'}
-          ],
-          url: [
-            {required: true, message: '请输入广告链接', trigger: 'blur'}
-          ],
-          startTime: [
-            {required: true, message: '请选择开始时间', trigger: 'blur'}
-          ],
-          endTime: [
-            {required: true, message: '请选择到期时间', trigger: 'blur'}
-          ],
-          pic: [
-            {required: true, message: '请选择广告图片', trigger: 'blur'}
-          ]
-        },
-        typeOptions: Object.assign({}, defaultTypeOptions)
-      }
+    resetForm(formName) {
+      this.$refs[formName].resetFields();
+      this.homeAdvertise = Object.assign({}, defaultHomeAdvertise);
     },
-    created(){
-      if (this.isEdit) {
-        getHomeAdvertise(this.$route.query.id).then(response => {
-          this.homeAdvertise = response.data;
-        });
-      }else{
-        this.homeAdvertise = Object.assign({},defaultHomeAdvertise);
-      }
+    goBack() {
+      this.$router.push("/sms/advertise");
     },
-    methods: {
-      onSubmit(formName) {
-        this.$refs[formName].validate((valid) => {
-          if (valid) {
-            this.$confirm('是否提交数据', '提示', {
-              confirmButtonText: '确定',
-              cancelButtonText: '取消',
-              type: 'warning'
-            }).then(() => {
-              if (this.isEdit) {
-                updateHomeAdvertise(this.$route.query.id, this.homeAdvertise).then(response => {
-                  this.$refs[formName].resetFields();
-                  this.$message({
-                    message: '修改成功',
-                    type: 'success',
-                    duration:1000
-                  });
-                  this.$router.back();
-                });
-              } else {
-                createHomeAdvertise(this.homeAdvertise).then(response => {
-                  this.$refs[formName].resetFields();
-                  this.homeAdvertise = Object.assign({},defaultHomeAdvertise);
-                  this.$message({
-                    message: '提交成功',
-                    type: 'success',
-                    duration:1000
-                  });
-                });
-              }
-            });
-
-          } else {
-            this.$message({
-              message: '验证失败',
-              type: 'error',
-              duration:1000
-            });
-            return false;
-          }
-        });
-      },
-      resetForm(formName) {
-        this.$refs[formName].resetFields();
-        this.homeAdvertise = Object.assign({},defaultHomeAdvertise);
-      }
-    }
-  }
+  },
+};
 </script>
 <style scoped>
-  .input-width {
-    width: 70%;
-  }
+.input-width {
+  width: 70%;
+}
 </style>
 
 

src/views/sms/advertise/update.vue

@@ -1,12 +1,13 @@
-<template> 
-  <home-advertise-detail :isEdit="true"></home-advertise-detail>
+<template>
+    <home-advertise-detail :isEdit="true"></home-advertise-detail>
 </template>
 <script>
-  import HomeAdvertiseDetail from './components/HomeAdvertiseDetail'
-  export default {
-    name: 'updateHomeAdvertise',
-    components: { HomeAdvertiseDetail }
-  }
+import HomeAdvertiseDetail from "./components/HomeAdvertiseDetail";
+export default {
+  name: "updateHomeAdvertise",
+  components: { HomeAdvertiseDetail },
+
+};
 </script>
 <style></style>