优化页面发布流程

工作空间/产研/权益/汇丰全行/产品原型/pc-demo/src/views/PageAssembly.vue

@@ -61,7 +61,7 @@
           </el-button>
           <h2 class="toolbar-title">{{ isNew ? '新建组装页' : '编辑组装页' }}</h2>
           <el-tag v-if="editData.status === 'published' && !isModified" type="success" size="small" effect="plain">正式线上环境</el-tag>
-          <el-tag v-else-if="isModified" type="warning" size="small" effect="plain">有未发布的修改</el-tag>
+          <el-tag v-else-if="showModifiedStatus" type="warning" size="small" effect="plain">有未发布的修改</el-tag>
           <el-tag v-else size="info" effect="plain">草稿 (未发布)</el-tag>
         </div>
         <div class="toolbar-right">
@@ -69,7 +69,7 @@
             <el-icon><Link /></el-icon>获取链接
           </el-button>
           <el-button size="small" type="primary" plain @click="handleSaveAssembly('draft')">保存草稿</el-button>
-          <el-button size="small" type="primary" @click="handleSaveAssembly('publish')">发布上线</el-button>
+          <el-button v-if="canPublish" size="small" type="primary" @click="handleSaveAssembly('publish')">发布上线</el-button>
         </div>
       </div>
 
