From 2a66b40a504f078e682a564591640ddb4760a46b Mon Sep 17 00:00:00 2001
From: "wu.jian2" <distantmtn@gmail.com>
Date: Mon, 24 Jul 2023 13:47:20 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20post=E8=AF=B7=E6=B1=82=E6=94=B9=E4=B8=BA?=
 =?UTF-8?q?=E4=BD=BF=E7=94=A8=E5=8E=9F=E5=BD=A2=E9=93=BE=E4=B8=8A=E5=AE=9E?=
 =?UTF-8?q?=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 data-room-ui/packages/ComponentList/index.vue | 211 +++++++++++++-----
 1 file changed, 153 insertions(+), 58 deletions(-)

diff --git a/data-room-ui/packages/ComponentList/index.vue b/data-room-ui/packages/ComponentList/index.vue
index b74bcb3e..faaca2f5 100644
--- a/data-room-ui/packages/ComponentList/index.vue
+++ b/data-room-ui/packages/ComponentList/index.vue
@@ -2,27 +2,63 @@
   <div class="big-screen-list-wrap">
     <div class="internal-box">
       <div class="top-search-wrap">
-        <el-select v-if="catalogInfo !== 'system'" v-model="catalogCode" class="bs-el-select" popper-class="bs-el-select"
-          placeholder="请选择分组" clearable @change="reSearch">
-          <el-option v-for="item in catalogList" :key="item.code" :label="item.name" :value="item.code" />
+        <el-select
+          v-if="catalogInfo !== 'system'"
+          v-model="catalogCode"
+          class="bs-el-select"
+          popper-class="bs-el-select"
+          placeholder="请选择分组"
+          clearable
+          @change="reSearch"
+        >
+          <el-option
+            v-for="item in catalogList"
+            :key="item.code"
+            :label="item.name"
+            :value="item.code"
+          />
         </el-select>
-        <el-input v-model="searchKey" class="bs-el-input" placeholder="请输入组件名称" prefix-icon="el-icon-search" clearable
-          @clear="reSearch" @keyup.enter.native="reSearch" />
-        <el-button type="primary" @click="reSearch">
+        <el-input
+          v-model="searchKey"
+          class="bs-el-input"
+          placeholder="请输入组件名称"
+          prefix-icon="el-icon-search"
+          clearable
+          @clear="reSearch"
+          @keyup.enter.native="reSearch"
+        />
+        <el-button
+          type="primary"
+          @click="reSearch"
+        >
           搜索
         </el-button>
-        <el-button v-if="catalogInfo !== 'system'" type="primary" @click="catalogManage">
+        <el-button
+          v-if="catalogInfo !== 'system'"
+          type="primary"
+          @click="catalogManage"
+        >
           分组管理
         </el-button>
       </div>
-      <div v-loading="loading" class="list-wrap bs-scrollbar" element-loading-text="加载中" :style="{
-        display: gridComputed ? 'grid' : 'flex',
-        justifyContent: gridComputed ? 'space-around' : 'flex-start'
-      }">
+      <div
+        v-loading="loading"
+        class="list-wrap bs-scrollbar"
+        element-loading-text="加载中"
+        :style="{
+          display: gridComputed ? 'grid' : 'flex',
+          justifyContent: gridComputed ? 'space-around' : 'flex-start'
+        }"
+      >
         <!-- 第一个是新增大屏卡片 -->
-        <div v-if="catalogInfo !== 'system'" class="big-screen-card-wrap" :style="{
-          width: gridComputed ? 'auto' : '290px'
-        }" @click="add">
+        <div
+          v-if="catalogInfo !== 'system'"
+          class="big-screen-card-wrap"
+          :style="{
+            width: gridComputed ? 'auto' : '290px'
+          }"
+          @click="add"
+        >
           <div class="big-screen-card-inner big-screen-card-inner-add">
             <div class="add-big-screen-card">
               <div class="add-big-screen-card-inner">
@@ -34,38 +70,72 @@
           </div>
         </div>
         <!-- 后面遍历 list -->
-        <div v-for="screen in list" :key="screen.id" class="big-screen-card-wrap" :style="{
-          width: gridComputed ? 'auto' : '290px'
-        }">
+        <div
+          v-for="screen in list"
+          :key="screen.id"
+          class="big-screen-card-wrap"
+          :style="{
+            width: gridComputed ? 'auto' : '290px'
+          }"
+        >
           <div class="big-screen-card-inner">
             <div class="screen-card__hover">
               <div class="screen-card__hover-box">
                 <div class="preview">
