feat: 对图片上传及redis缓存做优化

app/controller/editor.ts

@@ -18,6 +18,7 @@ export default class EditorController extends Controller {
       const result = await ctx.model.PageInfo.create({ ...pageInfo, uuid: uuidv1().replace(/-/g, ''), tenantId: ctx.headers['qg-tenant-id']});
       ctx.body = ctx.helper.ok(result);
       await ctx.service.redis.set(`pageInfo:${result.dataValues.uuid}`, result.dataValues);
+      await ctx.service.redis.del(`page:${result.dataValues.uuid}`);
     } catch (error) {
       if (error.message.indexOf('Data too long') > -1 && error.message.indexOf('page_data') > -1) {
         error.message = '配置组件过多，请对组件进行删减';
@@ -36,7 +37,7 @@ export default class EditorController extends Controller {
     }
     try {
       const result = await ctx.model.PageInfo.update(pageInfo, {where: { uuid: pageInfo.uuid, tenantId: ctx.headers['qg-tenant-id'] }});
-      await ctx.service.redis.set(`pageInfo:${pageInfo.uuid}`, pageInfo);
+      await ctx.service.redis.del(`pageInfo:${pageInfo.uuid}`, pageInfo);
       await ctx.service.redis.del(`page:${pageInfo.uuid}`);
       ctx.body = ctx.helper.ok(result);
     } catch (error) {

app/web/page/editor/component/DynamicForm/component/Upload/index.vue

@@ -103,6 +103,25 @@
                }
               },
               BeforeUpload: (up, file) => {
+                const {type, size} = file;
+                let limit = 0;
+                // 来自量子积木v1.5需求中的优化点
+                if (type === 'image/gif') {
+                  // gif限制5M
+                  limit = 5 * 1024 * 1024;
+                   if (size > limit) {
+                    this.$toast('gif图大小不允许超过5Mb');
+                    return false;
+                  }
+                } else {
+                  // 其他格式限制800KB
+                  limit = 800 * 1024;
+                  if (size > limit) {
+                    this.$toast('文件大小不允许超过800Kb');
+                    return false;
+                  }
+                }
+                // if ()
                 // var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
                 this.percent = 0;
               },

app/web/page/editor/view/navigator/components/addOrEditNavigator.vue

@@ -9,14 +9,14 @@
         <div class="navigator-info">
           <div class="navigator-info-name">导航背景色</div>
           <div class="navigator-info-input color">
-            <Input class="color-input" v-model="bgColor"/>
+            <Input class="color-input" v-model="bgColor" />
             <ColorPicker v-model="bgColor" />
           </div>
         </div>
          <div class="navigator-info">
           <div class="navigator-info-name">导航背景图</div>
           <div class="navigator-info-input">
-            <uploader v-model="bgImg" class="uploader" />
+            <uploader v-model="bgImg" class="uploader" :showInput="false"/>
           </div>
         </div>
         <div class="navigator-list">
@@ -52,26 +52,26 @@
                 <div class="item">
                   <div class="label"><i>*</i>选中图标</div>
                   <div class="setting">
-                    <uploader v-model="item.selectIcon" class="uploader" />
+                    <uploader v-model="item.selectIcon" class="uploader" :showInput="false" />
                   </div>
                 </div>
                 <div class="item">
                   <div class="label"><i>*</i>未选中图标</div>
                   <div class="setting">
-                    <uploader v-model="item.icon" class="uploader" />
+                    <uploader v-model="item.icon" class="uploader" :showInput="false" />
                   </div>
                 </div>
                 <div class="item" v-if="item.type == 1">
                   <div class="label"><i>*</i>选中文案颜色</div>
                   <div class="setting">
-                    <Input class="color-input" v-model="item.selectColor"/>
+                    <Input class="color-input" v-model="item.selectColor" @on-blur="changeColor" />
                     <ColorPicker v-model="item.selectColor" />
                   </div>
                 </div>
                 <div class="item" v-if="item.type == 1">
                   <div class="label"><i>*</i>未选中文案颜色</div>
                   <div class="setting">
-                    <Input class="color-input" v-model="item.color"/>
+                    <Input class="color-input" v-model="item.color" @on-blur="changeColor" />
                     <ColorPicker v-model="item.color" />
                   </div>
                 </div>
@@ -245,15 +245,20 @@ export default {
       this.navigatorData.splice(index, 1);
     },
     validate() {
+      const reg = /^(?:#[A-Fa-f0-9]{3}|#[A-Fa-f0-9]{6})$/;
       // 校验值
       if (!this.name) {
         this.$toast('请填写名称');
         return false;
       }
-      if (!this.navigatorData) {
+      if (!this.navigatorData.length) {
         this.$toast('请配置导航');
         return false;
       }
+      if (this.bgColor && !reg.test(this.bgColor)) {
+        this.$toast('导航背景色格式错误，请重新填写');
+        return false;
+      }
       const arr = JSON.parse(JSON.stringify(this.navigatorData));
       let navigatorNameExist = true; // 导航名称是否创建
       let typeExist = true; // 导航类型是否选择(目前默认选择了图文形式)
@@ -272,6 +277,10 @@ export default {
           this.$toast('图文形式配置缺失，请填写后重试');
           return false;  
         }
+        if(arr[i].type == 1 && (!reg.test(arr[i].color) || !reg.test(arr[i].selectColor))) {
+          this.$toast('导航文字颜色格式错误，请重新填写');
+          return false;
+        }
         if (
           arr[i].type == 2
           &&
@@ -300,17 +309,20 @@ export default {
       // 首先要进行校验
       if (!this.validate()) return;
       const params = {
-        name: this.name,
+        name: this.name.trim(),
         navigatorData: this.navigatorData,
-        author: this.author,
+        author: this.author.trim(),
         id: this.id,
-        bgColor: this.bgColor,
-        bgImg: this.bgImg
+        bgColor: this.bgColor.trim(),
+        bgImg: this.bgImg.trim()
       };
       await navigatorApi.saveNavigator(params);
       this.$toast('保存成功');
       this.$emit('close', 1);
       this.resetData();
+    },
+    changeColor(evnet, data) {
+      data = /^(?:#[A-Fa-f0-9]{3}|#[A-Fa-f0-9]{6})$/.test(evnet.target.value) ? evnet.target.value : ""
     }
   },
 }