修改完成待测试

2026-09-13 17:45:47 +08:00
parent 9ad572907b
commit bbc024f7f2
80 changed files with 3844 additions and 1672 deletions
@@ -0,0 +1,72 @@
+<template>
+  <view class="batch-management">
+    <view class="batch-management__copy">
+      <text>{{ active ? `已选择 ${selectedCount} 条` : `批量管理${resourceName}` }}</text>
+      <text>{{ active ? "仅可选择有删除权限的内容" : "可一次选择多条内容移入回收站" }}</text>
+    </view>
+    <view class="batch-management__actions">
+      <template v-if="active">
+        <AppButton compact type="secondary" :disabled="busy" :label="allSelected ? '取消全选' : '全选'" @click="$emit('toggle-all')" />
+        <AppButton compact :disabled="!selectedCount || busy" :label="busy ? '正在删除' : `删除 ${selectedCount || ''}`.trim()" @click="$emit('delete')" />
+        <AppButton compact type="secondary" :disabled="busy" label="完成" @click="$emit('finish')" />
+      </template>
+      <AppButton v-else compact type="secondary" :label="`管理${resourceName}`" @click="$emit('start')" />
+    </view>
+  </view>
+</template>
+
+<script setup>
+import AppButton from "@/components/AppButton.vue";
+
+defineProps({
+  active: { type: Boolean, default: false },
+  selectedCount: { type: Number, default: 0 },
+  allSelected: { type: Boolean, default: false },
+  busy: { type: Boolean, default: false },
+  resourceName: { type: String, required: true },
+});
+defineEmits(["start", "finish", "toggle-all", "delete"]);
+</script>
+
+<style scoped lang="scss">
+.batch-management {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 18rpx;
+  margin-bottom: 20rpx;
+  padding: 20rpx 22rpx;
+  border: 1rpx solid rgba(159, 35, 35, 0.18);
+  background: rgba(255, 252, 242, 0.92);
+}
+.batch-management__copy {
+  min-width: 0;
+  flex: 1;
+}
+.batch-management__copy text {
+  display: block;
+  color: $ink-muted;
+  font-size: clamp(12px, 20rpx, 15px);
+  line-height: 1.45;
+}
+.batch-management__copy text:first-child {
+  color: $ink;
+  font-size: clamp(14px, 23rpx, 17px);
+  font-weight: 700;
+}
+.batch-management__actions {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  gap: 10rpx;
+}
+@media (max-width: 420px) {
+  .batch-management {
+    align-items: stretch;
+    flex-direction: column;
+  }
+  .batch-management__actions {
+    justify-content: flex-start;
+  }
+}
+</style>