MrShi
12 小时以前 62b483cc627b0a5f7d626d6b333a3ef7c7c1f4f4
mini-program/pages/my-collection/my-collection.vue
@@ -5,7 +5,7 @@
            <text>{{item.name}}</text>
            <view class="cate-item-x" v-if="type === item.id"></view>
         </view>
         <view class="cate-item" style="flex: 0.7; justify-content: flex-end; padding-right: 30rpx; box-sizing: border-box;" @click="edit = !edit">
         <view class="cate-item" style="flex: 0.7; justify-content: flex-end; padding-right: 30rpx; box-sizing: border-box;" @click="guanli">
            <image src="/static/icon/ic_guanli@2x.png" mode="widthFix" v-show="!edit"></image>
            <image src="/static/icon/ic_guanli_sel@2x.png" mode="widthFix" v-show="edit"></image>
            <text class="wz" :style="{ color: edit ? '#004096' : '' }">管理</text>
@@ -13,8 +13,9 @@
      </view>
      <view class="list1" v-if="type === '1'">
         <view class="list-item" v-for="(item, index) in list" :key="index">
            <view class="left" v-if="edit">
               <image src="/static/icon/ic_agree@2x.png" mode="widthFix"></image>
            <view class="left" v-if="edit" @click="select(index)">
               <image src="/static/icon/ic_agree@2x.png" mode="widthFix" v-if="!item.active"></image>
               <image src="/static/icon/cart_ic_sel@2x.png" mode="widthFix" v-else></image>
            </view>
            <view class="right">
               <view class="list-item-image">
@@ -33,12 +34,13 @@
      <view class="list" v-else>
         <view class="list-item" v-for="(item, index) in list" :key="index">
            <view class="info">
               <view class="check" v-if="edit">
                  <image src="/static/icon/ic_agree@2x.png" mode="widthFix"></image>
               <view class="check" v-if="edit" @click="select(index)">
                  <image src="/static/icon/ic_agree@2x.png" mode="widthFix" v-if="!item.active"></image>
                  <image src="/static/icon/cart_ic_sel@2x.png" mode="widthFix" v-else></image>
               </view>
               <view class="info-right">
                  <view class="info-title">{{item.name}}</view>
                  <view class="info-desc">{{item.remark}}</view>
                  <view class="info-desc">{{item.content}}</view>
                  <view class="info-data">
                     <view class="tips">{{item.labelName}}</view>
                     <text>{{item.readNum}} 阅读|{{item.createDate}}</text>
@@ -54,22 +56,47 @@
         <view style="width: 100%; height: calc(100rpx + env(safe-area-inset-bottom));"></view>
         <view class="footer">
            <view class="caozuo">
               <view class="caozuo-left">
                  <image src="/static/icon/ic_agree@2x.png" mode="widthFix"></image>
               <view class="caozuo-left" @click="quanxuan">
                  <image src="/static/icon/ic_agree@2x.png" mode="widthFix" v-if="!selectAll"></image>
                  <image src="/static/icon/cart_ic_sel@2x.png" mode="widthFix" v-else></image>
                  <text>全选</text>
               </view>
               <view class="caozuo-btn">删除(0)</view>
               <view class="caozuo-btn" @click="shanchu">删除({{totalNum}})</view>
            </view>
            <view style="width: 100%; height: env(safe-area-inset-bottom);"></view>
         </view>
      </template>
      <u-modal :show="show" :showCancelButton="true" @confirm="dele" @cancel="show = false">
         确认删除吗?
      </u-modal>
   </view>
</template>
<script>
   export default {
      computed: {
         totalNum() {
            let total = 0
            this.list.forEach((item) => {
               if (item.active) {
                  total++
               }
            })
            return total;
         },
         selectAll() {
            let isSelectAll = true
            this.list.forEach((item) => {
               if (!item.active) {
                  isSelectAll = false
               }
            })
            return isSelectAll;
         }
      },
      data() {
         return {
            show: false,
            edit: false,
            type: '1',
            page: 1,
@@ -89,8 +116,48 @@
         this.getList()
      },
      methods: {
         shanchu() {
            if (this.totalNum > 0) {
               this.show = true
            } else {
               uni.showToast({
                  title: '至少选择一项内容',
                  icon: 'none'
               })
            }
         },
         dele() {
            this.$u.api.cancelbatch({
               ids: this.list.filter(item => item.active).map(item => item.id).join(',')
            }).then(res => {
               if (res.code === 200) {
                  this.show = false
                  this.edit = false
                  this.page = 1
                  this.list = []
                  this.next = true
                  this.getList()
                  this.getNum()
               }
            })
         },
         quanxuan() {
            this.list.forEach(item => {
               item.active = true
            })
         },
         guanli() {
            this.edit = !this.edit
            this.list.forEach(item => {
               item.active = false
            })
         },
         select(index) {
            this.list[index].active = !this.list[index].active
         },
         changeRow(id) {
            this.type = id
            this.edit = false
            this.page = 1
            this.list = []
            this.next = true
@@ -115,8 +182,10 @@
               }
            }).then(res => {
               if (res.code === 200) {
                  console.log(res)
                  this.page++
                  res.data.records.forEach(item => {
                     item.active = false
                  })
                  this.list.push(...res.data.records)
                  if (res.data.total === this.list.length) {
                     this.next = false
@@ -378,6 +447,7 @@
                           font-size: 24rpx;
                           color: #999999;
                           margin-left: 10rpx;
                           text-decoration: line-through;
                        }
                     }
                  }