更新号池编辑环境

2026-04-15 23:19:40 +08:00
parent aabf7e56d4
commit 19828ea396
10 changed files with 618 additions and 148 deletions
@@ -0,0 +1,109 @@
+<script setup>
+import { computed, ref, watch } from 'vue';
+
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false,
+  },
+  row: {
+    type: Object,
+    default: null,
+  },
+  saveLoading: {
+    type: Boolean,
+    default: false,
+  },
+});
+
+const emit = defineEmits(['update:modelValue', 'save-remark']);
+const remarkText = ref('');
+
+function typeText(type) {
+  if (type === 'account') return '账号密码';
+  if (type === 'account_tk') return '账号密码+Token';
+  return 'Token';
+}
+
+const PLATFORM_MAP = {
+  local: { label: '本地', type: 'info' },
+  xianyu: { label: '闲鱼', type: 'warning' },
+  pinduoduo: { label: '拼多多', type: 'danger' },
+  jingdong: { label: '京东', type: 'primary' },
+  douyin: { label: '抖音', type: 'success' },
+};
+
+const platformLabel = computed(() => {
+  if (!props.row?.extractedPlatform) return '-';
+  return PLATFORM_MAP[props.row.extractedPlatform]?.label || props.row.extractedPlatform;
+});
+
+const platformType = computed(() => {
+  if (!props.row?.extractedPlatform) return 'info';
+  return PLATFORM_MAP[props.row.extractedPlatform]?.type || 'info';
+});
+
+watch(
+  () => props.row,
+  (row) => {
+    remarkText.value = row?.remark || '';
+  },
+  { immediate: true }
+);
+
+function onSaveRemark() {
+  if (!props.row?.id) return;
+  emit('save-remark', { id: props.row.id, remark: remarkText.value || '' });
+}
+</script>
+
+<template>
+  <el-dialog
+    :model-value="modelValue"
+    title="账号详情"
+    width="560px"
+    @update:model-value="(v) => emit('update:modelValue', v)"
+  >
+    <el-descriptions :column="1" border v-if="row">
+      <el-descriptions-item label="ID">{{ row.id }}</el-descriptions-item>
+      <el-descriptions-item label="账号类型">{{ typeText(row.type) }}</el-descriptions-item>
+      <el-descriptions-item label="账号">{{ row.account || '-' }}</el-descriptions-item>
+      <el-descriptions-item label="密码">{{ row.password || '-' }}</el-descriptions-item>
+      <el-descriptions-item label="Token">
+        <span class="token-text">{{ row.token || '-' }}</span>
+      </el-descriptions-item>
+      <el-descriptions-item label="提取状态">
+        {{ row.extracted ? '已提取' : '未提取' }}
+      </el-descriptions-item>
+      <el-descriptions-item label="提取时间">{{ row.extractedAt || '-' }}</el-descriptions-item>
+      <el-descriptions-item label="提取平台">
+        <el-tag v-if="row.extractedPlatform" :type="platformType" size="small">
+          {{ platformLabel }}
+        </el-tag>
+        <span v-else>-</span>
+      </el-descriptions-item>
+      <el-descriptions-item label="备注">
+        <div class="remark-edit-wrap">
+          <el-input v-model="remarkText" type="textarea" :rows="3" placeholder="请输入备注" />
+          <el-button type="primary" size="small" :loading="saveLoading" @click="onSaveRemark">
+            保存备注
+          </el-button>
+        </div>
+      </el-descriptions-item>
+    </el-descriptions>
+  </el-dialog>
+</template>
+
+<style scoped>
+.token-text {
+  word-break: break-all;
+  white-space: pre-wrap;
+  line-height: 1.6;
+}
+
+.remark-edit-wrap {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+</style>
@@ -0,0 +1,80 @@
+<script setup>
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false,
+  },
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  type: {
+    type: String,
+    default: 'account',
+  },
+  platform: {
+    type: String,
+    default: 'local',
+  },
+  remark: {
+    type: String,
+    default: '',
+  },
+  platformMap: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+
+const emit = defineEmits(['update:modelValue', 'update:platform', 'update:remark', 'confirm']);
+
+function typeText(type) {
+  if (type === 'account') return '账号密码';
+  if (type === 'account_tk') return '账号密码+Token';
+  return 'Token';
+}
+</script>
+
+<template>
+  <el-dialog
+    :model-value="modelValue"
+    title="提取账号"
+    width="420px"
+    @update:model-value="(v) => emit('update:modelValue', v)"
+  >
+    <el-form label-width="84px">
+      <el-form-item label="提取类型">
+        <el-input :model-value="typeText(type)" disabled />
+      </el-form-item>
+      <el-form-item label="提取平台">
+        <el-select
+          :model-value="platform"
+          style="width: 100%"
+          @update:model-value="(v) => emit('update:platform', v)"
+        >
+          <el-option
+            v-for="(v, k) in platformMap"
+            :key="k"
+            :value="k"
+            :label="v.label"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="备注">
+        <el-input
+          :model-value="remark"
+          type="textarea"
+          :rows="3"
+          placeholder="提取备注（可选）"
+          @update:model-value="(v) => emit('update:remark', v)"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="emit('update:modelValue', false)">取消</el-button>
+      <el-button type="primary" :loading="loading" @click="emit('confirm')">
+        确认提取
+      </el-button>
+    </template>
+  </el-dialog>
+</template>