完善页面
This commit is contained in:
@@ -1,23 +1,28 @@
|
||||
<template>
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">商品采集配置</text>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">商品采集配置 页面开发中...</text>
|
||||
<view class="page-header"><view class="breadcrumb"><text class="bc-item">设置</text><text class="bc-sep">/</text><text class="bc-item">接口配置</text><text class="bc-sep">/</text><text class="bc-item active">商品采集配置</text></view></view>
|
||||
<view class="content-card">
|
||||
<view class="tabs-header"><view class="tab-item active"><text class="tab-text">基础配置</text></view></view>
|
||||
<view class="config-view">
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label">接口选择:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group @change="onInterfaceChange">
|
||||
<label><radio value="onepass" checked color="#2d8cf0" /><text>一号通</text></label>
|
||||
<label><radio value="99api" color="#2d8cf0" /><text>99Api</text></label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-actions"><button class="submit-btn" type="primary" @click="handleSubmit">提交</button></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref } from 'vue'
|
||||
const onInterfaceChange = (e : any) => { console.log(e.detail.value) }
|
||||
const handleSubmit = () => { uni.showToast({ title: '提交成功' }) }
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
</style>
|
||||
<style scoped> .admin-page-container { padding: 20px; background-color: #f5f7f9; } .content-card { background: #fff; padding: 20px; } .breadcrumb { margin-bottom: 20px; display: flex; flex-direction: row; } </style>
|
||||
|
||||
@@ -1,23 +1,194 @@
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">电子面单配置</text>
|
||||
<view class="page-header">
|
||||
<view class="breadcrumb">
|
||||
<text class="bc-item">设置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item">接口配置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item active">电子面单配置</text>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">电子面单配置 页面开发中...</text>
|
||||
</view>
|
||||
|
||||
<view class="content-card">
|
||||
<view class="tabs-header">
|
||||
<view class="tab-item active"><text class="tab-text">基础配置</text></view>
|
||||
<view class="tab-item"><text class="tab-text">一号通配置</text></view>
|
||||
</view>
|
||||
|
||||
<view class="config-view">
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label">开启电子面单:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onEnableChange">
|
||||
<label class="radio-label">
|
||||
<radio value="1" :checked="form.enable == '1'" color="#2d8cf0" />
|
||||
<text class="radio-text">开启</text>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<radio value="0" :checked="form.enable == '0'" color="#2d8cf0" />
|
||||
<text class="radio-text">关闭</text>
|
||||
</label>
|
||||
</radio-group>
|
||||
<text class="form-tips">电子面单是否开启</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-row">
|
||||
<view class="form-label">电子面单类型:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group">
|
||||
<label class="radio-label">
|
||||
<radio value="onepass" checked color="#2d8cf0" />
|
||||
<text class="radio-text">一号通</text>
|
||||
</label>
|
||||
</radio-group>
|
||||
<text class="form-tips">电子面单类型</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-actions">
|
||||
<button class="submit-btn" type="primary" @click="handleSubmit">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
const form = reactive({
|
||||
enable: '1'
|
||||
})
|
||||
|
||||
const onEnableChange = (e: any) => {
|
||||
form.enable = e.detail.value
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
uni.showToast({ title: '提交成功' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container {
|
||||
min-height: 100vh;
|
||||
background-color: #f5f7f9;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.bc-item { font-size: 14px; color: #999; }
|
||||
.bc-item.active { color: #333; }
|
||||
.bc-sep { margin: 0 8px; color: #ccc; }
|
||||
|
||||
.content-card {
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.tabs-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 15px 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
border-bottom: 2px solid #2d8cf0;
|
||||
}
|
||||
|
||||
.tab-item.active .tab-text {
|
||||
color: #2d8cf0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.config-view {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 30px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
width: 100px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.form-input-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.form-radio-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.radio-label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.radio-text {
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.form-tips {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #bfbfbf;
|
||||
margin-top: 12px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
margin-top: 40px;
|
||||
padding-left: 120px;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
width: 80px;
|
||||
height: 36px;
|
||||
background-color: #2d8cf0;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,23 +1,182 @@
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">物流查询配置</text>
|
||||
<view class="page-header">
|
||||
<view class="breadcrumb">
|
||||
<text class="bc-item">设置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item">接口配置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item active">物流查询配置</text>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">物流查询配置 页面开发中...</text>
|
||||
</view>
|
||||
|
||||
<view class="content-card">
|
||||
<view class="tabs-header">
|
||||
<view class="tab-item active"><text class="tab-text">基础配置</text></view>
|
||||
<view class="tab-item"><text class="tab-text">阿里云配置</text></view>
|
||||
</view>
|
||||
|
||||
<view class="config-view">
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label">接口选择:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onInterfaceChange">
|
||||
<label class="radio-label">
|
||||
<radio value="onepass" :checked="form.interfaceType == 'onepass'" color="#2d8cf0" />
|
||||
<text class="radio-text">一号通</text>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<radio value="ali" :checked="form.interfaceType == 'ali'" color="#2d8cf0" />
|
||||
<text class="radio-text">阿里云物流查询</text>
|
||||
</label>
|
||||
</radio-group>
|
||||
<text class="form-tips">建议使用一号通更方便不用配置密钥,阿里云云市场购买链接:https://0x9.me/w9vnq</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-actions">
|
||||
<button class="submit-btn" type="primary" @click="handleSubmit">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
const form = reactive({
|
||||
interfaceType: 'onepass'
|
||||
})
|
||||
|
||||
const onInterfaceChange = (e: any) => {
|
||||
form.interfaceType = e.detail.value
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
uni.showToast({ title: '提交成功' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container {
|
||||
min-height: 100vh;
|
||||
background-color: #f5f7f9;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.bc-item { font-size: 14px; color: #999; }
|
||||
.bc-item.active { color: #333; }
|
||||
.bc-sep { margin: 0 8px; color: #ccc; }
|
||||
|
||||
.content-card {
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.tabs-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 15px 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
border-bottom: 2px solid #2d8cf0;
|
||||
}
|
||||
|
||||
.tab-item.active .tab-text {
|
||||
color: #2d8cf0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.config-view {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 30px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
width: 100px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.form-input-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.form-radio-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.radio-label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.radio-text {
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.form-tips {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #bfbfbf;
|
||||
margin-top: 12px;
|
||||
max-width: 600px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
margin-top: 40px;
|
||||
padding-left: 120px;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
width: 80px;
|
||||
height: 36px;
|
||||
background-color: #2d8cf0;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,23 +1,90 @@
|
||||
<template>
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">一号通配置</text>
|
||||
<view class="page-header">
|
||||
<view class="breadcrumb">
|
||||
<text class="bc-item">设置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item">接口配置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item">一号通</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item active">一号通配置</text>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">一号通配置 页面开发中...</text>
|
||||
</view>
|
||||
<view class="content-card">
|
||||
<view class="tabs-header">
|
||||
<view class="tab-item" @click="navigateTo('/pages/mall/admin/setting/interface/onepass/index')">
|
||||
<text class="tab-text">一号通账户</text>
|
||||
</view>
|
||||
<view class="tab-item active">
|
||||
<text class="tab-text">一号通配置</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-section">
|
||||
<view class="section-title">一号通配置</view>
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label"><text class="star">*</text>AppId:</view>
|
||||
<view class="form-input-box">
|
||||
<input class="form-input" v-model="form.appId" placeholder="一号通账号内创建应用的AppId" />
|
||||
<text class="form-tips">一号通账号内创建应用的AppId</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-row">
|
||||
<view class="form-label"><text class="star">*</text>AppSecret:</view>
|
||||
<view class="form-input-box">
|
||||
<input class="form-input" v-model="form.appSecret" type="password" placeholder="一号通账号内创建应用的AppSecret" />
|
||||
<text class="form-tips">一号通账号内创建应用的AppSecret</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-row">
|
||||
<view class="form-label">电子发票状态:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onInvoiceStatusChange">
|
||||
<label class="radio-label"><radio value="1" :checked="form.invoiceStatus == '1'" color="#2d8cf0" /><text class="radio-text">开启</text></label>
|
||||
<label class="radio-label"><radio value="0" :checked="form.invoiceStatus == '0'" color="#2d8cf0" /><text class="radio-text">关闭</text></label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-actions">
|
||||
<button class="submit-btn" type="primary" @click="handleSubmit">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive } from 'vue'
|
||||
const form = reactive({ appId: 'Aiok6xUdyOmpgXNd8Syf', appSecret: 'IO30qpzHFLf2CPIPjcwTWTPVID1jeX9uTVDz', invoiceStatus: '0' })
|
||||
const onInvoiceStatusChange = (e : any) => { form.invoiceStatus = e.detail.value }
|
||||
const handleSubmit = () => { uni.showToast({ title: '提交成功' }) }
|
||||
const navigateTo = (url : string) => { uni.navigateTo({ url }) }
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container { min-height: 100vh; background-color: #f5f7f9; padding: 20px; }
|
||||
.breadcrumb { display: flex; flex-direction: row; align-items: center; margin-bottom: 20px; }
|
||||
.bc-item { font-size: 14px; color: #999; }
|
||||
.bc-item.active { color: #333; }
|
||||
.bc-sep { margin: 0 8px; color: #ccc; }
|
||||
.content-card { background-color: #fff; border-radius: 4px; overflow: hidden; }
|
||||
.tabs-header { display: flex; flex-direction: row; border-bottom: 1px solid #f0f0f0; padding: 0 20px; }
|
||||
.tab-item { padding: 15px 20px; cursor: pointer; }
|
||||
.tab-text { font-size: 14px; color: #666; }
|
||||
.tab-item.active { border-bottom: 2px solid #2d8cf0; }
|
||||
.tab-item.active .tab-text { color: #2d8cf0; font-weight: bold; }
|
||||
.form-section { padding: 20px; }
|
||||
.section-title { font-size: 16px; font-weight: bold; color: #333; margin-bottom: 40px; padding-bottom: 15px; border-bottom: 1px solid #f0f0f0; }
|
||||
.form-content { max-width: 800px; padding-left: 40px; }
|
||||
.form-row { display: flex; flex-direction: row; margin-bottom: 24px; }
|
||||
.form-label { width: 120px; font-size: 14px; color: #606266; text-align: right; padding-top: 8px; margin-right: 20px; }
|
||||
.star { color: #ff4d4f; margin-right: 4px; }
|
||||
.form-input-box { flex: 1; }
|
||||
.form-input { width: 100%; max-width: 400px; border: 1px solid #dcdfe6; border-radius: 4px; height: 36px; padding: 0 12px; font-size: 14px; }
|
||||
.form-tips { display: block; font-size: 12px; color: #999; margin-top: 8px; }
|
||||
.form-radio-group { display: flex; flex-direction: row; align-items: center; height: 36px; }
|
||||
.radio-label { display: flex; flex-direction: row; align-items: center; margin-right: 20px; }
|
||||
.radio-text { font-size: 14px; margin-left: 8px; }
|
||||
.form-actions { margin-top: 40px; padding-left: 140px; }
|
||||
.submit-btn { width: 80px; height: 36px; background-color: #2d8cf0; color: #fff; border-radius: 4px; font-size: 14px; line-height: 36px; text-align: center; }
|
||||
</style>
|
||||
|
||||
@@ -1,23 +1,149 @@
|
||||
<template>
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">一号通页面</text>
|
||||
<view class="login-wrapper">
|
||||
<view class="login-card">
|
||||
<view class="login-aside">
|
||||
<view class="aside-content">
|
||||
<text class="aside-title">商家寄件</text>
|
||||
<text class="aside-desc">中小商家可灵活选择多家快递品牌</text>
|
||||
<view class="aside-illustration">
|
||||
<view class="illu-box">
|
||||
<view class="illu-icon"></view>
|
||||
<view class="illu-card">
|
||||
<view class="illu-avatar"></view>
|
||||
<view class="illu-line"></view>
|
||||
<view class="illu-line short"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="login-main">
|
||||
<view class="login-tabs">
|
||||
<view class="tab-item" :class="{ active: activeTab == 'account' }" @click="activeTab = 'account'">
|
||||
<text class="tab-text">账号登录</text>
|
||||
</view>
|
||||
<view class="tab-item" :class="{ active: activeTab == 'sms' }" @click="activeTab = 'sms'">
|
||||
<text class="tab-text">短信登录/注册</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="login-form">
|
||||
<template v-if="activeTab == 'account'">
|
||||
<view class="form-item">
|
||||
<input class="form-input" placeholder="请输入手机号/账号" v-model="account" />
|
||||
</view>
|
||||
<view class="form-item password-item">
|
||||
<input class="form-input" type="password" placeholder="请输入密码" v-model="password" />
|
||||
<text class="forget-password">忘记密码</text>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="form-item">
|
||||
<input class="form-input" placeholder="请输入手机号" v-model="phone" />
|
||||
</view>
|
||||
<view class="form-item sms-item">
|
||||
<input class="form-input" placeholder="请输入验证码" v-model="verifyCode" />
|
||||
<text class="get-code">获取验证码</text>
|
||||
</view>
|
||||
</template>
|
||||
<view class="form-agreement">
|
||||
<checkbox-group @change="onAgreementChange">
|
||||
<label class="agreement-label">
|
||||
<checkbox class="agreement-cb" value="agreed" color="#2d8cf0" :checked="isAgreed" />
|
||||
<text class="agreement-text">仔细阅读并同意</text>
|
||||
<text class="agreement-link">《用户协议》</text>
|
||||
</label>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
<button class="login-btn" type="primary" @click="handleLogin" :disabled="!isAgreed">登录</button>
|
||||
<view class="contact-box">
|
||||
<text class="contact-text">咨询客服</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">一号通页面 页面开发中...</text>
|
||||
<view class="float-tabs">
|
||||
<view class="float-tab active">
|
||||
<text class="float-icon">U</text>
|
||||
<text class="float-text">账号登录</text>
|
||||
</view>
|
||||
<view class="float-tab">
|
||||
<text class="float-icon gray">C</text>
|
||||
<text class="float-text gray">扫码登录</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="page-footer">
|
||||
<view class="footer-links">
|
||||
<text class="footer-link">官网</text>
|
||||
<text class="footer-link">社区</text>
|
||||
<text class="footer-link">文档</text>
|
||||
</view>
|
||||
<text class="footer-copy">Copyright (c) 2014-2025 CRMEB-BZ v5.6.4</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref } from 'vue'
|
||||
const activeTab = ref('account')
|
||||
const account = ref('')
|
||||
const password = ref('')
|
||||
const phone = ref('')
|
||||
const verifyCode = ref('')
|
||||
const isAgreed = ref(false)
|
||||
const onAgreementChange = (e : any) => {
|
||||
const values = e.detail.value as string[]
|
||||
isAgreed.value = values.includes('agreed')
|
||||
}
|
||||
const handleLogin = () => {
|
||||
if (!isAgreed.value) {
|
||||
uni.showToast({ title: '请先同意用户协议', icon: 'none' })
|
||||
return
|
||||
}
|
||||
uni.showToast({ title: '登录中...', icon: 'loading' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container { display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 100vh; background-color: #f5f7f9; padding: 40px 20px; }
|
||||
.login-wrapper { position: relative; display: flex; flex-direction: row; margin-bottom: 60px; }
|
||||
.login-card { display: flex; flex-direction: row; width: 800px; height: 480px; background-color: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 24px rgba(0,0,0,0.1); }
|
||||
.login-aside { width: 320px; background: linear-gradient(135deg, #3a7bd5 0%, #00d2ff 100%); padding: 40px; color: #fff; }
|
||||
.aside-title { font-size: 28px; font-weight: bold; margin-bottom: 12px; display: block; }
|
||||
.aside-desc { font-size: 14px; opacity: 0.9; line-height: 1.6; }
|
||||
.aside-illustration { margin-top: 60px; display: flex; justify-content: center; }
|
||||
.illu-box { width: 160px; height: 160px; background-color: rgba(255,255,255,0.2); border-radius: 12px; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; }
|
||||
.illu-card { width: 80px; height: 100px; background-color: #fff; border-radius: 4px; padding: 10px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
|
||||
.illu-avatar { width: 30px; height: 30px; background-color: #e6f7ff; border-radius: 50%; margin: 0 auto 10px; }
|
||||
.illu-line { height: 4px; background-color: #f0f0f0; border-radius: 2px; margin-bottom: 8px; }
|
||||
.illu-line.short { width: 60%; }
|
||||
.login-main { flex: 1; padding: 40px 60px; display: flex; flex-direction: column; }
|
||||
.login-tabs { display: flex; flex-direction: row; margin-bottom: 40px; border-bottom: 1px solid #f0f0f0; }
|
||||
.tab-item { margin-right: 32px; padding: 0 0 12px 0; cursor: pointer; position: relative; }
|
||||
.tab-text { font-size: 18px; color: #909399; }
|
||||
.tab-item.active .tab-text { color: #303133; font-weight: bold; }
|
||||
.tab-item.active::after { content: ''; position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; background-color: #2d8cf0; }
|
||||
.login-form { display: flex; flex-direction: column; }
|
||||
.form-item { margin-bottom: 24px; border-bottom: 1px solid #dcdfe6; padding-bottom: 8px; display: flex; flex-direction: row; align-items: center; }
|
||||
.form-input { flex: 1; height: 36px; font-size: 14px; }
|
||||
.forget-password { font-size: 14px; color: #2d8cf0; cursor: pointer; }
|
||||
.sms-item .get-code { font-size: 14px; color: #2d8cf0; cursor: pointer; }
|
||||
.form-agreement { margin-bottom: 30px; }
|
||||
.agreement-label { display: flex; flex-direction: row; align-items: center; }
|
||||
.agreement-cb { transform: scale(0.7); margin-right: 4px; }
|
||||
.agreement-text { font-size: 12px; color: #909399; }
|
||||
.agreement-link { font-size: 12px; color: #2d8cf0; cursor: pointer; }
|
||||
.login-btn { width: 100%; height: 44px; background-color: #2d8cf0; color: #fff; border-radius: 4px; font-size: 16px; margin-bottom: 20px; }
|
||||
.contact-box { display: flex; justify-content: center; }
|
||||
.contact-text { font-size: 14px; color: #909399; cursor: pointer; }
|
||||
.float-tabs { display: flex; flex-direction: column; margin-left: 1px; }
|
||||
.float-tab { width: 44px; height: 90px; background-color: #f0f2f5; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 0 4px 4px 0; margin-bottom: 1px; cursor: pointer; }
|
||||
.float-tab.active { background-color: #2d8cf0; }
|
||||
.float-icon { font-size: 20px; color: #fff; margin-bottom: 8px; }
|
||||
.float-icon.gray { color: #909399; }
|
||||
.float-text { font-size: 12px; color: #fff; writing-mode: vertical-lr; letter-spacing: 2px; }
|
||||
.float-text.gray { color: #909399; writing-mode: vertical-lr; }
|
||||
.page-footer { display: flex; flex-direction: column; align-items: center; }
|
||||
.footer-links { display: flex; flex-direction: row; margin-bottom: 12px; }
|
||||
.footer-link { font-size: 14px; color: #909399; margin: 0 12px; }
|
||||
.footer-copy { font-size: 12px; color: #c0c4cc; }
|
||||
</style>
|
||||
|
||||
@@ -1,23 +1,203 @@
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">商城支付配置</text>
|
||||
<view class="page-header">
|
||||
<view class="breadcrumb">
|
||||
<text class="bc-item">设置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item">接口配置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item active">商城支付配置</text>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">商城支付配置 页面开发中...</text>
|
||||
</view>
|
||||
|
||||
<view class="content-card">
|
||||
<view class="tabs-header">
|
||||
<view class="tab-item active"><text class="tab-text">基础配置</text></view>
|
||||
<view class="tab-item"><text class="tab-text">微信支付配置</text></view>
|
||||
</view>
|
||||
|
||||
<view class="config-view">
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label">余额支付:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onBalancePayChange">
|
||||
<label class="radio-label">
|
||||
<radio value="1" :checked="form.balancePay == '1'" color="#2d8cf0" />
|
||||
<text class="radio-text">开启</text>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<radio value="0" :checked="form.balancePay == '0'" color="#2d8cf0" />
|
||||
<text class="radio-text">关闭</text>
|
||||
</label>
|
||||
</radio-group>
|
||||
<text class="form-tips">余额支付请选择开启或关闭</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-row">
|
||||
<view class="form-label">好友代付:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onFriendPayChange">
|
||||
<label class="radio-label">
|
||||
<radio value="1" :checked="form.friendPay == '1'" color="#2d8cf0" />
|
||||
<text class="radio-text">开启</text>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<radio value="0" :checked="form.friendPay == '0'" color="#2d8cf0" />
|
||||
<text class="radio-text">关闭</text>
|
||||
</label>
|
||||
</radio-group>
|
||||
<text class="form-tips">好友代付开关,关闭后付款类型不显示好友代付</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-actions">
|
||||
<button class="submit-btn" type="primary" @click="handleSubmit">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
const form = reactive({
|
||||
balancePay: '1',
|
||||
friendPay: '1'
|
||||
})
|
||||
|
||||
const onBalancePayChange = (e: any) => {
|
||||
form.balancePay = e.detail.value
|
||||
}
|
||||
|
||||
const onFriendPayChange = (e: any) => {
|
||||
form.friendPay = e.detail.value
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
uni.showToast({ title: '提交成功' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container {
|
||||
min-height: 100vh;
|
||||
background-color: #f5f7f9;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.bc-item { font-size: 14px; color: #999; }
|
||||
.bc-item.active { color: #333; }
|
||||
.bc-sep { margin: 0 8px; color: #ccc; }
|
||||
|
||||
.content-card {
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.tabs-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 15px 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
border-bottom: 2px solid #2d8cf0;
|
||||
}
|
||||
|
||||
.tab-item.active .tab-text {
|
||||
color: #2d8cf0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.config-view {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 30px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
width: 100px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.form-input-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.form-radio-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.radio-label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.radio-text {
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.form-tips {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #bfbfbf;
|
||||
margin-top: 12px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
margin-top: 40px;
|
||||
padding-left: 120px;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
width: 80px;
|
||||
height: 36px;
|
||||
background-color: #2d8cf0;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,23 +1,186 @@
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">短信接口配置</text>
|
||||
<view class="page-header">
|
||||
<view class="breadcrumb">
|
||||
<text class="bc-item">设置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item">接口配置</text>
|
||||
<text class="bc-sep">/</text>
|
||||
<text class="bc-item active">短信功能配置</text>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">短信接口配置 页面开发中...</text>
|
||||
</view>
|
||||
|
||||
<view class="content-card">
|
||||
<view class="tabs-header">
|
||||
<view class="tab-item active"><text class="tab-text">基础配置</text></view>
|
||||
<view class="tab-item"><text class="tab-text">阿里云配置</text></view>
|
||||
<view class="tab-item"><text class="tab-text">腾讯云配置</text></view>
|
||||
</view>
|
||||
|
||||
<view class="config-view">
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label">短信类型:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onSmsTypeChange">
|
||||
<label class="radio-label">
|
||||
<radio value="onepass" :checked="form.smsType == 'onepass'" color="#2d8cf0" />
|
||||
<text class="radio-text">一号通</text>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<radio value="ali" :checked="form.smsType == 'ali'" color="#2d8cf0" />
|
||||
<text class="radio-text">阿里云</text>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<radio value="tencent" :checked="form.smsType == 'tencent'" color="#2d8cf0" />
|
||||
<text class="radio-text">腾讯云</text>
|
||||
</label>
|
||||
</radio-group>
|
||||
<text class="form-tips">短信类型,选择发送的短信类型</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-actions">
|
||||
<button class="submit-btn" type="primary" @click="handleSubmit">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
const form = reactive({
|
||||
smsType: 'onepass'
|
||||
})
|
||||
|
||||
const onSmsTypeChange = (e: any) => {
|
||||
form.smsType = e.detail.value
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
uni.showToast({ title: '提交成功' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container {
|
||||
min-height: 100vh;
|
||||
background-color: #f5f7f9;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.bc-item { font-size: 14px; color: #999; }
|
||||
.bc-item.active { color: #333; }
|
||||
.bc-sep { margin: 0 8px; color: #ccc; }
|
||||
|
||||
.content-card {
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.tabs-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 15px 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
border-bottom: 2px solid #2d8cf0;
|
||||
}
|
||||
|
||||
.tab-item.active .tab-text {
|
||||
color: #2d8cf0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.config-view {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 30px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
width: 100px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.form-input-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.form-radio-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.radio-label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.radio-text {
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.form-tips {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #bfbfbf;
|
||||
margin-top: 12px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
margin-top: 40px;
|
||||
padding-left: 120px;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
width: 80px;
|
||||
height: 36px;
|
||||
background-color: #2d8cf0;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,23 +1,62 @@
|
||||
<template>
|
||||
<template>
|
||||
<view class="admin-page-container">
|
||||
<view class="page-card">
|
||||
<view class="page-header">
|
||||
<text class="page-title">系统存储配置</text>
|
||||
<view class="page-header"><view class="breadcrumb"><text class="bc-item">设置</text><text class="bc-sep">/</text><text class="bc-item">接口配置</text><text class="bc-sep">/</text><text class="bc-item active">系统存储配置</text></view></view>
|
||||
<view class="content-card">
|
||||
<view class="tabs-header">
|
||||
<scroll-view class="tabs-scroll" scroll-x="true" show-scrollbar="false">
|
||||
<view class="tabs-list">
|
||||
<view class="tab-item active"><text class="tab-text">储存配置</text></view>
|
||||
<view class="tab-item"><text class="tab-text">七牛云储存</text></view>
|
||||
<view class="tab-item"><text class="tab-text">阿里云储存</text></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="page-content">
|
||||
<text class="placeholder-text">系统存储配置 页面开发中...</text>
|
||||
<view class="config-view">
|
||||
<view class="notice-box">
|
||||
<text class="notice-text">上传图片时会生成缩略图\nx</text>
|
||||
</view>
|
||||
<view class="form-content">
|
||||
<view class="form-row">
|
||||
<view class="form-label">存储方式:</view>
|
||||
<view class="form-input-box">
|
||||
<radio-group class="form-radio-group" @change="onStorageTypeChange">
|
||||
<label class="radio-label"><radio value="local" :checked="form.storageType == 'local'" color="#2d8cf0" /><text class="radio-text">本地存储</text></label>
|
||||
<label class="radio-label"><radio value="qiniu" :checked="form.storageType == 'qiniu'" color="#2d8cf0" /><text class="radio-text">七牛云存储</text></label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-actions"><button class="save-btn" type="primary" @click="handleSave">保存</button></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive } from 'vue'
|
||||
const form = reactive({ storageType: 'local' })
|
||||
const onStorageTypeChange = (e : any) => { form.storageType = e.detail.value }
|
||||
const handleSave = () => { uni.showToast({ title: '保存成功' }) }
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-page-container { padding: 20px; background-color: #f5f7f9; min-height: 100vh; }
|
||||
.page-card { background-color: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 1px 4px rgba(0,21,41,0.08); }
|
||||
.page-header { margin-bottom: 20px; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; }
|
||||
.page-title { font-size: 16px; font-weight: bold; color: #303133; }
|
||||
.placeholder-text { font-size: 14px; color: #909399; }
|
||||
.admin-page-container { min-height: 100vh; background-color: #f5f7f9; padding: 20px; }
|
||||
.breadcrumb { display: flex; flex-direction: row; margin-bottom: 20px; }
|
||||
.bc-item { font-size: 14px; color: #999; }
|
||||
.bc-item.active { color: #333; }
|
||||
.bc-sep { margin: 0 8px; color: #ccc; }
|
||||
.content-card { background-color: #fff; border-radius: 4px; }
|
||||
.tabs-header { border-bottom: 1px solid #f0f0f0; }
|
||||
.tabs-scroll { white-space: nowrap; width: 100%; }
|
||||
.tabs-list { display: flex; flex-direction: row; padding: 0 20px; }
|
||||
.tab-item { padding: 15px 20px; cursor: pointer; }
|
||||
.tab-text { font-size: 14px; color: #666; }
|
||||
.tab-item.active { border-bottom: 2px solid #2d8cf0; }
|
||||
.tab-item.active .tab-text { color: #2d8cf0; font-weight: bold; }
|
||||
.config-view { padding: 24px; }
|
||||
.notice-box { background-color: #fffbe6; border: 1px solid #ffe58f; border-radius: 4px; padding: 16px; margin-bottom: 30px; }
|
||||
.notice-text { font-size: 13px; color: #faad14; line-height: 1.8; }
|
||||
.form-content { padding-left: 20px; }
|
||||
.form-row { display: flex; flex-direction: row; margin-bottom: 30px; align-items: center; }
|
||||
.form-label { width: 140px; font-size: 14px; color: #333; text-align: right; margin-right: 20px; }
|
||||
.form-actions { margin-top: 40px; padding-left: 160px; }
|
||||
.save-btn { width: 80px; height: 36px; background-color: #2d8cf0; color: #fff; border-radius: 4px; font-size: 14px; line-height: 36px; text-align: center; }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user