diff --git a/epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss b/epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss
index e4319b9..c4aa5d7 100644
--- a/epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss
+++ b/epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss
@@ -45,6 +45,7 @@
 				.d-item {
 					margin: 5px 0;
 					line-height: 24px;
+					overflow: hidden;
 					.d-item-region {
 						margin-right: 4px;
 						font-size: 10px;
@@ -128,7 +129,7 @@
 			background-color: #f7f6f9;
 			box-shadow: 0 5px 15px 1px rgba(0, 0, 0, 0.2);
 
-			.mw-phone-topbar{
+			.mw-phone-topbar {
 				display: block;
 				width: 100%;
 			}
@@ -182,7 +183,7 @@
 				cursor: pointer;
 
 				&.z-focused {
-					box-shadow: 0 0 12px 3px rgba(#67C23A, 0.5);
+					box-shadow: 0 0 12px 3px rgba(#67c23a, 0.5);
 				}
 
 				.d-cpt-operate {
@@ -224,6 +225,16 @@
 					}
 				}
 
+				.mw-cpt-placeholder {
+					position: relative;
+					line-height: 40px;
+					text-align: center;
+					font-size: 17px;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: rgba(255, 76, 82, 1);
+				}
+
 				.mw-cpt-top_title {
 					position: relative;
 
diff --git a/epmet-oper-web/src/views/modules/wx-mini/index-set.vue b/epmet-oper-web/src/views/modules/wx-mini/index-set.vue
index 213e405..7319a9c 100644
--- a/epmet-oper-web/src/views/modules/wx-mini/index-set.vue
+++ b/epmet-oper-web/src/views/modules/wx-mini/index-set.vue
@@ -12,9 +12,9 @@
         <el-table-column label="小程序首页配置" fixed="right" header-align="center" align="center" width="150">
           <template slot-scope="scope">
             <el-button type="text" size="small"
-              @click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 0)">政府端</el-button>
+              @click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 0)">居民端</el-button>
             <el-button type="text" size="small"
-              @click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 1)">居民端</el-button>
+              @click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 1)">政府端</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -29,7 +29,7 @@
         @click="save">保存</el-button>
       <el-button type="danger"
         @click="publish">发布</el-button>
-      <span style="margin-left:20px; color:#aaa; font-size:13px">({{ wxIndex.customerName }} - {{ wxIndex.clientType===0 ? '政府端' : '居民端' }})</span>
+      <span style="margin-left:20px; color:#aaa; font-size:13px">({{ wxIndex.customerName }} - {{ wxIndex.clientType===1 ? '政府端' : '居民端' }})</span>
 
       <el-row class="wrap" :gutter="20">
         <el-col :span="5">
@@ -37,10 +37,10 @@
           <div class="mw-cpt_type">
             <div class="d-function"  v-show="item.componentList.length > 0" :key="item.functionId" v-for="item in cptTypeList">
               <div class="d-info" @click="shiftCptTypeItemUnfold(item)">
-                <img v-if="item.functionId==1" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt1.png">
-                <img v-else-if="item.functionId==2" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt2.png">
-                <img v-else-if="item.functionId==3" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt3.png">
-                <img v-else-if="item.functionId==4" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt4.png">
+                <img v-if="item.functionName=='议事厅'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt1.png">
+                <img v-else-if="item.functionName=='社群'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt2.png">
+                <img v-else-if="item.functionName=='党建声音'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt3.png">
+                <img v-else-if="item.functionName=='消息通知'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt4.png">
                 <img v-else class="d-ico" src="@/assets/img/modules/wx-mini/index-set/common-cpt.png">
 
                 <span class="d-name">{{ item.functionName }}</span>
@@ -85,14 +85,18 @@
                       <img class="d-cpt-avatar" v-if="item.demoData.avatar" :src="item.demoData.avatar">
                       <img class="d-cpt-avatar" v-else src="@/assets/img/modules/wx-mini/index-set/page/avatar-mini.png">
                     </div>
-
-                    <div class="d-cpt-operate z-small"
-                      v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
-                      @click.stop>
-                      <div class="d-cpt-btn" @click="delCpt(item)">
-                        <img src="@/assets/img/modules/wx-mini/index-set/del.png">
-                        <p>删除</p>
-                      </div>
+                  </div>
+                  <div class="mw-cpt-placeholder" v-else>
+                    <div class="d-cpt-wrap">
+                      {{ item.componentName }}
+                    </div>
+                  </div>
+                  <div class="d-cpt-operate z-small"
+                    v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
+                    @click.stop>
+                    <div class="d-cpt-btn" @click="delCpt(item)">
+                      <img src="@/assets/img/modules/wx-mini/index-set/del.png">
+                      <p>删除</p>
                     </div>
                   </div>
                 </div>
@@ -117,14 +121,18 @@
                         </div>
                       </div>
                     </div>
-
-                    <div class="d-cpt-operate z-small"
-                      v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
-                      @click.stop>
-                      <div class="d-cpt-btn" @click="delCpt(item)">
-                        <img src="@/assets/img/modules/wx-mini/index-set/del.png">
-                        <p>删除</p>
-                      </div>
+                  </div>
+                  <div class="mw-cpt-placeholder" v-else>
+                    <div class="d-cpt-wrap">
+                      {{ item.componentName }}
+                    </div>
+                  </div>
+                  <div class="d-cpt-operate z-small"
+                    v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
+                    @click.stop>
+                    <div class="d-cpt-btn" @click="delCpt(item)">
+                      <img src="@/assets/img/modules/wx-mini/index-set/del.png">
+                      <p>删除</p>
                     </div>
                   </div>
                 </div>
@@ -141,14 +149,18 @@
                       <img v-else src="@/assets/img/modules/wx-mini/index-set/page/msg.png">
                       <span>{{ item.demoData.text }}</span>
                     </div>
-
-                    <div class="d-cpt-operate z-small"
-                      v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
-                      @click.stop>
-                      <div class="d-cpt-btn" @click="delCpt(item)">
-                        <img src="@/assets/img/modules/wx-mini/index-set/del.png">
-                        <p>删除</p>
-                      </div>
+                  </div>
+                  <div class="mw-cpt-placeholder" v-else>
+                    <div class="d-cpt-wrap">
+                      {{ item.componentName }}
+                    </div>
+                  </div>
+                  <div class="d-cpt-operate z-small"
+                    v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
+                    @click.stop>
+                    <div class="d-cpt-btn" @click="delCpt(item)">
+                      <img src="@/assets/img/modules/wx-mini/index-set/del.png">
+                      <p>删除</p>
                     </div>
                   </div>
                 </div>
@@ -177,7 +189,7 @@
                     </div>
                   </div>
                   <div class="mw-cpt-cnt_menus"
-                    v-if="item.componentFrontId==='resi-functionList-extend-moreFunctionIcons'">
+                    v-else-if="item.componentFrontId==='resi-functionList-extend-moreFunctionIcons'">
                     <div class="d-cpt-wrap">
                       <div class="list">
                         <div class="item" :key="subindex" v-for="(subitem, subindex) in item.demoData.list">
@@ -192,7 +204,7 @@
                     </div>
                   </div>
                   <div class="mw-cpt-cnt_groups"
-                    v-if="item.componentFrontId==='resi-functionList-group-recommendGroupSlider'">
+                    v-else-if="item.componentFrontId==='resi-functionList-group-recommendGroupSlider'">
                     <div class="d-cpt-wrap">
                       <div class="list">
                         <div class="item" :key="subindex" v-for="(subitem, subindex) in item.demoData.list">
@@ -219,6 +231,11 @@
                       </div>
                     </div>
                   </div>
+                  <div class="mw-cpt-placeholder" v-else>
+                    <div class="d-cpt-wrap">
+                      {{ item.componentName }}
+                    </div>
+                  </div>
                   <div class="d-cpt-operate"
                     v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
                     @click.stop>
@@ -316,6 +333,47 @@ export default {
         functionName: '通用组件',
         functionType: 1, // 1通用 2功能
         isUnfold: true,
+        componentList: [
+          {
+            componentId: '7',
+            componentName: '新闻列表',
+            componentFrontId: 'resi-functionList-hall-hotSubjectList',
+            region: 'functionList',
+            configuration: {
+              // bgc: '#fff'
+            },
+            demoData: {
+              list: [
+                {
+                  pic: '',
+                  title: '我是新闻标题，我是新闻标题，我是新闻标题，我是新闻标题，我是新闻标题',
+                  author: '大港路党支部',
+                  date: '2020-01-02'
+                },
+                {
+                  pic: '',
+                  title: '我是新闻标题',
+                  author: '大港路党支部',
+                  date: '2020-01-02'
+                },
+                {
+                  pic: '',
+                  title: '我是新闻标题',
+                  author: '大港路党支部',
+                  date: '2020-01-02'
+                }
+              ]
+            },
+            configurationDescription: ''
+          }
+        ]
+      },
+      // 功能组件
+      {
+        functionId: '1',
+        functionName: '议事厅',
+        functionType: 2, // 1通用 2功能
+        isUnfold: false,
         componentList: [
           {
             componentId: '1',
@@ -329,6 +387,7 @@ export default {
               avatar: '',
               title: '青岛市市北区大港路第二网格'
             },
+            region: 'titleList',
             configurationDescription: '请配置具体内容'
           },
           {
@@ -342,6 +401,7 @@ export default {
               pic: '',
               title: '轮播图新闻标题'
             },
+            region: 'topList',
             configurationDescription: '请配置具体内容'
           },
           {
@@ -355,21 +415,14 @@ export default {
               ico: '',
               text: '有新消息！'
             },
+            region: 'floatingList',
             configurationDescription: ''
-          }
-        ]
-      },
-      // 功能组件
-      {
-        functionId: '1',
-        functionName: '议事厅',
-        functionType: 2, // 1通用 2功能
-        isUnfold: false,
-        componentList: [
+          },
           {
             componentId: '5',
             componentName: '功能菜单',
             componentFrontId: 'resi-functionList-extend-moreFunctionIcons',
+            region: 'functionList',
             configuration: {
               // bgc: '#eee'
             },
@@ -399,6 +452,7 @@ export default {
             componentId: '6',
             componentName: '热门群',
             componentFrontId: 'resi-functionList-group-recommendGroupSlider',
+            region: 'functionList',
             configuration: {
               // bgc: '#fff'
             },
@@ -434,37 +488,6 @@ export default {
               ]
             },
             configurationDescription: ''
-          },
-          {
-            componentId: '7',
-            componentName: '新闻列表',
-            componentFrontId: 'resi-functionList-hall-hotSubjectList',
-            configuration: {
-              // bgc: '#fff'
-            },
-            demoData: {
-              list: [
-                {
-                  pic: '',
-                  title: '我是新闻标题，我是新闻标题，我是新闻标题，我是新闻标题，我是新闻标题',
-                  author: '大港路党支部',
-                  date: '2020-01-02'
-                },
-                {
-                  pic: '',
-                  title: '我是新闻标题',
-                  author: '大港路党支部',
-                  date: '2020-01-02'
-                },
-                {
-                  pic: '',
-                  title: '我是新闻标题',
-                  author: '大港路党支部',
-                  date: '2020-01-02'
-                }
-              ]
-            },
-            configurationDescription: ''
           }
         ]
       }
