Skip to content

P
pptist
Commit 904ed5bc authored by zhengke's avatar zhengke
Browse files
Options

no message

parent 0803642f
Hide whitespace changes
Inline Side-by-side
Showing with 134 additions and 34 deletions
src/assets/styles/common.css
View file @ 904ed5bc
......@@ -263,6 +263,9 @@ page {
.q-pt-md{
padding-top: 12px;
}
.q-pb-md{
padding-bottom: 10px;
}
.q-ma-lg{
margin:20px
}
......@@ -278,6 +281,9 @@ page {
.q-mt-lg{
margin-top:20px
}
.q-mb-md{
margin-bottom:10px
}
.q-mb-lg{
margin-bottom:20px
}
......
src/services/ConfigService.ts
View file @ 904ed5bc
......@@ -4,6 +4,13 @@ import Api,{ HttpResponse, Result } from './../utils/request';
* 配置相关方法
*/
class ConfigService{
/**
* 根据团期配置编号获取行程详情
*/
static async triptemplateGetTripConfig(params : any):Promise<HttpResponse>{
return Api.Post("triptemplate_GetTripConfig",params)
}
/**
* 新增修改模版数据
*/
......
src/store/screen.ts
View file @ 904ed5bc
......@@ -8,7 +8,7 @@ export interface ScreenState {
export const useScreenStore = defineStore('screen', {
state: (): ScreenState => ({
screening: false, // 是否进入放映状态
market: false
market: true
}),
actions: {
......
src/views/Market/Index.vue
View file @ 904ed5bc
<template>
<div style="padding: 30px; background: #f3f6fb;height:100vh;">
<div style="max-width:1440px; margin:0 auto;">
<div style="background: #f3f6fb;height:100vh;">
<div style="padding: 30px; max-width:1440px; margin:0 auto;">
<el-row justify="space-between">
<el-col :span="6">
<h1 class="alifont" style="font-size:20px;">智慧设计平台</h1>
......@@ -14,7 +14,7 @@
</el-col>
<el-col :span="6"></el-col>
</el-row>
<div class="q-mt-lg bg-white q-pa-lg rounded">
<div class="q-mt-lg bg-white rounded" style="padding: 20px 20px 0 20px;">
<div class="row text-small items-center">
<span style="margin-right: 50px;">适用线路：</span>
<el-check-tag :checked="queryObj.LineId == 0" @change="onLineChangeHandler(0)"
......@@ -23,42 +23,58 @@
class="text-small q-mr-md" v-for="x in lines" :key="x.LineID">{{x.LineName}}</el-check-tag>
</div>
<el-divider style="margin:12px 0;border-top-color:#f3f6fb;"></el-divider>
<div class="row text-small items-center">
<span style="margin-right: 50px;">适用国家：</span>
<el-check-tag :checked="queryObj.CountryName == ''" @change="onCountryNameChangeHandler('')"
class="text-small q-mr-md">通用</el-check-tag>
<el-check-tag :checked="queryObj.CountryName == x"
@change="onCountryNameChangeHandler(x.CountryName)" class="text-small q-mr-md"
v-for="(x,i) in countries" :key="i">{{x.CountryName}}</el-check-tag>
</div>
<el-divider style="margin:12px 0;border-top-color:#f3f6fb;"></el-divider>
<div class="row text-small items-center">
<span style="margin-right: 50px;">季节：</span>
<el-check-tag :checked="queryObj.SeasonName == ''" @change="onSeasonNameChangeHandler('')"
class="text-small q-mr-md">通用</el-check-tag>
<el-check-tag :checked="queryObj.SeasonName == x" @change="onSeasonNameChangeHandler(x.SeasonName)"
class="text-small q-mr-md" v-for="(x,i) in seasonArr" :key="i">{{x.SeasonName}}</el-check-tag>
</div>
<el-divider style="margin:12px 0;border-top-color:#f3f6fb;"></el-divider>
<div class="row text-small items-center">
<span style="margin-right: 50px;">颜色：</span>
<el-check-tag :checked="queryObj.ColorName == ''" @change="onColorNameChangeHandler('')"
class="text-small q-mr-md">通用</el-check-tag>
<el-check-tag :checked="queryObj.ColorName == x" @change="onColorNameChangeHandler(x.ColorName)"
class="text-small q-mr-md" v-for="(x,i) in colorArr" :key="i">{{x.ColorName}}</el-check-tag>
<div class="row wrap q-pb-md">
<div class="q-pb-md">
<div class="row text-small items-center">
<span style="margin-right: 50px;">适用国家：</span>
<el-check-tag :checked="queryObj.CountryName == ''" @change="onCountryNameChangeHandler('')"
class="text-small q-mr-md">通用</el-check-tag>
<el-check-tag :checked="queryObj.CountryName == x"
@change="onCountryNameChangeHandler(x.CountryName)" class="text-small q-mr-md"
v-for="(x,i) in countries" :key="i">{{x.CountryName}}</el-check-tag>
</div>
</div>
<div class="q-pb-md">
<div class="MarketVerticalLine">&nbsp;</div>
</div>
<div class="q-pb-md">
<div class="row text-small items-center">
<span style="margin-right: 50px;">季节：</span>
<el-check-tag :checked="queryObj.SeasonName == ''" @change="onSeasonNameChangeHandler('')"
class="text-small q-mr-md">通用</el-check-tag>
<el-check-tag :checked="queryObj.SeasonName == x" @change="onSeasonNameChangeHandler(x.SeasonName)"
class="text-small q-mr-md" v-for="(x,i) in seasonArr" :key="i">{{x.SeasonName}}</el-check-tag>
</div>
</div>
<div class="q-pb-md">
<div class="MarketVerticalLine">&nbsp;</div>
</div>
<div class="q-pb-md">
<div class="row text-small items-center">
<span style="margin-right: 50px;">颜色：</span>
<el-check-tag :checked="queryObj.ColorName == ''" @change="onColorNameChangeHandler('')"
class="text-small q-mr-md">通用</el-check-tag>
<el-check-tag :checked="queryObj.ColorName == x" @change="onColorNameChangeHandler(x.ColorName)"
class="text-small q-mr-md" v-for="(x,i) in colorArr" :key="i">{{x.ColorName}}</el-check-tag>
</div>
</div>
</div>
</div>
<div class="q-mt-lg bg-white q-pa-lg rounded" style="height:200px;">
<div class="q-mt-lg row wrap bg-white rounded" style="padding: 30px 10px;">
<template v-for="(item,index) in dataList">
<div style="width:200px;height:200px;" @click="goToTemplate(item)">
<img :src="item.CoverImg" style="width:100px;height:80px" />
<br />
<span>{{item.Title}}</span>
<div class="MarketIndexListBox">
<div class="MarketIndexList bg-white rounded" @click="goToTemplate(item)">
<div class="MarketIndexList-img">
<img :src="item.CoverImg" style="width:100%;height:100%" />
</div>
<div class="MarketIndexList-text">{{item.Title}}</div>
</div>
</div>
</template>
</div>
</div>
</div>
</template>
<script setup lang="ts">
......@@ -73,7 +89,7 @@
const {
userInfo
} = storeToRefs(userStore())
const line = ref([] as Array < any > ) //线路
const lines = ref([] as Array < any > ) //线路
const countries = ref(['日本', '韩国', '老挝', '法国', '意大利'] as Array < any > ) //国家
const colorArr = ref([] as Array < any > ); //颜色
const seasonArr = ref([] as Array < any > ); //季节
......@@ -94,10 +110,33 @@
searchData.value = inject(injectKeyTemplate)
const marketStore = useScreenStore()
const { screening, market } = storeToRefs(useScreenStore())
/**
* 根据团期配置编号获取行程详情
*/
const GetTripConfig = async () =>{
try {
let queryMsg = {
ConfigId: 0
}
if(!queryMsg.ConfigId) return
let datasRes = await ConfigService.triptemplateGetTripConfig(queryMsg);
if (datasRes.data.resultCode == 1) {
if(datasRes.data.data&&datasRes.data.data.length>0&&datasRes.data.data[0].TempId){
searchData.value.TempId = item.TempId
marketStore.setMarket(!market)
}
}
} catch (error) {
console.log("triptemplate_GetTripConfig", error);
}
}
/**
* 页面跳转
*/
const goToTemplate = (item: any) => {
return
// searchData.value.TempId = item.TempId
marketStore.setMarket(!market)
// console.log("item", item.TempId);
......@@ -187,7 +226,7 @@
queryTemplateBySearchHandler();
</script>
<style>
<style scoped>
@import url('../../assets/styles/common.css');
@font-face {
......@@ -207,4 +246,52 @@
font-weight: 500 !important;
font-size: 12px !important;
}
.MarketIndexListBox{
width: 20%;
margin-bottom: 20px;
padding: 0 10px;
cursor: pointer;
}
.MarketIndexList{
width: 100%;
}
.MarketIndexListBox:hover{
position: relative;
top: -5px;
}
.MarketIndexListBox:hover .MarketIndexList{
box-shadow: 0 5px 6px -3px #0003, 0 9px 12px 1px #00000024, 0 3px 16px 2px #0000001f;
}
.MarketIndexList-img{
position: relative;
width: 100%;
height: 0;
padding-top: 100%;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
overflow: hidden;
}
.MarketIndexList-img img{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.MarketIndexList-text{
font-size: 14px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding: 15px 20px 10px 20px;
}
.MarketVerticalLine{
width: 1px;
height: 80%;
background: #dcdfe6;
margin-right: 30px;
margin-top: 5px;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment