提交 | 用户 | 时间
|
820397
|
1 |
<template> |
H |
2 |
<ContentWrap> |
|
3 |
<!-- 搜索工作栏 --> |
|
4 |
<el-form |
|
5 |
class="-mb-15px" |
|
6 |
:model="queryParams" |
|
7 |
ref="queryFormRef" |
|
8 |
:inline="true" |
|
9 |
label-width="68px" |
|
10 |
> |
|
11 |
<el-form-item label="用户编号" prop="userId"> |
|
12 |
<el-select |
|
13 |
v-model="queryParams.userId" |
|
14 |
clearable |
|
15 |
placeholder="请输入用户编号" |
|
16 |
class="!w-240px" |
|
17 |
> |
|
18 |
<el-option |
|
19 |
v-for="item in userList" |
|
20 |
:key="item.id" |
|
21 |
:label="item.nickname" |
|
22 |
:value="item.id" |
|
23 |
/> |
|
24 |
</el-select> |
|
25 |
</el-form-item> |
|
26 |
<el-form-item label="写作类型" prop="type"> |
|
27 |
<el-select |
|
28 |
v-model="queryParams.type" |
|
29 |
placeholder="请选择写作类型" |
|
30 |
clearable |
|
31 |
class="!w-240px" |
|
32 |
> |
|
33 |
<el-option |
|
34 |
v-for="dict in getIntDictOptions(DICT_TYPE.AI_WRITE_TYPE)" |
|
35 |
:key="dict.value" |
|
36 |
:label="dict.label" |
|
37 |
:value="dict.value" |
|
38 |
/> |
|
39 |
</el-select> |
|
40 |
</el-form-item> |
|
41 |
<el-form-item label="平台" prop="platform"> |
|
42 |
<el-select v-model="queryParams.platform" placeholder="请选择平台" clearable class="!w-240px"> |
|
43 |
<el-option |
|
44 |
v-for="dict in getStrDictOptions(DICT_TYPE.AI_PLATFORM)" |
|
45 |
:key="dict.value" |
|
46 |
:label="dict.label" |
|
47 |
:value="dict.value" |
|
48 |
/> |
|
49 |
</el-select> |
|
50 |
</el-form-item> |
|
51 |
<el-form-item label="创建时间" prop="createTime"> |
|
52 |
<el-date-picker |
|
53 |
v-model="queryParams.createTime" |
|
54 |
value-format="YYYY-MM-DD HH:mm:ss" |
|
55 |
type="daterange" |
|
56 |
start-placeholder="开始日期" |
|
57 |
end-placeholder="结束日期" |
|
58 |
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" |
|
59 |
class="!w-240px" |
|
60 |
/> |
|
61 |
</el-form-item> |
|
62 |
<el-form-item> |
|
63 |
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> |
|
64 |
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> |
|
65 |
<el-button |
|
66 |
type="primary" |
|
67 |
plain |
|
68 |
@click="openForm('create')" |
|
69 |
v-hasPermi="['ai:write:create']" |
|
70 |
> |
|
71 |
<Icon icon="ep:plus" class="mr-5px" /> 新增 |
|
72 |
</el-button> |
|
73 |
<!-- TODO @iailab 目前没有导出接口,需要导出吗 --> |
|
74 |
<el-button |
|
75 |
type="success" |
|
76 |
plain |
|
77 |
@click="handleExport" |
|
78 |
:loading="exportLoading" |
|
79 |
v-hasPermi="['ai:write:export']" |
|
80 |
> |
|
81 |
<Icon icon="ep:download" class="mr-5px" /> 导出 |
|
82 |
</el-button> |
|
83 |
</el-form-item> |
|
84 |
</el-form> |
|
85 |
</ContentWrap> |
|
86 |
|
|
87 |
<!-- 列表 --> |
|
88 |
<ContentWrap> |
|
89 |
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true"> |
|
90 |
<el-table-column label="编号" align="center" prop="id" width="120" fixed="left" /> |
|
91 |
<el-table-column label="用户" align="center" prop="userId" width="180"> |
|
92 |
<template #default="scope"> |
|
93 |
<span>{{ userList.find((item) => item.id === scope.row.userId)?.nickname }}</span> |
|
94 |
</template> |
|
95 |
</el-table-column> |
|
96 |
<el-table-column label="写作类型" align="center" prop="type"> |
|
97 |
<template #default="scope"> |
|
98 |
<dict-tag :type="DICT_TYPE.AI_WRITE_TYPE" :value="scope.row.type" /> |
|
99 |
</template> |
|
100 |
</el-table-column> |
|
101 |
<el-table-column label="平台" align="center" prop="platform" width="120"> |
|
102 |
<template #default="scope"> |
|
103 |
<dict-tag :type="DICT_TYPE.AI_PLATFORM" :value="scope.row.platform" /> |
|
104 |
</template> |
|
105 |
</el-table-column> |
|
106 |
<el-table-column label="模型" align="center" prop="model" width="180" /> |
|
107 |
<el-table-column |
|
108 |
label="生成内容提示" |
|
109 |
align="center" |
|
110 |
prop="prompt" |
|
111 |
width="180" |
|
112 |
show-overflow-tooltip |
|
113 |
/> |
|
114 |
<el-table-column label="生成的内容" align="center" prop="generatedContent" width="180" /> |
|
115 |
<el-table-column label="原文" align="center" prop="originalContent" width="180" /> |
|
116 |
<el-table-column label="长度" align="center" prop="length"> |
|
117 |
<template #default="scope"> |
|
118 |
<dict-tag :type="DICT_TYPE.AI_WRITE_LENGTH" :value="scope.row.length" /> |
|
119 |
</template> |
|
120 |
</el-table-column> |
|
121 |
<el-table-column label="格式" align="center" prop="format"> |
|
122 |
<template #default="scope"> |
|
123 |
<dict-tag :type="DICT_TYPE.AI_WRITE_FORMAT" :value="scope.row.format" /> |
|
124 |
</template> |
|
125 |
</el-table-column> |
|
126 |
<el-table-column label="语气" align="center" prop="tone"> |
|
127 |
<template #default="scope"> |
|
128 |
<dict-tag :type="DICT_TYPE.AI_WRITE_TONE" :value="scope.row.tone" /> |
|
129 |
</template> |
|
130 |
</el-table-column> |
|
131 |
<el-table-column label="语言" align="center" prop="language"> |
|
132 |
<template #default="scope"> |
|
133 |
<dict-tag :type="DICT_TYPE.AI_WRITE_LANGUAGE" :value="scope.row.language" /> |
|
134 |
</template> |
|
135 |
</el-table-column> |
|
136 |
<el-table-column |
|
137 |
label="创建时间" |
|
138 |
align="center" |
|
139 |
prop="createTime" |
|
140 |
:formatter="dateFormatter" |
|
141 |
width="180px" |
|
142 |
/> |
|
143 |
<el-table-column label="错误信息" align="center" prop="errorMessage" /> |
|
144 |
<el-table-column label="操作" align="center"> |
|
145 |
<template #default="scope"> |
|
146 |
<!-- TODO @iailab 目前没有修改接口,写作要可以更改吗--> |
|
147 |
<el-button |
|
148 |
link |
|
149 |
type="primary" |
|
150 |
@click="openForm('update', scope.row.id)" |
|
151 |
v-hasPermi="['ai:write:update']" |
|
152 |
> |
|
153 |
编辑 |
|
154 |
</el-button> |
|
155 |
<el-button |
|
156 |
link |
|
157 |
type="danger" |
|
158 |
@click="handleDelete(scope.row.id)" |
|
159 |
v-hasPermi="['ai:write:delete']" |
|
160 |
> |
|
161 |
删除 |
|
162 |
</el-button> |
|
163 |
</template> |
|
164 |
</el-table-column> |
|
165 |
</el-table> |
|
166 |
<!-- 分页 --> |
|
167 |
<Pagination |
|
168 |
:total="total" |
|
169 |
v-model:page="queryParams.pageNo" |
|
170 |
v-model:limit="queryParams.pageSize" |
|
171 |
@pagination="getList" |
|
172 |
/> |
|
173 |
</ContentWrap> |
|
174 |
</template> |
|
175 |
|
|
176 |
<script setup lang="ts"> |
|
177 |
import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict' |
|
178 |
import { dateFormatter } from '@/utils/formatTime' |
|
179 |
import { useRouter } from 'vue-router' |
|
180 |
import { WriteApi, AiWritePageReqVO, AiWriteRespVo } from '@/api/ai/write' |
|
181 |
import * as UserApi from '@/api/system/user' |
|
182 |
|
|
183 |
/** AI 写作列表 */ |
|
184 |
defineOptions({ name: 'AiWriteManager' }) |
|
185 |
|
|
186 |
const message = useMessage() // 消息弹窗 |
|
187 |
const { t } = useI18n() // 国际化 |
|
188 |
const router = useRouter() // 路由 |
|
189 |
|
|
190 |
const loading = ref(true) // 列表的加载中 |
|
191 |
const list = ref<AiWriteRespVo[]>([]) // 列表的数据 |
|
192 |
const total = ref(0) // 列表的总页数 |
|
193 |
const queryParams = reactive<AiWritePageReqVO>({ |
|
194 |
pageNo: 1, |
|
195 |
pageSize: 10, |
|
196 |
userId: undefined, |
|
197 |
type: undefined, |
|
198 |
platform: undefined, |
|
199 |
createTime: undefined |
|
200 |
}) |
|
201 |
const queryFormRef = ref() // 搜索的表单 |
|
202 |
const userList = ref<UserApi.UserVO[]>([]) // 用户列表 |
|
203 |
|
|
204 |
/** 查询列表 */ |
|
205 |
const getList = async () => { |
|
206 |
loading.value = true |
|
207 |
try { |
|
208 |
const data = await WriteApi.getWritePage(queryParams) |
|
209 |
list.value = data.list |
|
210 |
total.value = data.total |
|
211 |
} finally { |
|
212 |
loading.value = false |
|
213 |
} |
|
214 |
} |
|
215 |
|
|
216 |
/** 搜索按钮操作 */ |
|
217 |
const handleQuery = () => { |
|
218 |
queryParams.pageNo = 1 |
|
219 |
getList() |
|
220 |
} |
|
221 |
|
|
222 |
/** 重置按钮操作 */ |
|
223 |
const resetQuery = () => { |
|
224 |
queryFormRef.value.resetFields() |
|
225 |
handleQuery() |
|
226 |
} |
|
227 |
|
|
228 |
/** 新增方法,跳转到写作页面 **/ |
|
229 |
const openForm = (type: string, id?: number) => { |
|
230 |
switch (type) { |
|
231 |
case 'create': |
|
232 |
router.push('/ai/write') |
|
233 |
break |
|
234 |
} |
|
235 |
} |
|
236 |
|
|
237 |
/** 删除按钮操作 */ |
|
238 |
const handleDelete = async (id: number) => { |
|
239 |
try { |
|
240 |
// 删除的二次确认 |
|
241 |
await message.delConfirm() |
|
242 |
// 发起删除 |
|
243 |
await WriteApi.deleteWrite(id) |
|
244 |
message.success(t('common.delSuccess')) |
|
245 |
// 刷新列表 |
|
246 |
await getList() |
|
247 |
} catch {} |
|
248 |
} |
|
249 |
|
|
250 |
/** 初始化 **/ |
|
251 |
onMounted(async () => { |
|
252 |
getList() |
|
253 |
// 获得用户列表 |
|
254 |
userList.value = await UserApi.getSimpleUserList() |
|
255 |
}) |
|
256 |
</script> |