385 lines
8.5 KiB
Vue
385 lines
8.5 KiB
Vue
|
<template>
|
|||
|
|
<view class="admin-container">
|
|||
|
|
<view class="header">
|
|||
|
|
<view class="back-btn" @click="goBack">← 返回</view>
|
|||
|
|
<text class="title">模型状态管理</text>
|
|||
|
|
<view class="placeholder"></view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<scroll-view scroll-y class="content">
|
|||
|
|
<view class="intro-card">
|
|||
|
|
<text class="intro-text">💡 在此管理各个模型的可用状态。当第三方接口更新时，可以临时禁用模型并显示维护信息。</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- Veo 模型配置 -->
|
|||
|
|
<view class="model-card">
|
|||
|
|
<view class="model-header">
|
|||
|
|
<text class="model-name">Veo 模型</text>
|
|||
|
|
<switch :checked="!veoDisabled" @change="onVeoStatusChange" color="#8B7355" />
|
|||
|
|
</view>
|
|||
|
|
<view class="model-status">
|
|||
|
|
<text class="status-label">状态：</text>
|
|||
|
|
<text :class="['status-value', veoDisabled ? 'disabled' : 'enabled']">
|
|||
|
|
{{ veoDisabled ? '已禁用' : '正常' }}
|
|||
|
|
</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-group">
|
|||
|
|
<text class="form-label">维护提示信息</text>
|
|||
|
|
<textarea
|
|||
|
|
class="form-textarea"
|
|||
|
|
v-model="veoMessage"
|
|||
|
|
placeholder="请输入维护提示信息，例如：官方接口参数更新，正在处理中，暂不可用"
|
|||
|
|
maxlength="200"
|
|||
|
|
/>
|
|||
|
|
<view class="char-count">{{ veoMessage.length }} / 200</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 火山引擎模型配置 -->
|
|||
|
|
<view class="model-card">
|
|||
|
|
<view class="model-header">
|
|||
|
|
<text class="model-name">火山引擎模型</text>
|
|||
|
|
<switch :checked="!volcengineDisabled" @change="onVolcengineStatusChange" color="#8B7355" />
|
|||
|
|
</view>
|
|||
|
|
<view class="model-status">
|
|||
|
|
<text class="status-label">状态：</text>
|
|||
|
|
<text :class="['status-value', volcengineDisabled ? 'disabled' : 'enabled']">
|
|||
|
|
{{ volcengineDisabled ? '已禁用' : '正常' }}
|
|||
|
|
</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-group">
|
|||
|
|
<text class="form-label">维护提示信息</text>
|
|||
|
|
<textarea
|
|||
|
|
class="form-textarea"
|
|||
|
|
v-model="volcengineMessage"
|
|||
|
|
placeholder="请输入维护提示信息，例如：官方接口参数更新，正在处理中，暂不可用"
|
|||
|
|
maxlength="200"
|
|||
|
|
/>
|
|||
|
|
<view class="char-count">{{ volcengineMessage.length }} / 200</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 保存按钮 -->
|
|||
|
|
<button class="save-btn" @click="saveConfig" :disabled="saving">
|
|||
|
|
<text v-if="saving">保存中...</text>
|
|||
|
|
<text v-else>💾 保存配置</text>
|
|||
|
|
</button>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { API_BASE } from '@/config/api.js';
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
API_BASE,
|
|||
|
|
veoDisabled: false,
|
|||
|
|
veoMessage: '',
|
|||
|
|
volcengineDisabled: false,
|
|||
|
|
volcengineMessage: '',
|
|||
|
|
saving: false
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onLoad() {
|
|||
|
|
this.loadConfig();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
goBack() {
|
|||
|
|
uni.navigateBack();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 加载配置
|
|||
|
|
loadConfig() {
|
|||
|
|
console.log('[Admin] 加载模型状态配置...');
|
|||
|
|
uni.showLoading({ title: '加载中...' });
|
|||
|
|
|
|||
|
|
uni.request({
|
|||
|
|
url: `${this.API_BASE}/api/admin/system/model-status-config`,
|
|||
|
|
method: 'GET',
|
|||
|
|
success: (res) => {
|
|||
|
|
console.log('[Admin] 配置响应:', res);
|
|||
|
|
if (res.statusCode === 200 && res.data && res.data.success) {
|
|||
|
|
const config = res.data.data;
|
|||
|
|
|
|||
|
|
// 设置Veo状态
|
|||
|
|
this.veoDisabled = config.veo_disabled === 'true';
|
|||
|
|
this.veoMessage = config.veo_message || '';
|
|||
|
|
|
|||
|
|
// 设置火山引擎状态
|
|||
|
|
this.volcengineDisabled = config.volcengine_disabled === 'true';
|
|||
|
|
this.volcengineMessage = config.volcengine_message || '';
|
|||
|
|
|
|||
|
|
console.log('[Admin] 配置加载成功');
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '加载配置失败',
|
|||
|
|
icon: 'none'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
fail: (error) => {
|
|||
|
|
console.error('[Admin] 加载配置失败:', error);
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '网络错误',
|
|||
|
|
icon: 'none'
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
complete: () => {
|
|||
|
|
uni.hideLoading();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// Veo状态切换
|
|||
|
|
onVeoStatusChange(e) {
|
|||
|
|
this.veoDisabled = !e.detail.value;
|
|||
|
|
console.log('[Admin] Veo状态:', this.veoDisabled ? '禁用' : '启用');
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 火山引擎状态切换
|
|||
|
|
onVolcengineStatusChange(e) {
|
|||
|
|
this.volcengineDisabled = !e.detail.value;
|
|||
|
|
console.log('[Admin] 火山引擎状态:', this.volcengineDisabled ? '禁用' : '启用');
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 保存配置
|
|||
|
|
saveConfig() {
|
|||
|
|
console.log('[Admin] 保存配置...');
|
|||
|
|
|
|||
|
|
// 验证：如果禁用了模型，必须填写维护信息
|
|||
|
|
if (this.veoDisabled && !this.veoMessage.trim()) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: 'Veo模型已禁用，请填写维护提示信息',
|
|||
|
|
icon: 'none',
|
|||
|
|
duration: 2000
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (this.volcengineDisabled && !this.volcengineMessage.trim()) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '火山引擎模型已禁用，请填写维护提示信息',
|
|||
|
|
icon: 'none',
|
|||
|
|
duration: 2000
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.saving = true;
|
|||
|
|
uni.showLoading({ title: '保存中...' });
|
|||
|
|
|
|||
|
|
const config = {
|
|||
|
|
veo_disabled: this.veoDisabled ? 'true' : 'false',
|
|||
|
|
veo_message: this.veoMessage,
|
|||
|
|
volcengine_disabled: this.volcengineDisabled ? 'true' : 'false',
|
|||
|
|
volcengine_message: this.volcengineMessage
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
uni.request({
|
|||
|
|
url: `${this.API_BASE}/api/admin/system/model-status-config`,
|
|||
|
|
method: 'POST',
|
|||
|
|
header: {
|
|||
|
|
'Content-Type': 'application/json'
|
|||
|
|
},
|
|||
|
|
data: config,
|
|||
|
|
success: (res) => {
|
|||
|
|
console.log('[Admin] 保存响应:', res);
|
|||
|
|
if (res.statusCode === 200 && res.data && res.data.success) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '保存成功',
|
|||
|
|
icon: 'success'
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 延迟返回
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack();
|
|||
|
|
}, 1500);
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: res.data?.message || '保存失败',
|
|||
|
|
icon: 'none'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
fail: (error) => {
|
|||
|
|
console.error('[Admin] 保存失败:', error);
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '网络错误',
|
|||
|
|
icon: 'none'
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
complete: () => {
|
|||
|
|
this.saving = false;
|
|||
|
|
uni.hideLoading();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.admin-container {
|
|||
|
|
width: 100%;
|
|||
|
|
min-height: 100vh;
|
|||
|
|
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header {
|
|||
|
|
background: white;
|
|||
|
|
padding: 60rpx 40rpx 20rpx;
|
|||
|
|
padding-top: calc(60rpx + constant(safe-area-inset-top));
|
|||
|
|
padding-top: calc(60rpx + env(safe-area-inset-top));
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.back-btn {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #666;
|
|||
|
|
padding: 16rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333;
|
|||
|
|
flex: 1;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.placeholder {
|
|||
|
|
width: 80rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content {
|
|||
|
|
flex: 1;
|
|||
|
|
padding: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.intro-card {
|
|||
|
|
background: rgba(139, 115, 85, 0.1);
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
padding: 32rpx;
|
|||
|
|
margin-bottom: 40rpx;
|
|||
|
|
border: 2rpx solid rgba(139, 115, 85, 0.2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.intro-text {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #666;
|
|||
|
|
line-height: 1.6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.model-card {
|
|||
|
|
background: white;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
padding: 32rpx;
|
|||
|
|
margin-bottom: 32rpx;
|
|||
|
|
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.model-header {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
padding-bottom: 24rpx;
|
|||
|
|
border-bottom: 2rpx solid #f0f0f0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.model-name {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.model-status {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.status-label {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #666;
|
|||
|
|
margin-right: 16rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.status-value {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
padding: 8rpx 24rpx;
|
|||
|
|
border-radius: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.status-value.enabled {
|
|||
|
|
color: #52c41a;
|
|||
|
|
background: rgba(82, 196, 26, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.status-value.disabled {
|
|||
|
|
color: #ff4d4f;
|
|||
|
|
background: rgba(255, 77, 79, 0.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.form-group {
|
|||
|
|
margin-top: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.form-label {
|
|||
|
|
display: block;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #666;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.form-textarea {
|
|||
|
|
width: 100%;
|
|||
|
|
min-height: 200rpx;
|
|||
|
|
padding: 24rpx;
|
|||
|
|
border: 2rpx solid #e0e0e0;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
background: #f8f9fa;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.char-count {
|
|||
|
|
text-align: right;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #999;
|
|||
|
|
margin-top: 8rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.save-btn {
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 32rpx;
|
|||
|
|
background: linear-gradient(135deg, #8B7355 0%, #6D8B8B 100%);
|
|||
|
|
color: white;
|
|||
|
|
border: none;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
box-shadow: 0 8rpx 24rpx rgba(139, 115, 85, 0.3);
|
|||
|
|
margin-top: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.save-btn:disabled {
|
|||
|
|
opacity: 0.6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.save-btn:active:not(:disabled) {
|
|||
|
|
transform: translateY(2rpx);
|
|||
|
|
box-shadow: 0 4rpx 12rpx rgba(139, 115, 85, 0.3);
|
|||
|
|
}
|
|||
|
|
</style>
|