@@ -568,6 +591,7 @@ export default {
       await this.getCptTypeList()
       await this.getCptList()
       this.toStep(2)
+      this.cleanFocusCpt()
       loadingInstance.close()
     },
     processBackendCptData (item) {
@@ -710,15 +734,27 @@ export default {
     },
     // 判断组件所属区域类别
     checkCptRegion (item) {
-      const { componentFrontId } = item
-      const fun = name => name === componentFrontId
-      if (['resi-titleList-home-gridNameTitle'].findIndex(fun) !== -1) {
+      const { region } = item
+      // const { componentFrontId } = item
+      // const fun = name => name === componentFrontId
+      // if (['resi-titleList-home-gridNameTitle'].findIndex(fun) !== -1) {
+      //   return 'top'
+      // } else if (['resi-topList-voice-hotNewsSwiper'].findIndex(fun) !== -1) {
+      //   return 'ban'
+      // } else if (['resi-functionList-extend-moreFunctionIcons', 'resi-functionList-group-recommendGroupSlider', 'resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1) {
+      //   return 'cnt'
+      // } else if (['resi-floatingList-mine-newMessageButton'].findIndex(fun) !== -1) {
+      //   return 'fixed'
+      // } else {
+      //   return 'none'
+      // }
+      if (region === 'titleList') {
         return 'top'
-      } else if (['resi-topList-voice-hotNewsSwiper'].findIndex(fun) !== -1) {
+      } else if (region === 'topList') {
         return 'ban'
-      } else if (['resi-functionList-extend-moreFunctionIcons', 'resi-functionList-group-recommendGroupSlider', 'resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1) {
+      } else if (region === 'functionList') {
         return 'cnt'
-      } else if (['resi-floatingList-mine-newMessageButton'].findIndex(fun) !== -1) {
+      } else if (region === 'floatingList') {
         return 'fixed'
       } else {
         return 'none'
@@ -727,8 +763,10 @@ export default {
     // 判断组件是否可用复用
     checkCptReuse (item) {
       const { componentFrontId } = item
+      const reuseList = this.cptTypeList[0].componentList.map(v => v.componentFrontId)
       const fun = name => name === componentFrontId
-      return ['resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1
+      // return ['resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1
+      return reuseList.findIndex(fun) !== -1
     },
     // 根据所属区域简称得到名字
     getCptRegionName (id) {
@@ -747,19 +785,19 @@ export default {
       const tempOnlyId = getRandomString(20)
       if (regionType === 'top') {
         if (this.topCptList.length > 0) {
-
+          this.$message('标题区已有组件，请删除后再添加')
         } else {
           this.addCpt(item, tempOnlyId, 1)
         }
       } else if (regionType === 'ban') {
         if (this.banCptList.length > 0) {
-
+          this.$message('置顶区已有组件，请删除后再添加')
         } else {
           this.addCpt(item, tempOnlyId, 2)
         }
       } else if (regionType === 'fixed') {
         if (this.fixedCptList.length > 0) {
-
+          this.$message('浮窗区已有组件，请删除后再添加')
         } else {
           this.addCpt(item, tempOnlyId, 3)
         }
@@ -781,7 +819,7 @@ export default {
       console.log('添加组件到实例')
       let trueItem = cloneDeep(item)
       trueItem.tempOnlyId = tempOnlyId
-      trueItem.region = region
+      trueItem.localRegion = region
       trueItem.displayOrder = displayOrder
       this.cptList.push(trueItem)
     },
@@ -807,12 +845,16 @@ export default {
     checkExistCpt (item) {
       return this.cptList.some(cptItem => item.componentFrontId === cptItem.componentFrontId)
     },
+    // 清空聚焦实例组件
+    cleanFocusCpt () {
+      this.focusedCpt = { tempOnlyId: '' }
+    },
     // 聚焦实例组件
     focusCpt (item) {
       console.log('聚焦实例组件')
       if (this.isInPreview) return
       if (this.focusedCpt.tempOnlyId === item.tempOnlyId) {
-        this.focusedCpt = { tempOnlyId: '' }
+        this.cleanFocusCpt()
       } else {
         this.focusedCpt = { ...cloneDeep(item), demoData: JSON.stringify(item.demoData), configuration: JSON.stringify(item.configuration), demoIsUnfold: true, confIsUnfold: false }
       }