Showing
2 changed files
with
27 additions
and
35 deletions
... | ... | @@ -7400,6 +7400,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
7400 | 7400 | SET_IMG_EL: 'variableImageTableSetImgEl', |
7401 | 7401 | PREVIEW_IMG_CONTAINER: 'img__container', |
7402 | 7402 | DEL_PREVIEW_IMG: 'img__delete', |
7403 | + PREVIEW_CONTAINER: 'previewContainer' | |
7403 | 7404 | } |
7404 | 7405 | |
7405 | 7406 | const enumConst = { |
... | ... | @@ -7456,24 +7457,11 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
7456 | 7457 | } |
7457 | 7458 | } |
7458 | 7459 | |
7459 | - function generatorEventListenner() { | |
7460 | - $(`#${enumActionEl.TABLE_BODY_EL}`).on('click', `.${enumActionEl.SET_IMG_EL}`, (event) => { | |
7461 | - if ($(event.target).hasClass(enumActionEl.DEL_PREVIEW_IMG)) return | |
7462 | - const rowFilter = $(event.target).parents('tr').attr('lay-filter') | |
7463 | - // createUploadImgLayer(rowFilter) | |
7464 | - generateUploadLayerComponent((imageState) => { | |
7465 | - | |
7466 | - $(`#${enumActionEl.TABLE_BODY_EL}`) | |
7467 | - .find(`tr[lay-filter="${rowFilter}"]`) | |
7468 | - .find('img').attr('src', imageState[enumConst.IMAGE_GALLERY_IMAGE_PATH]) | |
7469 | - | |
7470 | - form.val(rowFilter, { | |
7471 | - [enumConst.IMAGE_ORIGIN]: imageState[enumConst.IMAGE_ORIGIN], | |
7472 | - [enumConst.IMAGE_GALLERY_CATEGORY]: imageState[enumConst.IMAGE_GALLERY_CATEGORY], | |
7473 | - [enumConst.IMAGE_GALLERY_IMAGE_PATH]: imageState[enumConst.IMAGE_GALLERY_IMAGE_PATH], | |
7474 | - }) | |
7475 | - }) | |
7476 | - }) | |
7460 | + function createUploadImgContainer(info) { | |
7461 | + const enableEl = $(`#${enumActionEl.TABLE_BODY_EL} tr[lay-filter="${enumActionEl.ENABLE_FILTER}"] .${enumActionEl.PREVIEW_CONTAINER}`) | |
7462 | + const closeEl = $(`#${enumActionEl.TABLE_BODY_EL} tr[lay-filter="${enumActionEl.CLOSE_FILTER}"] .${enumActionEl.PREVIEW_CONTAINER}`) | |
7463 | + generateUploadImgContainer({ el: enableEl }) | |
7464 | + generateUploadImgContainer({ el: closeEl }) | |
7477 | 7465 | } |
7478 | 7466 | |
7479 | 7467 | function addRecord(filter, state, defaultValue) { |
... | ... | @@ -7488,17 +7476,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
7488 | 7476 | <input class="layui-input" autocomplete="off" style="display: none;" name="${enumConst.TYPE}" lay-verType="tips" lay-verify="required" /> |
7489 | 7477 | </div> |
7490 | 7478 | </td> |
7491 | - <td> | |
7492 | - <div class="${enumActionEl.SET_IMG_EL}"> | |
7493 | - <input name="${enumConst.IMAGE_GALLERY_CATEGORY}" type="text" style="display: none"> | |
7494 | - <input name="${enumConst.IMAGE_GALLERY_IMAGE_PATH}" type="text" style="display: none"> | |
7495 | - <input name="${enumConst.IMAGE_ORIGIN}" type="text" style="display: none"> | |
7496 | - <div class="${enumActionEl.PREVIEW_IMG_CONTAINER}"> | |
7497 | - <img src="" alt=""> | |
7498 | - <div class="${enumActionEl.DEL_PREVIEW_IMG}">x</div> | |
7499 | - <div class="add__button">+</div> | |
7500 | - </div> | |
7501 | - </div> | |
7479 | + <td class=${enumActionEl.PREVIEW_CONTAINER}> | |
7502 | 7480 | </td> |
7503 | 7481 | </tr>` |
7504 | 7482 | } |
... | ... | @@ -7537,6 +7515,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
7537 | 7515 | async function submit(callback) { |
7538 | 7516 | const enableValue = form.val(enumActionEl.ENABLE_FILTER) |
7539 | 7517 | const closeValue = form.val(enumActionEl.CLOSE_FILTER) |
7518 | + console.log({ enableValue, closeValue }) | |
7540 | 7519 | |
7541 | 7520 | const formVal = getDataSourceBindValue() |
7542 | 7521 | |
... | ... | @@ -7595,17 +7574,17 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
7595 | 7574 | 'lay-submit': '', |
7596 | 7575 | 'lay-filter': enumActionEl.LAYER_SUBMIT_FILTER, |
7597 | 7576 | }) |
7577 | + createUploadImgContainer() | |
7598 | 7578 | |
7599 | 7579 | const info = getLayerBindInfo('act', type) |
7600 | 7580 | const { condition = [], enabled } = info |
7601 | 7581 | Object.assign(recordData, { enabled }) |
7582 | + | |
7602 | 7583 | if (info && condition.length) { |
7603 | 7584 | echoData(info) |
7604 | 7585 | } else { |
7605 | 7586 | initialData() |
7606 | 7587 | } |
7607 | - | |
7608 | - generatorEventListenner() | |
7609 | 7588 | }, |
7610 | 7589 | yes(index) { |
7611 | 7590 | form.on(`submit(${enumActionEl.LAYER_SUBMIT_FILTER})`, data => { |
... | ... | @@ -8186,8 +8165,8 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
8186 | 8165 | DEL_PREVIEW_IMG: 'img__delete', |
8187 | 8166 | } |
8188 | 8167 | |
8189 | - const getFormFilter = `${enumActionEl.CONTAINER_FILTER}-${Date.now()}` | |
8190 | - | |
8168 | + const getFormFilter = `${enumActionEl.CONTAINER_FILTER}-${Date.now() - Math.random()}` | |
8169 | + | |
8191 | 8170 | function createTemplate() { |
8192 | 8171 | return ` |
8193 | 8172 | <div class="layui-form ${enumActionEl.SET_IMG_EL}" lay-filter="${getFormFilter}"> |
... | ... | @@ -8222,19 +8201,31 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
8222 | 8201 | function mount() { |
8223 | 8202 | if (!el) throw Error('mount element is required') |
8224 | 8203 | $(el).append(createTemplate()) |
8204 | + generateEventLinstenner() | |
8225 | 8205 | } |
8226 | 8206 | |
8227 | 8207 | // TODO 生成容器监听事件 |
8228 | 8208 | function generateEventLinstenner() { |
8229 | 8209 | $(el).on('click', `.${enumActionEl.SET_IMG_EL}`, (event) => { |
8230 | - if ($(event.target).hasClass(enumActionEl.DEL_PREVIEW_IMG)) return | |
8210 | + if ($(event.target).hasClass(enumActionEl.DEL_PREVIEW_IMG)) { | |
8211 | + $(el).find(`div[lay-filter="${getFormFilter}"] img`).attr('src', '') | |
8212 | + form.val(getFormFilter, { | |
8213 | + [enumConst.IMAGE_ORIGIN]: null, | |
8214 | + [enumConst.IMAGE_GALLERY_CATEGORY]: null, | |
8215 | + [enumConst.IMAGE_GALLERY_IMAGE_PATH]: null, | |
8216 | + }) | |
8217 | + return | |
8218 | + } | |
8231 | 8219 | generateUploadLayerComponent((imageState) => { |
8232 | - | |
8233 | 8220 | $(el).find('img').attr('src', imageState[enumConst.IMAGE_GALLERY_IMAGE_PATH]) |
8234 | 8221 | form.val(getFormFilter, imageState) |
8222 | + console.log(form.val(getFormFilter)) | |
8235 | 8223 | }) |
8236 | 8224 | }) |
8237 | 8225 | } |
8226 | + | |
8227 | + mount() | |
8228 | + return { getValue, setValue } | |
8238 | 8229 | } |
8239 | 8230 | |
8240 | 8231 | // 异步设置此处才能生效 -- 设置默认select和样式和初始化侧边栏生成组件和事件绑定 | ... | ... |