feat: support work template

back-end/h5-api/api/work/config/routes.json

@@ -71,6 +71,22 @@
       "config": {
         "policies": []
       }
+    },
+    {
+      "method": "POST",
+      "path": "/works/set-as-template/:id",
+      "handler": "Work.setAsTemplate",
+      "config": {
+        "policies": []
+      }
+    },
+    {
+      "method": "POST",
+      "path": "/works/use-template/:id",
+      "handler": "Work.useTemplate",
+      "config": {
+        "policies": []
+      }
     }
   ]
 }

back-end/h5-api/api/work/controllers/Work.js

@@ -49,4 +49,20 @@ module.exports = {
     // eslint-disable-next-line require-atomic-updates
     return ctx.body = { uuidMap2Name, formDetails };
   },
+  setAsTemplate: async (ctx) => {
+    let work = await strapi.services.work.findOne(ctx.params);
+    work = work.toJSON();
+
+    // eslint-disable-next-line no-unused-vars
+    const templateWork = await strapi.services.work.create();
+    return strapi.services.work.update({id: templateWork.id}, { pages: work.pages, is_template: true });
+  },
+  useTemplate: async (ctx) => {
+    let templateWork = await strapi.services.work.findOne(ctx.params);
+    templateWork = templateWork.toJSON();
+
+    // eslint-disable-next-line no-unused-vars
+    const work = await strapi.services.work.create();
+    return strapi.services.work.update({id: work.id}, { pages: templateWork.pages, is_template: false });
+  },
 };

back-end/h5-api/api/work/models/Work.js

@@ -7,19 +7,19 @@
 module.exports = {
   // Before saving a value.
   // Fired before an `insert` or `update` query.
-  beforeSave: async (model, attrs, options) => {
-    // https://github.com/strapi/strapi/issues/2882
-    // need to remove this after this pr will be merged(https://github.com/strapi/strapi/pull/3664)
-    Object.keys(model.constructor.attributes).forEach(k => {
-      if (model.constructor.attributes[k].type === 'json') {
-        const value = model.get(k);
+  // beforeSave: async (model, attrs, options) => {
+  //   // https://github.com/strapi/strapi/issues/2882
+  //   // need to remove this after this pr will be merged(https://github.com/strapi/strapi/pull/3664)
+  //   Object.keys(model.constructor.attributes).forEach(k => {
+  //     if (model.constructor.attributes[k].type === 'json') {
+  //       const value = model.get(k);
 
-        if (Array.isArray(value)) {
-          model.set(k, JSON.stringify(value));
-        }
-      }
-    });
-  },
+  //       if (Array.isArray(value)) {
+  //         model.set(k, JSON.stringify(value));
+  //       }
+  //     }
+  //   });
+  // },
 
   // After saving a value.
   // Fired after an `insert` or `update` query.
@@ -48,6 +48,7 @@ module.exports = {
       elements: []
     }];
     model.set('pages', JSON.stringify(defaultPages));
+    model.set('is_template', false);
   },
 
   // After creating a value.
@@ -56,7 +57,17 @@ module.exports = {
 
   // Before updating a value.
   // Fired before an `update` query.
-  // beforeUpdate: async (model, attrs, options) => {},
+  // beforeUpdate: async (model, attrs, options) => {
+  //   Object.keys(model.constructor.attributes).forEach(k => {
+  //     if (model.constructor.attributes[k].type === 'json') {
+  //       const value = model.get(k);
+
+  //       if (Array.isArray(value)) {
+  //         model.set(k, JSON.stringify(value));
+  //       }
+  //     }
+  //   });
+  // },
 
   // After updating a value.
   // Fired after an `update` query.

back-end/h5-api/api/work/models/Work.settings.json

@@ -35,10 +35,13 @@
     "update_time": {
       "type": "date"
     },
-    "pages": {
+    "formData": {
       "type": "json"
     },
-    "formData": {
+    "is_template": {
+      "type": "boolean"
+    },
+    "pages": {
       "type": "json"
     }
   }

front-end/h5/src/components/core/editor/index.js

@@ -100,7 +100,8 @@ export default {
       work: state => state.work
     }),
     ...mapState('loading', {
-      saveWork_loading: state => state.saveWork_loading
+      saveWork_loading: state => state.saveWork_loading,
+      setWorkAsTemplate_loading: state => state.setWorkAsTemplate_loading
     })
   },
   methods: {
@@ -109,8 +110,12 @@ export default {
       'pageManager',
       'saveWork',
       'createWork',
-      'fetchWork'
+      'fetchWork',
+      'setWorkAsTemplate'
     ]),