-                  <div class="screen-card__oper-label circle" @click="preview(screen)">
+                  <div
+                    class="screen-card__oper-label circle"
+                    @click="preview(screen)"
+                  >
                     <span>预览</span>
                   </div>
-                  <div v-if="catalogInfo !== 'system'" class="circle" @click="design(screen)">
+                  <div
+                    v-if="catalogInfo !== 'system'"
+                    class="circle"
+                    @click="design(screen)"
+                  >
                     <span>设计</span>
                   </div>
-                  <div v-if="catalogInfo !== 'system'" class="circle" @click="edit(screen)">
+                  <div
+                    v-if="catalogInfo !== 'system'"
+                    class="circle"
+                    @click="edit(screen)"
+                  >
                     <span>编辑</span>
                   </div>
-                  <div v-if="catalogInfo !== 'system'" class="circle" @click="copy(screen)">
+                  <div
+                    v-if="catalogInfo !== 'system'"
+                    class="circle"
+                    @click="copy(screen)"
+                  >
                     <span>复制</span>
                   </div>
-                  <div v-if="catalogInfo !== 'system'" class="circle" @click="del(screen)">
+                  <div
+                    v-if="catalogInfo !== 'system'"
+                    class="circle"
+                    @click="del(screen)"
+                  >
                     <span>删除</span>
                   </div>
                 </div>
               </div>
             </div>
             <div class="big-screen-card-img">
-              <el-image :src="catalogInfo !== 'system' ? screen.coverPicture : screen.img" fit="fill"
-                style="width: 100%; height: 100%">
-                <div slot="placeholder" class="image-slot">
+              <el-image
+                :src="catalogInfo !== 'system' ? screen.coverPicture : screen.img"
+                fit="fill"
+                style="width: 100%; height: 100%"
+              >
+                <div
+                  slot="placeholder"
+                  class="image-slot"
+                >
                   加载中···
                 </div>
-                <div slot="error" class="image-slot" style="font-size: 20px">
+                <div
+                  slot="error"
+                  class="image-slot"
+                  style="font-size: 20px"
+                >
                   <div class="error-img-text">
                     {{ catalogInfo !== 'system' ? screen.name : screen.title }}
                   </div>
@@ -73,29 +143,54 @@
               </el-image>
             </div>
             <div class="big-screen-bottom">
-              <div class="left-bigscreen-title" :title="catalogInfo !== 'system' ? screen.name : screen.title">
+              <div
+                class="left-bigscreen-title"
+                :title="catalogInfo !== 'system' ? screen.name : screen.title"
+              >
                 {{ catalogInfo !== 'system' ? screen.name : screen.title }}
               </div>
             </div>
           </div>
         </div>
       </div>
-      <div v-if="catalogInfo !== 'system'" class="footer-pagination-wrap">
+      <div
+        v-if="catalogInfo !== 'system'"
+        class="footer-pagination-wrap"
+      >
         <!-- <div class="footer-pagination-wrap-text">
         总共 {{ totalCount }} 个项目
       </div> -->
         <div class="bs-pagination">
-          <el-pagination class="bs-el-pagination" popper-class="bs-el-pagination" background
-            layout="total, prev, pager, next, sizes" :page-size="size" prev-text="上一页" next-text="下一页" :total="totalCount"
-            :page-sizes="[10, 20, 50, 100]" :current-page="current" @current-change="currentChangeHandle"
-            @size-change="sizeChangeHandle" />
+          <el-pagination
+            class="bs-el-pagination"
+            popper-class="bs-el-pagination"
+            background
+            layout="total, prev, pager, next, sizes"
+            :page-size="size"
+            prev-text="上一页"
+            next-text="下一页"
+            :total="totalCount"
+            :page-sizes="[10, 20, 50, 100]"
+            :current-page="current"
+            @current-change="currentChangeHandle"
+            @size-change="sizeChangeHandle"
+          />
         </div>
       </div>
     </div>
     <!-- 新增或编辑弹窗 -->
-    <EditForm v-if="catalogInfo !== 'system'" ref="EditForm" :type="catalogInfo" @refreshData="reSearch" />
-    <CatalogEditForm v-if="catalogInfo !== 'system'" ref="CatalogEditForm" :catalog-type="catalogType"
-      @updateCatalogList="updateCatalogList" />
+    <EditForm
+      v-if="catalogInfo !== 'system'"
+      ref="EditForm"
+      :type="catalogInfo"
+      @refreshData="reSearch"
+    />
+    <CatalogEditForm
+      v-if="catalogInfo !== 'system'"
+      ref="CatalogEditForm"
+      :catalog-type="catalogType"
+      @updateCatalogList="updateCatalogList"
+    />
   </div>
 </template>
 <script>
