no message

src/components/template/editTable.js

@@ -13,27 +13,37 @@ export default {
     }
   },
   methods: {
-    convertTableJson(tableData, list, attributes = {
-      isAdd: true,
-      isDel: true,
-      isUpdate: true,
-      isConfirm: true,
-      isEdit: true,
-      isTemElm: true,
-      confirmText: "",
-      editText: "",
-      delText: "",
-    }, funs = {
-      add: function () { },
-      confirm: function () { },
-      delete: function () { },
-      update: function () { },
-      verify: function () { },
-    }) {
+    convertTableJson(
+      tableData,
+      list,
+      attributes = {
+        isAdd: true,
+        isDel: true,
+        isUpdate: true,
+        isConfirm: true,
+        isEdit: true,
+        isTemElm: true,
+        confirmText: '',
+        editText: '',
+        delText: ''
+      },
+      funs = {
+        add: function () {},
+        confirm: function () {},
+        delete: function () {},
+        update: function () {},
+        verify: function () {},
+        btnSlot: function () {}
+      }
+    ) {
       var newList = list.map(item => {
         if (item.editRender && item.viewRender) {
           item.render = (h, { row, column, index }) => {
-            if (attributes?.isTemElm !== undefined ? setShowElement(attributes?.isTemElm, { row, column, index }) : index == this.isEditTableIndex) {
+            if (
+              attributes?.isTemElm !== undefined
+                ? setShowElement(attributes?.isTemElm, { row, column, index })
+                : index == this.isEditTableIndex
+            ) {
               return item.editRender(h, { row, column, index })
             } else {
               return item.viewRender(h, { row, column, index })
@@ -41,7 +51,7 @@ export default {
           }
         }
         return item
-      });
+      })
       if (setShowElement(attributes?.isEdit)) {
         newList.push({
           columnAttributes: {
@@ -49,56 +59,91 @@ export default {
             width: 100
           },
           render: (h, { row, column, index }) => {
-            return <div style="padding-left:10px">
-              {(attributes?.isConfirm !== undefined ? setShowElement(attributes?.isConfirm, { row, column, index }) : this.isEditTableIndex == index) && <el-button type="text" onClick={async () => {
-                if (funs.verify && !await funs.verify({ row, column, index }, this.isEditTableIndex)) {
-                  return;
-                }
-                if (funs.confirm) {
-                  funs.confirm({ row, column, index })
-                } else {
-                  this.isEditTableIndex = -1
-                }
-              }}>{attributes?.confirmText || '确定'}</el-button>}
-              {(attributes?.isUpdate !== undefined ? setShowElement(attributes?.isUpdate, { row, column, index }) : this.isEditTableIndex == -1) && <el-button type="text" onClick={async () => {
-                if (funs.verify && !await funs.verify({ row, column, index }, this.isEditTableIndex)) {
-                  return;
-                }
-                if (funs.update) {
-                  funs.update({ row, column, index })
-                } else {
-                  this.isEditTableIndex = index
-                }
-              }}>{attributes?.editText || '编辑'}</el-button>}
-              {setShowElement(attributes?.isDel, { row, column, index }) && <el-button type="text" onClick={async () => {
-                if (funs.delete) {
-                  funs.delete({ row, column, index }, function(){
-                    tableData.splice(index, 1)
-                  })
-                } else {
-                  tableData.splice(index, 1)
-                }
-              }}>{attributes?.delText || '删除'}</el-button>}
-            </div>
+            return (
+              <div style="padding-left:10px">
+                {(attributes?.isConfirm !== undefined
+                  ? setShowElement(attributes?.isConfirm, { row, column, index })
+                  : this.isEditTableIndex == index) && (
+                  <el-button
+                    type="text"
+                    onClick={async () => {
+                      if (funs.verify && !(await funs.verify({ row, column, index }, this.isEditTableIndex))) {
+                        return
+                      }
+                      if (funs.confirm) {
+                        funs.confirm({ row, column, index })
+                      } else {
+                        this.isEditTableIndex = -1
+                      }
+                    }}
+                  >
+                    {attributes?.confirmText || '确定'}
+                  </el-button>
+                )}
+                {(attributes?.isUpdate !== undefined
+                  ? setShowElement(attributes?.isUpdate, { row, column, index })
+                  : this.isEditTableIndex == -1) && (
+                  <el-button
+                    type="text"
+                    onClick={async () => {
+                      if (funs.verify && !(await funs.verify({ row, column, index }, this.isEditTableIndex))) {
+                        return
+                      }
+                      if (funs.update) {
+                        funs.update({ row, column, index })
+                      } else {
+                        this.isEditTableIndex = index
+                      }
+                    }}
+                  >
+                    {attributes?.editText || '编辑'}
+                  </el-button>
+                )}
+                {setShowElement(attributes?.isDel, { row, column, index }) && (
+                  <el-button
+                    type="text"
+                    onClick={async () => {
+                      if (funs.delete) {
+                        funs.delete({ row, column, index }, function () {
+                          tableData.splice(index, 1)
+                        })
+                      } else {
+                        tableData.splice(index, 1)
+                      }
+                    }}
+                  >
+                    {attributes?.delText || '删除'}
+                  </el-button>
+                )}
+                {funs.btnSlot ? funs.btnSlot({ row, column, index }) : null}
+              </div>
+            )
           }
         })
-      };
-      return <div>
-        {setShowElement(attributes?.isAdd) ? <div>
-          <el-button size="mini" type="primary" onClick={async () => {
-            if (funs.verify && !await funs.verify({}, this.isEditTableIndex)) {
-              return;
-            }
-            if (funs.add) {
-              funs.add()
-            }
-          }}>新增</el-button>
-        </div> : null}
-        <zj-table
-          columns={newList}
-          table-data={tableData}
-        />
-      </div>
+      }
+      return (
+        <div>
+          {setShowElement(attributes?.isAdd) ? (
+            <div>
+              <el-button
+                size="mini"
+                type="primary"
+                onClick={async () => {
+                  if (funs.verify && !(await funs.verify({}, this.isEditTableIndex))) {
+                    return
+                  }
+                  if (funs.add) {
+                    funs.add()
+                  }
+                }}
+              >
+                新增
+              </el-button>
+            </div>
+          ) : null}
+          <zj-table columns={newList} table-data={tableData} />
+        </div>
+      )
     }
   }
 }

src/views/mallManagement/setActivity/formModule.vue

@@ -0,0 +1,175 @@
+<template>
+  <zj-form-module title="活动网点" label-width="120px" :form-data="item" :form-items="formItems"> </zj-form-module>
+</template>
+
+<script>
+import editTable from '@/components/template/editTable.js'
+import { required, mobileRequired, mobile, httpUrl, email } from '@/components/template/rules_verify.js'
+import { string } from '@zjlib/element-plugins'
+export default {
+  props: {
+    item: {
+      type: Object,
+      default: () => ({})
+    },
+    typeView: {
+      type: [String, Number],
+      default: 0
+    }
+  },
+  mixins: [editTable],
+  data() {
+    return {}
+  },
+  computed: {
+    formItems() {
+      return [
+        {
+          name: 'slot-component',
+          md: 24,
+          formItemAttributes: {
+            label: '',
+            'label-width': '0px',
+            prop: 'promotionQuestionnaireQrcodes',
+            rules: []
+          },
+          render: (h, { props, onInput }) => {
+            var { value } = props
+            return this.convertTableJson(
+              value,
+              [
+                {
+                  columnAttributes: {
+                    label: '网点名称',
+                    prop: 'websitName'
+                  },
+                  editRender: (h, { row, column, index }) => {
+                    return (
+                      <div class="redbordererr">
+                        <el-form-item
+                          label=""
+                          label-width="0px"
+                          prop={`promotionQuestionnaireQrcodes.${index}.${column.columnAttributes.prop}`}
+                          rules={[{ required: true, message: '请填写', trigger: 'blur' }]}
+                        >
+                          <el-input
+                            value={row[column.columnAttributes.prop]}
+                            onInput={val => {
+                              row[column.columnAttributes.prop] = val
+                            }}
+                            placeholder="请输入内容"
+                          ></el-input>
+                        </el-form-item>
+                      </div>
+                    )
+                  },
+                  viewRender: (h, { row, column, index }) => {
+                    return <div style="padding-left:10px">{row[column.columnAttributes.prop]}</div>
+                  }
+                },
+                {
+                  columnAttributes: {
+                    label: '活动二维码',
+                    prop: 'qrcode',
+                    width: 160
+                  },
+                  render: (h, { row, column, index }) => {
+                    return (
+                      <div class="redbordererr">
+                        {row[column.columnAttributes.prop] ? (
+                          <el-image
+                            src={row[column.columnAttributes.prop]}
+                            preview-src-list={[row[column.columnAttributes.prop]]}
+                            fit="fit"
+                            style="width:80px;height:80px;"
+                          />
+                        ) : null}
+                      </div>
+                    )
+                  }
+                }
+              ],
+              {
+                isEdit: this.qx(this.item),
+                isAdd: this.qx(this.item),
+                isUpdate: false,
+                isDel: ({ row, column, index }) => {
+                  return !row.id
+                }
+              },
+              {
+                add: () => {
+                  this.item.promotionQuestionnaireQrcodes.push({
+                    websitName: '',
+                    qrcode: ''
+                  })
+                  this.isEditTableIndex = this.item.promotionQuestionnaireQrcodes.length - 1
+                },
+                delete: ({ row, column, index }, cb) => {
+                  if (this.isEditTableIndex == index) {
+                    this.isEditTableIndex = -1
+                  } else if (this.isEditTableIndex > index) {
+                    this.isEditTableIndex--
+                  }
+                  cb && cb()
+                },
+                verify: ({ row, column, index }, isEditTableIndex) => {
+                  return new Promise(r => {
+                    if (isEditTableIndex > -1) {
+                      this.acquireVerify(this, 'dqangqianyemian')(
+                        [`promotionQuestionnaireQrcodes.${isEditTableIndex}.websitName`],
+                        v => {
+                          if (v) {
+                            r(true)
+                          } else {
+                            r(false)
+                          }
+                        }
+                      )
+                      r(true)
+                    } else {
+                      r(true)
+                    }
+                  })
+                },
+                btnSlot: ({ row, column, index }) => {
+                  if (row.id && row.qrcode) {
+                    return (
+                      <el-button
+                        type="text"
+                        onClick={() => {
+                          window.open(row.qrcode)
+                        }}
+                      >
+                        下载二维码
+                      </el-button>
+                    )
+                  }
+                  return null
+                }
+              }
+            )
+          }
+        }
+      ]
+    }
+  },
+  methods: {
+    qx(item) {
+      return (
+        !!this.typeView &&
+        (!item.id || !!~[0, 1].indexOf(item.status) || !!~['待生效', '生效中'].indexOf(item.statusText))
+      )
+    },
+    acquireVerify(v, name) {
+      if (v.$parent[name]) {
+        return v.$parent[name]
+      } else {
+        return this.acquireVerify(v.$parent, name)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss"></style>

src/views/mallManagement/setActivity/index.vue

@@ -22,6 +22,7 @@
         <zj-form-container v-if="formDialog" ref="formRef" :form-data="formData" :styleSwitch="false">
           <zj-form-module title="活动信息" label-width="120px" :form-data="formData" :form-items="formItems">
           </zj-form-module>
+          <formModule :item="formData" :typeView="typeView"></formModule>
           <zj-form-module title="活动填写内容" label-width="100px" :form-data="formData" :form-items="formItems2">
           </zj-form-module>
         </zj-form-container>
@@ -53,8 +54,9 @@ import ImageUpload from '@/components/file-upload'
 import quillEditor from '@/components/v-quill-editor'
 import editTable from '@/components/template/editTable.js'
 import { required, mobileRequired, mobile, httpUrl, email } from '@/components/template/rules_verify.js'
+import formModule from './formModule.vue'
 export default {
-  components: { TemplatePage, answer, ImageUpload, quillEditor },
+  components: { TemplatePage, answer, ImageUpload, quillEditor, formModule },
   mixins: [import_mixin, operation_mixin, editTable],
   data() {
     return {
@@ -77,7 +79,8 @@ export default {
         banner: [],
         detailImgs: [],
         promotionQuestionnaireItems: [],
-        promotionQuestionnaireUsers: []
+        promotionQuestionnaireUsers: [],
+        promotionQuestionnaireQrcodes: []
       },
       // 表格属性
       tableAttributes: {
@@ -220,7 +223,6 @@ export default {
           },
           render: (h, { props, onInput }) => {
             var { value } = props
-            console.log(value)
             return (
               <div class="redbordererr" style="">
                 <el-form-item
@@ -875,6 +877,9 @@ export default {
         this.typeView &&
         (!item.id || !!~[0, 1].indexOf(item.status) || !!~['待生效', '生效中'].indexOf(item.statusText))
       )
+    },
+    dqangqianyemian(...p) {
+      return this.$refs.formRef.validateField(...p)
     }
   }
 }