6852188cf1
1. 修复了搜索页面中的类型错误和构建问题 - 修复了 v-model 的类型断言问题 - 优化了搜索关键字的处理逻辑 2. 优化了首页布局和样式 - 添加了渐变背景样式 - 调整了搜索栏和轮播图的间距 - 优化了卡片圆角和边距 3. 改进了广告页面(AD)的UI - 优化了布局和样式 - 添加了响应式设计 - 改进了按钮样式和交互 4. 重构了主题和样式 - 提取了常用样式到 theme.scss - 使用 SCSS 变量管理颜色和尺寸 - 优化了组件间的样式复用 5. 修复了路由和布局问题 - 更新了路由配置 - 优化了重定向布局 - 修复了导航栏显示问题
79 lines
1.9 KiB
Vue
79 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { ref, useTemplateRef, watch } from 'vue';
|
|
import { useSetPieChart } from '@/hooks/chart/usePieChart';
|
|
import {
|
|
formatData,
|
|
getTableData,
|
|
setDimensionData
|
|
} from '@/views/Survey/views/Analysis/components/AnalysisInfo/hooks/pieSeries';
|
|
|
|
// series 信息
|
|
const tableData = ref([]);
|
|
const analysis = defineModel('analysis');
|
|
const series = ref([]);
|
|
const dimension = defineModel('dimension');
|
|
|
|
const index = ref(0);
|
|
// 饼图 dom 结构
|
|
// 当 keyword 变动的时候，标记脏数据
|
|
watch(
|
|
() => analysis.value,
|
|
async () => {
|
|
tableData.value = {
|
|
...analysis.value,
|
|
option: getTableData(analysis.value)
|
|
};
|
|
|
|
series.value = formatData(dimension.value ? tableData.value : analysis.value, index.value);
|
|
const pieChart = useTemplateRef<HTMLSpanElement>('pieChart');
|
|
useSetPieChart(pieChart, series, { title: false, legend: false });
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
|
|
const changeChart = (i: Number) => {
|
|
index.value = i;
|
|
series.value = formatData(tableData.value, index.value);
|
|
// const pieChart = useTemplateRef<HTMLSpanElement>('pieChart');
|
|
// useSetPieChart(pieChart, series, { title: false, legend: false });
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<section>
|
|
<!-- <div v-if="dimension">
|
|
<van-radio-group v-model="index" @change="changeChart">
|
|
<van-radio v-for="(item, index) in tableData.option" :name="index">{{
|
|
item.option
|
|
}}</van-radio>
|
|
</van-radio-group>
|
|
</div> -->
|
|
|
|
<!-- 图表部分 -->
|
|
<div
|
|
class="charts"
|
|
style="
|
|
display: flex;
|
|
height: 300px;
|
|
|
|
justify-content: center;
|
|
margin: 16px 0;
|
|
"
|
|
>
|
|
<span ref="pieChart" style="width: 100%; height: 300px"></span>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.task-card {
|
|
//margin: 16px;
|
|
background-color: #fff;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
|
}
|
|
.charts {
|
|
width: calc(100vw - 50px);
|
|
}
|
|
</style>
|