增加 点击下线时，需要增加下线备注和原因

src/views/goodStore/goodsCost/index.vue

@@ -254,7 +254,7 @@
         >
           <i
             class="el-icon-download tb-icon"
-            @click="get_donline(scope.row.spuCode)"
+            @click="showDonlineDlg(scope.row.spuCode)"
           ></i>
           
         </el-tooltip>
@@ -353,6 +353,37 @@
       </template>
     </ex-table>
     <no-auth v-else></no-auth>
+    <el-dialog title="下线原因" :visible.sync="dialogFormVisible" width="500px">
+      <el-form
+        :model="donline_form"
+        :rules="donline_rules"
+        ref="donline_Form"
+        class="demo-ruleForm"
+        label-width="80px"
+      >
+        
+        <el-form-item label="下线原因" prop="offline_remark">
+          <el-select
+            v-model="donline_form.offline_remark"
+            placeholder="请选择下线原因"
+          >
+            <el-option :label="item.label" :value="item.value" v-for="item in donline_formStOps" :key="item.value"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="下线备注" prop="offline_reason">
+          <el-input
+            v-model="donline_form.offline_reason"
+            type="textarea"
+            placeholder="请输入下线备注"
+            autocomplete="off"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取 消</el-button>
+        <el-button type="primary" @click="donlineDlg">确 定</el-button>
+      </div>
+    </el-dialog>
     <add-edit
       :id="''"
       :sitem="changeList"
