feat: 优化问卷列表和分析页面

1. 修改 SurveyItem 组件布局和样式
2. 在分析页面添加搜索栏
3. 更新问卷项中的时间显示格式
4. 调整分析页面组件的宽度
5. 添加 AI 洞察图标
This commit is contained in:
Huangzhe
2025-05-16 15:21:58 +08:00
parent 01df85f5dd
commit d0952d2576
7 changed files with 80 additions and 23 deletions

3
components.d.ts vendored
View File

@@ -33,10 +33,12 @@ declare module 'vue' {
RouterView: typeof import('vue-router')['RouterView']
VanActionSheet: typeof import('vant/es')['ActionSheet']
VanButton: typeof import('vant/es')['Button']
VanCard: typeof import('vant/es')['Card']
VanCell: typeof import('vant/es')['Cell']
VanCellGroup: typeof import('vant/es')['CellGroup']
VanCheckbox: typeof import('vant/es')['Checkbox']
VanCheckboxGroup: typeof import('vant/es')['CheckboxGroup']
VanCol: typeof import('vant/es')['Col']
VanDivider: typeof import('vant/es')['Divider']
VanField: typeof import('vant/es')['Field']
VanIcon: typeof import('vant/es')['Icon']
@@ -47,6 +49,7 @@ declare module 'vue' {
VanPopup: typeof import('vant/es')['Popup']
VanRadio: typeof import('vant/es')['Radio']
VanRadioGroup: typeof import('vant/es')['RadioGroup']
VanRow: typeof import('vant/es')['Row']
VanSearch: typeof import('vant/es')['Search']
VanStepper: typeof import('vant/es')['Stepper']
VanSwipe: typeof import('vant/es')['Swipe']

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.2 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 8.9 KiB

View File

@@ -100,7 +100,9 @@ const router = createRouter({
}, {
path: '/analysis',
name: 'analysis',
meta: {},
meta: {
title:"统计分析"
},
component: () => import('@/views/Survey/views/Analysis/Index.vue')
}, {
path: '/ad',

View File

@@ -18,6 +18,7 @@ import {
saveTemplate,
currentSurvey
} from '@/views/Survey/hooks/useSurveyData';
import ai from '@/assets/img/analysis/ai.svg';
// router
const router = useRouter();
@@ -128,28 +129,28 @@ function copyItem(item: SurveyItem) {
</script>
<template>
<section>
<section style="width: 100%">
<!-- 问卷详情 -->
<div class="survey_item_info">
<div style="position: relative">
<div class="survey_item_info_title">
<el-text>
<b v-html="survey.project_name"></b>
</el-text>
<el-text>{{ survey.answer_num }}</el-text>
<el-text v-if="survey.is_time" size="small">
{{ `${survey.start_time} ${survey.end_time ?? '无限期'}` }}
</el-text>
<div style="display: flex; justify-content: space-between; margin: 10px 0">
<div class="survey_item_info_title">
<el-text style="max-width: 100px">
<b v-html="survey.project_name"></b>
</el-text>
<el-text class="wrap">{{ survey.answer_num }}</el-text>
<el-text class="wrap" v-if="survey.is_time" style="text-wrap: nowrap; font-size: 14px">
{{ `${survey.start_time} ${survey.end_time ?? '无限期'}` }}
</el-text>
</div>
<el-button
<!-- AI 洞察图片 -->
<img
v-if="isAnalysis"
style="margin-left: 30px"
type="primary"
size="small"
:src="ai"
class="survey_item_info_title-survey"
@click="emit('post-analysis')"
>
AI 洞察
</el-button>
/>
</div>
<div class="survey_item_info_status">
<el-space spacer="|">
@@ -173,7 +174,7 @@ function copyItem(item: SurveyItem) {
<!-- 问卷时间 -->
<div class="flex align-center">
<img src="@/assets/img/publish/time.png" alt="" />
<el-text size="small">{{ survey.created_at }}</el-text>
<el-text size="small"> 创建时间 {{ survey.created_at }}</el-text>
</div>
</el-space>
</div>
@@ -278,13 +279,12 @@ function copyItem(item: SurveyItem) {
}
}
& > :nth-child(2) {
position: relative;
left: 10px;
.wrap {
padding: 1px 3px;
border: 2px solid #f5f5f5;
border-radius: 6px;
font-size: 12px;
text-wrap: nowrap;
}
}
@@ -299,7 +299,7 @@ function copyItem(item: SurveyItem) {
text-overflow: ellipsis;
padding: 10px 15px;
box-sizing: border-box;
margin: 0 10px 10px 10px;
margin: 0 10px 10px 5px;
color: #828282;
font-weight: 400;
font-size: 12px;

View File

@@ -1,7 +1,7 @@
import { getSurveysPage, deleteSurveys, saveTemplates } from '@/api/home';
import { ref } from 'vue';
import { showDialog, showConfirmDialog, showFailToast, showToast } from 'vant';
import { getSurveysDetail } from '@/api/design';
import { getSetting, getSurveysDetail } from '@/api/design';
const form = ref({
page: 0,
@@ -18,6 +18,7 @@ const currentSurvey = ref<SurveyItem>();
async function fetchSingleSurvey(sn: string) {
const res = await getSurveysDetail(sn);
// const res = await getSetting({sn})
// console.log(res);
if (res.data.code === 0) {
currentSurvey.value = res.data.data;

View File

@@ -11,6 +11,7 @@ import {
} from '@/views/Survey/views/Analysis/hooks/useAnalysis';
import Wait from '@/views/Survey/views/Analysis/components/Wait/Index.vue';
import AnalysisInfo from '@/views/Survey/views/Analysis/components/AnalysisInfo/Index.vue';
import SearchBar from '@/components/Search/Index.vue';
const route = useRoute();
/**
@@ -24,6 +25,11 @@ useFetchAnalysis(route.query.sn as string);
</script>
<template>
<search-bar
:value="''"
style="margin: 15px 10px 5px 10px"
@click="() => $router.push({ name: 'search' })"
/>
<section v-if="currentSurvey" class="survey-container">
<!-- 问卷详情部分 -->
<van-cell class="survey-item">
@@ -74,6 +80,7 @@ useFetchAnalysis(route.query.sn as string);
.ai-insight,
.logic-info,
.analysis {
width: 100%;
border-radius: theme.$card-radius;
margin-bottom: theme.$gap;
}