@@ -114,7 +209,7 @@ export default {
     }
   },
   components: { EditForm, CatalogEditForm },
-  data() {
+  data () {
     return {
       name: '',
       catalogVisible: false,
@@ -128,41 +223,41 @@ export default {
     }
   },
   computed: {
-    catalogType() {
+    catalogType () {
       if (this.catalogInfo === 'component') {
         return 'componentCatalog'
       } else {
         return 'bizComponentCatalog'
       }
     },
-    code() {
+    code () {
       return ''
     },
-    gridComputed() {
+    gridComputed () {
       return this.list.length > 2
     }
   },
   watch: {
-    catalogInfo() {
+    catalogInfo () {
       this.reset()
       this.init()
     },
-    catalogCode(value) {
+    catalogCode (value) {
       this.reSearch()
     }
   },
-  mounted() {
+  mounted () {
     this.init()
   },
   methods: {
-    reset() {
+    reset () {
       this.searchKey = ''
       this.current = 1
       this.size = 10
       this.catalogCode = ''
       this.init()
     },
-    init() {
+    init () {
       if (this.catalogInfo !== 'system') {
         this.getDataList()
         this.getCatalogList()
@@ -171,10 +266,10 @@ export default {
         this.list = [...innerRemoteComponents, ...getRemoteComponents()]
       }
     },
-    updateCatalogList(list) {
+    updateCatalogList (list) {
       this.catalogList = list
     },
-    reSearch() {
+    reSearch () {
       if (this.catalogInfo !== 'system') {
         this.current = 1
         this.getDataList()
@@ -183,18 +278,18 @@ export default {
         this.list = arr?.filter((item) => item.title.indexOf(this.searchKey) !== -1)
       }
     },
-    catalogManage() {
+    catalogManage () {
       this.$refs.CatalogEditForm.formVisible = true
     },
     // 获取分组列表
-    getCatalogList() {
+    getCatalogList () {
       this.$dataRoomAxios.get(`/bigScreen/type/list/${this.catalogType}`)
         .then((data) => {
           this.catalogList = data
         })
         .catch(() => { })
     },
-    getDataList() {
+    getDataList () {
       this.loading = true
       if (this.catalogInfo === 'component') {
         this.$dataRoomAxios.get('/bigScreen/design/page', {
@@ -228,7 +323,7 @@ export default {
           })
       }
     },
-    preview(screen) {
+    preview (screen) {
       let path = ''
       let query = {
         code: screen.code
@@ -249,7 +344,7 @@ export default {
       })
       window.open(href, '_blank')
     },
-    design(screen) {
+    design (screen) {
       const path = this.catalogInfo === 'component' ? (window.BS_CONFIG?.routers?.designUrl || '/big-screen/design') : (window.BS_CONFIG?.routers?.bizComponentDesignUrl || 'big-screen-biz-component-design')
       const { href } = this.$router.resolve({
         path,
@@ -259,17 +354,17 @@ export default {
       })
       window.open(href, '_self')
     },
-    add() {
+    add () {
       const page = {
         code: '',
         type: this.catalogInfo === 'component' ? 'bigScreen' : 'bizComponent'
       }
       this.$refs.EditForm.init(page, this.catalogCode)
     },
-    edit(screen) {
+    edit (screen) {
       this.$refs.EditForm.init(screen, this.catalogCode)
     },
-    del(screen) {
+    del (screen) {
       this.$confirm('确定删除该组件', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
@@ -278,7 +373,7 @@ export default {
       })
         .then(async () => {
           const url = this.catalogInfo === 'component' ? `/bigScreen/design/delete/${screen.code}` : `/bigScreen/bizComponent/delete/${screen.id}`
-          post(url)
+          this.$dataRoomAxios.post(url)
             .then(() => {
               this.$message({
                 type: 'success',
@@ -295,8 +390,8 @@ export default {
         })
         .catch()
     },
-    copy(screen) {
-      const url = this.catalogInfo === 'component' ? `/bigScreen/design/copy/${screen.code}` : `/bigScreen/bizComponent/copy/${screen.code}`
+    copy (screen) {
+      const url = this.catalogInfo === 'component' ? `/bigScreen/design/copy/${screen.code}` : `/Component/copy/${screen.code}`
       this.$confirm('确定复制该组件', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
@@ -304,7 +399,7 @@ export default {
         customClass: 'bs-el-message-box'
       })
         .then(async () => {
-          post(url)
+          this.$dataRoomAxios.post(url)
             .then(() => {
               this.$message({
                 type: 'success',