收藏列表

jero-web/src/views/documentManage/collection/index.vue

@@ -10,13 +10,13 @@
                 :model="queryParams"
                 ref="tagEditForm"
               >
-              <a-row :gutter="44">
-                <a-col :md="6" :sm="12">
+              <a-row :gutter="24" type="flex" justify="start">
+                <a-col :md="6" :sm="8">
                   <a-form-model-item :label="'编号'">
                     <j-input :placeholder="'请输入编号'" v-model="queryParams.serialNumber"></j-input>
                   </a-form-model-item>
                 </a-col>
-                <a-col :md="6" :sm="12">
+                <a-col :md="6" :sm="8">
                   <a-form-model-item :label="'标题'">
                     <j-input :placeholder="'请输入标题'" v-model="queryParams.title"></j-input>
                   </a-form-model-item>
@@ -37,21 +37,18 @@
             </a-form>
           </div>
         </div>
-        <div class="table-operator" style="margin-top: 10px">
-          <a-button @click="handleBatCancel" type="primary">批量取消收藏</a-button>
+        <div class="table-operator">
+          <div class="operator-text" @click="handleBatCancel">
+            <a-icon type="delete" />
+            批量取消收藏
+          </div>
         </div>
         <div class="colloction-table">
-          <a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" :pagination="false" class="tag-con-table">
+          <a-table bordered :data-source="tableData" :columns="columns" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" :pagination="false" :loading="loading" class="tag-con-table">
             <a slot="serialNumber" slot-scope="text, record" @click="numberClick(record)">{{ text }}</a>
 <!--            <a slot="title" slot-scope="text, record" @click="titleClick(record)">{{ text }}</a>-->
             <template slot="action" slot-scope="text, record">
-              <a-popconfirm
-                v-if="tableData.length"
-                title="确定取消收藏?"
-                @confirm="() => onCancel(record)"
-              >
-                <a class="action-delete" href="javascript:;">取消收藏</a>
-              </a-popconfirm>
+                <a class="action-delete" href="javascript:;" @click="onCancel(record)">取消收藏</a>
             </template>
           </a-table>
           <div class="page" v-if="tableData.length > 0">
@@ -59,6 +56,7 @@
               :show-total="total => `共 ${total} 条`"
               show-quick-jumper
               show-size-changer
+              :current="queryParams.pageNo"
               :page-size.sync="queryParams.pageSize"
               :total="total"
               @change="onChangePage"
@@ -71,6 +69,7 @@
 </template>
 <script>
   import { getAction, postAction, deleteAction, putAction } from '@/api/manage'
+  import eventBUs from '../../../common/event'
   // import search from '@/components/search'
   export default {
     name:'collection',
@@ -122,6 +121,8 @@
           }
         ],
         tableData:[],  //列表数据
+        selecIds:'',
+        loading:false
       }
     },
     mounted() {
@@ -133,9 +134,11 @@
         let params={
           ...this.queryParams
         }
+        this.loading=true
         getAction(`collection/onlCgformCollection/page`,params).then(res=>{
           if(res.success){
-            this.tableData= { ...res.result.records }
+            this.tableData= [ ...res.result.records ]
+            this.loading=false
           }
         })
       },//搜索
@@ -144,11 +147,52 @@
       },
       //批量取消收藏
       handleBatCancel(){
-
+        let params={
+          ids:this.selecIds
+        }
+        if(this.selecIds){
+          this.$confirm({
+            title: '确认批量取消收藏?',
+            content: '',
+            onOk:
+              async () => {
+                deleteAction(`collection/onlCgformCollection/deleteBatch`,params).then(res=> {
+                  if(res.success){
+                    this.$message.success(res.message)
+                    this.selectedRowKeys = []
+                    this.loadData()
+                  }else{
+                    this.$message.warning(res.message)
+                  }
+                })
+              },
+            onCancel() {},
+          });
+        }else{
+          this.$message.warning('请选择至少一条数据')
+        }
       },
       //取消收藏
       onCancel(record){
-
+        let params={
+          id:record.id
+        }
+        this.$confirm({
+          title: '确认取消收藏?',
+          content: '',
+          onOk:
+            async () => {
+              deleteAction(`collection/onlCgformCollection/delete`,params).then(res=> {
+                if(res.success){
+                  this.$message.success(res.message)
+                  this.loadData()
+                }else{
+                  this.$message.warning(res.message)
+                }
+              })
+            },
+          onCancel() {},
+        });
       },
       //清空
       searchReset(){
@@ -170,8 +214,15 @@
       },
       //选择框
       onSelectChange(selectedRowKeys,rows) {
-        console.log('selectedRowKeys changed: ', selectedRowKeys);
-        this.selectedRowKeys = selectedRowKeys;
+        this.selectedRowKeys = selectedRowKeys
+        let ids=[]
+        if(rows && rows.length>0){
+          rows.forEach(item=>{
+            ids.push(item.id)
+          })
+        }
+        this.selecIds=ids.join(',')
+        // console.log('selectedRowKeys changed: ', ids);
       },
       //点击编号
       numberClick(records){
@@ -186,7 +237,17 @@
   }
 </script>
 <style lang="less" scoped>
-
+  @import '~@assets/less/common.less';
+  .collection{
+    .collection-search-wrapper{
+      margin-bottom: 20px;
+    }
+    .colloction-table{
+      .page{
+        margin-top: 20px;
+      }
+    }
+  }
 </style>
 <style lang="less">
   .collection{