Merge branch 'feature/feature-20250430-h5' of https://e.coding.yili.com/yldc/ylst/ylst-survey-h5 into feature/feature-20250430-h5
This commit is contained in:
Huangzhe
@@ -106,6 +106,26 @@ function tooptipFormatter(data: { row: any; column: any; cellValue: any }): VNod
|
||||
content: data
|
||||
});
|
||||
}
|
||||
|
||||
// render
|
||||
const RenderSlot = {
|
||||
functional: true,
|
||||
props: {
|
||||
row: Object,
|
||||
render: Function,
|
||||
index: Number,
|
||||
column: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup(props) {
|
||||
return () => {
|
||||
const { row, index, column } = props;
|
||||
return props.render(h, { row, index, column });
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -136,10 +156,19 @@ function tooptipFormatter(data: { row: any; column: any; cellValue: any }): VNod
|
||||
<template #default="scope">
|
||||
<slot name="column-default" :scope="scope">
|
||||
<div
|
||||
v-if="!item.render"
|
||||
class="table-view-html"
|
||||
@click.stop="handleImageClick"
|
||||
v-html="scope.row[item.prop]"
|
||||
></div>
|
||||
|
||||
<RenderSlot
|
||||
v-else
|
||||
:row="scope.row"
|
||||
:render="item.render"
|
||||
:index="scope.$index"
|
||||
:column="item"
|
||||
></RenderSlot>
|
||||
</slot>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
@@ -33,8 +33,6 @@ function useSetPieChart(
|
||||
|
||||
// 如果 data 变动，重新生成图表w
|
||||
watch(series, (value) => {
|
||||
console.log(chartInstance);
|
||||
|
||||
const currentOptions = chartInstance.getOption();
|
||||
|
||||
// 合并新的 series 数据到现有配置中
|
||||
|
||||
@@ -1,101 +1,101 @@
|
||||
<script setup>
|
||||
import { fetchSurveys } from '@/hooks/request/useSurvey';
|
||||
import CreateSurvey from './components/CreateSurvey/Index.vue';
|
||||
import NewSurvey from './components/NewSurvey/index.vue';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import utils from '@/assets/js/common';
|
||||
import { getUserInfo } from '@/api/common/index.js';
|
||||
import { showFailToast } from 'vant';
|
||||
import appBridge from '@/assets/js/appBridge';
|
||||
import ImageSlider from './components/ImageSlider/Index.vue';
|
||||
import SearchBar from '@/components/Search/Index.vue';
|
||||
import Navigation from '@/components/Navigation/Index.vue';
|
||||
import HomeRecommend from './components/HomeRecommend/Index.vue';
|
||||
import MineTask from '@/views/Home/components/MineTask/Index.vue';
|
||||
import router from '@/router';
|
||||
|
||||
const contentShow = ref(false);
|
||||
// 获取我的问卷数据
|
||||
const { surveys } = fetchSurveys();
|
||||
const keyword = ref('');
|
||||
onMounted(async () => {
|
||||
if (appBridge.isInReactNative()) {
|
||||
const appToken = utils.getSessionStorage('xToken');
|
||||
getUserInfo(appToken)
|
||||
.then((res) => {
|
||||
if (res.data) {
|
||||
contentShow.value = true;
|
||||
const token = res.data.data.token;
|
||||
localStorage.setItem('plantToken', token);
|
||||
utils.setSessionStorage('userInfo', res.data.data);
|
||||
} else {
|
||||
contentShow.value = false;
|
||||
showFailToast(
|
||||
error.response.data?.message || error.data?.message || error.message || '服务器错误'
|
||||
);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
contentShow.value = false;
|
||||
showFailToast(error?.response?.data?.message || error?.message || '服务器错误');
|
||||
});
|
||||
} else {
|
||||
utils.setSessionStorage('xToken', 'f74ba36d7fc3468480648dedba5672ff');
|
||||
contentShow.value = true;
|
||||
}
|
||||
});
|
||||
|
||||
function handleSearchClick() {
|
||||
router.push({ name: 'search' });
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="contentShow" class="container-home">
|
||||
<div class="container-body">
|
||||
<!-- 搜索栏 -->
|
||||
<section class="search">
|
||||
<search-bar placeholder="请输入关键词" :value="keyword" @click="handleSearchClick" />
|
||||
</section>
|
||||
<!-- 首页轮播图 -->
|
||||
<section class="slider">
|
||||
<image-slider />
|
||||
</section>
|
||||
<create-survey :createdNewPage="false" />
|
||||
<!-- 最新问卷 -->
|
||||
<!--<last-survey/>-->
|
||||
<!-- 模板市场 -->
|
||||
<!-- <Market/> -->
|
||||
<!--底部新建问卷-->
|
||||
<NewSurvey />
|
||||
|
||||
<!-- 我的问卷 部分， 当问卷不存在时，显示推荐内容 -->
|
||||
<mine-task v-if="surveys?.length > 0" :surveys="surveys" />
|
||||
<home-recommend v-else class="home_recommend" />
|
||||
<navigation />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@use '@/assets/css/theme';
|
||||
|
||||
.container-body {
|
||||
padding: 0 10px 80px;
|
||||
}
|
||||
|
||||
.search {
|
||||
margin: 0 -10px 0 -10px;
|
||||
padding: 10px;
|
||||
@extend %search-gradient;
|
||||
}
|
||||
|
||||
.slider {
|
||||
overflow: hidden;
|
||||
border-radius: theme.$card-radius;
|
||||
}
|
||||
|
||||
.home_recommend {
|
||||
margin: theme.$gap 0;
|
||||
}
|
||||
</style>
|
||||
<script setup>
|
||||
import { fetchSurveys } from '@/hooks/request/useSurvey';
|
||||
import CreateSurvey from './components/CreateSurvey/Index.vue';
|
||||
import NewSurvey from './components/NewSurvey/index.vue';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import utils from '@/assets/js/common';
|
||||
import { getUserInfo } from '@/api/common/index.js';
|
||||
import { showFailToast } from 'vant';
|
||||
import appBridge from '@/assets/js/appBridge';
|
||||
import ImageSlider from './components/ImageSlider/Index.vue';
|
||||
import SearchBar from '@/components/Search/Index.vue';
|
||||
import Navigation from '@/components/Navigation/Index.vue';
|
||||
import HomeRecommend from './components/HomeRecommend/Index.vue';
|
||||
import MineTask from '@/views/Home/components/MineTask/Index.vue';
|
||||
import router from '@/router';
|
||||
|
||||
const contentShow = ref(false);
|
||||
// 获取我的问卷数据
|
||||
const { surveys } = fetchSurveys();
|
||||
const keyword = ref('');
|
||||
onMounted(async () => {
|
||||
if (appBridge.isInReactNative()) {
|
||||
const appToken = utils.getSessionStorage('xToken');
|
||||
getUserInfo(appToken)
|
||||
.then((res) => {
|
||||
if (res.data) {
|
||||
contentShow.value = true;
|
||||
const token = res.data.data.token;
|
||||
localStorage.setItem('plantToken', token);
|
||||
utils.setSessionStorage('userInfo', res.data.data);
|
||||
} else {
|
||||
contentShow.value = false;
|
||||
showFailToast(
|
||||
error.response.data?.message || error.data?.message || error.message || '服务器错误'
|
||||
);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
contentShow.value = false;
|
||||
showFailToast(error?.response?.data?.message || error?.message || '服务器错误');
|
||||
});
|
||||
} else {
|
||||
utils.setSessionStorage('xToken', 'f74ba36d7fc3468480648dedba5672ff');
|
||||
contentShow.value = true;
|
||||
}
|
||||
});
|
||||
|
||||
function handleSearchClick() {
|
||||
router.push({ name: 'search' });
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="contentShow" class="container-home">
|
||||
<div class="container-body">
|
||||
<!-- 搜索栏 -->
|
||||
<section class="search">
|
||||
<search-bar placeholder="请输入关键词" :value="keyword" @click="handleSearchClick" />
|
||||
</section>
|
||||
<!-- 首页轮播图 -->
|
||||
<section class="slider">
|
||||
<image-slider />
|
||||
</section>
|
||||
<create-survey :createdNewPage="false" />
|
||||
<!-- 最新问卷 -->
|
||||
<!--<last-survey/>-->
|
||||
<!-- 模板市场 -->
|
||||
<!-- <Market/> -->
|
||||
<!--底部新建问卷-->
|
||||
<NewSurvey />
|
||||
|
||||
<!-- 我的问卷 部分， 当问卷不存在时，显示推荐内容 -->
|
||||
<mine-task v-if="surveys?.length > 0" :surveys="surveys" />
|
||||
<home-recommend v-else class="home_recommend" />
|
||||
<navigation />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@use '@/assets/css/theme';
|
||||
|
||||
.container-body {
|
||||
padding: 0 10px 80px;
|
||||
}
|
||||
|
||||
.search {
|
||||
margin: 0 -10px 0 -10px;
|
||||
padding: 10px;
|
||||
@extend %search-gradient;
|
||||
}
|
||||
|
||||
.slider {
|
||||
overflow: hidden;
|
||||
border-radius: theme.$card-radius;
|
||||
}
|
||||
|
||||
.home_recommend {
|
||||
margin: theme.$gap 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,100 +1,110 @@
|
||||
<script setup lang="ts">
|
||||
import { recommend } from '@/hooks/request/recommend';
|
||||
import { ref } from 'vue';
|
||||
import YlTable from '@/components/YlTable/Index.vue';
|
||||
import CommonLayout from '@/components/Layout/CommonLayout.vue';
|
||||
|
||||
// 外部获取的数据
|
||||
const { data } = recommend({});
|
||||
|
||||
const props = ref<TablePropsType[]>([
|
||||
{
|
||||
prop: 'rank',
|
||||
label: '排名',
|
||||
width: 58
|
||||
},
|
||||
{
|
||||
prop: 'trend_name',
|
||||
label: '趋势名称',
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'growth_ring_ratio',
|
||||
label: '声量增长环比',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
prop: 'sales_growth_ring_ratio',
|
||||
label: '销量增长环比',
|
||||
width: 120
|
||||
}
|
||||
]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<van-cell class="home_recommend">
|
||||
<template #extra>
|
||||
<div style="width: 90vw">
|
||||
<common-layout title="123">
|
||||
<template #title>
|
||||
<h3 class="recommend-layout-title">内容推荐</h3>
|
||||
</template>
|
||||
|
||||
<span class="recommend-title">{{ data?.title }}</span>
|
||||
<yl-table
|
||||
style="margin-top: 10px"
|
||||
:header-style="{ background: '#E8F9F4' }"
|
||||
:data="data?.surveyTrendDataVOS"
|
||||
:props="props"
|
||||
/>
|
||||
<!-- 剧中展示提示语 -->
|
||||
<div class="more">
|
||||
<span>- 最新数据及更多创新趋势请到YIP探索 - </span>
|
||||
</div>
|
||||
</common-layout>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@use '@/assets/css/theme' as *;
|
||||
|
||||
.home_recommend {
|
||||
border-radius: $card-radius;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.recommend-layout-title {
|
||||
font-family:
|
||||
PingFangSC,
|
||||
PingFang SC;
|
||||
font-weight: 800;
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.recommend-title {
|
||||
color: #000000;
|
||||
font-family:
|
||||
PingFangSC,
|
||||
PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
line-height: 15px;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.more {
|
||||
margin: 5px;
|
||||
color: #919191;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script setup lang="ts">
|
||||
import { recommend } from '@/hooks/request/recommend';
|
||||
import { ref } from 'vue';
|
||||
import YlTable from '@/components/YlTable/Index.vue';
|
||||
import CommonLayout from '@/components/Layout/CommonLayout.vue';
|
||||
|
||||
// 外部获取的数据
|
||||
const { data } = recommend({});
|
||||
const props = ref<TablePropsType[]>([
|
||||
{
|
||||
prop: 'rank',
|
||||
label: '排名',
|
||||
width: 58
|
||||
},
|
||||
{
|
||||
prop: 'trend_name',
|
||||
label: '趋势名称',
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'growth_ring_ratio',
|
||||
label: '声量增长环比',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
prop: 'sales_growth_ring_ratio',
|
||||
label: '销量增长环比',
|
||||
width: 120,
|
||||
render: (h, p) => {
|
||||
return h(
|
||||
'div',
|
||||
{
|
||||
style: {
|
||||
color: p.row.sales_growth_ring_ratio < 0 ? 'red' : 'green'
|
||||
}
|
||||
},
|
||||
p.row.sales_growth_ring_ratio
|
||||
);
|
||||
}
|
||||
}
|
||||
]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<van-cell class="home_recommend">
|
||||
<template #extra>
|
||||
<div style="width: 90vw">
|
||||
<common-layout title="123">
|
||||
<template #title>
|
||||
<h3 class="recommend-layout-title">内容推荐</h3>
|
||||
</template>
|
||||
|
||||
<span class="recommend-title">{{ data?.title }}</span>
|
||||
<yl-table
|
||||
style="margin-top: 10px"
|
||||
:header-style="{ background: '#E8F9F4' }"
|
||||
:data="data?.surveyTrendDataVOS"
|
||||
:props="props"
|
||||
/>
|
||||
<!-- 剧中展示提示语 -->
|
||||
<div class="more">
|
||||
<span>- 最新数据及更多创新趋势请到YIP探索 - </span>
|
||||
</div>
|
||||
</common-layout>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@use '@/assets/css/theme' as *;
|
||||
|
||||
.home_recommend {
|
||||
border-radius: $card-radius;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.recommend-layout-title {
|
||||
font-family:
|
||||
PingFangSC,
|
||||
PingFang SC;
|
||||
font-weight: 800;
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.recommend-title {
|
||||
color: #000000;
|
||||
font-family:
|
||||
PingFangSC,
|
||||
PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
line-height: 15px;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.more {
|
||||
margin: 5px;
|
||||
color: #919191;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user