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.
349 lines
8.4 KiB
349 lines
8.4 KiB
<template>
|
|
<view class="main">
|
|
<view :style="{height:iSMT+'px'}"></view>
|
|
|
|
<view class="time-share-title">
|
|
<text>分时设计</text>
|
|
</view>
|
|
<view style="height:57.5vh;background-color: white;">
|
|
<view class="title">A股竞价</view>
|
|
<view class="top-options">
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': aStockBid === 'auto' }"
|
|
@click="handleAStockBidChange('auto')"
|
|
>
|
|
<text>智能开启</text>
|
|
<view class="active-dot" v-if="aStockBid === 'auto'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': aStockBid === 'open' }"
|
|
@click="handleAStockBidChange('open')"
|
|
>
|
|
<text>保持开启</text>
|
|
<view class="active-dot" v-if="aStockBid === 'open'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': aStockBid === 'close' }"
|
|
@click="handleAStockBidChange('close')"
|
|
>
|
|
<text>保持关闭</text>
|
|
<view class="active-dot" v-if="aStockBid === 'close'"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="title">K线样式</view>
|
|
<view class="top-options">
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': kStyle === 'common' }"
|
|
@click="handleKStyleChange('common')"
|
|
>
|
|
<image src="../../static/my/common.png" class="kline-icon" />
|
|
<text>普通</text>
|
|
<view class="active-dot" v-if="kStyle === 'common'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': kStyle === 'outline' }"
|
|
@click="handleKStyleChange('outline')"
|
|
>
|
|
<image src="../../static/my/outline.png" class="kline-icon" />
|
|
<text>轮廓图</text>
|
|
<view class="active-dot" v-if="kStyle === 'outline'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': kStyle === 'polylines' }"
|
|
@click="handleKStyleChange('polylines')"
|
|
>
|
|
<image src="../../static/my/polylines.png" class="kline-icon" />
|
|
<text>折线图</text>
|
|
<view class="active-dot" v-if="kStyle === 'polylines'"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="title">除权类型</view>
|
|
<view class="top-options">
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': exRights === 'exRights' }"
|
|
@click="handleExRightsChange('exRights')"
|
|
>
|
|
<text>除权</text>
|
|
<view class="active-dot" v-if="exRights === 'exRights'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': exRights === 'normal' }"
|
|
@click="handleExRightsChange('normal')"
|
|
>
|
|
<text>普通</text>
|
|
<view class="active-dot" v-if="exRights === 'normal'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': exRights === 'weighted' }"
|
|
@click="handleExRightsChange('weighted')"
|
|
>
|
|
<text>加权</text>
|
|
<view class="active-dot" v-if="exRights === 'weighted'"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="title">涨跌颜色</view>
|
|
<view class="top-options">
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': rfColor === 'greenUp' }"
|
|
@click="handleRfColorChange('greenUp')"
|
|
>
|
|
<view class="color-icon">
|
|
<image src="../../static/my/greenRise.png" class="kline-icon" />
|
|
</view>
|
|
<text>绿涨红跌</text>
|
|
<view class="active-dot" v-if="rfColor === 'greenUp'"></view>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': rfColor === 'red' }"
|
|
@click="handleRfColorChange('red')"
|
|
>
|
|
<view class="color-icon">
|
|
<image src="../../static/my/redRise.png" class="kline-icon" />
|
|
</view>
|
|
<text>红涨绿跌</text>
|
|
<view class="active-dot" v-if="rfColor === 'redUp'"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="title">副图指标个数</view>
|
|
<view class="top-options">
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': indexCount === 1 }"
|
|
@click="handleIndexCountChange(1)"
|
|
>
|
|
<text>1</text>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': indexCount === 2 }"
|
|
@click="handleIndexCountChange(2)"
|
|
>
|
|
<text>2</text>
|
|
</view>
|
|
<view
|
|
class="option-btn"
|
|
:class="{ 'active': indexCount === 3 }"
|
|
@click="handleIndexCountChange(3)"
|
|
>
|
|
<text>3</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <view class="indicator-title">
|
|
<text>指标设置</text>
|
|
</view>
|
|
<view class="indicator-list">
|
|
<view class="indicator-item" v-for="(item, index) in indicatorList" :key="index">
|
|
<text class="indicator-text">{{ item }}</text>
|
|
<view class="indicator-icons">
|
|
<image src="../../static/my/setting.png" class="icon" />
|
|
<image src="../../static/my/menu.png" class="icon" />
|
|
</view>
|
|
</view>
|
|
<view style="height:10vh;background-color: white;"></view>
|
|
</view> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue'
|
|
import { getMarketSetting, updateMarketSetting } from "@/api/setting/market"
|
|
|
|
const iSMT = ref(0)
|
|
const aStockBid = ref('auto') // A股竞价：auto/open/close
|
|
const kStyle = ref('common') // K线样式：common/outline/polylines
|
|
const exRights = ref('exRights') // 除权类型：exRights/normal/weighted
|
|
const rfColor = ref('greenUp') // 涨跌颜色：greenUp/redUp
|
|
const indexCount = ref(1) // 副图个数：1/2/3
|
|
const indicatorList = ref(['K线', '均线', '成交量', 'KDJ', 'MACD', 'RSI'])
|
|
|
|
const getMarketSettings = async () => {
|
|
try {
|
|
const res = await getMarketSetting()
|
|
if (res.code === 200) {
|
|
aStockBid.value = res.data.auctionDisplay ?? 'auto'
|
|
kStyle.value = res.data.klineStyle ?? 'common'
|
|
exRights.value = res.data.rightsIssueType ?? 'exRights'
|
|
rfColor.value = res.data.priceColorScheme ?? 'greenUp'
|
|
indexCount.value = res.data.subChartCount ?? 1
|
|
}
|
|
} catch (err) {
|
|
console.error("获取市场设置失败：", err)
|
|
}
|
|
}
|
|
|
|
const updateSetting = async () => {
|
|
try {
|
|
const params = {
|
|
auctionDisplay: aStockBid.value,
|
|
klineStyle: kStyle.value,
|
|
rightsIssueType: exRights.value,
|
|
priceColorScheme: rfColor.value,
|
|
subChartCount: indexCount.value
|
|
}
|
|
const res = await updateMarketSetting(params)
|
|
if (res.code === 200) {
|
|
uni.showToast({ title: '设置已更新', icon: 'none' })
|
|
} else {
|
|
uni.showToast({ title: '更新失败', icon: 'none' })
|
|
}
|
|
} catch (err) {
|
|
console.error("更新设置失败：", err)
|
|
uni.showToast({ title: '更新失败', icon: 'none' })
|
|
}
|
|
}
|
|
|
|
const handleAStockBidChange = (newValue) => {
|
|
if (newValue !== aStockBid.value) {
|
|
aStockBid.value = newValue
|
|
updateSetting()
|
|
}
|
|
}
|
|
|
|
const handleKStyleChange = (newValue) => {
|
|
if (newValue !== kStyle.value) {
|
|
kStyle.value = newValue
|
|
updateSetting()
|
|
}
|
|
}
|
|
|
|
const handleExRightsChange = (newValue) => {
|
|
if (newValue !== exRights.value) {
|
|
exRights.value = newValue
|
|
updateSetting()
|
|
}
|
|
}
|
|
|
|
const handleRfColorChange = (newValue) => {
|
|
if (newValue !== rfColor.value) {
|
|
rfColor.value = newValue
|
|
updateSetting()
|
|
}
|
|
}
|
|
|
|
const handleIndexCountChange = (newValue) => {
|
|
if (newValue !== indexCount.value) {
|
|
indexCount.value = newValue
|
|
updateSetting()
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
|
|
getMarketSettings()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.time-share-title {
|
|
height: 4.5vh;
|
|
padding: 0 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.title {
|
|
height: 5.5vh;
|
|
padding: 0 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 26rpx;
|
|
color: #666;
|
|
}
|
|
|
|
.top-options {
|
|
display: flex;
|
|
padding: 0 40rpx;
|
|
}
|
|
|
|
.option-btn {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border: 1rpx solid #ddd;
|
|
border-radius: 8rpx;
|
|
margin: 0 10rpx;
|
|
padding: 15rpx 0;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.option-btn.active {
|
|
border-color: red;
|
|
}
|
|
|
|
.active-dot {
|
|
width: 16rpx;
|
|
height: 16rpx;
|
|
background-color: red;
|
|
border-radius: 50%;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
.kline-icon {
|
|
margin-right: 10rpx;
|
|
font-size: 32rpx;
|
|
width:60rpx;
|
|
height:50rpx;
|
|
}
|
|
|
|
.color-icon {
|
|
margin-right: 10rpx;
|
|
display: flex;
|
|
gap: 4rpx;
|
|
}
|
|
|
|
.indicator-title {
|
|
height: 6vh;
|
|
padding: 0 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.indicator-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
padding: 0 40rpx;
|
|
background-color: white;
|
|
}
|
|
|
|
.indicator-item {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 7.5vh;
|
|
border-bottom: 1rpx solid #eee;
|
|
}
|
|
|
|
.indicator-text {
|
|
font-size: 28rpx;
|
|
flex: 1;
|
|
}
|
|
|
|
.indicator-icons {
|
|
display: flex;
|
|
gap: 100rpx;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.icon {
|
|
width: 28rpx;
|
|
height: 28rpx;
|
|
}
|
|
</style>
|