yudao
/
admin-vue3
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vue3.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

REVIEW 公众号选择的下拉框 

(cherry picked from commit fd447dc7a3)
pull/173/head
YunaiV 2023-04-11 23:28:59 +08:00 committed by shizhong
parent 9b00e33ddb
commit 02b5447e12
10 changed files with 31 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.front
View File

@ -19,7 +19,7 @@ VITE_API_URL=/admin-api
VITE_BASE_PATH=/
# 项目本地运行端口号, 与.vscode/launch.json配合
VITE_PORT=5173
VITE_PORT=80
# 是否删除debugger
VITE_DROP_DEBUGGER=false

3
src/views/mp/autoReply/index.vue
View File

@ -3,7 +3,8 @@
<!-- 搜索工作栏 -->
<ContentWrap>
<WxAccountSelect @change="(accountId) => accountChanged(accountId)" />
<!-- TODO @芋艿：调整成 el-form 和 WxAccountSelect -->
<WxAccountSelect @change="accountChanged" />
</ContentWrap>
<!-- tab 切换 -->

5
src/views/mp/components/WxMpSelect.vue
View File

@ -19,13 +19,12 @@ const emit = defineEmits<{
(e: 'change', id: number | undefined): void
}>()
onMounted(async () => {
onMounted(() => {
handleQuery()
})
const handleQuery = async () => {
const data = await MpAccountApi.getSimpleAccountList()
accountList.value = data
accountList.value = await MpAccountApi.getSimpleAccountList()
// 默认选中第一个
if (accountList.value.length > 0) {
accountId.value = accountList.value[0].id

6
src/views/mp/components/wx-account-select/main.vue
View File

@ -1,6 +1,7 @@
<template>
<el-form class="-mb-15px" ref="queryFormRef" :inline="true" label-width="68px">
<el-form-item label="公众号" prop="accountId">
<!-- TODO 芋艿：需要将 el-form 和 el-select 解耦 -->
<el-select
v-model="accountId"
placeholder="请选择公众号"
@ -24,13 +25,12 @@ const queryFormRef = ref()
const emit = defineEmits(['change'])
onMounted(async () => {
onMounted(() => {
handleQuery()
})
const handleQuery = async () => {
const data = await MpAccountApi.getSimpleAccountList()
accountList.value = data
accountList.value = await MpAccountApi.getSimpleAccountList()
// 默认选中第一个
if (accountList.value.length > 0) {
accountId.value = accountList.value[0].id

3
src/views/mp/draft/index.vue
View File

@ -3,7 +3,8 @@
<!-- 搜索工作栏 -->
<ContentWrap>
<WxAccountSelect @change="(accountId) => accountChanged(accountId)">
<!-- TODO @芋艿：调整成 el-form 和 WxAccountSelect -->
<WxAccountSelect @change="accountChanged">
<template #actions>
<el-button type="primary" plain @click="handleAdd" v-hasPermi="['mp:draft:create']">
<Icon icon="ep:plus" />新增

1
src/views/mp/freePublish/index.vue
View File

@ -3,6 +3,7 @@
<!-- 搜索工作栏 -->
<ContentWrap>
<!-- TODO @芋艿：调整成 el-form 和 WxAccountSelect -->
<WxAccountSelect @change="(accountId) => accountChanged(accountId)" />
</ContentWrap>

5
src/views/mp/material/index.vue
View File

@ -3,10 +3,7 @@
<ContentWrap>
<el-form class="-mb-15px" :inline="true" label-width="68px">
<el-form-item label="公众号" prop="accountId">
<WxMpSelect @change="(accountId) => accountChange(accountId)" />
</el-form-item>
<el-form-item>
<slot name="actions"></slot>
<WxMpSelect @change="accountChange" />
</el-form-item>
</el-form>
</ContentWrap>

3
src/views/mp/menu/index.vue
View File

@ -2,7 +2,8 @@
<doc-alert title="公众号菜单" url="https://doc.iocoder.cn/mp/menu/" />
<!-- 搜索工作栏 -->
<ContentWrap>
<WxAccountSelect @change="(accountId) => accountChanged(accountId)" />
<!-- TODO @芋艿：调整成 el-form 和 WxAccountSelect -->
<WxAccountSelect @change="accountChanged" />
</ContentWrap>
<!-- 列表 -->

85
src/views/mp/tag/index.vue
View File

@ -1,45 +1,19 @@
<template>
<doc-alert title="公众号标签" url="https://doc.iocoder.cn/mp/tag/" />
<!-- 搜索工作栏 -->
<ContentWrap>
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="68px"
>
<el-form-item label="公众号" prop="accountId">
<el-select v-model="queryParams.accountId" placeholder="请选择公众号" class="!w-240px">
<el-option
v-for="item in accountList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="标签名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入标签名称"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item>
<el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
</el-form-item>
<!-- TODO @芋艿：调整成 el-form 和 WxAccountSelect -->
<WxAccountSelect @change="accountChanged">
<template #actions>
<el-button type="primary" plain @click="openForm('create')" v-hasPermi="['mp:tag:create']">
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
<el-button type="success" plain @click="handleSync" v-hasPermi="['mp:tag:sync']">
<Icon icon="ep:refresh" class="mr-5px" /> 同步
</el-button>
</el-form-item>
</el-form>
</template>
</WxAccountSelect>
</ContentWrap>
<!-- 列表 -->
@ -90,8 +64,8 @@
</template>
<script setup lang="ts" name="MpTag">
import { dateFormatter } from '@/utils/formatTime'
import WxAccountSelect from '@/views/mp/components/wx-account-select/main.vue'
import * as MpTagApi from '@/api/mp/tag'
import * as MpAccountApi from '@/api/mp/account'
import TagForm from './TagForm.vue'
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
@ -102,19 +76,18 @@ const list = ref([]) // 列表的数据
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
accountId: undefined,
name: null
accountId: undefined
})
const queryFormRef = ref() // 搜索的表单
const accountList = ref<MpAccountApi.AccountVO[]>([]) // 公众号账号列表
/** 侦听公众号变化 **/
const accountChanged = (accountId) => {
queryParams.pageNo = 1
queryParams.accountId = accountId
getList()
}
/** 查询列表 */
const getList = async () => {
// 如果没有选中公众号账号，则进行提示。
if (!queryParams.accountId) {
await message.error('未选中公众号，无法查询标签')
return
}
try {
loading.value = true
const data = await MpTagApi.getTagPage(queryParams)
@ -125,22 +98,6 @@ const getList = async () => {
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
// 默认选中第一个
if (accountList.value.length > 0) {
queryParams.accountId = accountList.value[0].id
}
handleQuery()
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
@ -170,14 +127,4 @@ const handleSync = async () => {
await getList()
} catch {}
}
/** 初始化 **/
onMounted(async () => {
accountList.value = await MpAccountApi.getSimpleAccountList()
// 选中第一个
if (accountList.value.length > 0) {
queryParams.accountId = accountList.value[0].id
}
await getList()
})
</script>

1
src/views/mp/user/index.vue
View File

@ -3,6 +3,7 @@
<!-- 搜索工作栏 -->
<ContentWrap>
<!-- TODO @芋艿：调整成 el-form 和 WxAccountSelect -->
<WxAccountSelect @change="(accountId) => accountChanged(accountId)">
<template #actions>
<el-button type="success" plain @click="handleSync" v-hasPermi="['mp:user:sync']">