Merge remote-tracking branch 'origin/main' into feature/0724_新媒体账号状态重构

# Conflicts: # src/views/property-marketing/media-account/account-manage/components/account-table/index.vue # src/views/property-marketing/put-account/account-data/components/filter-block/index.vue # src/views/property-marketing/put-account/account-manage/components/account-table/index.vue # src/views/property-marketing/put-account/account-manage/components/filter-block/index.vue
2025-07-25 10:33:58 +08:00
parent a50234543b 2169df7082
commit ebbcddc407
106 changed files with 2231 additions and 537 deletions
--- a/src/views/property-marketing/media-account/account-manage/components/account-table/delete-account.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/account-table/delete-account.vue
@ -15,7 +15,7 @@
      <span>确认删除 {{ accountName }} 这个账号吗？</span>
    </div>
    <template #footer>
-      <a-button class="cancel-btn" size="large" @click="onClose">取消</a-button>
+      <a-button size="large" @click="onClose">取消</a-button>
      <a-button type="primary" class="ml-16px danger-btn" status="danger" size="large" @click="onDelete"
        >确认删除</a-button
      >
--- a/src/views/property-marketing/media-account/account-manage/components/account-table/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/account-table/index.vue
@ -46,6 +46,30 @@
          <span class="label">运营人员</span>
          <span class="cts">{{ item.operator?.name || '-' }}</span>
        </div>
+        <div class="field-row">
+          <span class="label">所属项目</span>
+          <span v-if="!item.projects.length" class="cts">-</span>
+          <div v-else class="flex items-center">
+            <a-tooltip
+              v-if="item.projects.length > 2"
+              position="bottom"
+              :content="
+                item.projects
+                  .slice(2)
+                  .map((v) => v.name)
+                  .join(',')
+              "
+            >
+              <div class="tag-box">
+                <span class="text">{{ `+${item.projects.length - 2}` }}</span>
+              </div>
+            </a-tooltip>
+
+            <div v-for="(project, index) in item.projects.slice(0, 2)" :key="index" class="tag-box">
+              <span class="text">{{ project.name }}</span>
+            </div>
+          </div>
+        </div>
        <div class="field-row">
          <span class="label">分组</span>
          <span class="cts">{{ item.group?.name || '-' }}</span>
--- a/src/views/property-marketing/media-account/account-manage/components/account-table/pause-account-patch.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/account-table/pause-account-patch.vue
@ -9,7 +9,7 @@
      <span>确认暂停同步 “{{ accountName }}” 这个账号的数据吗？</span>
    </div>
    <template #footer>
-      <a-button class="cancel-btn" size="large" @click="onClose">取消</a-button>
+      <a-button size="large" @click="onClose">取消</a-button>
      <a-button type="primary" class="ml-16px" size="large" @click="onConfirm">确定</a-button>
    </template>
  </a-modal>