@@ -475,6 +475,12 @@ export default {
     hasPrivilegeBlock() {
       return this.editData.blocks.some(b => b.type === 'privilege')
     },
+    showModifiedStatus() {
+      return this.editData.status === 'modified' || (this.editData.status === 'published' && this.isModified)
+    },
+    canPublish() {
+      return !this.isModified && !!this.editData.id && ['draft', 'modified'].includes(this.editData.status)
+    },
     linkQueryStr() {
       const params = []
       if (this.linkForm.campaignId) params.push(`CampaignId=${this.linkForm.campaignId}`)
@@ -752,10 +758,16 @@ export default {
         }
       }
       if (!data.name.trim()) data.name = '未命名组装页'
-      data.status = type === 'publish' ? 'published' : 'draft'
+      if (type === 'publish' && this.isModified) {
+        ElMessage.warning('请先保存草稿后再发布上线')
+        return
+      }
+      const currentStatus = data.status
+      data.status = type === 'publish' ? 'published' : (currentStatus === 'published' || currentStatus === 'modified' ? 'modified' : 'draft')
 
       const res = await request.post('/api/assembly/save', data)
       if (!data.id) data.id = res.data.id
+      if (type === 'draft') this.isNew = false
       this.isModified = false
       ElMessage.success(type === 'publish' ? '已发布组装页配置！' : '已保存组装页配置草稿！')
       if (type === 'publish') this.backToList()

工作空间/产研/权益/汇丰全行/产品原型/pc-demo/src/views/PageHomeConfig.vue

@@ -13,7 +13,7 @@
           <el-icon><Link /></el-icon>获取链接
         </el-button>
         <el-button size="small" type="primary" plain @click="handleSave('draft')">保存草稿</el-button>
-        <el-button size="small" type="primary" @click="handleSave('publish')">发布上线</el-button>
+        <el-button v-if="canPublish" size="small" type="primary" @click="handleSave('publish')">发布上线</el-button>
       </div>
     </div>
 
@@ -221,6 +221,7 @@ export default {
       ],
       configData: {},
       pageStatus: 'draft',
+      isModified: false,
       sortTarget: 1,
       linkDialogVisible: false,
       linkForm: { campaignId: '', channelId: '' },
@@ -232,6 +233,9 @@ export default {
     currentTierData() {
       return this.configData[this.currentTier] || null
     },
+    canPublish() {
+      return !this.isModified && ['draft', 'modified'].includes(this.pageStatus)
+    },
     linkQueryStr() {
       const params = []
       if (this.linkForm.campaignId) params.push(`CampaignId=${this.linkForm.campaignId}`)
@@ -257,6 +261,7 @@ export default {
       const res = await request.get('/api/page-config/home')
       this.configData = this.normalizeHomeConfig(res.data.config || {})
       this.pageStatus = res.data.status
+      this.isModified = false
     },
     normalizeHomeConfig(config) {
       Object.keys(config).forEach((key) => {
@@ -280,6 +285,7 @@ export default {
       if (this.pageStatus === 'published') {
         this.pageStatus = 'modified'
       }
+      this.isModified = true
     },
     onTierChange() {},
     triggerUpload(type, index) {
@@ -334,9 +340,14 @@ export default {
     },
     async handleSave(type) {
       if (!this.validatePrivilegeImages()) return
-      const status = type === 'publish' ? 'published' : 'draft'
+      if (type === 'publish' && this.isModified) {
+        ElMessage.warning('请先保存草稿后再发布上线')
+        return
+      }
+      const status = type === 'publish' ? 'published' : (this.pageStatus === 'published' || this.pageStatus === 'modified' ? 'modified' : 'draft')
       await request.put('/api/page-config/home', { config: this.configData, status })
       this.pageStatus = status
+      this.isModified = false
       ElMessage.success(type === 'publish' ? '已发布权益介绍页配置！' : '已保存权益介绍页配置草稿！')
     },
     onPrivilegeImageToggle(val) {

工作空间/产研/权益/汇丰全行/产品原型/pc-demo/src/views/PageZoneConfig.vue

@@ -13,7 +13,7 @@
           <el-icon><Link /></el-icon>获取链接
         </el-button>
         <el-button size="small" type="primary" plain @click="handleSave('draft')">保存草稿</el-button>
-        <el-button size="small" type="primary" @click="handleSave('publish')">发布上线</el-button>
+        <el-button v-if="canPublish" size="small" type="primary" @click="handleSave('publish')">发布上线</el-button>
       </div>
     </div>
 
@@ -343,6 +343,7 @@ export default {
       ],
       availableTags: [],
       pageStatus: 'draft',
+      isModified: false,
       dataLoaded: false,
       sortTarget: 1,
       linkDialogVisible: false,
@@ -379,6 +380,9 @@ export default {
     testUrl() {
       const q = this.linkQueryStr
       return `https://test.hsbc.com/zone${q ? q + '&' : '?'}draft=1`
+    },
+    canPublish() {
+      return !this.isModified && ['draft', 'modified'].includes(this.pageStatus)
     }
   },
   created() {
@@ -494,6 +498,7 @@ export default {
       this.configData = cfg
       this.availableTags = res.data.availableTags
       this.pageStatus = res.data.status
+      this.isModified = false
       this.$nextTick(() => { this.dataLoaded = true })
     },
     triggerIdentityUpload(key) {
@@ -521,6 +526,7 @@ export default {
       if (this.pageStatus === 'published') {
         this.pageStatus = 'modified'
       }
+      this.isModified = true
     },
     triggerUpload(type, index) {
       const ref = this.$refs[type + 'Upload' + index]
@@ -574,9 +580,14 @@ export default {
         ElMessage.error(`保存失败：第 ${invalidCarouselIndex + 1} 个活动广告轮播图跳转链接配置未填写完整！`)
         return
       }
-      const status = type === 'publish' ? 'published' : 'draft'
+      if (type === 'publish' && this.isModified) {
+        ElMessage.warning('请先保存草稿后再发布上线')
+        return
+      }
+      const status = type === 'publish' ? 'published' : (this.pageStatus === 'published' || this.pageStatus === 'modified' ? 'modified' : 'draft')
       await request.put('/api/page-config/zone', { config: this.configData, status })
       this.pageStatus = status
+      this.isModified = false
       ElMessage.success(type === 'publish' ? '已发布权益首页配置！' : '已保存权益首页配置草稿！')
     },
     async showLinkDialog() {