fixed
This commit is contained in:
quantulr
@ -15,7 +15,7 @@
|
||||
</el-breadcrumb>
|
||||
<div>
|
||||
<ul class="_list" v-loading="loading">
|
||||
<li v-for="item in state.list" :key="item" @click="handlePath(item.id)">
|
||||
<li v-for="item in props.data" :key="item" @click="handlePath(item.id)">
|
||||
<el-image
|
||||
style="width: 100%; height: 135px"
|
||||
:src="item.image"
|
||||
@ -26,7 +26,7 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="conter1400" style="position: relative">
|
||||
<!-- <div class="conter1400" style="position: relative">
|
||||
<pagination
|
||||
:total="state.total"
|
||||
:pageSizes="state.pageSizes"
|
||||
@ -35,7 +35,7 @@
|
||||
:autoScroll="false"
|
||||
@pagination="getDataList"
|
||||
/>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
@ -47,34 +47,25 @@ function handlePath(id) {
|
||||
let routeData = router.resolve({ path: `/solution/detail/${id}/` });
|
||||
window.open(routeData.href, "_blank");
|
||||
}
|
||||
async function solution_case_list() {
|
||||
return {
|
||||
code: 200,
|
||||
message: "ok",
|
||||
data: {
|
||||
data: [
|
||||
{
|
||||
id: "DXN0wBPaQldP",
|
||||
title: "复杂条件下城际轨道交通地下结构施工关键技术研究",
|
||||
image:
|
||||
"https://www.casshare.com/upimages/upload/20220310/9784d1c88922ef03f75ebc2a2db25f14.jpg",
|
||||
description: "复杂条件下城际轨道交通地下结构施工关键技术研究",
|
||||
},
|
||||
],
|
||||
count: 1,
|
||||
},
|
||||
};
|
||||
// return request({
|
||||
// url: "/v1/service/solution_case/list",
|
||||
// method: "post",
|
||||
// data: {
|
||||
// kind_id: props.oneLevelTitle.id,
|
||||
// page_num: state.pageNum,
|
||||
// page_size: state.pageSize,
|
||||
// },
|
||||
// });
|
||||
}
|
||||
const loading = ref(true);
|
||||
// async function solution_case_list() {
|
||||
// return {
|
||||
// code: 200,
|
||||
// message: "ok",
|
||||
// data: {
|
||||
// data: [
|
||||
// {
|
||||
// id: "DXN0wBPaQldP",
|
||||
// title: "复杂条件下城际轨道交通地下结构施工关键技术研究",
|
||||
// image:
|
||||
// "https://www.casshare.com/upimages/upload/20220310/9784d1c88922ef03f75ebc2a2db25f14.jpg",
|
||||
// description: "复杂条件下城际轨道交通地下结构施工关键技术研究",
|
||||
// },
|
||||
// ],
|
||||
// count: 1,
|
||||
// },
|
||||
// };
|
||||
// }
|
||||
const loading = ref(false);
|
||||
|
||||
const state = reactive({
|
||||
pageNum: 1,
|
||||
@ -83,6 +74,7 @@ const state = reactive({
|
||||
total: 0,
|
||||
list: [],
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
isShowMore: {
|
||||
type: Boolean,
|
||||
@ -96,28 +88,33 @@ const props = defineProps({
|
||||
type: String,
|
||||
default: "查看更多",
|
||||
},
|
||||
data: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
console.log(props.data);
|
||||
const emit = defineEmits();
|
||||
function handleShow() {
|
||||
emit("update:isShowMore", false);
|
||||
}
|
||||
|
||||
function getDataList() {
|
||||
loading.value = true;
|
||||
solution_case_list()
|
||||
.then((res) => {
|
||||
if (200 == res.code) {
|
||||
state.total = res.data.count;
|
||||
state.list = res.data.data;
|
||||
loading.value = false;
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
// loading.value = true;
|
||||
// solution_case_list()
|
||||
// .then((res) => {
|
||||
// if (200 == res.code) {
|
||||
// state.total = res.data.count;
|
||||
// state.list = res.data.data;
|
||||
// loading.value = false;
|
||||
// }
|
||||
// })
|
||||
// .catch(() => {
|
||||
// loading.value = false;
|
||||
// });
|
||||
}
|
||||
onMounted(() => {
|
||||
getDataList();
|
||||
// getDataList();
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -1,127 +1,125 @@
|
||||
<template>
|
||||
<div class="bg">
|
||||
<div class="conter1400" v-loading="loading">
|
||||
<div class="head">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<span class="one">服务案例</span>
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>
|
||||
<span>服务案例详情</span>
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="title">
|
||||
<div>{{ state.data.title }}</div>
|
||||
<div class="bg">
|
||||
<div class="conter1400" v-loading="loading">
|
||||
<div class="head">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<span class="one">服务案例</span>
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>
|
||||
<span>服务案例详情</span>
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="title">
|
||||
<div>{{ state.data.title }}</div>
|
||||
|
||||
<div class="description">
|
||||
<span class="visits">浏览量：{{ state.data.visits }}</span>
|
||||
<span>{{ parseTime(state.data.created_at) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="html" v-html="state.data.content"></div>
|
||||
</div>
|
||||
<div class="description">
|
||||
<span class="visits">浏览量：{{ state.data.visits }}</span>
|
||||
<span>{{ parseTime(state.data.created_at) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<webFooter></webFooter>
|
||||
|
||||
<div class="html" v-html="state.data.content"></div>
|
||||
</div>
|
||||
</div>
|
||||
<webFooter></webFooter>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { nextTick, onMounted } from "vue";
|
||||
import seeMore from "./components/seeMore.vue";
|
||||
import { getInfo } from "@/api/website/solution/index";
|
||||
import webFooter from "@/components/webFooter/index.vue";
|
||||
import request from '@/utils/request'
|
||||
import request from "@/utils/request";
|
||||
|
||||
function detail (id) {
|
||||
return request({
|
||||
url: '/v1/service/solution_case/detail',
|
||||
method: 'post',
|
||||
data: { id }
|
||||
})
|
||||
function detail(id) {
|
||||
return request({
|
||||
url: "/v1/service/solution_case/detail",
|
||||
method: "post",
|
||||
data: { id },
|
||||
});
|
||||
}
|
||||
|
||||
const loading = ref(true);
|
||||
|
||||
const state = reactive({
|
||||
data: {},
|
||||
data: {},
|
||||
});
|
||||
const route = useRoute();
|
||||
watch(route, () => {
|
||||
getData()
|
||||
})
|
||||
getData();
|
||||
});
|
||||
onMounted(() => {
|
||||
getData()
|
||||
getData();
|
||||
});
|
||||
|
||||
function getData () {
|
||||
let id = route.params.id;
|
||||
if (!id) return
|
||||
detail(id).then(res => {
|
||||
if (200 == res.code) {
|
||||
state.data = res.data;
|
||||
loading.value = false;
|
||||
}
|
||||
}).catch(() => {
|
||||
loading.value = false;
|
||||
function getData() {
|
||||
let id = route.params.id;
|
||||
if (!id) return;
|
||||
getInfo({ id })
|
||||
.then((resp) => {
|
||||
state.data = resp.data;
|
||||
loading.value = false;
|
||||
})
|
||||
.catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bg {
|
||||
background: rgba(242, 246, 255, 1);
|
||||
min-height: 100%;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.conter1400 {
|
||||
flex: 1;
|
||||
background: rgba(242, 246, 255, 1);
|
||||
min-height: 100%;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.conter1400 {
|
||||
flex: 1;
|
||||
}
|
||||
.head {
|
||||
padding: 30px 0 20px 0;
|
||||
span {
|
||||
font-size: 16px;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
.head {
|
||||
padding: 30px 0 20px 0;
|
||||
span {
|
||||
font-size: 16px;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
.one {
|
||||
color: #333333;
|
||||
}
|
||||
.one {
|
||||
color: #333333;
|
||||
}
|
||||
.content {
|
||||
background: #fff;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.content {
|
||||
background: #fff;
|
||||
margin-bottom: 40px;
|
||||
|
||||
.title,
|
||||
.html {
|
||||
padding: 30px 40px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
border-bottom: 1px solid #dcdcdc;
|
||||
.description {
|
||||
padding-top: 20px;
|
||||
font-size: 14px;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
.visits {
|
||||
display: inline-block;
|
||||
width: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.title,
|
||||
.html {
|
||||
padding: 30px 40px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
border-bottom: 1px solid #dcdcdc;
|
||||
.description {
|
||||
padding-top: 20px;
|
||||
font-size: 14px;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
.visits {
|
||||
display: inline-block;
|
||||
width: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
<style></style>
|
||||
|
||||
@ -62,7 +62,7 @@
|
||||
<div class="_list conter1400">
|
||||
<ul>
|
||||
<li
|
||||
v-for="child in item.children"
|
||||
v-for="child in item.children.slice(0, 2)"
|
||||
:key="child.id"
|
||||
@click="handlePath(child.id)"
|
||||
>
|
||||
@ -85,6 +85,7 @@
|
||||
</div>
|
||||
<seeMore
|
||||
v-if="isShowMore"
|
||||
:data="moreData"
|
||||
v-model:isShowMore="isShowMore"
|
||||
v-model:oneLevelTitle="oneLevelTitle"
|
||||
></seeMore>
|
||||
@ -92,11 +93,12 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { nextTick, onMounted } from "vue";
|
||||
import { nextTick, onMounted, reactive } from "vue";
|
||||
import seeMore from "./components/seeMore.vue";
|
||||
import webFooter from "@/components/webFooter/index.vue";
|
||||
import { banner } from "@/api/website/home/index";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { getCase } from "@/api/website/solution";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
@ -104,10 +106,8 @@ function handlePath(id) {
|
||||
let routeData = router.resolve({ path: `/solution/detail/${id}/` });
|
||||
window.open(routeData.href, "_blank");
|
||||
}
|
||||
function solution_case(mode) {
|
||||
return { code: 200, message: "ok", data: [] };
|
||||
}
|
||||
|
||||
let moreData = ref([]);
|
||||
const loading = ref(true);
|
||||
const oneLevelTitle = ref({});
|
||||
const modeDict = { small: 101, large: 102, government: 103, scientific: 104 };
|
||||
@ -146,41 +146,11 @@ function initData() {
|
||||
if (!name) return;
|
||||
let mode = modeDict[name];
|
||||
let key = keyDict[name];
|
||||
let res = {};
|
||||
if (name == "large") {
|
||||
res = {
|
||||
code: 200,
|
||||
message: "ok",
|
||||
data: [
|
||||
{
|
||||
id: "oKZkJoBa9lmX",
|
||||
mode: 102,
|
||||
title: "技术资讯",
|
||||
image:
|
||||
"https://www.casshare.com/upimages/upload/20220310/e461612dff5675507d04885174397d40.png",
|
||||
description:
|
||||
"内部技术成果孵化\n\n提供从顶层设计到项目市场化的\n 全套解决方案，加速大企业内部创新创业\n 提高内孵成功率\n\n 孵化机制设计咨询 商业培训资源对接\n 产品体系延伸拓展 项目落地渠道对接",
|
||||
children: [
|
||||
{
|
||||
id: "DXN0wBPaQldP",
|
||||
title: "复杂条件下城际轨道交通地下结构施工关键技术研究",
|
||||
image:
|
||||
"https://www.casshare.com/upimages/upload/20220310/9784d1c88922ef03f75ebc2a2db25f14.jpg",
|
||||
description: "复杂条件下城际轨道交通地下结构施工关键技术研究",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
} else {
|
||||
res = { code: 200, message: "ok", data: [] };
|
||||
}
|
||||
// solution_case(mode).then((res) => {
|
||||
// if (200 == res.code) {
|
||||
state.caseList = res.data;
|
||||
initScroll();
|
||||
// }
|
||||
// });
|
||||
|
||||
getCase({ mode }).then((res) => {
|
||||
state.caseList = res.data;
|
||||
initScroll();
|
||||
});
|
||||
loading.value = true;
|
||||
banner({ locals: key })
|
||||
.then((resp) => {
|
||||
@ -230,7 +200,6 @@ function setScrollTop(id, index) {
|
||||
isShowMore.value = false;
|
||||
nextTick(() => {
|
||||
window.scrollTo({
|
||||
// - 80
|
||||
top: itemRefs[index].offsetTop,
|
||||
});
|
||||
});
|
||||
@ -240,6 +209,8 @@ function isOddEvenNumber(num) {
|
||||
return num % 2 == 0 ? false : true;
|
||||
}
|
||||
function handleShowMore(item) {
|
||||
console.log(item);
|
||||
moreData.value = item.children;
|
||||
oneLevelTitle.value = item;
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
|
||||
Reference in New Issue
Block a user