You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
883 lines
18 KiB
883 lines
18 KiB
<template>
|
|
<view class="main">
|
|
<!-- 顶部状态栏占位 -->
|
|
<view class="top" :style="{height:iSMT+'px'}"></view>
|
|
<deepExploration_header></deepExploration_header>
|
|
|
|
<view class="search">
|
|
<input v-model="searchName" class="searchInput" type="text" placeholder="请输入股票名称、股票代码"
|
|
placeholder-style="color: #A6A6A6; font-size: 22rpx;" />
|
|
<image @click="searchStock" class="seachIcon" src="/static/deepExploration-images/search.png"
|
|
mode="aspectFill"></image>
|
|
</view>
|
|
|
|
<view class="content">
|
|
<view class="select">
|
|
<image class="img" :src="navItems[currentIndex].icon" mode=""></image>
|
|
<view v-for="(item, index) in navItems" :key="index" class="selectItem"
|
|
:class="{ active: currentIndex === index }" @click="handleModel(index)">
|
|
<button class="btn"></button>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="graphAndTxt">
|
|
<view class="graph">
|
|
<view class="graph_header">
|
|
<view class="left">TESA</view>
|
|
<view class="center">
|
|
<image class="last" src="/static/deepExploration-images/last.png" mode="aspectFill"></image>
|
|
<text>Taewlkj.sejssssssssf</text>
|
|
<image class="next" src="/static/deepExploration-images/next.png" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="right">2025/10/26</view>
|
|
</view>
|
|
<view class="graph_data">
|
|
<text>435.900</text>
|
|
<text>22.410</text>
|
|
<text>5.120%</text>
|
|
</view>
|
|
<view class="graph_content">
|
|
<view class="charts-box">
|
|
<!-- uCharts 蜡烛图组件 -->
|
|
<qiun-data-charts type="candle" :opts="opts" :chartData="chartData" :disableScroll="true"
|
|
:ontouch="true" :onzoom="true" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="txt">
|
|
<view class="txtHeader">
|
|
<image src="/static/deepExploration-images/plus.png" mode="aspectFill"></image>
|
|
<text>{{navItems[currentIndex].name}}</text>
|
|
</view>
|
|
<view class="txtContent">
|
|
<view v-if="loading" class="loading">加载中...</view>
|
|
<rich-text :nodes="htmlContent"></rich-text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 底部切换栏 -->
|
|
<footerBar class="static-footer" :type="type"></footerBar>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,
|
|
onMounted
|
|
} from 'vue'
|
|
import deepExploration_header from '@/components/deepExploration_header.vue'
|
|
import footerBar from '@/components/footerBar.vue'
|
|
import {
|
|
onLoad
|
|
} from '@dcloudio/uni-app'
|
|
import {
|
|
getModel1First,
|
|
getModel1Second,
|
|
getModel2First,
|
|
getModel2Second,
|
|
getModel3First,
|
|
getModel3Second,
|
|
getModel4First,
|
|
getModel4Second,
|
|
} from '/api/deepExploration/deepExploration.js'
|
|
import marked from 'marked'; // 引入 marked 库
|
|
import hljs from 'highlight.js';
|
|
import 'highlight.js/styles/atom-one-dark.css'; // 可替换为其他主题
|
|
|
|
// 响应式变量定义
|
|
const type = ref('deepExploration')
|
|
const iSMT = ref(0)
|
|
const currentIndex = ref(0)
|
|
const navItems = ref([{
|
|
name: '主力追踪',
|
|
icon: '/static/deepExploration-images/1.png'
|
|
},
|
|
{
|
|
name: '主力雷达',
|
|
icon: '/static/deepExploration-images/2.png'
|
|
},
|
|
{
|
|
name: '主力解码',
|
|
icon: '/static/deepExploration-images/3.png'
|
|
},
|
|
{
|
|
name: '主力资金流',
|
|
icon: '/static/deepExploration-images/4.png'
|
|
},
|
|
])
|
|
|
|
//搜索股票
|
|
const searchStock = () => {
|
|
console.log('搜索参数：', stockName.value);
|
|
if (currentIndex.value == 0) {
|
|
handleModel(0)
|
|
} else if (currentIndex.value == 1) {
|
|
console.log(index);
|
|
handleModel(1)
|
|
} else if (currentIndex.value == 2) {
|
|
console.log(index);
|
|
handleModel(2)
|
|
} else if (currentIndex.value == 3) {
|
|
console.log(index);
|
|
handleModel(3)
|
|
} else {
|
|
uni.showToast({
|
|
title: '请选择模块',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
}
|
|
|
|
}
|
|
//点击四大模块
|
|
const handleModel = (index) => {
|
|
currentIndex.value = index
|
|
if (currentIndex.value == 0) {
|
|
console.log(index);
|
|
handleTrack()
|
|
} else if (currentIndex.value == 1) {
|
|
console.log(index);
|
|
handleRadar()
|
|
} else if (currentIndex.value == 2) {
|
|
console.log(index);
|
|
handleDecode()
|
|
} else if (currentIndex.value == 3) {
|
|
console.log(index);
|
|
handleCapitalFlow()
|
|
}
|
|
}
|
|
|
|
const stockName = ref('')
|
|
const searchName = ref('')
|
|
const stockCode = ref('')
|
|
const language = ref('')
|
|
const recordId = ref('')
|
|
const parentId = ref('')
|
|
const stockId = ref('')
|
|
|
|
const loading = ref(true);
|
|
const error = ref('');
|
|
const htmlContent = ref('');
|
|
const markdownContent = ref('');
|
|
|
|
// 初始化 marked 配置（支持代码高亮）
|
|
marked.setOptions({
|
|
highlight: (code, lang) => {
|
|
if (lang && hljs.getLanguage(lang)) {
|
|
return hljs.highlight(code, { language: lang }).value;
|
|
}
|
|
return hljs.highlightAuto(code).value;
|
|
},
|
|
breaks: true,
|
|
gfm: true,
|
|
sanitize: true, // 过滤掉 Markdown 中的 inline style（可能导致横向溢出）
|
|
sanitizer: (html) => {
|
|
// 移除所有 style 属性，避免后端返回的 Markdown 带强制横向样式
|
|
return html.replace(/style="[^"]*"/g, '');
|
|
}
|
|
});
|
|
|
|
//点击主力追踪
|
|
const handleTrack = async () => {
|
|
try {
|
|
markdownContent.value = '\n## 📊 主力解码分析：\n### 序列密码\n\tL2情绪解码。当前股票序列密码为53、0、17、158，市场情绪未出现确定性转折。\n\n### 股票温度\n\tL1情绪监控。当前股票温度为51，处于温热区，情绪积极向上，资金稳步进场。趋势健康，量价配合良好。此时应积极跟随趋势，顺势而为。\n\n### 市场温度\n\t当前市场温度为61，处于温热区，指数温和上行，技术面呈多头排列，资金有序进场，赚钱效应扩散。需警惕市场风险，以规避“甜蜜陷阱”。\n '
|
|
htmlContent.value = marked.parse(markdownContent.value);
|
|
loading.value = true;
|
|
// const result = await getModel1First({
|
|
// content: searchName.value,
|
|
// language: "cn",
|
|
// marketList: "hk,cn,usa,my,sg,vi,in,gb",
|
|
// model: 1
|
|
// })
|
|
// console.log('result', result);
|
|
// if (result.code == 200) {
|
|
// stockCode.value = result.data.code
|
|
// stockName.value = result.data.name
|
|
// recordId.value = result.data.recordId
|
|
// parentId.value = result.data.parentId
|
|
// stockId.value = result.data.stockId
|
|
// language.value = result.data.language
|
|
// const res = await getModel1Second({
|
|
// language: language.value,
|
|
// recordId: recordId.value,
|
|
// parentId: parentId.value,
|
|
// stockId: stockId.value,
|
|
// token: 'pCtw6AYK0EHAaIexoFHsbZjtsfEAIhcmwkCFm6uKko8VPfMvyDiODL9v9c0veic9fIpQbvT8zN4sH/Si6Q'
|
|
// })
|
|
// if (res.code == 200) {
|
|
// markdownContent.value = res.data.markdown
|
|
// htmlContent.value = marked.parse(markdownContent.value);
|
|
// }
|
|
// console.log('res', res);
|
|
// }
|
|
|
|
} catch {
|
|
error.value = e.message || '加载失败，请重试';
|
|
}finally{
|
|
loading.value = false;
|
|
}
|
|
}
|
|
|
|
//点击主力雷达
|
|
const handleRadar = () => {
|
|
|
|
}
|
|
|
|
//点击主力解码
|
|
const handleDecode = () => {
|
|
|
|
}
|
|
|
|
//点击主力资金流
|
|
const handleCapitalFlow = () => {
|
|
|
|
}
|
|
|
|
|
|
// 1. K线图配置
|
|
const opts = ref({
|
|
rotate: false,
|
|
rotateLock: false,
|
|
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
|
|
padding: [15, 15, 0, 15],
|
|
dataLabel: false,
|
|
enableScroll: true,
|
|
enableMarkLine: false,
|
|
legend: {},
|
|
xAxis: {
|
|
labelCount: 4,
|
|
itemCount: 30,
|
|
disableGrid: true,
|
|
gridColor: "#CCCCCC",
|
|
gridType: "solid",
|
|
dashLength: 4,
|
|
scrollShow: false,
|
|
scrollAlign: "left",
|
|
scrollColor: "#A6A6A6",
|
|
scrollBackgroundColor: "#EFEBEF",
|
|
labelColor: "#8C8C8C",
|
|
fontSize: 9
|
|
},
|
|
yAxis: {
|
|
labelColor: "#8C8C8C",
|
|
fontSize: 9
|
|
},
|
|
extra: {
|
|
candle: {
|
|
color: {
|
|
upLine: "#f04864",
|
|
upFill: "#f04864",
|
|
downLine: "#2fc25b",
|
|
downFill: "#2fc25b"
|
|
},
|
|
average: {
|
|
show: false,
|
|
name: ["MA5", "MA10", "MA30"],
|
|
day: [5, 10, 20],
|
|
color: ["#1890ff", "#2fc25b", "#facc14"]
|
|
}
|
|
},
|
|
markLine: {
|
|
type: "dash",
|
|
dashLength: 5,
|
|
data: [{
|
|
value: 2150,
|
|
lineColor: "#f04864",
|
|
showLabel: false
|
|
},
|
|
{
|
|
value: 2350,
|
|
lineColor: "#f04864",
|
|
showLabel: false
|
|
}
|
|
]
|
|
},
|
|
tooltip: {
|
|
showCategory: true
|
|
}
|
|
}
|
|
})
|
|
|
|
// 2. K线图数据（响应式定义）
|
|
const chartData = ref({})
|
|
|
|
// 获取K线数据函数（直接定义，无需methods）
|
|
const getServerData = () => {
|
|
// 模拟服务器请求延时
|
|
setTimeout(() => {
|
|
const res = {
|
|
"categories": [
|
|
"2025/08/25",
|
|
"2025/08/26",
|
|
"2025/08/27",
|
|
"2025/08/28",
|
|
"2025/08/29",
|
|
"2025/09/01",
|
|
"2025/09/02",
|
|
"2025/09/03",
|
|
"2025/09/04",
|
|
"2025/09/05",
|
|
"2025/09/08",
|
|
"2025/09/09",
|
|
"2025/09/10",
|
|
"2025/09/11",
|
|
"2025/09/12",
|
|
"2025/09/15",
|
|
"2025/09/16",
|
|
"2025/09/17",
|
|
"2025/09/18",
|
|
"2025/09/19",
|
|
"2025/09/22",
|
|
"2025/09/23",
|
|
"2025/09/24",
|
|
"2025/09/25",
|
|
"2025/09/26",
|
|
"2025/09/29",
|
|
"2025/09/30",
|
|
"2025/10/09",
|
|
"2025/10/10",
|
|
"2025/10/13",
|
|
"2025/10/14",
|
|
"2025/10/15",
|
|
"2025/10/16",
|
|
"2025/10/17",
|
|
"2025/10/20",
|
|
"2025/10/21",
|
|
"2025/10/22",
|
|
"2025/10/23",
|
|
"2025/10/24",
|
|
"2025/10/27"
|
|
],
|
|
series: [{
|
|
"name": "贵州茅台",
|
|
"data": [
|
|
[
|
|
1470.01,
|
|
1496.0,
|
|
1466.0,
|
|
1499.33
|
|
],
|
|
[
|
|
1490.32,
|
|
1474.23,
|
|
1480.01,
|
|
1481.61
|
|
],
|
|
[
|
|
1481.88,
|
|
1484.93,
|
|
1448.0,
|
|
1448.0
|
|
],
|
|
[
|
|
1447.97,
|
|
1456.1,
|
|
1438.77,
|
|
1446.1
|
|
],
|
|
[
|
|
1453.0,
|
|
1482.58,
|
|
1452.0,
|
|
1480.0
|
|
],
|
|
[
|
|
1482.2,
|
|
1488.0,
|
|
1465.7,
|
|
1476.1
|
|
],
|
|
[
|
|
1478.66,
|
|
1509.0,
|
|
1478.0,
|
|
1491.3
|
|
],
|
|
[
|
|
1491.0,
|
|
1503.5,
|
|
1466.0,
|
|
1480.55
|
|
],
|
|
[
|
|
1472.0,
|
|
1479.3,
|
|
1460.47,
|
|
1480.66
|
|
],
|
|
[
|
|
1471.0,
|
|
1486.97,
|
|
1464.0,
|
|
1483.0
|
|
],
|
|
[
|
|
1483.0,
|
|
1506.44,
|
|
1477.5,
|
|
1501.23
|
|
],
|
|
[
|
|
1505.0,
|
|
1509.95,
|
|
1493.42,
|
|
1505.0
|
|
],
|
|
[
|
|
1506.66,
|
|
1529.95,
|
|
1496.0,
|
|
1522.01
|
|
],
|
|
[
|
|
1522.01,
|
|
1526.02,
|
|
1508.5,
|
|
1523.5
|
|
],
|
|
[
|
|
1526.0,
|
|
1538.02,
|
|
1510.53,
|
|
1516.0
|
|
],
|
|
[
|
|
1515.87,
|
|
1517.48,
|
|
1501.5,
|
|
1515.1
|
|
],
|
|
[
|
|
1515.1,
|
|
1520.99,
|
|
1496.21,
|
|
1499.98
|
|
],
|
|
[
|
|
1499.99,
|
|
1510.28,
|
|
1490.01,
|
|
1493.0
|
|
],
|
|
[
|
|
1492.0,
|
|
1497.8,
|
|
1463.5,
|
|
1467.96
|
|
],
|
|
[
|
|
1467.99,
|
|
1475.5,
|
|
1457.01,
|
|
1467.97
|
|
],
|
|
[
|
|
1465.09,
|
|
1467.97,
|
|
1450.01,
|
|
1453.35
|
|
],
|
|
[
|
|
1450.5,
|
|
1457.5,
|
|
1440.0,
|
|
1447.42
|
|
],
|
|
[
|
|
1434.07,
|
|
1456.78,
|
|
1434.07,
|
|
1442.0
|
|
],
|
|
[
|
|
1442.83,
|
|
1445.21,
|
|
1436.0,
|
|
1439.0
|
|
],
|
|
[
|
|
1441.18,
|
|
1447.11,
|
|
1428.01,
|
|
1435.0
|
|
],
|
|
[
|
|
1439.38,
|
|
1469.99,
|
|
1435.0,
|
|
1460.86
|
|
],
|
|
[
|
|
1460.0,
|
|
1460.76,
|
|
1440.0,
|
|
1443.99
|
|
],
|
|
[
|
|
1436.0,
|
|
1439.38,
|
|
1420.0,
|
|
1436.78
|
|
],
|
|
[
|
|
1437.6,
|
|
1439.94,
|
|
1427.5,
|
|
1430.0
|
|
],
|
|
[
|
|
1415.7,
|
|
1422.85,
|
|
1415.12,
|
|
1419.2
|
|
],
|
|
[
|
|
1429.99,
|
|
1464.0,
|
|
1429.99,
|
|
1451.02
|
|
],
|
|
[
|
|
1450.98,
|
|
1463.0,
|
|
1445.08,
|
|
1462.0
|
|
],
|
|
[
|
|
1461.92,
|
|
1484.95,
|
|
1458.88,
|
|
1484.91
|
|
],
|
|
[
|
|
1483.1,
|
|
1488.0,
|
|
1454.03,
|
|
1455.0
|
|
],
|
|
[
|
|
1455.0,
|
|
1469.5,
|
|
1454.88,
|
|
1457.93
|
|
],
|
|
[
|
|
1459.0,
|
|
1469.94,
|
|
1455.5,
|
|
1462.26
|
|
],
|
|
[
|
|
1462.08,
|
|
1465.73,
|
|
1456.0,
|
|
1458.7
|
|
],
|
|
[
|
|
1455.0,
|
|
1468.8,
|
|
1447.2,
|
|
1467.98
|
|
],
|
|
[
|
|
1467.95,
|
|
1478.88,
|
|
1449.34,
|
|
1450.0
|
|
],
|
|
[
|
|
1440.0,
|
|
1452.49,
|
|
1435.99,
|
|
1440.41
|
|
]
|
|
],
|
|
}]
|
|
}
|
|
// 给响应式变量赋值（需修改.value）
|
|
chartData.value = JSON.parse(JSON.stringify(res))
|
|
}, 500)
|
|
}
|
|
|
|
// 生命周期钩子：组件挂载后执行（替代onReady）
|
|
onMounted(() => {
|
|
iSMT.value = uni.getSystemInfoSync().statusBarHeight
|
|
getServerData() // 调用数据获取函数
|
|
})
|
|
|
|
// 页面加载时执行
|
|
onLoad((e) => {
|
|
if (e.index) {
|
|
currentIndex.value = e.index - 1
|
|
console.log('模块：', currentIndex.value)
|
|
}
|
|
if (e.stockName) {
|
|
stockName.value = e.stockName
|
|
console.log('股票名称：', stockName.value)
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.main {
|
|
width: 100%;
|
|
min-height: 100vh;
|
|
background-color: #fff;
|
|
padding-bottom: 120rpx;
|
|
|
|
.search {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
background-color: #F3F3F3;
|
|
width: calc(100% - 60rpx);
|
|
height: 80rpx;
|
|
border-radius: 50rpx;
|
|
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
|
|
padding: 0 40rpx;
|
|
margin: 15rpx 30rpx 0 30rpx;
|
|
|
|
.seachIcon {
|
|
position: absolute;
|
|
right: 50rpx;
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
}
|
|
|
|
.searchInput {
|
|
color: #111;
|
|
}
|
|
}
|
|
|
|
.content {
|
|
margin-top: 30rpx;
|
|
padding-top: 30rpx;
|
|
background-color: rgb(248, 248, 248);
|
|
|
|
.select {
|
|
position: relative;
|
|
margin-bottom: -5rpx;
|
|
|
|
.img {
|
|
width: 750rpx;
|
|
height: 198rpx;
|
|
}
|
|
|
|
.selectItem {
|
|
.btn {
|
|
position: absolute;
|
|
width: 120rpx;
|
|
height: 150rpx;
|
|
background-color: transparent;
|
|
|
|
&::after {
|
|
border: none;
|
|
}
|
|
}
|
|
|
|
&:nth-of-type(1) .btn {
|
|
top: 30rpx;
|
|
left: 60rpx;
|
|
}
|
|
|
|
&:nth-of-type(2) .btn {
|
|
top: 30rpx;
|
|
left: 230rpx;
|
|
}
|
|
|
|
&:nth-of-type(3) .btn {
|
|
top: 30rpx;
|
|
left: 400rpx;
|
|
}
|
|
|
|
&:nth-of-type(4) .btn {
|
|
top: 30rpx;
|
|
left: 570rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.graphAndTxt {
|
|
background-color: #fff;
|
|
border-radius: 50rpx 50rpx 0 0;
|
|
padding: 68.6rpx 36.5rpx 0 36.5rpx;
|
|
|
|
.graph {
|
|
border: 1rpx solid #e2e2e2;
|
|
border-radius: 30rpx 30rpx 0 0;
|
|
|
|
.graph_header {
|
|
padding: 32rpx 20.5rpx 0 24rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.left {
|
|
color: #333333;
|
|
font-family: "PingFang SC";
|
|
font-size: 15px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 15px;
|
|
}
|
|
|
|
.center {
|
|
margin-left: 105rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
text {
|
|
width: 160rpx;
|
|
height: 36rpx;
|
|
padding-left: 10rpx;
|
|
color: #000000;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
text-align: center;
|
|
font-family: "PingFang SC";
|
|
font-size: 18px;
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
line-height: 18px;
|
|
}
|
|
|
|
.last {
|
|
width: 15rpx;
|
|
height: 20rpx;
|
|
margin-right: 30rpx;
|
|
}
|
|
|
|
.next {
|
|
width: 15rpx;
|
|
height: 20rpx;
|
|
margin-left: 30rpx;
|
|
}
|
|
}
|
|
|
|
.right {
|
|
margin-left: 50rpx;
|
|
color: #6a6a6a;
|
|
font-family: "PingFang SC";
|
|
font-size: 13px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 15px;
|
|
}
|
|
}
|
|
|
|
.graph_data {
|
|
display: flex;
|
|
padding: 48rpx 24rpx;
|
|
|
|
text {
|
|
display: flex;
|
|
color: #25ba5d;
|
|
font-family: "PingFang SC";
|
|
font-size: 17px;
|
|
line-height: 17px;
|
|
}
|
|
|
|
text:nth-child(2) {
|
|
margin-left: 120rpx;
|
|
}
|
|
|
|
text:nth-child(3) {
|
|
margin-left: 150rpx;
|
|
}
|
|
}
|
|
|
|
.graph_content {
|
|
.charts-box {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
|
|
.txt {
|
|
background-color: #F3F3F3;
|
|
margin-top: 48rpx;
|
|
border-radius: 30rpx;
|
|
|
|
.txtHeader {
|
|
padding: 30rpx 24rpx;
|
|
|
|
image {
|
|
width: 20rpx;
|
|
height: 20rpx;
|
|
}
|
|
|
|
text {
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
padding: 0 22rpx;
|
|
border-radius: 22rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
line-height: 37rpx;
|
|
}
|
|
}
|
|
|
|
.txtContent {
|
|
min-height: 200rpx;
|
|
padding: 20rpx 30rpx;
|
|
margin-bottom: 100rpx;
|
|
::v-deep * {
|
|
box-sizing: border-box;
|
|
width: 100% !important; // 强制所有解析后的标签占满容器宽度
|
|
white-space: normal !important; // 取消强制不换行
|
|
word-wrap: break-word !important; // 长词/长数字自动换行
|
|
}
|
|
|
|
// 标题样式（确保换行）
|
|
::v-deep h2 {
|
|
font-size: 32rpx;
|
|
color: #333;
|
|
margin: 25rpx 0 15rpx;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
// 段落样式（核心换行控制）
|
|
::v-deep p {
|
|
font-size: 26rpx;
|
|
color: #666;
|
|
margin: 15rpx 0;
|
|
line-height: 1.8; // 增加行高，提升可读性
|
|
text-align: justify; // 两端对齐，避免单侧参差不齐
|
|
}
|
|
|
|
// 列表样式（纵向排列）
|
|
::v-deep ul, ::v-deep ol {
|
|
margin: 15rpx 0 15rpx 30rpx;
|
|
}
|
|
|
|
::v-deep li {
|
|
margin: 10rpx 0;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
// 加载状态样式
|
|
.loading {
|
|
text-align: center;
|
|
padding: 50rpx 0;
|
|
color: #666;
|
|
font-size: 26rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.static-footer {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
</style>
|