renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 更换radio，radiogroup

Browse Source
This commit is contained in:
rd
2025-09-03 16:42:05 +08:00
parent a29580ff1e
commit 1a6fad8bd5
20 changed files with 76 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/styles/components/modal.scss
View File

@ -1,9 +1,9 @@
.arco-modal { .ant-modal {
.arco-modal-header { .ant-modal-header {
border-bottom: 1px solid var(--Border-1, #d7d7d9); border-bottom: 1px solid var(--Border-1, #d7d7d9);
height: 56px; height: 56px;
padding: 0 20px; padding: 0 20px;
.arco-modal-title { .ant-modal-title {
font-family: $font-family-medium; font-family: $font-family-medium;
color: #211f24; color: #211f24;
font-size: 16px; font-size: 16px;
@ -13,11 +13,11 @@
} }
} }
.arco-modal-body { .ant-modal-body {
padding: 24px 20px; padding: 24px 20px;
} }
.arco-modal-footer { .ant-modal-footer {
display: flex; display: flex;
height: 64px; height: 64px;
padding: 0px 20px; padding: 0px 20px;

2
src/views/components/dataEngine/hotCloud.vue
View File

@ -170,7 +170,7 @@ const processTagData = (apiData) => {
color: #6d4cfe !important; color: #6d4cfe !important;
border-color: #6d4cfe !important; border-color: #6d4cfe !important;
} }
:deep(.arco-modal-body) { :deep(.ant-modal-body) {
padding: 0px; padding: 0px;
} }

4
src/views/components/dataEngine/hotTranslation.vue
View File

@ -325,7 +325,7 @@ const handleOk = () => {
color: #6d4cfe !important; color: #6d4cfe !important;
border-color: #6d4cfe !important; border-color: #6d4cfe !important;
} }
:deep(.arco-modal-body) { :deep(.ant-modal-body) {
padding: 0px; padding: 0px;
} }
@ -379,7 +379,7 @@ const handleOk = () => {
} }
} }
.arco-modal-body { .ant-modal-body {
padding: 12px 20px 0; padding: 12px 20px 0;
.cts { .cts {
color: var(--Text-2, #3c4043); color: var(--Text-2, #3c4043);

2
src/views/components/dataEngine/keyWord.vue
View File

@ -692,7 +692,7 @@ onMounted(() => {
} }
} }
.arco-modal-body { .ant-modal-body {
padding: 12px 20px 0; padding: 12px 20px 0;
.cts { .cts {
color: var(--Text-2, #3c4043); color: var(--Text-2, #3c4043);

2
src/views/components/dataEngine/topHeader.vue
View File

@ -185,7 +185,7 @@ const handleReset = () => {
color: #6d4cfe !important; color: #6d4cfe !important;
border-color: #6d4cfe !important; border-color: #6d4cfe !important;
} }
:deep(.arco-modal-body) { :deep(.ant-modal-body) {
padding: 0px; padding: 0px;
} }
.reset-btn { .reset-btn {

8
src/views/components/dataEngine/userPainPoints.vue
View File

@ -288,16 +288,16 @@ const search = () => {
</style> </style>
<style lang="scss"> <style lang="scss">
.user-pain-points-modal { .user-pain-points-modal {
.arco-modal-header { .ant-modal-header {
border-bottom: none; border-bottom: none;
height: 56px; height: 56px;
padding: 0 20px; padding: 0 20px;
.arco-modal-title { .ant-modal-title {
justify-content: flex-start; justify-content: flex-start;
} }
} }
.arco-modal-body { .ant-modal-body {
padding: 12px 20px 0; padding: 12px 20px 0;
.cts { .cts {
color: var(--Text-2, #3c4043); color: var(--Text-2, #3c4043);
@ -313,7 +313,7 @@ const search = () => {
} }
} }
.arco-modal-footer { .ant-modal-footer {
display: flex; display: flex;
height: 64px; height: 64px;
padding: 0px 20px; padding: 0px 20px;

8
src/views/material-center/components/finished-products/manuscript/components/upload-manuscript-modal/index.vue
View File

@ -1,6 +1,6 @@
<script lang="jsx"> <script lang="jsx">
import { Modal, Button, Form, FormItem } from 'ant-design-vue'; import { Modal, Button, Form, FormItem, RadioGroup, Radio } from 'ant-design-vue';
import { Input, RadioGroup, Radio, Upload, Message as AMessage, Textarea } from '@arco-design/web-vue'; import { Input, Upload, Message as AMessage, Textarea } from '@arco-design/web-vue';
import { useClipboard } from '@vueuse/core'; import { useClipboard } from '@vueuse/core';
import { getWriterLinksGenerate, getTemplateUrl, postWorksByLink, postWorksByFile } from '@/api/all/generationWorkshop'; import { getWriterLinksGenerate, getTemplateUrl, postWorksByLink, postWorksByFile } from '@/api/all/generationWorkshop';
import { generateFullUrl } from '@/utils/tools'; import { generateFullUrl } from '@/utils/tools';
@ -366,7 +366,7 @@ export default {
destroyOnClose destroyOnClose
centered centered
onCancel={onClose} onCancel={onClose}
footer={(isDefault.value && isLocal.value) ? null : renderFooterButtons()} footer={isDefault.value && isLocal.value ? null : renderFooterButtons()}
> >
<Form <Form
ref={formRef} ref={formRef}
@ -379,7 +379,7 @@ export default {
> >
{isDefault.value && ( {isDefault.value && (
<FormItem label="上传方式"> <FormItem label="上传方式">
<RadioGroup v-model={uploadType.value} onChange={onUploadTypeChange}> <RadioGroup v-model:value={uploadType.value} onChange={onUploadTypeChange}>
<Radio value={UPLOAD_TYPE.LINK}>链接上传</Radio> <Radio value={UPLOAD_TYPE.LINK}>链接上传</Radio>
<Radio value={UPLOAD_TYPE.LOCAL}>本地上传</Radio> <Radio value={UPLOAD_TYPE.LOCAL}>本地上传</Radio>
<Radio value={UPLOAD_TYPE.HANDWRITE}>写手上传</Radio> <Radio value={UPLOAD_TYPE.HANDWRITE}>写手上传</Radio>

8
src/views/property-marketing/component.scss
View File

@ -1,11 +1,11 @@
.arco-modal { .ant-modal {
.arco-modal-body { .ant-modal-body {
.arco-form-item { .ant-form-item {
margin-bottom: 16px; margin-bottom: 16px;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.arco-form-item-label { .ant-form-item-label {
color: var(--Text-1, #211f24); color: var(--Text-1, #211f24);
font-family: $font-family-regular; font-family: $font-family-regular;
font-size: 14px; font-size: 14px;

48
src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue
View File

@ -4,19 +4,8 @@
--> -->
<script lang="jsx"> <script lang="jsx">
import { ref, computed } from 'vue'; import { ref, computed } from 'vue';
import { Button, Modal } from 'ant-design-vue'; import { Button, Modal, Form, FormItem, RadioGroup, Radio } from 'ant-design-vue';
import { import { Input, Upload, Switch, Tooltip, Message as AMessage, Textarea } from '@arco-design/web-vue';
Form,
FormItem,
Input,
RadioGroup,
Radio,
Upload,
Switch,
Tooltip,
Message as AMessage,
Textarea,
} from '@arco-design/web-vue';
import AuthorizedAccountModal from '../authorized-account-modal'; import AuthorizedAccountModal from '../authorized-account-modal';
// import ImportPromptModal from '../import-prompt-modal'; // import ImportPromptModal from '../import-prompt-modal';
import StatusBox from '@/views/property-marketing/media-account/components/status-select/status-box.tsx'; import StatusBox from '@/views/property-marketing/media-account/components/status-select/status-box.tsx';
@ -242,14 +231,12 @@ export default {
handleBatchImport(); handleBatchImport();
return; return;
} }
formRef.value.validate(async (errors) => { formRef.value.validate().then(async () => {
if (!errors) {
if (isCustomCookie.value && !form.value.cookie) { if (isCustomCookie.value && !form.value.cookie) {
AMessage.warning('请填写Cookie值'); AMessage.warning('请填写Cookie值');
return; return;
} }
isEdit.value ? handleEditAccount() : handleAddAccount(); isEdit.value ? handleEditAccount() : handleAddAccount();
}
}); });
} }
const startAuthorized = (id, platform) => { const startAuthorized = (id, platform) => {
@ -285,10 +272,17 @@ export default {
onCancel={onClose} onCancel={onClose}
footer={null} footer={null}
> >
<Form ref={formRef} model={form.value} rules={rules} layout="horizontal" auto-label-width> <Form
ref={formRef}
model={form.value}
rules={rules}
layout="horizontal"
labelCol={{ span: 5 }}
wrapperCol={{ span: 19 }}
>
{!isEdit.value && ( {!isEdit.value && (
<FormItem label="上传方式" required> <FormItem label="上传方式" required>
<RadioGroup v-model={uploadType.value}> <RadioGroup v-model:value={uploadType.value}>
<Radio value="manual">手动添加账号</Radio> <Radio value="manual">手动添加账号</Radio>
<Radio value="batch">批量导入账号</Radio> <Radio value="batch">批量导入账号</Radio>
</RadioGroup> </RadioGroup>
@ -345,34 +339,34 @@ export default {
<> <>
{isEdit.value && ( {isEdit.value && (
<> <>
<FormItem label="账号名称" field="name"> <FormItem label="账号名称" name="name">
<Input v-model={form.value.name} placeholder="请输入..." size="large" disabled /> <Input v-model={form.value.name} placeholder="请输入..." size="large" disabled />
</FormItem> </FormItem>
<FormItem label="账号ID" field="account_id"> <FormItem label="账号ID" name="account_id">
<Input v-model={form.value.account_id} placeholder="请输入..." size="large" disabled /> <Input v-model={form.value.account_id} placeholder="请输入..." size="large" disabled />
</FormItem> </FormItem>
<FormItem label="状态" field="status"> <FormItem label="状态" name="status">
<StatusBox item={form.value} /> <StatusBox item={form.value} />
</FormItem> </FormItem>
</> </>
)} )}
<FormItem label="手机号码" field="mobile" required> <FormItem label="手机号码" name="mobile" required>
<Input v-model={form.value.mobile} placeholder="请输入..." size="large" /> <Input v-model={form.value.mobile} placeholder="请输入..." size="large" />
</FormItem> </FormItem>
<FormItem label="运营人员" field="operator_name" required> <FormItem label="运营人员" name="operator_name" required>
<Input v-model={form.value.operator_name} placeholder="请输入..." class="w-240px" size="large" /> <Input v-model={form.value.operator_name} placeholder="请输入..." class="w-240px" size="large" />
</FormItem> </FormItem>
<FormItem label="运营平台" required={!isEdit.value}> <FormItem label="运营平台" required={!isEdit.value}>
{isEdit.value ? ( {isEdit.value ? (
<img src={form.value.platform === 0 ? icon3 : icon4} width="24" height="24" /> <img src={form.value.platform === 0 ? icon3 : icon4} width="24" height="24" />
) : ( ) : (
<RadioGroup v-model={form.value.platform}> <RadioGroup v-model:value={form.value.platform}>
<Radio value={1}>小红书</Radio> <Radio value={1}>小红书</Radio>
<Radio value={0}>抖音</Radio> <Radio value={0}>抖音</Radio>
</RadioGroup> </RadioGroup>
)} )}
</FormItem> </FormItem>
<FormItem label="号码持有人" field="holder_name"> <FormItem label="号码持有人" name="holder_name">
<Input v-model={form.value.holder_name} placeholder="请输入..." class="w-240px" size="large" /> <Input v-model={form.value.holder_name} placeholder="请输入..." class="w-240px" size="large" />
</FormItem> </FormItem>
<FormItem label="所属项目"> <FormItem label="所属项目">
@ -403,7 +397,7 @@ export default {
</FormItem> </FormItem>
<FormItem <FormItem
label="笔记链接" label="笔记链接"
field="end_work_link" name="end_work_link"
v-slots={{ v-slots={{
label: () => label: () =>
renderLabel('笔记链接', '平台将从该笔记“之后”的内容开始同步，该笔记及更早的数据均不采集'), renderLabel('笔记链接', '平台将从该笔记“之后”的内容开始同步，该笔记及更早的数据均不采集'),
@ -425,7 +419,7 @@ export default {
<Switch v-model={isCustomCookie.value} size="large" /> <Switch v-model={isCustomCookie.value} size="large" />
</FormItem> </FormItem>
{isCustomCookie.value && ( {isCustomCookie.value && (
<FormItem label="" field="cookie"> <FormItem label="" name="cookie">
<Textarea <Textarea
v-model={form.value.cookie} v-model={form.value.cookie}
placeholder="请输入..." placeholder="请输入..."

2
src/views/property-marketing/media-account/account-manage/components/add-account-modal/style.scss
View File

@ -4,7 +4,7 @@
.w-240px { .w-240px {
width: 240px !important; width: 240px !important;
} }
.arco-modal-body { .ant-modal-body {
.upload-block { .upload-block {
width: 100%; width: 100%;
.dt { .dt {

12
src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue
View File

@ -16,17 +16,17 @@
</div> </div>
<Form ref="formRef" :model="form" layout="horizontal" auto-label-width> <Form ref="formRef" :model="form" layout="horizontal" auto-label-width>
<FormItem label="编辑方式" required> <FormItem label="编辑方式" required>
<a-radio-group v-model="editType"> <RadioGroup v-model:value="editType">
<a-radio value="all"> <Radio value="all">
<div class="flex items-center"> <div class="flex items-center">
<span>统一编辑</span> <span>统一编辑</span>
<a-tooltip content="原标签将被清除，统一为新标签。"> <a-tooltip content="原标签将被清除，统一为新标签。">
<img :src="icon1" alt="icon" class="ml-2px" width="14" height="14" /> <img :src="icon1" alt="icon" class="ml-2px" width="14" height="14" />
</a-tooltip> </a-tooltip>
</div> </div>
</a-radio> </Radio>
<a-radio value="each">分别编辑</a-radio> <Radio value="each">分别编辑</Radio>
</a-radio-group> </RadioGroup>
</FormItem> </FormItem>
<FormItem label="选择标签" required> <FormItem label="选择标签" required>
<template v-if="editType === 'all'"> <template v-if="editType === 'all'">
@ -85,7 +85,7 @@
<script setup> <script setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import { Button, Modal, Form, FormItem } from 'ant-design-vue'; import { Button, Modal, Form, FormItem, RadioGroup, Radio } from 'ant-design-vue';
import { fetchAccountTags, batchPutTag } from '@/api/all/propertyMarketing'; import { fetchAccountTags, batchPutTag } from '@/api/all/propertyMarketing';
import icon1 from '@/assets/img/icon-question.png'; import icon1 from '@/assets/img/icon-question.png';

2
src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/style.scss
View File

@ -2,7 +2,7 @@
.batch-tag-modal { .batch-tag-modal {
border-radius: 8px; border-radius: 8px;
.arco-modal-body { .ant-modal-body {
// min-height: 200px; // min-height: 200px;
.t1 { .t1 {
color: var(--Text-3, #737478); color: var(--Text-3, #737478);

6
src/views/property-marketing/media-account/account-manage/components/group-manage-modal/style.scss
View File

@ -2,9 +2,9 @@
.account-manage-modal { .account-manage-modal {
border-radius: 8px; border-radius: 8px;
.arco-modal-body { .ant-modal-body {
.arco-btn { .ant-btn {
.arco-btn-icon { .ant-btn-icon {
line-height: 16px; line-height: 16px;
} }
} }

2
src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/style.scss
View File

@ -1,7 +1,7 @@
@import "@/views/property-marketing/component.scss"; @import "@/views/property-marketing/component.scss";
.import-prompt-modal { .import-prompt-modal {
border-radius: 8px; border-radius: 8px;
.arco-modal-body { .ant-modal-body {
.tip { .tip {
color: var(--Text-1, #211f24); color: var(--Text-1, #211f24);
font-family: $font-family-regular; font-family: $font-family-regular;

2
src/views/property-marketing/media-account/account-manage/components/sync-data-modal/style.scss
View File

@ -1,7 +1,7 @@
@import "@/views/property-marketing/component.scss"; @import "@/views/property-marketing/component.scss";
.sync-data-modal { .sync-data-modal {
border-radius: 8px; border-radius: 8px;
.arco-modal-body { .ant-modal-body {
.tip { .tip {
color: var(--Text-1, #211f24); color: var(--Text-1, #211f24);
font-family: $font-family-regular; font-family: $font-family-regular;

6
src/views/property-marketing/put-account/account-data/components/group-manage-modal/style.scss
View File

@ -2,9 +2,9 @@
.account-manage-modal { .account-manage-modal {
border-radius: 8px; border-radius: 8px;
.arco-modal-body { .ant-modal-body {
.arco-btn { .ant-btn {
.arco-btn-icon { .ant-btn-icon {
line-height: 16px; line-height: 16px;
} }
} }

18
src/views/property-marketing/put-account/account-manage/components/add-account-modal/index.vue
View File

@ -23,10 +23,10 @@
:wrapperCol="{ span: 19 }" :wrapperCol="{ span: 19 }"
> >
<FormItem v-if="!isEdit" label="上传方式" required> <FormItem v-if="!isEdit" label="上传方式" required>
<a-radio-group v-model="uploadType"> <RadioGroup v-model:value="uploadType">
<a-radio value="manual">手动添加账户</a-radio> <Radio value="manual">手动添加账户</Radio>
<a-radio value="batch">批量导入账户</a-radio> <Radio value="batch">批量导入账户</Radio>
</a-radio-group> </RadioGroup>
</FormItem> </FormItem>
<!-- 批量导入账户模式下的内容 --> <!-- 批量导入账户模式下的内容 -->
@ -111,14 +111,14 @@
<img :src="PLATFORM_LIST[form.platform].icon" width="14" height="14" class="mr-4px" /> <img :src="PLATFORM_LIST[form.platform].icon" width="14" height="14" class="mr-4px" />
<span>{{ PLATFORM_LIST[form.platform].label }}</span> <span>{{ PLATFORM_LIST[form.platform].label }}</span>
</div> </div>
<a-radio-group v-else v-model="form.platform"> <RadioGroup v-else v-model:value="form.platform">
<a-radio v-for="item in PLATFORM_LIST" :key="item.value" :value="item.value"> <Radio v-for="item in PLATFORM_LIST" :key="item.value" :value="item.value">
<div class="flex items-center"> <div class="flex items-center">
<img :src="item.icon" width="14" height="14" class="mr-4px" /> <img :src="item.icon" width="14" height="14" class="mr-4px" />
<span>{{ item.label }}</span> <span>{{ item.label }}</span>
</div> </div>
</a-radio> </Radio>
</a-radio-group> </RadioGroup>
</FormItem> </FormItem>
<FormItem label="所属项目" name="project_ids"> <FormItem label="所属项目" name="project_ids">
<CommonSelect v-model="form.project_ids" :options="projects" placeholder="请选择…" size="large" /> <CommonSelect v-model="form.project_ids" :options="projects" placeholder="请选择…" size="large" />
@ -155,7 +155,7 @@
</template> </template>
<script setup> <script setup>
import { Modal, Form, FormItem, Button, Input } from 'ant-design-vue'; import { Modal, Form, FormItem, Button, Input, RadioGroup, Radio } from 'ant-design-vue';
import { ref, defineEmits } from 'vue'; import { ref, defineEmits } from 'vue';
import AuthorizedAccountModal from '../authorized-account-modal'; import AuthorizedAccountModal from '../authorized-account-modal';

14
src/views/property-marketing/put-account/account-manage/components/authorized-account-modal/index.vue
View File

@ -13,20 +13,6 @@
centered centered
@cancel="close" @cancel="close"
> >
<!-- <div v-if="showSyncTip">
<div class="flex items-center mb-20px">
<img :src="icon1" width="16" height="16" class="mr-16px" />
<p class="s2">
检测到该账户最后更新日期为{{ exactFormatTime(lastSyncedAt, 'MM月DD日HH:mm', 'YYYY年MM月DD日 HH:mm') }}，已有{{
getDaysDiffText(lastSyncedAt)
}}未同步最新数据。
</p>
</div>
<a-radio-group v-model="syncType" class="ml-32px">
<a-radio value="sync" class="mb-16px">立即同步遗漏数据 - 获取完整的最新数据 （推荐）</a-radio>
<a-radio value="no_sync">仅授权不更新 - 继续使用当前不完全的数据</a-radio>
</a-radio-group>
</div> -->
<div class="flex flex-col items-center"> <div class="flex flex-col items-center">
<template v-if="isLoading"> <template v-if="isLoading">
<a-progress <a-progress

2
src/views/property-marketing/put-account/account-manage/components/import-prompt-modal/style.scss
View File

@ -1,7 +1,7 @@
@import "@/views/property-marketing/component.scss"; @import "@/views/property-marketing/component.scss";
.import-prompt-modal { .import-prompt-modal {
border-radius: 8px; border-radius: 8px;
.arco-modal-body { .ant-modal-body {
.tip { .tip {
color: var(--Text-1, #211f24); color: var(--Text-1, #211f24);
font-family: $font-family-medium; font-family: $font-family-medium;

6
src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/style.scss
View File

@ -7,9 +7,9 @@
font-weight: 400; font-weight: 400;
line-height: 22px; line-height: 22px;
} }
.arco-modal-header { .ant-modal-header {
} }
.arco-modal-body { .ant-modal-body {
height: 536px; height: 536px;
overflow: hidden; overflow: hidden;
display: flex; display: flex;
@ -33,7 +33,7 @@
} }
} }
.arco-modal-footer { .ant-modal-footer {
justify-content: space-between; justify-content: space-between;
.s1 { .s1 {
font-family: $font-family-regular; font-family: $font-family-regular;