+    ...mapActions('loading', {
+      updateLoading: 'update'
+    }),
     /**
      * !#zh 点击插件，copy 其基础数据到组件树（中间画布）
      * #!en click the plugin shortcut, create new Element with the plugin's meta data
@@ -165,7 +170,29 @@ export default {
           >
             <a-menu-item key="1" class="transparent-bg"><a-button type="primary" size="small" onClick={() => { this.previewVisible = true }}>预览</a-button></a-menu-item>
             <a-menu-item key="2" class="transparent-bg"><a-button size="small" onClick={() => this.saveWork()} loading={this.saveWork_loading}>保存</a-button></a-menu-item>
-            <a-menu-item key="3" class="transparent-bg"><a-button size="small">发布</a-button></a-menu-item>
+            {/* <a-menu-item key="3" class="transparent-bg"><a-button size="small">发布</a-button></a-menu-item> */}
+            <a-menu-item key="3" class="transparent-bg">
+              <a-dropdown-button onClick={() => {}} size="small">
+                发布
+                <a-menu slot="overlay" onClick={({ key }) => {
+                  switch (key) {
+                    case 'setAsTemplate':
+                      this.updateLoading({ type: 'setWorkAsTemplate_loading', value: true })
+                      this.saveWork().then(() => {
+                        this.setWorkAsTemplate()
+                      })
+                  }
+                }}>
+                  <a-menu-item key="setAsTemplate">
+                    <a-spin spinning={this.setWorkAsTemplate_loading} size="small">
+                      <a-icon type="cloud-upload" />设置为模板
+                    </a-spin>
+                  </a-menu-item>
+                  {/* <a-menu-item key="2"><a-icon type="user" />2nd menu item</a-menu-item> */}
+                  {/* <a-menu-item key="3"><a-icon type="user" />3rd item</a-menu-item> */}
+                </a-menu>
+              </a-dropdown-button>
+            </a-menu-item>
           </a-menu>
           <ExternalLinksOfHeader />
         </a-layout-header>

front-end/h5/src/router.js