--- a/src/views/property-marketing/media-account/account-manage/components/account-table/style.scss
+++ b/src/views/property-marketing/media-account/account-manage/components/account-table/style.scss
@ -1,9 +1,3 @@
-@mixin ellipsis {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
 .card-container {
  flex: 1;
  display: grid;
--- a/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue
@ -19,12 +19,11 @@ import {
  Message as AMessage,
  Textarea,
 } from '@arco-design/web-vue';
-import TagSelect from '@/views/property-marketing/media-account/components/tag-select';
-import GroupSelect from '@/views/property-marketing/media-account/components/group-select';
 import AuthorizedAccountModal from '../authorized-account-modal';
 // import ImportPromptModal from '../import-prompt-modal';
 import StatusBox from '@/views/property-marketing/media-account/components/status-select/status-box.tsx';
 import SyncDataModal from '../sync-data-modal';
+import CommonSelect from '@/components/common-select';

 // import { downloadByUrl } from '@/utils/tools';
 import { showExportNotification } from '@/utils/arcoD';
@ -37,6 +36,7 @@ import {
  putMediaAccounts,
  getTemplateUrl,
  batchMediaAccounts,
+  getProjectList,
 } from '@/api/all/propertyMarketing';

 import icon1 from '@/assets/img/media-account/icon-download.png';
@ -58,6 +58,7 @@ const INITIAL_FORM = {
  platform: 1,
  group_id: undefined,
  tag_ids: [],
+  project_ids: [],
  end_work_link: undefined,
  cookie: undefined,
 };
@ -66,6 +67,7 @@ export default {
  setup(props, { emit, expose }) {
    const groupOptions = ref([]);
    const tagOptions = ref([]);
+    const projects = ref([]);
    const visible = ref(false);
    const uploadType = ref('manual');
    const uploadStatus = ref(UploadStatus.DEFAULT);
@ -126,6 +128,12 @@ export default {
        tagOptions.value = data;
      }
    };
+    const getProjects = async () => {
+      const { code, data } = await getProjectList();
+      if (code === 200) {
+        projects.value = data;
+      }
+    };
    function handleUpload(option) {
      const { fileItem } = option;
      uploadStatus.value = UploadStatus.WAITING;
@ -141,6 +149,9 @@ export default {
    const reset = () => {
      formRef.value?.resetFields();
      formRef.value?.clearValidate();
+      groupOptions.value = [];
+      tagOptions.value = [];
+      projects.value = [];
      form.value = cloneDeep(INITIAL_FORM);
      fileName.value = '';
      file.value = null;
@ -162,6 +173,7 @@ export default {
      }
      getGroups();
      getTags();
+      getProjects();
      visible.value = true;
    };
    const getAccountDetail = async () => {
@ -364,8 +376,16 @@ export default {
              <FormItem label="号码持有人" field="holder_name">
                <Input v-model={form.value.holder_name} placeholder="请输入..." class="w-240px" size="large" />
              </FormItem>
+              <FormItem label="所属项目">
+                <CommonSelect
+                  v-model={form.value.project_ids}
+                  options={projects.value}
+                  placeholder="请选择…"
+                  size="large"
+                />
+              </FormItem>
              <FormItem label="选择分组">
-                <GroupSelect
+                <CommonSelect
                  v-model={form.value.group_id}
                  multiple={false}
                  options={groupOptions.value}
@ -373,8 +393,9 @@ export default {
                  size="large"
                />
              </FormItem>
+
              <FormItem label="选择标签">
-                <TagSelect v-model={form.value.tag_ids} options={tagOptions.value} placeholder="请选择…" size="large" />
+                <CommonSelect v-model={form.value.tag_ids} options={tagOptions.value} placeholder="请选择…" size="large" />
              </FormItem>
              <FormItem
                label="笔记链接"
@ -406,7 +427,6 @@ export default {
                    v-model={form.value.cookie}
                    placeholder="请输入..."
                    size="large"
-                    max-length={500}
                    auto-size={{ minRows: 5, maxRows: 8 }}
                  />
                </FormItem>
@ -415,7 +435,7 @@ export default {
          )}
        </Form>
        <div style="display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px;">
-          <Button size="large" class="cancel-btn" onClick={onClose}>
+          <Button size="large" onClick={onClose}>
            取消
          </Button>
          <Button type="primary" size="large" loading={importLoading.value} onClick={onSubmit}>
--- a/src/views/property-marketing/media-account/account-manage/components/authorized-account-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/authorized-account-modal/index.vue
@ -76,15 +76,10 @@
    </div>

    <template #footer>
-      <a-button v-if="modalState === MODAL_STATE.QR_READY" size="large" class="cancel-btn" @click="handleRefreshQrCode">
+      <a-button v-if="modalState === MODAL_STATE.QR_READY" size="large" @click="handleRefreshQrCode">
        重新生成
      </a-button>
-      <a-button
-        v-if="[MODAL_STATE.SUCCESS, MODAL_STATE.FAILED].includes(modalState)"
-        size="large"
-        class="cancel-btn"
-        @click="close"
-      >
+      <a-button v-if="[MODAL_STATE.SUCCESS, MODAL_STATE.FAILED].includes(modalState)" size="large" @click="close">
        取消
      </a-button>
      <a-button type="primary" size="large" @click="handleOk">
--- a/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/index.vue
@ -30,7 +30,7 @@
      <a-form-item label="选择分组" required>
        <template v-if="editType === 'all'">
          <div class="flex items-center w-100%">
-            <GroupSelect v-model="form.group_id" :options="groupOptions" :multiple="false" class="flex-1" />
+            <CommonSelect v-model="form.group_id" :options="groupOptions" :multiple="false" class="flex-1" />
          </div>
        </template>
      </a-form-item>
@ -47,7 +47,7 @@
            <a-table-column title="选择分组" data-index="group_id">
              <template #cell="{ record }">
                <div class="flex items-center w-100%">
-                  <GroupSelect v-model="record.group_id" :options="groupOptions" :multiple="false" />
+                  <CommonSelect v-model="record.group_id" :options="groupOptions" :multiple="false" />
                </div>
              </template>
            </a-table-column>
@ -56,7 +56,7 @@
      </template>
    </a-form>
    <template #footer>
-      <a-button size="large" class="mr-16px cancel-btn" @click="onClose">取消</a-button>
+      <a-button size="large" @click="onClose">取消</a-button>
      <a-button type="primary" size="large" @click="onSubmit">确定</a-button>
    </template>
  </a-modal>
@ -65,7 +65,7 @@
 <script setup>
 import { ref, reactive } from 'vue';
 import { fetchAccountGroups, batchPutGroup } from '@/api/all/propertyMarketing';
-import GroupSelect from '@/views/property-marketing/media-account/components/group-select';
+import CommonSelect from '@/components/common-select';

 import icon1 from '@/assets/img/icon-question.png';

--- a/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue
@ -76,7 +76,7 @@
      </template>
    </a-form>
    <template #footer>
-      <a-button size="large" class="mr-16px cancel-btn" @click="onClose">取消</a-button>
+      <a-button size="large" @click="onClose">取消</a-button>
      <a-button type="primary" size="large" @click="onSubmit">确定</a-button>
    </template>
  </a-modal>
--- a/src/views/property-marketing/media-account/account-manage/components/filter-block/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/filter-block/index.vue
@ -33,16 +33,20 @@
        <span class="label">平台</span>
        <a-space class="w-160px">
          <a-select v-model="query.platform" size="medium" placeholder="全部" allow-clear @change="handleSearch">
-            <a-option v-for="(item, index) in PLATFORM_LIST" :key="index" :value="item.value" :label="item.label">{{
-              item.label
-            }}</a-option>
+            <a-option
+              v-for="(item, index) in MEDIA_ACCOUNT_PLATFORMS"
+              :key="index"
+              :value="item.value"
+              :label="item.label"
+              >{{ item.label }}</a-option
+            >
          </a-select>
        </a-space>
      </div>
      <div class="filter-row-item flex items-center">
        <span class="label">运营人员</span>
        <a-space class="w-160px">
-          <OperatorSelect v-model="query.operator_id" :options="operators" @change="handleSearch" />
+          <CommonSelect v-model="query.operator_id" :multiple="false" :options="operators" @change="handleSearch" />
        </a-space>
      </div>
    </div>
@ -50,22 +54,28 @@
      <div class="filter-row-item flex items-center">
        <span class="label">分组</span>
        <a-space class="w-200px">
-          <GroupSelect v-model="query.group_ids" multiple :options="groups" @change="handleSearch" />
+          <CommonSelect v-model="query.group_ids" multiple :options="groups" @change="handleSearch" />
+        </a-space>
+      </div>
+      <div class="filter-row-item flex items-center">
+        <span class="label">所属项目</span>
+        <a-space class="w-200px">
+          <CommonSelect v-model="query.project_ids" :options="projects" @change="handleSearch" />
        </a-space>
      </div>
      <div class="filter-row-item flex items-center">
        <span class="label">标签</span>
        <a-space class="w-320px">
-          <TagSelect v-model="query.tag_ids" :options="tags" @change="handleSearch" />
+          <CommonSelect v-model="query.tag_ids" :options="tags" @change="handleSearch" />
        </a-space>
      </div>
-      <a-button class="w-84px search-btn mr-12px" size="medium" @click="handleSearch">
+      <a-button type="outline" class="w-84px mr-12px" size="medium" @click="handleSearch">
        <template #icon>
          <icon-search />
        </template>
        <template #default>搜索</template>
      </a-button>
-      <a-button class="w-84px reset-btn" size="medium" @click="handleReset">
+      <a-button class="w-84px" size="medium" @click="handleReset">
        <template #icon>
          <icon-refresh />
        </template>
@ -77,13 +87,17 @@

 <script setup>
 import { reactive, defineEmits, defineProps } from 'vue';
-import { fetchAccountTags, fetchAccountGroups, fetchAccountOperators } from '@/api/all/propertyMarketing';
-import TagSelect from '@/views/property-marketing/media-account/components/tag-select';
-import GroupSelect from '@/views/property-marketing/media-account/components/group-select';
-import OperatorSelect from '@/views/property-marketing/media-account/components/operator-select';
+import {
+  fetchAccountTags,
+  getProjectList,
+  fetchAccountGroups,
+  fetchAccountOperators,
+} from '@/api/all/propertyMarketing';
 import StatusSelect from '@/views/property-marketing/media-account/components/status-select';
+import CommonSelect from '@/components/common-select';

-import { INITIAL_QUERY, PLATFORM_LIST } from '@/views/property-marketing/media-account/account-manage/constants';
+import { INITIAL_QUERY } from '@/views/property-marketing/media-account/account-manage/constants';
+import { MEDIA_ACCOUNT_PLATFORMS } from '@/utils/platform';

 const props = defineProps({
  query: {
@ -97,6 +111,7 @@ const emits = defineEmits('onSearch', 'onReset', 'update:query');
 const tags = ref([]);
 const groups = ref([]);
 const operators = ref([]);
+const projects = ref([]);

 const handleSearch = () => {
  emits('update:query', props.query);
@ -127,11 +142,18 @@ const getOperators = async () => {
    operators.value = data;
  }
 };
+const getProjects = async () => {
+  const { code, data } = await getProjectList();
+  if (code === 200) {
+    projects.value = data;
+  }
+};

 onMounted(() => {
  getTags();
  getGroups();
  getOperators();
+  getProjects();
 });

 defineExpose({
--- a/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue
@ -16,7 +16,7 @@
      </a-form-item>
    </a-form>
    <template #footer>
-      <a-button class="cancel-btn" @click="onClose">取消</a-button>
+      <a-button @click="onClose">取消</a-button>
      <a-button type="primary" class="ml-16px" @click="onSubmit">确认</a-button>
    </template>
  </a-modal>
--- a/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue
@ -9,7 +9,7 @@
      <span>确认删除 "{{ groupName }}" 这个分组吗？</span>
    </div>
    <template #footer>
-      <a-button class="cancel-btn" size="large" @click="onClose">取消</a-button>
+      <a-button size="large" @click="onClose">取消</a-button>
      <a-button type="primary" class="ml-16px danger-btn" status="danger" size="large" @click="onDelete"
        >确认删除</a-button
      >
--- a/src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue
@ -21,7 +21,7 @@
      </div>
    </div>
    <template #footer>
-      <a-button size="large" class="cancel-btn" @click="close">取消</a-button>
+      <a-button size="large" @click="close">取消</a-button>
      <a-button type="primary" size="large" @click="handleOk"> 去授权 </a-button>
    </template>
  </a-modal>
--- a/src/views/property-marketing/media-account/account-manage/components/reauthorize-account-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/reauthorize-account-modal/index.vue
@ -92,13 +92,12 @@
    </div>

    <template #footer>
-      <a-button v-if="modalState === MODAL_STATE.QR_READY" size="large" class="cancel-btn" @click="handleRefreshQrCode">
+      <a-button v-if="modalState === MODAL_STATE.QR_READY" size="large" @click="handleRefreshQrCode">
        重新生成
      </a-button>
      <a-button
        v-if="modalState === MODAL_STATE.SUCCESS || modalState === MODAL_STATE.FAILED"
        size="large"
-        class="cancel-btn"
        @click="close"
      >
        取消
--- a/src/views/property-marketing/media-account/account-manage/components/sync-data-modal/index.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/sync-data-modal/index.vue
@ -20,7 +20,7 @@
      </div>
    </div>
    <template #footer>
-      <a-button size="large" class="cancel-btn" @click="close">稍后再说</a-button>
+      <a-button size="large" @click="close">稍后再说</a-button>
      <a-button type="primary" size="large" @click="handleOk"> 更新数据 </a-button>
    </template>
  </a-modal>
--- a/src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/add-tag.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/add-tag.vue
@ -1,7 +1,3 @@
-<!--
- * @Author: AI
- * @Date: 2025-06-27
-->
 <template>
  <a-modal
    v-model:visible="visible"
@ -16,7 +12,7 @@
      </a-form-item>
    </a-form>
    <template #footer>
-      <a-button class="cancel-btn" @click="onClose">取消</a-button>
+      <a-button @click="onClose">取消</a-button>
      <a-button type="primary" class="ml-16px" @click="onSubmit">确认</a-button>
    </template>
  </a-modal>
--- a/src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/delete-tag.vue
+++ b/src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/delete-tag.vue
@ -9,7 +9,7 @@
      <span>确认删除 "{{ tagName }}" 这个标签吗？</span>
    </div>
    <template #footer>
-      <a-button class="cancel-btn" size="large" @click="onClose">取消</a-button>
+      <a-button size="large" @click="onClose">取消</a-button>
      <a-button type="primary" class="ml-16px danger-btn" status="danger" size="large" @click="onDelete"
        >确认删除</a-button
      >