Skip to content

Commit 0a9f9b6

Browse files
ChanzhaoyuChanzhaoyu
committed
feat: 调整界面
1 parent af76b89 commit 0a9f9b6

File tree

2 files changed

+134
-140
lines changed

2 files changed

+134
-140
lines changed

‎src/components/common/PromptStore/index.vue

Lines changed: 131 additions & 140 deletions
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,6 @@ const createColumns = (): DataTableColumns<DataProps> => {
257257
{
258258
title: t('store.title'),
259259
key: 'renderKey',
260-
width: 160,
261260
},
262261
{
263262
title: t('store.description'),
@@ -296,6 +295,7 @@ const createColumns = (): DataTableColumns<DataProps> => {
296295
},
297296
]
298297
}
298+
299299
const columns = createColumns()
300300
301301
watch(
@@ -321,152 +321,143 @@ const dataSource = computed(() => {
321321
<template>
322322
<NMessageProvider>
323323
<NModal v-model:show="show" style="width: 90%; max-width: 900px;" preset="card">
324-
<NCard>
325-
<div class="space-y-4">
326-
<NTabs type="segment">
327-
<NTabPane name="local" :tab="$t('store.local')">
328-
<div class="flex items-center justify-between">
329-
<div class="flex items-center justify-end space-x-4">
330-
<NButton
331-
type="primary"
332-
size="small"
333-
@click="changeShowModal('add')"
334-
>
335-
{{ $t('common.add') }}
336-
</NButton>
337-
<NButton
338-
size="small"
339-
@click="changeShowModal('local_import')"
340-
>
341-
{{ $t('common.import') }}
342-
</NButton>
343-
<NButton
344-
size="small"
345-
:loading="exportLoading"
346-
@click="exportPromptTemplate()"
347-
>
348-
{{ $t('common.export') }}
349-
</NButton>
350-
<NPopconfirm @positive-click="clearPromptTemplate">
351-
<template #trigger>
352-
<NButton size="small">
353-
{{ $t('common.clear') }}
354-
</NButton>
355-
</template>
356-
{{ $t('store.clearStoreConfirm') }}
357-
</NPopconfirm>
358-
</div>
359-
<div class="flex items-center space-x-4">
360-
<NInput v-model:value="searchValue" />
361-
</div>
362-
</div>
363-
<br>
364-
<NDataTable
365-
:max-height="400"
366-
:columns="columns"
367-
:data="dataSource"
368-
:pagination="pagination"
369-
:bordered="false"
370-
/>
371-
</NTabPane>
372-
<NTabPane name="download" :tab="$t('store.online')">
373-
<p class="mb-4">
374-
{{ $t('store.onlineImportWarning') }}
375-
</p>
376-
<div class="flex items-center gap-4">
377-
<NInput v-model:value="downloadURL" placeholder="" />
324+
<div class="space-y-4">
325+
<NTabs type="segment">
326+
<NTabPane name="local" :tab="$t('store.local')">
327+
<div
328+
class="flex items-center justify-between"
329+
:class="isMobile ? 'flex-col gap-2' : 'flex-row'"
330+
>
331+
<div class="flex items-center justify-end space-x-4">
332+
<NButton
333+
type="primary"
334+
size="small"
335+
@click="changeShowModal('add')"
336+
>
337+
{{ $t('common.add') }}
338+
</NButton>
339+
<NButton
340+
size="small"
341+
@click="changeShowModal('local_import')"
342+
>
343+
{{ $t('common.import') }}
344+
</NButton>
378345
<NButton
379-
strong
380-
secondary
381-
:disabled="downloadDisabled"
382-
:loading="importLoading"
383-
@click="downloadPromptTemplate()"
346+
size="small"
347+
:loading="exportLoading"
348+
@click="exportPromptTemplate()"
384349
>
385-
{{ $t('common.download') }}
350+
{{ $t('common.export') }}
386351
</NButton>
352+
<NPopconfirm @positive-click="clearPromptTemplate">
353+
<template #trigger>
354+
<NButton size="small">
355+
{{ $t('common.clear') }}
356+
</NButton>
357+
</template>
358+
{{ $t('store.clearStoreConfirm') }}
359+
</NPopconfirm>
387360
</div>
388-
<NDivider />
389-
<NLayoutContent
390-
style="height: 360px"
391-
content-style="background: none;"
392-
:native-scrollbar="false"
361+
<div class="flex items-center space-x-4">
362+
<NInput v-model:value="searchValue" style="width: 100%" />
363+
</div>
364+
</div>
365+
<br>
366+
<NDataTable
367+
:max-height="400"
368+
:columns="columns"
369+
:data="dataSource"
370+
:pagination="pagination"
371+
:bordered="false"
372+
/>
373+
</NTabPane>
374+
<NTabPane name="download" :tab="$t('store.online')">
375+
<p class="mb-4">
376+
{{ $t('store.onlineImportWarning') }}
377+
</p>
378+
<div class="flex items-center gap-4">
379+
<NInput v-model:value="downloadURL" placeholder="" />
380+
<NButton
381+
strong
382+
secondary
383+
:disabled="downloadDisabled"
384+
:loading="importLoading"
385+
@click="downloadPromptTemplate()"
386+
>
387+
{{ $t('common.download') }}
388+
</NButton>
389+
</div>
390+
<NDivider />
391+
<NLayoutContent
392+
style="height: 360px"
393+
content-style="background: none;"
394+
:native-scrollbar="false"
395+
>
396+
<NCard
397+
v-for="info in promptRecommendList"
398+
:key="info.key" :title="info.key"
399+
style="margin: 5px;"
400+
embedded
401+
:bordered="true"
393402
>
394-
<NCard
395-
v-for="info in promptRecommendList"
396-
:key="info.key" :title="info.key"
397-
style="margin: 5px;"
398-
embedded
399-
:bordered="true"
403+
<p
404+
class="overflow-hidden text-ellipsis whitespace-nowrap"
405+
:title="info.desc"
400406
>
401-
<p
402-
class="overflow-hidden text-ellipsis whitespace-nowrap"
403-
:title="info.desc"
404-
>
405-
{{ info.desc }}
406-
</p>
407-
<template #footer>
408-
<div class="flex items-center justify-end space-x-4">
409-
<NButton text>
410-
<a
411-
:href="info.url"
412-
target="_blank"
413-
>
414-
<SvgIcon class="text-xl" icon="ri:link" />
415-
</a>
416-
</NButton>
417-
<NButton text @click="setDownloadURL(info.downloadUrl) ">
418-
<SvgIcon class="text-xl" icon="ri:add-fill" />
419-
</NButton>
420-
</div>
421-
</template>
422-
</NCard>
423-
</NLayoutContent>
424-
</NTabPane>
425-
</NTabs>
426-
</div>
427-
</NCard>
407+
{{ info.desc }}
408+
</p>
409+
<template #footer>
410+
<div class="flex items-center justify-end space-x-4">
411+
<NButton text>
412+
<a
413+
:href="info.url"
414+
target="_blank"
415+
>
416+
<SvgIcon class="text-xl" icon="ri:link" />
417+
</a>
418+
</NButton>
419+
<NButton text @click="setDownloadURL(info.downloadUrl) ">
420+
<SvgIcon class="text-xl" icon="ri:add-fill" />
421+
</NButton>
422+
</div>
423+
</template>
424+
</NCard>
425+
</NLayoutContent>
426+
</NTabPane>
427+
</NTabs>
428+
</div>
428429
</NModal>
429-
<NModal v-model:show="showModal">
430-
<NCard
431-
style="width: 600px"
432-
:bordered="false"
433-
size="huge"
434-
role="dialog"
435-
aria-modal="true"
436-
>
437-
<NSpace v-if="modalMode === 'add' || modalMode === 'modify'" vertical>
438-
{{ t('store.title') }}
439-
<NInput v-model:value="tempPromptKey" />
440-
{{ t('store.description') }}
441-
<NInput v-model:value="tempPromptValue" type="textarea" />
442-
<NButton
443-
strong
444-
secondary
445-
:style="{ width: '100%' }"
446-
:disabled="inputStatus"
447-
@click="() => { modalMode === 'add' ? addPromptTemplate() : modifyPromptTemplate() }"
448-
>
449-
{{ t('common.confirm') }}
450-
</NButton>
451-
</NSpace>
452-
<NSpace v-if="modalMode === 'local_import'" vertical>
453-
<NInput
454-
v-model:value="tempPromptValue"
455-
:placeholder="t('store.importPlaceholder')"
456-
:autosize="{ minRows: 3, maxRows: 15 }"
457-
type="textarea"
458-
/>
459-
<NButton
460-
strong
461-
secondary
462-
:style="{ width: '100%' }"
463-
:disabled="inputStatus"
464-
@click="() => { importPromptTemplate() }"
465-
>
466-
{{ t('common.import') }}
467-
</NButton>
468-
</NSpace>
469-
</NCard>
430+
<NModal v-model:show="showModal" style="width: 90%; max-width: 600px;" preset="card">
431+
<NSpace v-if="modalMode === 'add' || modalMode === 'modify'" vertical>
432+
{{ t('store.title') }}
433+
<NInput v-model:value="tempPromptKey" />
434+
{{ t('store.description') }}
435+
<NInput v-model:value="tempPromptValue" type="textarea" />
436+
<NButton
437+
block
438+
type="primary"
439+
:disabled="inputStatus"
440+
@click="() => { modalMode === 'add' ? addPromptTemplate() : modifyPromptTemplate() }"
441+
>
442+
{{ t('common.confirm') }}
443+
</NButton>
444+
</NSpace>
445+
<NSpace v-if="modalMode === 'local_import'" vertical>
446+
<NInput
447+
v-model:value="tempPromptValue"
448+
:placeholder="t('store.importPlaceholder')"
449+
:autosize="{ minRows: 3, maxRows: 15 }"
450+
type="textarea"
451+
/>
452+
<NButton
453+
block
454+
type="primary"
455+
:disabled="inputStatus"
456+
@click="() => { importPromptTemplate() }"
457+
>
458+
{{ t('common.import') }}
459+
</NButton>
460+
</NSpace>
470461
</NModal>
471462
</NMessageProvider>
472463
</template>

‎src/locales/zh-TW.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ export default {
1818
clearSuccess: '清除成功',
1919
yes: '是',
2020
no: '否',
21+
confirm: '確定',
22+
download: '下載',
2123
noData: '暫無資料',
2224
wrong: '好像出錯了，請稍後再試。',
2325
success: '操作成功',
@@ -43,6 +45,7 @@ export default {
4345
deleteMessage: '刪除訊息',
4446
deleteMessageConfirm: '是否刪除此訊息?',
4547
deleteHistoryConfirm: '確定刪除此紀錄?',
48+
clearHistoryConfirm: '確定清除紀錄?',
4649
},
4750
setting: {
4851
setting: '設定',

0 commit comments

Comments
 (0)