@@ -20,6 +20,11 @@ export default new Router({
           name: 'work-manager-list',
           component: () => import('@/views/work-manager/list.vue')
         },
+        {
+          path: '/work-manager/templates',
+          name: 'work-manager-templates',
+          component: () => import('@/views/work-manager/templates.vue')
+        },
         {
           path: '/work-manager/form-stat',
           name: 'form-stat',

front-end/h5/src/store/modules/editor.js

@@ -13,7 +13,8 @@ const state = {
   formDetailOfWork: {
     uuidMap2Name: {},
     formDetails: []
-  }
+  },
+  workTemplates: []
 }
 
 // getters

front-end/h5/src/store/modules/loading.js

@@ -1,7 +1,10 @@
 // initial state
 const state = {
   saveWork_loading: false,
-  fetchWorks_loading: false
+  fetchWorks_loading: false,
+  setWorkAsTemplate_loading: false,
+  fetchWorkTemplates_loading: false,
+  useTemplate_loading: false
 }
 
 // getters

front-end/h5/src/store/modules/work.js

@@ -13,6 +13,7 @@ export const actions = {
   },
   createWork ({ commit }, payload) {
     strapi.createEntry('works').then(entry => {
+      commit('setWork', entry)
       router.replace({ name: 'editor', params: { workId: entry.id } })
       // window.location = `${window.location.origin}/#/editor/${entry.id}`
     })
@@ -35,7 +36,7 @@ export const actions = {
       ...payload
     }
 
-    new AxiosWrapper({
+    return new AxiosWrapper({
       dispatch,
       commit,
       loading_name: 'saveWork_loading',
@@ -57,7 +58,17 @@ export const actions = {
       loading_name: 'fetchWorks_loading',
       successMsg: '获取作品列表成功',
       customRequest: strapi.getEntries.bind(strapi)
-    }).get('works', {})
+    }).get('works', { is_template: false })
+  },
+  fetchWorkTemplates ({ commit, dispatch, state }, workId) {
+    new AxiosWrapper({
+      dispatch,
+      commit,
+      name: 'editor/setWorkTemplates',
+      loading_name: 'fetchWorkTemplates_loading',
+      successMsg: '获取模板列表成功',
+      customRequest: strapi.getEntries.bind(strapi)
+    }).get('works', { is_template: true })
   },
   /**
    *
@@ -128,6 +139,24 @@ export const actions = {
       loading_name: 'queryFormsOfWork_loading',
       successMsg: '表单查询完毕'
     }).get(`/works/form/query/${workId}`)
+  },
+  setWorkAsTemplate ({ commit, state, dispatch }, workId) {
+    new AxiosWrapper({
+      dispatch,
+      commit,
+      // name: 'editor/formDetailOfWork',
+      loading_name: 'setWorkAsTemplate_loading',
+      successMsg: '设置为模板成功'
+    }).post(`/works/set-as-template/${workId || state.work.id}`)
+  },
+  useTemplate ({ commit, state, dispatch }, workId) {
+    return new AxiosWrapper({
+      dispatch,
+      commit,
+      // name: 'editor/formDetailOfWork',
+      loading_name: 'useTemplate_loading',
+      successMsg: '使用模板成功'
+    }).post(`/works/use-template/${workId}`)
   }
 }
 
@@ -143,6 +172,16 @@ export const mutations = {
     value.sort((a, b) => b.id - a.id)
     state.works = value
   },
+  /**
+   * payload: {
+   *  type:   @params {String} "editor/setWorks",
+   *  value:  @params {Array}  work list
+   * }
+   */
+  setWorkTemplates (state, { type, value }) {
+    value.sort((a, b) => b.id - a.id)
+    state.workTemplates = value
+  },
   setWork (state, work) {
     window.__work = work
     work.pages = work.pages.map(page => {

front-end/h5/src/utils/http.js

@@ -43,6 +43,14 @@ export class AxiosWrapper {
     this.setDefaultLoadingName(args)
 
     this.setLoadingValue(true)
+    if (this.customRequest) {
+      return this.customRequest(...args)
+        .then(data => {
+          const handler = this.getCommonResponseHandler({ failMsg: 'Save Failed.' })
+          handler.call(this, { status: 200, data })
+        })
+        .finally(() => this.setLoadingValue(false))
+    }
     return this.instance.get(...args).then(response => {
       const handler = this.getCommonResponseHandler({ failMsg: 'Query Failed.' })
       handler.call(this, response)
@@ -59,6 +67,7 @@ export class AxiosWrapper {
     return this.instance.post(...args).then(response => {
       const handler = this.getCommonResponseHandler({ failMsg: 'Save Failed.' })
       handler.call(this, response)
+      return response.data
     }).catch(error => {
       // handle error
       myMessage.error(error.message)

front-end/h5/src/views/work-manager/index.vue

@@ -38,7 +38,8 @@ const sidebarMenus = [
         label: '免费模板',
         value: 'freeTemplates',
         antIcon: 'snippets',
-        key: '3-1'
+        key: '3-1',
+        routerName: 'work-manager-templates'
       }
     ]
   },