@@ -392,7 +423,28 @@ export default {
     },
   },
   data() {
+    var validate = (rule, value, callback) => {
+      if (value == "") {
+        return callback(new Error("必填项不能为空"));
+      } else {
+        callback();
+      }
+    };
     return {
+      dialogFormVisible: false,
+      donline_formStOps:[
+        {value:"1",label:"库存不足"},
+        {value:"2",label:"商品原因"},
+      ],
+      donline_form: {
+        offline_reason: "",
+        offline_remark: "",
+        spuCode: "",
+      },
+      donline_rules: {
+        offline_reason: [{ validator: validate, required: true, trigger: "blur" }],
+        offline_remark: [{ validator: validate, required: true, trigger: "change" }],
+      },
       statusList: [
         {
           code: "0",
@@ -805,7 +857,24 @@ export default {
       }
       this.showModel = true;
     },
-
+//点击下线
+    async showDonlineDlg(spuCode) {
+      this.dialogFormVisible = true;
+      this.donline_form.spuCode = spuCode;
+      // this.donlineDlg(spuCode)
+    },
+    //商品下线原因 确定
+    async donlineDlg() {
+      await this.$refs.donline_Form.validate(async (valid) => {
+        if (valid) {
+          this.dialogFormVisible = false;
+          this.get_donline(this.donline_form.spuCode);
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
 
    async get_donline(spuCode){
       await this.$confirm(`本次操作会下线本条SKU下的所有商品`, "提示",{
@@ -822,10 +891,7 @@ export default {
       })
         .then(async () => {
           this.loading = true;
-          const model = {
-            spuCode: spuCode,
-     
-          };
+          const model = this.donline_form;
           const res = await asyncRequest.goodupoffline(model);
           if (res && res.code === 0) {
             this.loading = false;

src/views/goodStore/goodsOnline/index.vue

@@ -164,9 +164,8 @@
                   <!-- <el-option label="供应商编号" value="4" /> -->
                   <el-option label="业务企业编号" value="5" />
                   <el-option label="平台商品编号" value="6" />
-                  <el-option label="创建人" value="7" /> 
-                  <el-option label="创建人部门" value="9" /> 
-                  </el-select
+                  <el-option label="创建人" value="7" />
+                  <el-option label="创建人部门" value="9" /> </el-select
               ></el-input>
             </el-col>
             <el-col
@@ -280,14 +279,43 @@
         >
           <i
             class="el-icon-download tb-icon"
-            @click="get_donline(scope.row.skuCode)"
+            @click="showDonlineDlg(scope.row.skuCode)"
           ></i>
-          
         </el-tooltip>
       </template>
     </ex-table>
     <no-auth v-else></no-auth>
-    
+    <el-dialog title="下线原因" :visible.sync="dialogFormVisible" width="500px">
+      <el-form
+        :model="donline_form"
+        :rules="donline_rules"
+        ref="donline_Form"
+        class="demo-ruleForm"
+        label-width="80px"
+      >
+        
+        <el-form-item label="下线原因" prop="offline_remark">
+          <el-select
+            v-model="donline_form.offline_remark"
+            placeholder="请选择下线原因"
+          >
+            <el-option :label="item.label" :value="item.value" v-for="item in donline_formStOps" :key="item.value"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="下线备注" prop="offline_reason">
+          <el-input
+            v-model="donline_form.offline_reason"
+            type="textarea"
+            placeholder="请输入下线备注"
+            autocomplete="off"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取 消</el-button>
+        <el-button type="primary" @click="donlineDlg">确 定</el-button>
+      </div>
+    </el-dialog>
     <el-dialog
       title="上线商品导出"
       :visible.sync="centerDialogVisible"
@@ -311,12 +339,11 @@
           </el-date-picker> -->
 
           <periodDatePicker
-                      :start="ruleForm.start_date"
-                      :end="ruleForm.end_date"
-                      :width="'165px'"
-
-                      @timeReturned="time"
-                    />
+            :start="ruleForm.start_date"
+            :end="ruleForm.end_date"
+            :width="'165px'"
+            @timeReturned="time"
+          />
         </el-form-item>
         <el-form-item label="状态: " prop="status">
           <el-select v-model="ruleForm.status" placeholder="请选择">
@@ -391,13 +418,28 @@ export default {
       }
     };
     return {
+      
+      dialogFormVisible: false,
+      donline_formStOps:[
+        {value:"1",label:"库存不足"},
+        {value:"2",label:"商品原因"},
+      ],
+      donline_form: {
+        offline_reason: "",
+        offline_remark: "",
+        skuCode: "",
+      },
+      donline_rules: {
+        offline_reason: [{ validator: validate, required: true, trigger: "blur" }],
+        offline_remark: [{ validator: validate, required: true, trigger: "change" }],
+      },
       fileUrl: urlConfig.baseURL,
       ruleForm: {
         // date: "",
         platform_id: "",
         status: "",
-        start_date:"",
-        end_date:"",
+        start_date: "",
+        end_date: "",
       },
       rules: {
         start_date: [
@@ -494,7 +536,6 @@ export default {
     async time(e) {
       this.ruleForm.start_date = e.startTime || "";
       this.ruleForm.end_date = e.endTime || "";
-      
     },
     platform_codesearchChange(e) {
       const { id } = e;
@@ -678,7 +719,6 @@ export default {
      * @param {String} status 0-禁用 1-启用
      */
     async get_againonline(skuCode) {
-      
       await this.$confirm(`确定要重新发起上线流程？`, {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
@@ -708,25 +748,45 @@ export default {
           console.log("取消");
         });
     },
+    //点击下线
+    async showDonlineDlg(skuCode) {
+      this.dialogFormVisible = true;
+      this.donline_form.skuCode = skuCode;
+      // this.donlineDlg(skuCode)
+    },
+    //商品下线原因 确定
+    async donlineDlg() {
+      await this.$refs.donline_Form.validate(async (valid) => {
+        if (valid) {
+          this.dialogFormVisible = false;
+          this.get_donline(this.donline_form.skuCode);
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
     /**
-     * 商品下线 
-     * @param {String} id id 
-     * @param {String} status 0-禁用 1-启用 
+     * 商品下线
+     * @param {String} id id
+     * @param {String} status 0-禁用 1-启用
      */
     async get_donline(skuCode) {
-
-      
-         await this.$confirm(`确定要下线商品？`, {
+      await this.$confirm(`确定要下线商品？`, {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning",
       })
         .then(async () => {
           this.loading = true;
-          const model = {
+          let obj = {
             skuCode: skuCode,
             exam_status: "8",
           };
+          let model = {...this.donline_form,...obj}
+          console.log("aaaaa",model)
+  
+    
           const res = await asyncRequest.status(model);
           if (res && res.code === 0) {
             this.loading = false;
@@ -745,8 +805,6 @@ export default {
         .catch(() => {
           console.log("取消");
         });
-      
-     
     },
     /**
      * 启用/禁用
@@ -865,5 +923,4 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-
 </style>