ts-glitter 13.8.813 → 13.8.814

package/lowcode/Entry.js

@@ -70,7 +70,7 @@ export class Entry {
         }
         window.renderClock = (_a = window.renderClock) !== null && _a !== void 0 ? _a : clockF();
         console.log(`Entry-time:`, window.renderClock.stop());
-        glitter.share.editerVersion = 'V_13.8.813';
+        glitter.share.editerVersion = 'V_13.8.814';
         glitter.share.start = new Date();
         const vm = {
             appConfig: [],

package/lowcode/Entry.ts

@@ -71,7 +71,7 @@ export class Entry {
         }
         (window as any).renderClock = (window as any).renderClock ?? clockF();
         console.log(`Entry-time:`, (window as any).renderClock.stop());
-        glitter.share.editerVersion = 'V_13.8.813';
+        glitter.share.editerVersion = 'V_13.8.814';
         glitter.share.start = new Date();
         const vm: {
             appConfig: any;

package/lowcode/backend-manager/bg-widget.js

@@ -2601,7 +2601,7 @@ ${(_c = obj.default) !== null && _c !== void 0 ? _c : ''}</textarea
                 id: obj.gvc.glitter.getUUID(),
                 loading: false,
             };
-            return html ` <div class="bg-white shadow rounded-3" style="overflow-y: auto; width: calc(100% - ${document.body.clientWidth > 768 ? 70 : 0}px); height: calc(100% - 70px);">
+            return html ` <div class="bg-white shadow ${document.body.clientWidth < 800 ? `` : `rounded-3`}" style="overflow-y: auto; width: calc(100% - ${document.body.clientWidth > 768 ? 70 : 0}px); ${document.body.clientWidth > 768 ? `height: calc(100% - 70px);` : `height:${window.parent.innerHeight}px;`};padding-top:${gvc.glitter.share.top_inset || 0}px;">
                 ${gvc.bindView({
                 bind: vm.id,
                 view: () => {

package/lowcode/backend-manager/bg-widget.ts

@@ -3067,7 +3067,7 @@ ${obj.default ?? ''}</textarea
                 loading: false,
             };
 
-            return html` <div class="bg-white shadow rounded-3" style="overflow-y: auto; width: calc(100% - ${document.body.clientWidth > 768 ? 70 : 0}px); height: calc(100% - 70px);">
+            return html` <div class="bg-white shadow ${document.body.clientWidth<800 ? ``:`rounded-3`}" style="overflow-y: auto; width: calc(100% - ${document.body.clientWidth > 768 ? 70 : 0}px); ${document.body.clientWidth > 768 ? `height: calc(100% - 70px);`:`height:${(window.parent as any).innerHeight}px;`};padding-top:${gvc.glitter.share.top_inset || 0}px;">
                 ${gvc.bindView({
                     bind: vm.id,
                     view: () => {

package/lowcode/cms-plugin/shopping-product-setting.js

@@ -1645,6 +1645,7 @@ export class ShoppingProductSetting {
             const dialog = new ShareDialog(gvc.glitter);
             if (!variant.barcode) {
                 dialog.errorMessage({ text: '請先設定商品條碼' });
+                return;
             }
             window.parent.glitter.addMtScript([
                 {

package/lowcode/cms-plugin/shopping-product-setting.ts

@@ -1925,6 +1925,7 @@ export class ShoppingProductSetting {
                                                 const dialog = new ShareDialog(gvc.glitter);
                                                 if (!variant.barcode) {
                                                     dialog.errorMessage({ text: '請先設定商品條碼' });
+                                                    return
                                                 }
                                                 (window.parent as any).glitter.addMtScript(
                                                     [

package/lowcode/glitter-base/route/user.js

@@ -594,6 +594,10 @@ export class ApiUser {
         });
     }
     static setPublicConfig(cf) {
+        var _a;
+        window.glitter.share._public_config = (_a = window.glitter.share._public_config) !== null && _a !== void 0 ? _a : {};
+        const config = window.glitter.share._public_config;
+        config[cf.key + cf.user_id] = undefined;
         return BaseApi.create({
             url: getBaseUrl() + `/api-public/v1/user/public/config`,
             type: 'PUT',
@@ -635,6 +639,9 @@ export class ApiUser {
                         config[key + user_id] = res;
                         break;
                 }
+                if (key.indexOf('alt_') === 0) {
+                    config[key + user_id] = res;
+                }
                 resolve(res);
             });
         });

package/lowcode/glitter-base/route/user.ts

@@ -645,6 +645,9 @@ export class ApiUser {
     }
 
     public static setPublicConfig(cf: { key: string; value: any; user_id?: string; token?: string }) {
+        (window as any).glitter.share._public_config = (window as any).glitter.share._public_config ?? {};
+        const config = (window as any).glitter.share._public_config;
+        config[cf.key + cf.user_id]=undefined;
         return BaseApi.create({
             url: getBaseUrl() + `/api-public/v1/user/public/config`,
             type: 'PUT',
@@ -686,6 +689,9 @@ export class ApiUser {
                         config[key + user_id] = res;
                         break;
                 }
+                if(key.indexOf('alt_')===0){
+                    config[key + user_id] = res;
+                }
                 resolve(res);
             });
         });

package/lowcode/glitterBundle/Glitter.js

@@ -76,6 +76,15 @@ export class Glitter {
         this.ut = {
             glitter: this,
             queue: {},
+            resize_img_url: (link) => {
+                let rela_link = link;
+                [150, 600, 1200, 1440].reverse().map((dd) => {
+                    if (document.body.clientWidth < dd) {
+                        rela_link = link.replace('size1440_s*px$_', `size${dd}_s*px$_`);
+                    }
+                });
+                return rela_link;
+            },
             clock() {
                 return {
                     start: new Date(),
@@ -933,15 +942,15 @@ ${(!error.message) ? `` : `錯誤訊息:${error.message}`}${(!error.lineNumber)
         glitter.runJsInterFace("closeAPP", {}, function (response) {
         });
     }
-    generateCheckSum(str) {
+    generateCheckSum(str, count) {
         let hash = 0;
         for (let i = 0; i < str.length; i++) {
             hash = (hash << 5) - hash + str.charCodeAt(i);
             hash = hash & hash;
         }
         hash = Math.abs(hash);
-        let checksum = hash.toString().slice(0, 6);
-        while (checksum.length < 6) {
+        let checksum = hash.toString().slice(0, (count !== null && count !== void 0 ? count : 6));
+        while (checksum.length < (count !== null && count !== void 0 ? count : 6)) {
             checksum = '0' + checksum;
         }
         return checksum;

package/lowcode/glitterBundle/Glitter.ts

@@ -495,7 +495,7 @@ ${(!error.message) ? `` : `錯誤訊息:${error.message}`}${(!error.lineNumber)
         })
     }
 
-    public generateCheckSum(str: string) {
+    public generateCheckSum(str: string,count?:number) {
         let hash = 0;
 
         for (let i = 0; i < str.length; i++) {
@@ -507,10 +507,10 @@ ${(!error.message) ? `` : `錯誤訊息:${error.message}`}${(!error.lineNumber)
         hash = Math.abs(hash);
 
         // 將hash轉換為6碼字串
-        let checksum = hash.toString().slice(0, 6);
+        let checksum = hash.toString().slice(0, (count ?? 6));
 
         // 如果不足6碼，則補零
-        while (checksum.length < 6) {
+        while (checksum.length < (count ?? 6)) {
             checksum = '0' + checksum;
         }
 
@@ -674,6 +674,15 @@ ${(!error.message) ? `` : `錯誤訊息:${error.message}`}${(!error.lineNumber)
     public ut = {
         glitter: this,
         queue: {},
+        resize_img_url:(link:string)=>{
+            let rela_link=link;
+            [150, 600, 1200, 1440].reverse().map((dd) => {
+                if (document.body.clientWidth < dd) {
+                    rela_link = link.replace('size1440_s*px$_', `size${dd}_s*px$_`)
+                }
+            })
+            return rela_link
+        },
         clock() {
             return {
                 start: new Date(),

package/lowcode/glitterBundle/GlitterInitial.js

@@ -2,6 +2,7 @@
 import { Entry } from '../Entry.js';
 import { Glitter } from './Glitter.js';
 import { GVCType } from './module/PageManager.js';
+import { ApiUser } from "../glitter-base/route/user.js";
 const glitter = new Glitter(window);
 window.glitter = glitter;
 window.rootGlitter = glitter;
@@ -74,6 +75,27 @@ function traverseHTML(element, document) {
             traverseHTML(children[j], document);
         }
     }
+    if ((element.tagName || '').toLowerCase() === 'img') {
+        const src = element.getAttribute('src');
+        if (src) {
+            try {
+                const tag = glitter.generateCheckSum(src, 9);
+                setTimeout(() => {
+                    if (element) {
+                        ApiUser.getPublicConfig(`alt_` + tag, 'manager').then((res) => {
+                            if (res && res.response.value) {
+                                setTimeout(() => {
+                                    element.setAttribute('alt', res.response.value.alt);
+                                }, 10);
+                            }
+                        });
+                    }
+                }, 10);
+            }
+            catch (e) {
+            }
+        }
+    }
     if (element && element.getAttribute && element.getAttribute('glem') === 'bindView') {
         const id = element.getAttribute('gvc-id');
         glitter.elementCallback[id].element = element;

package/lowcode/glitterBundle/GlitterInitial.ts

@@ -3,6 +3,7 @@ import {Entry} from '../Entry.js';
 import {Glitter} from './Glitter.js';
 import {GVC} from './GVController.js';
 import {GVCType} from './module/PageManager.js';
+import {ApiUser} from "../glitter-base/route/user.js";
 
 const glitter = new Glitter(window); // glitter變數
 (window as any).glitter = glitter;
@@ -90,7 +91,28 @@ function traverseHTML(element: any, document: any) {
             traverseHTML(children[j], document);
         }
     }
+    if((element.tagName || '').toLowerCase() === 'img' ){
+        const src=element.getAttribute('src');
+        if(src){
+            try {
+                const tag=glitter.generateCheckSum(src,9)
+                setTimeout(()=>{
+                    if(element){
+                        ApiUser.getPublicConfig(`alt_`+tag,'manager').then((res)=>{
+                            if(res && res.response.value){
+                                setTimeout(()=>{
+                                    element.setAttribute('alt', res.response.value.alt);
+                                },10)
+                            }
+                        })
+                    }
+                },10)
+            }catch (e) {
 
+            }
+        }
+
+    }
     if (element && element.getAttribute && element.getAttribute('glem') === 'bindView') {
         const id = element.getAttribute('gvc-id') as string;
         glitter.elementCallback[id].element = element;

package/lowcode/glitterBundle/html-component/widget.js

@@ -131,15 +131,7 @@ export const widgetComponent = {
                                         });
                                     }
                                     if (widget.data.elem === 'img') {
-                                        let rela_link = innerText;
-                                        if (innerText.includes(`size1440_s*px$_`)) {
-                                            [150, 600, 1200, 1440].reverse().map((dd) => {
-                                                if (document.body.clientWidth < dd) {
-                                                    rela_link = innerText.replace('size1440_s*px$_', `size${dd}_s*px$_`);
-                                                }
-                                            });
-                                        }
-                                        option.push({ key: 'src', value: rela_link });
+                                        option.push({ key: 'src', value: gvc.glitter.ut.resize_img_url(innerText) });
                                     }
                                     else if (widget.data.elem === 'input') {
                                         option.push({ key: 'value', value: innerText });

package/lowcode/glitterBundle/html-component/widget.ts

@@ -130,18 +130,7 @@ export const widgetComponent = {
                                         })
                                     }
                                     if (widget.data.elem === 'img') {
-                                        //判斷是新版響應式連結
-                                        let rela_link = innerText
-                                        if (innerText.includes(`size1440_s*px$_`)) {
-                                            [150, 600, 1200, 1440].reverse().map((dd) => {
-                                                if (document.body.clientWidth < dd) {
-                                                    rela_link = innerText.replace('size1440_s*px$_', `size${dd}_s*px$_`)
-                                                }
-                                            })
-                                        }
-
-
-                                        option.push({key: 'src', value: rela_link})
+                                        option.push({key: 'src', value: gvc.glitter.ut.resize_img_url(innerText)})
                                     } else if (widget.data.elem === 'input') {
                                         option.push({key: 'value', value: innerText})
                                     }

package/lowcode/modules/image-library.js

@@ -140,6 +140,39 @@ export class imageLibrary {
                                                     const imageUrl = (passType.includes(vm.type))
                                                         ? dd.data
                                                         : ((_b = (_a = vm.link.find(data => { var _a; return (_a = data === null || data === void 0 ? void 0 : data.tag) === null || _a === void 0 ? void 0 : _a.includes(dd.title); })) === null || _a === void 0 ? void 0 : _a.data) !== null && _b !== void 0 ? _b : noImageURL);
+                                                    function itemClick() {
+                                                        if (vm.type == "folder") {
+                                                            vm.tag = dd.title;
+                                                            that.selectImageLibrary(gvc, (selectData) => {
+                                                                vm.link = selectData;
+                                                                gvc.notifyDataChange(vm.id);
+                                                            }, `<div class="d-flex flex-column" style="border-radius: 10px 10px 0px 0px;background: #F2F2F2;">${vm.tag}</div>`, {
+                                                                key: 'folderEdit',
+                                                                mul: true,
+                                                                tag: dd.title,
+                                                            });
+                                                        }
+                                                        else {
+                                                            cf.edit(dd, (replace) => {
+                                                                if (!replace) {
+                                                                    let selectData = vm.link.findIndex(data => {
+                                                                        return data.id == dd.id;
+                                                                    });
+                                                                    vm.link.splice(selectData, 1);
+                                                                    save(() => {
+                                                                        gvc.notifyDataChange(vm.id);
+                                                                    });
+                                                                }
+                                                                else {
+                                                                    let replaceIndex = vm.link.findIndex(data => data.id == replace.id);
+                                                                    vm.link[replaceIndex] = replace;
+                                                                    save(() => {
+                                                                        gvc.notifyDataChange(vm.id);
+                                                                    });
+                                                                }
+                                                            });
+                                                        }
+                                                    }
                                                     return html `
                                                         <div class=""
                                                              style="padding: 10px 12px;position: relative;${(dd.selected) ? `border-radius: 10px;border: 2px solid #393939;background: #F7F7F7;box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.10);` : editArray[index] ? `border-radius: 10px;border: 1px solid #DDD;background: #F7F7F7;` : ``}"
@@ -187,37 +220,7 @@ export class imageLibrary {
                                                                  style="height:24px;width:24px;border-radius: 3px;background: rgba(0, 0, 0, 0.80);position: absolute;right: 8.15px;top: 8px;"
                                                                  onclick="${gvc.event((e, event) => {
                                                         event.stopPropagation();
-                                                        if (vm.type == "folder") {
-                                                            vm.tag = dd.title;
-                                                            that.selectImageLibrary(gvc, (selectData) => {
-                                                                vm.link = selectData;
-                                                                gvc.notifyDataChange(vm.id);
-                                                            }, `<div class="d-flex flex-column" style="border-radius: 10px 10px 0px 0px;background: #F2F2F2;">${vm.tag}</div>`, {
-                                                                key: 'folderEdit',
-                                                                mul: true,
-                                                                tag: dd.title,
-                                                            });
-                                                        }
-                                                        else {
-                                                            cf.edit(dd, (replace) => {
-                                                                if (!replace) {
-                                                                    let selectData = vm.link.findIndex(data => {
-                                                                        return data.id == dd.id;
-                                                                    });
-                                                                    vm.link.splice(selectData, 1);
-                                                                    save(() => {
-                                                                        gvc.notifyDataChange(vm.id);
-                                                                    });
-                                                                }
-                                                                else {
-                                                                    let replaceIndex = vm.link.findIndex(data => data.id == replace.id);
-                                                                    vm.link[replaceIndex] = replace;
-                                                                    save(() => {
-                                                                        gvc.notifyDataChange(vm.id);
-                                                                    });
-                                                                }
-                                                            });
-                                                        }
+                                                        itemClick();
                                                     })}">
                                                                 <svg xmlns="http://www.w3.org/2000/svg"
                                                                      width="12"
@@ -238,6 +241,11 @@ export class imageLibrary {
                                                                     </defs>
                                                                 </svg>
                                                             </div>
+                                                            <div class="position-absolute ${(dd.selected) ? `d-blok` : `d-none`} " style="transform: translate(-50%,-50%);left: 50%;top:50%;">
+                                                                ${BgWidget.darkButton('編輯圖片', gvc.event(() => {
+                                                        itemClick();
+                                                    }))}
+                                                            </div>
                                                             <div class="${(dd.selected) ? `d-flex` : `d-none`}  "
                                                                  style="height:24px;width:24px;border-radius: 3px;position: absolute;right: 8.15px;top: 8px;"
                                                             >
@@ -265,7 +273,7 @@ export class imageLibrary {
                                             divCreate: {
                                                 style: `${gvc.glitter.ut.frSize({
                                                     sm: `width:15%;`
-                                                }, `width:33%;`)}cursor:pointer;`
+                                                }, `width:49%;`)}cursor:pointer;`
                                             }
                                         });
                                     }).join('');
@@ -280,7 +288,7 @@ export class imageLibrary {
                                 class: `w-100 my-2 flex-wrap `,
                                 style: `display:flex;gap:${gvc.glitter.ut.frSize({
                                     sm: `17`
-                                }, `0`)}px;`,
+                                }, `0`)}px;${(document.body.clientWidth < 800) ? `justify-content: space-between;` : ``}`,
                             },
                             onCreate: () => {
                                 gvc.glitter.addMtScript([
@@ -879,105 +887,138 @@ export class imageLibrary {
     }
     static selectImageLibrary(gvc, callback, title, opt) {
         var _a, _b, _c;
-        function editorView(gvc, item) {
-            var _a, _b;
-            if (item.type === 'folder') {
-                return BgWidget.editeInput({
-                    gvc: gvc,
-                    title: `資料夾標題`,
-                    default: item.title,
-                    placeHolder: `請輸入資料夾標題`,
-                    callback: (text) => {
-                        item.title = text;
-                    }
-                });
-            }
-            else {
-                item.data = (_a = item.data) !== null && _a !== void 0 ? _a : {};
-                return [BgWidget.editeInput({
+        return __awaiter(this, void 0, void 0, function* () {
+            let alt = '';
+            let saveAlt = function () {
+            };
+            function editorView(gvc, item) {
+                var _a, _b;
+                if (item.type === 'folder') {
+                    return BgWidget.editeInput({
                         gvc: gvc,
-                        title: `圖片標題`,
+                        title: `資料夾標題`,
                         default: item.title,
-                        placeHolder: `請輸入圖片標題`,
+                        placeHolder: `請輸入資料夾標題`,
                         callback: (text) => {
                             item.title = text;
                         }
-                    }), EditorElem.uploadImageContainer({
+                    });
+                }
+                else {
+                    item.data = (_a = item.data) !== null && _a !== void 0 ? _a : {};
+                    return `<div>${[BgWidget.editeInput({
+                            gvc: gvc,
+                            title: `圖片標題`,
+                            default: item.title,
+                            placeHolder: `請輸入圖片標題`,
+                            callback: (text) => {
+                                item.title = text;
+                            }
+                        }),
+                        EditorElem.uploadImageContainer({
+                            gvc: gvc,
+                            title: `圖片資源`,
+                            def: (_b = item.data) !== null && _b !== void 0 ? _b : '',
+                            callback: (text) => {
+                                item.data = text;
+                            },
+                        }),
+                        gvc.bindView(() => {
+                            const id = gvc.glitter.getUUID();
+                            return {
+                                bind: id,
+                                view: () => __awaiter(this, void 0, void 0, function* () {
+                                    const tag = gvc.glitter.generateCheckSum(item.data, 9);
+                                    alt = (yield ApiUser.getPublicConfig(`alt_` + tag, 'manager')).response.value || { alt: '' };
+                                    saveAlt = () => __awaiter(this, void 0, void 0, function* () {
+                                        ApiUser.setPublicConfig({
+                                            key: `alt_` + tag,
+                                            value: alt,
+                                            user_id: 'manager'
+                                        });
+                                    });
+                                    return BgWidget.textArea({
+                                        gvc: gvc,
+                                        title: `ALT描述`,
+                                        default: alt.alt,
+                                        placeHolder: `請輸入ALT描述`,
+                                        callback: (text) => {
+                                            alt.alt = text;
+                                        }
+                                    });
+                                })
+                            };
+                        })].join('<div class="my-2"></div>')}</div>`;
+                }
+            }
+            imageLibrary.fileSystem({
+                getSelect: callback,
+                gvc: gvc,
+                key: opt ? ((_a = opt.key) !== null && _a !== void 0 ? _a : 'image-manager') : 'image-manager',
+                title: title,
+                tag: (_b = opt === null || opt === void 0 ? void 0 : opt.tag) !== null && _b !== void 0 ? _b : "",
+                mul: opt ? ((_c = opt.mul) !== null && _c !== void 0 ? _c : false) : false,
+                plus: (gvc, callback) => {
+                    const item = {
+                        title: '',
+                        data: {},
+                        items: [],
+                        type: 'file',
+                        tag: [],
+                        id: gvc.glitter.getUUID()
+                    };
+                    let count = 1;
+                    EditorElem.uploadFileFunction({
                         gvc: gvc,
-                        title: `圖片內容`,
-                        def: (_b = item.data) !== null && _b !== void 0 ? _b : '',
                         callback: (text) => {
-                            item.data = text;
+                            callback(text.map((item) => {
+                                return {
+                                    title: item.split('_')[3],
+                                    data: item,
+                                    items: [],
+                                    type: 'file',
+                                    tag: [],
+                                    id: gvc.glitter.getUUID()
+                                };
+                            }));
                         },
-                    })].join('');
-            }
-        }
-        imageLibrary.fileSystem({
-            getSelect: callback,
-            gvc: gvc,
-            key: opt ? ((_a = opt.key) !== null && _a !== void 0 ? _a : 'image-manager') : 'image-manager',
-            title: title,
-            tag: (_b = opt === null || opt === void 0 ? void 0 : opt.tag) !== null && _b !== void 0 ? _b : "",
-            mul: opt ? ((_c = opt.mul) !== null && _c !== void 0 ? _c : false) : false,
-            plus: (gvc, callback) => {
-                const item = {
-                    title: '',
-                    data: {},
-                    items: [],
-                    type: 'file',
-                    tag: [],
-                    id: gvc.glitter.getUUID()
-                };
-                let count = 1;
-                EditorElem.uploadFileFunction({
-                    gvc: gvc,
-                    callback: (text) => {
-                        callback(text.map((item) => {
-                            return {
-                                title: item.split('_')[3],
-                                data: item,
-                                items: [],
-                                type: 'file',
-                                tag: [],
-                                id: gvc.glitter.getUUID()
-                            };
-                        }));
-                    },
-                    return_array: true,
-                    multiple: true
-                });
-            },
-            edit: (item, callback) => {
-                item = JSON.parse(JSON.stringify(item));
-                BgWidget.settingDialog({
-                    gvc: gvc,
-                    title: '更新圖片',
-                    innerHTML: (gvc) => {
-                        return editorView(gvc, item);
-                    },
-                    footer_html: (gvc) => {
-                        return [BgWidget.danger(gvc.event(() => {
-                                const dialog = new ShareDialog(gvc.glitter);
-                                dialog.checkYesOrNot({
-                                    text: `刪除後使用此資源的內容將被取消關聯，是否確認刪除?`,
-                                    callback: (response) => {
-                                        if (response) {
-                                            callback(undefined);
-                                            gvc.closeDialog();
+                        return_array: true,
+                        multiple: true
+                    });
+                },
+                edit: (item, callback) => {
+                    item = JSON.parse(JSON.stringify(item));
+                    BgWidget.settingDialog({
+                        gvc: gvc,
+                        title: '更新圖片',
+                        innerHTML: (gvc) => {
+                            return editorView(gvc, item);
+                        },
+                        footer_html: (gvc) => {
+                            return [BgWidget.danger(gvc.event(() => {
+                                    const dialog = new ShareDialog(gvc.glitter);
+                                    dialog.checkYesOrNot({
+                                        text: `刪除後使用此資源的內容將被取消關聯，是否確認刪除?`,
+                                        callback: (response) => {
+                                            if (response) {
+                                                callback(undefined);
+                                                gvc.closeDialog();
+                                            }
                                         }
-                                    }
-                                });
-                            })), BgWidget.cancel(gvc.event(() => {
-                                gvc.closeDialog();
-                            })), BgWidget.save(gvc.event(() => {
-                                callback(item);
-                                gvc.closeDialog();
-                            }), '確定')].join('');
-                    },
-                    closeCallback: () => {
-                    }
-                });
-            }
+                                    });
+                                })), BgWidget.cancel(gvc.event(() => {
+                                    gvc.closeDialog();
+                                })), BgWidget.save(gvc.event(() => {
+                                    callback(item);
+                                    saveAlt();
+                                    gvc.closeDialog();
+                                }), '確定')].join('');
+                        },
+                        closeCallback: () => {
+                        }
+                    });
+                }
+            });
         });
     }
 }

package/lowcode/modules/image-library.ts

@@ -184,6 +184,44 @@ export class imageLibrary {
                                                            : (vm.link.find(data => data?.tag?.includes(dd.title))?.data ?? noImageURL);
 
 
+                                                       function itemClick(){
+                                                           if (vm.type == "folder") {
+                                                               //編輯資料夾內容
+                                                               vm.tag = dd.title;
+                                                               that.selectImageLibrary(gvc, (selectData) => {
+                                                                   vm.link = selectData;
+                                                                   gvc.notifyDataChange(vm.id);
+
+                                                               }, `<div class="d-flex flex-column" style="border-radius: 10px 10px 0px 0px;background: #F2F2F2;">${vm.tag}</div>`, {
+                                                                   key: 'folderEdit',
+                                                                   mul: true,
+                                                                   tag: dd.title,
+                                                               })
+
+                                                           } else {
+                                                               cf.edit(dd, (replace) => {
+                                                                   if (!replace) {
+                                                                       let selectData = vm.link.findIndex(data => {
+                                                                           return data.id == dd.id
+                                                                       })
+                                                                       vm.link.splice(selectData, 1)
+                                                                       save(() => {
+                                                                           gvc.notifyDataChange(vm.id);
+                                                                       })
+                                                                   } else {
+                                                                       let replaceIndex = vm.link.findIndex(data => data.id == replace.id)
+                                                                       vm.link[replaceIndex] = replace;
+                                                                       // console.log("vm.link -- " , vm.link);
+                                                                       save(() => {
+                                                                           gvc.notifyDataChange(vm.id);
+                                                                       })
+
+                                                                   }
+
+                                                               })
+                                                           }
+
+                                                       }
                                                        return html`
                                                         <div class=""
                                                              style="padding: 10px 12px;position: relative;${((dd as any).selected) ? `border-radius: 10px;border: 2px solid #393939;background: #F7F7F7;box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.10);` : editArray[index] ? `border-radius: 10px;border: 1px solid #DDD;background: #F7F7F7;` : ``}"
@@ -232,42 +270,7 @@ export class imageLibrary {
                                                                  style="height:24px;width:24px;border-radius: 3px;background: rgba(0, 0, 0, 0.80);position: absolute;right: 8.15px;top: 8px;"
                                                                  onclick="${gvc.event((e, event) => {
                                                            event.stopPropagation();
-                                                           if (vm.type == "folder") {
-                                                               //編輯資料夾內容
-                                                               vm.tag = dd.title;
-                                                               that.selectImageLibrary(gvc, (selectData) => {
-                                                                   vm.link = selectData;
-                                                                   gvc.notifyDataChange(vm.id);
-
-                                                               }, `<div class="d-flex flex-column" style="border-radius: 10px 10px 0px 0px;background: #F2F2F2;">${vm.tag}</div>`, {
-                                                                   key: 'folderEdit',
-                                                                   mul: true,
-                                                                   tag: dd.title,
-                                                               })
-
-                                                           } else {
-                                                               cf.edit(dd, (replace) => {
-                                                                   if (!replace) {
-                                                                       let selectData = vm.link.findIndex(data => {
-                                                                           return data.id == dd.id
-                                                                       })
-                                                                       vm.link.splice(selectData, 1)
-                                                                       save(() => {
-                                                                           gvc.notifyDataChange(vm.id);
-                                                                       })
-                                                                   } else {
-                                                                       let replaceIndex = vm.link.findIndex(data => data.id == replace.id)
-                                                                       vm.link[replaceIndex] = replace;
-                                                                       // console.log("vm.link -- " , vm.link);
-                                                                       save(() => {
-                                                                           gvc.notifyDataChange(vm.id);
-                                                                       })
-
-                                                                   }
-
-                                                               })
-                                                           }
-
+                                                                     itemClick()
                                                        })}">
                                                                 <svg xmlns="http://www.w3.org/2000/svg"
                                                                      width="12"
@@ -288,6 +291,11 @@ export class imageLibrary {
                                                                     </defs>
                                                                 </svg>
                                                             </div>
+                                                            <div class="position-absolute ${((dd as any).selected) ? `d-blok` : `d-none`} " style="transform: translate(-50%,-50%);left: 50%;top:50%;">
+                                                                ${BgWidget.darkButton('編輯圖片',gvc.event(()=>{
+                                                                    itemClick()
+                                                                }))}
+                                                            </div>
                                                             <div class="${((dd as any).selected) ? `d-flex` : `d-none`}  "
                                                                  style="height:24px;width:24px;border-radius: 3px;position: absolute;right: 8.15px;top: 8px;"
                                                             >
@@ -314,7 +322,7 @@ export class imageLibrary {
                                                divCreate: {
                                                    style: `${gvc.glitter.ut.frSize({
                                                        sm: `width:15%;`
-                                                   }, `width:33%;`)}cursor:pointer;`
+                                                   }, `width:49%;`)}cursor:pointer;`
                                                }
                                            })
                                        }).join('')
@@ -328,7 +336,7 @@ export class imageLibrary {
                                     class: `w-100 my-2 flex-wrap `,
                                     style: `display:flex;gap:${gvc.glitter.ut.frSize({
                                         sm: `17`
-                                    }, `0`)}px;`,
+                                    }, `0`)}px;${(document.body.clientWidth<800) ? `justify-content: space-between;`:``}`,
                                 },
                                 onCreate: () => {
                                     gvc.glitter.addMtScript(
@@ -990,12 +998,22 @@ export class imageLibrary {
 
     }
 
-    public static selectImageLibrary(gvc: GVC, callback: (id: FileItem[]) => void, title: string, opt?: {
+    public static async selectImageLibrary(gvc: GVC, callback: (id: FileItem[]) => void, title: string, opt?: {
         key?: string;
         mul?: boolean;
         tag?: string;
     }) {
-        function editorView(gvc: GVC, item: FileItem) {
+
+        let alt:any=''
+        let saveAlt=function (){
+
+        }
+         function editorView(gvc: GVC, item: FileItem) {
+
+            // ApiUser.setPublicConfig({
+            //     key:'alt_'+
+            // })
+            // alert(JSON.stringify(item))
             if (item.type === 'folder') {
                 return BgWidget.editeInput({
                     gvc: gvc,
@@ -1008,7 +1026,7 @@ export class imageLibrary {
                 })
             } else {
                 item.data = item.data ?? {}
-                return [BgWidget.editeInput({
+                return `<div>${[BgWidget.editeInput({
                     gvc: gvc,
                     title: `圖片標題`,
                     default: item.title,
@@ -1016,14 +1034,41 @@ export class imageLibrary {
                     callback: (text) => {
                         item.title = text
                     }
-                }), EditorElem.uploadImageContainer({
+                }),
+                    EditorElem.uploadImageContainer({
                     gvc: gvc,
-                    title: `圖片內容`,
+                    title: `圖片資源`,
                     def: item.data ?? '',
                     callback: (text) => {
                         item.data = text;
                     },
-                })].join('')
+                }),
+                    gvc.bindView(()=>{
+                        const id=gvc.glitter.getUUID()
+                        return {
+                            bind:id,
+                            view:async ()=>{
+                                const tag=gvc.glitter.generateCheckSum(item.data,9)
+                                alt=(await ApiUser.getPublicConfig(`alt_`+tag,'manager')).response.value || {alt:''};
+                                saveAlt=async ()=>{
+                                    ApiUser.setPublicConfig({
+                                        key:`alt_`+tag,
+                                        value:alt,
+                                        user_id:'manager'
+                                    })
+                                }
+                                return BgWidget.textArea({
+                                    gvc: gvc,
+                                    title: `ALT描述`,
+                                    default: alt.alt,
+                                    placeHolder: `請輸入ALT描述`,
+                                    callback: (text) => {
+                                        alt.alt = text
+                                    }
+                                })
+                            }
+                        }
+                    })].join('<div class="my-2"></div>')}</div>`
             }
         }
 
@@ -1112,6 +1157,7 @@ export class imageLibrary {
                             gvc.closeDialog()
                         })), BgWidget.save(gvc.event(() => {
                             callback(item);
+                            saveAlt()
                             gvc.closeDialog();
 
                         }), '確定')].join('')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ts-glitter",
-  "version": "13.8.813",
+  "version": "13.8.814",
   "description": "",
   "main": "index.js",
   "scripts": {