徐烜 / bsth-ebus-h5_editor · Commits

Commit a2fb4acc846efea13295993299bc4b0fd3d326d3

Authored by ly525
1 parent cf9756cc

fix: #113 

do save work before preview work
zh: 预览作品之前先保存作品
Inline Side-by-side
Showing 3 changed files with 25 additions and 4 deletions
front-end/h5/src/components/core/editor/index.js
  View file @a2fb4ac
... ... @@ -123,7 +123,12 @@ export default {
123 123 pages: state => state.work.pages,
124 124 work: state => state.work
125 125 }),
126   - ...mapState('loading', ['saveWork_loading', 'setWorkAsTemplate_loading', 'uploadWorkCover_loading'])
  126 + ...mapState('loading', [
  127 + 'saveWork_loading',
  128 + 'previewWork_loading',
  129 + 'setWorkAsTemplate_loading',
  130 + 'uploadWorkCover_loading'
  131 + ])
127 132 },
128 133 methods: {
129 134 ...mapActions('editor', [
... ... @@ -239,7 +244,7 @@ export default {
239 244 style={{ lineHeight: '64px', float: 'right', background: 'transparent' }}
240 245 >
241 246 {/* 保存、预览、发布、设置为模板 */}
242   - <a-menu-item key="1" class="transparent-bg"><a-button type="primary" size="small" onClick={() => { this.previewVisible = true }}>{this.$t('editor.header.preview')}</a-button></a-menu-item>
  247 + <a-menu-item key="1" class="transparent-bg"><a-button type="primary" size="small" onClick={() => { this.saveWork({ loadingName: 'previewWork_loading' }).then(() => { this.previewVisible = true }) }} loading={this.previewWork_loading}>{this.$t('editor.header.preview')}</a-button></a-menu-item>
243 248 <a-menu-item key="2" class="transparent-bg"><a-button size="small" onClick={() => this.saveWork({ isSaveCover: true })} loading={this.saveWork_loading || this.uploadWorkCover_loading}>{this.$t('editor.header.save')}</a-button></a-menu-item>
244 249 {/* <a-menu-item key="3" class="transparent-bg"><a-button size="small">发布</a-button></a-menu-item> */}
245 250 <a-menu-item key="3" class="transparent-bg">
... ...
front-end/h5/src/store/modules/loading.js
  View file @a2fb4ac
  1 +/*
  2 + * @Author: ly525
  3 + * @Date: 2019-11-24 18:51:58
  4 + * @LastEditors: ly525
  5 + * @LastEditTime: 2019-12-08 17:21:48
  6 + * @FilePath: /luban-h5/front-end/h5/src/store/modules/loading.js
  7 + * @Github: https://github.com/ly525/luban-h5
  8 + * @Description: loading module
  9 + * @Copyright 2018 - 2019 luban-h5. All Rights Reserved
  10 + */
1 11 // initial state
2 12 const state = {
3 13 saveWork_loading: false,
  14 + previewWork_loading: false,
4 15 fetchWorks_loading: false,
5 16 setWorkAsTemplate_loading: false,
6 17 fetchWorkTemplates_loading: false,
... ...
front-end/h5/src/store/modules/work.js
  View file @a2fb4ac
... ... @@ -21,6 +21,8 @@ export const actions = {
21 21 strapi.createEntry('works', new Work()).then(entry => {
22 22 const routeData = router.resolve({ name: 'editor', params: { workId: entry.id } })
23 23 window.open(routeData.href, '_blank')
  24 + // 如果希望不打开新 tab，可以注释上面面两行，启用下面一行的代码即可，不过不推荐。将编辑器单独起一个页面更有利于 vuex 的数据管理
  25 + // router.replace({ name: 'editor', params: { workId: entry.id } })
24 26 })
25 27 },
26 28 updateWork ({ commit, state }, payload = {}) {
... ... @@ -33,13 +35,16 @@ export const actions = {
33 35 },
34 36 /**
35 37 * isSaveCover {Boolean} 保存作品时，是否保存封面图
  38 + * loadingName {String} saveWork_loading, previewWork_loading
  39 + * 预览作品之前需要先保存，但希望 用户点击保存按钮 和 点击预览按钮 loading_name 能够不同（虽然都调用了 saveWork）
  40 + * 因为 loading 效果要放在不同的按钮上
36 41 */
37   - saveWork ({ commit, dispatch, state }, { isSaveCover = false } = {}) {
  42 + saveWork ({ commit, dispatch, state }, { isSaveCover = false, loadingName = 'saveWork_loading' } = {}) {
38 43 const fn = (callback) => {
39 44 new AxiosWrapper({
40 45 dispatch,
41 46 commit,
42   - loading_name: 'saveWork_loading',
  47 + loading_name: loadingName,
43 48 successMsg: '保存作品成功',
44 49 customRequest: strapi.updateEntry.bind(strapi)
45 50 }).put('works', state.work.id, state.work).then(callback)
... ...