mirror of
https://github.com/jekip/naive-ui-admin.git
synced 2026-03-01 00:23:11 +08:00
fix Bug or add example
This commit is contained in:
Ah jung
88
src/views/setting/account/account.vue
Normal file
88
src/views/setting/account/account.vue
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<n-grid :x-gap="24">
|
||||||
|
<n-grid-item span="6">
|
||||||
|
<n-card :bordered="false" size="small" class="proCard">
|
||||||
|
<n-thing
|
||||||
|
class="thing-cell"
|
||||||
|
v-for="item in typeTabList" :key="item.key"
|
||||||
|
:class="{'thing-cell-on':type===item.key}"
|
||||||
|
@click="switchType(item)"
|
||||||
|
>
|
||||||
|
<template #header>{{ item.name }}</template>
|
||||||
|
<template #description>{{ item.desc }}</template>
|
||||||
|
</n-thing>
|
||||||
|
</n-card>
|
||||||
|
</n-grid-item>
|
||||||
|
<n-grid-item span="18">
|
||||||
|
<n-card :bordered="false" size="small" :title="typeTitle" class="proCard">
|
||||||
|
<BasicSetting v-if="type === 1"></BasicSetting>
|
||||||
|
<SafetySetting v-if="type === 2"></SafetySetting>
|
||||||
|
</n-card>
|
||||||
|
</n-grid-item>
|
||||||
|
</n-grid>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, reactive, toRefs } from 'vue'
|
||||||
|
import BasicSetting from "./BasicSetting.vue"
|
||||||
|
import SafetySetting from "./SafetySetting.vue"
|
||||||
|
|
||||||
|
|
||||||
|
const typeTabList = [
|
||||||
|
{
|
||||||
|
name: '基本设置',
|
||||||
|
desc: '个人账户信息设置',
|
||||||
|
key: 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '安全设置',
|
||||||
|
desc: '密码，邮箱等设置',
|
||||||
|
key: 2
|
||||||
|
}
|
||||||
|
]
|
||||||
|
export default defineComponent({
|
||||||
|
components: { BasicSetting, SafetySetting },
|
||||||
|
setup() {
|
||||||
|
const state = reactive({
|
||||||
|
type: 1,
|
||||||
|
typeTitle: '基本设置'
|
||||||
|
})
|
||||||
|
|
||||||
|
function switchType(e) {
|
||||||
|
state.type = e.key
|
||||||
|
state.typeTitle = e.name
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
...toRefs(state),
|
||||||
|
switchType,
|
||||||
|
typeTabList
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.thing-cell {
|
||||||
|
margin: 0 -16px 10px;
|
||||||
|
padding: 5px 16px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #f3f3f3;
|
||||||
|
cursor: pointer
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.thing-cell-on {
|
||||||
|
background: #f0faff;
|
||||||
|
color: #2d8cf0;
|
||||||
|
|
||||||
|
::v-deep(.n-thing-main .n-thing-header .n-thing-header__title) {
|
||||||
|
color: #2d8cf0
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #f0faff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
138
src/views/setting/system/BasicSetting.vue
Normal file
138
src/views/setting/system/BasicSetting.vue
Normal file
@@ -0,0 +1,138 @@
|
|||||||
|
<template>
|
||||||
|
<n-grid cols="2 s:2 m:2 l:3 xl:3 2xl:3" responsive="screen">
|
||||||
|
<n-grid-item>
|
||||||
|
<n-form
|
||||||
|
:label-width="80"
|
||||||
|
:model="formValue"
|
||||||
|
:rules="rules"
|
||||||
|
ref="formRef"
|
||||||
|
>
|
||||||
|
<n-form-item label="网站名称" path="name">
|
||||||
|
<n-input v-model:value="formValue.name" placeholder="请输入网站名称"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="备案编号" path="icpCode">
|
||||||
|
<n-input placeholder="请输入备案编号" v-model:value="formValue.icpCode"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
<n-form-item label="联系电话" path="mobile">
|
||||||
|
<n-input placeholder="请输入联系电话" v-model:value="formValue.mobile"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="联系地址" path="address">
|
||||||
|
<n-input
|
||||||
|
v-model:value="formValue.address"
|
||||||
|
type="textarea"
|
||||||
|
placeholder="请输入联系地址"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="登录验证码" path="loginCode">
|
||||||
|
<n-radio-group v-model:value="formValue.loginCode" name="loginCode">
|
||||||
|
<n-space>
|
||||||
|
<n-radio :value="1">开启</n-radio>
|
||||||
|
<n-radio :value="0">关闭</n-radio>
|
||||||
|
</n-space>
|
||||||
|
</n-radio-group>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="网站开启访问" path="systemOpen">
|
||||||
|
<n-switch size="large" v-model:value="formValue.systemOpen" @update:value="systemOpenChange"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="网站关闭提示" path="closeText">
|
||||||
|
<n-input
|
||||||
|
v-model:value="formValue.closeText"
|
||||||
|
type="textarea"
|
||||||
|
placeholder="请输入网站关闭提示"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<n-space>
|
||||||
|
<n-button type="primary" @click="formSubmit">更新基本信息</n-button>
|
||||||
|
</n-space>
|
||||||
|
</div>
|
||||||
|
</n-form>
|
||||||
|
</n-grid-item>
|
||||||
|
</n-grid>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, reactive, ref, toRefs } from 'vue'
|
||||||
|
import { useDialog, useMessage } from 'naive-ui'
|
||||||
|
|
||||||
|
const rules = {
|
||||||
|
name: {
|
||||||
|
required: true,
|
||||||
|
message: '请输入网站名称',
|
||||||
|
trigger: 'blur'
|
||||||
|
},
|
||||||
|
mobile: {
|
||||||
|
required: true,
|
||||||
|
message: '请输入联系电话',
|
||||||
|
trigger: 'input'
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
setup() {
|
||||||
|
const formRef = ref(null)
|
||||||
|
const message = useMessage()
|
||||||
|
const dialog = useDialog()
|
||||||
|
|
||||||
|
const state = reactive({
|
||||||
|
formValue: {
|
||||||
|
name: '',
|
||||||
|
mobile: '',
|
||||||
|
icpCode: '',
|
||||||
|
address: '',
|
||||||
|
loginCode: 0,
|
||||||
|
closeText: '网站维护中，暂时无法访问！本网站正在进行系统维护和技术升级，网站暂时无法访问，敬请谅解！',
|
||||||
|
systemOpen: true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function systemOpenChange(value) {
|
||||||
|
if (!value) {
|
||||||
|
dialog.warning({
|
||||||
|
title: '提示',
|
||||||
|
content: '您确定要关闭系统访问吗？该操作立马生效，请慎重操作！',
|
||||||
|
positiveText: '确定',
|
||||||
|
negativeText: '取消',
|
||||||
|
onPositiveClick: () => {
|
||||||
|
message.success('操作成功')
|
||||||
|
},
|
||||||
|
onNegativeClick: () => {
|
||||||
|
state.formValue.systemOpen = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function formSubmit(e) {
|
||||||
|
formRef.value.validate((errors) => {
|
||||||
|
if (!errors) {
|
||||||
|
message.success('验证成功')
|
||||||
|
} else {
|
||||||
|
message.error('验证失败，请填写完整信息')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetForm() {
|
||||||
|
formRef.value.restoreValidation()
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
formRef,
|
||||||
|
...toRefs(state),
|
||||||
|
rules,
|
||||||
|
formSubmit,
|
||||||
|
resetForm,
|
||||||
|
systemOpenChange
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
85
src/views/setting/system/EmailSetting.vue
Normal file
85
src/views/setting/system/EmailSetting.vue
Normal file
@@ -0,0 +1,85 @@
|
|||||||
|
<template>
|
||||||
|
<n-grid cols="2 s:2 m:2 l:3 xl:3 2xl:3" responsive="screen">
|
||||||
|
<n-grid-item>
|
||||||
|
<n-form
|
||||||
|
:label-width="120"
|
||||||
|
:model="formValue"
|
||||||
|
:rules="rules"
|
||||||
|
ref="formRef"
|
||||||
|
>
|
||||||
|
|
||||||
|
<n-form-item label="发件人邮箱" path="originator">
|
||||||
|
<n-input v-model:value="formValue.originator" placeholder="请输入发件人邮箱"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="SMTP服务器地址">
|
||||||
|
<n-input placeholder="请输入SMTP服务器地址"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="SMTP服务器端口">
|
||||||
|
<n-input placeholder="请输入SMTP服务器端口"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="SMTP用户名">
|
||||||
|
<n-input placeholder="请输入SMTP用户名"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="SMTP密码">
|
||||||
|
<n-input type="password" placeholder="请输入SMTP密码"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="邮件测试">
|
||||||
|
<n-button>邮件测试</n-button>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<n-space>
|
||||||
|
<n-button type="primary" @click="formSubmit">更新邮件信息</n-button>
|
||||||
|
</n-space>
|
||||||
|
</div>
|
||||||
|
</n-form>
|
||||||
|
</n-grid-item>
|
||||||
|
</n-grid>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, reactive, ref, toRefs } from 'vue'
|
||||||
|
import { useMessage } from 'naive-ui'
|
||||||
|
|
||||||
|
const rules = {
|
||||||
|
originator: {
|
||||||
|
required: true,
|
||||||
|
message: '请输入发件人邮箱',
|
||||||
|
trigger: 'blur'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export default defineComponent({
|
||||||
|
setup() {
|
||||||
|
const formRef: any = ref(null)
|
||||||
|
const message = useMessage()
|
||||||
|
|
||||||
|
const state = reactive({
|
||||||
|
formValue: {
|
||||||
|
originator: '',
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function formSubmit() {
|
||||||
|
formRef.value.validate((errors) => {
|
||||||
|
if (!errors) {
|
||||||
|
message.success('验证成功')
|
||||||
|
} else {
|
||||||
|
message.error('验证失败，请填写完整信息')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
formRef,
|
||||||
|
...toRefs(state),
|
||||||
|
rules,
|
||||||
|
formSubmit
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
200
src/views/setting/system/RevealSetting.vue
Normal file
200
src/views/setting/system/RevealSetting.vue
Normal file
@@ -0,0 +1,200 @@
|
|||||||
|
<template>
|
||||||
|
<n-grid cols="2 s:2 m:2 l:3 xl:3 2xl:3" responsive="screen">
|
||||||
|
<n-grid-item>
|
||||||
|
<n-form
|
||||||
|
:label-width="120"
|
||||||
|
:model="formValue"
|
||||||
|
:rules="rules"
|
||||||
|
ref="formRef"
|
||||||
|
>
|
||||||
|
<n-form-item label="商品图片(大)">
|
||||||
|
<n-space align="center">
|
||||||
|
<span>宽度：</span>
|
||||||
|
<n-input v-model:value="formValue.bigWidth" style="width:80px" placeholder="宽度像素"/>
|
||||||
|
<span>高度：</span>
|
||||||
|
<n-input v-model:value="formValue.bigHeight" style="width:80px" placeholder="高度像素"/>
|
||||||
|
</n-space>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="商品图片(小)">
|
||||||
|
<n-space align="center">
|
||||||
|
<span>宽度：</span>
|
||||||
|
<n-input v-model:value="formValue.smallWidth" style="width:80px" placeholder="宽度像素"/>
|
||||||
|
<span>高度：</span>
|
||||||
|
<n-input v-model:value="formValue.smallHeight" style="width:80px" placeholder="高度像素"/>
|
||||||
|
</n-space>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="水印透明度" path="watermarkClarity">
|
||||||
|
<n-input-number v-model:value="formValue.watermarkClarity" :show-button="false" placeholder="请输入水印透明度"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="水印图片" path="watermarkClarity">
|
||||||
|
<n-upload action="http://www.mocky.io/v2/5e4bafc63100007100d8b70f">
|
||||||
|
<n-button>上传文件</n-button>
|
||||||
|
</n-upload>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="水印位置" path="watermarkPlace">
|
||||||
|
<n-select placeholder="请选择价格精确方式"
|
||||||
|
:options="watermarkPlaceList"
|
||||||
|
v-model:value="formValue.watermarkPlace"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="价格精确位数" path="pricePreciseNum">
|
||||||
|
<n-select placeholder="请选择价格精确位数"
|
||||||
|
:options="pricePreciseNumList"
|
||||||
|
v-model:value="formValue.pricePreciseNum"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="价格精确方式" path="pricePrecise">
|
||||||
|
<n-select placeholder="请选择价格精确方式"
|
||||||
|
:options="pricePreciseList"
|
||||||
|
v-model:value="formValue.pricePrecise"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<n-form-item label="前台显示市场价" path="isMarketPrice">
|
||||||
|
<n-switch size="large" v-model:value="formValue.isMarketPrice"/>
|
||||||
|
</n-form-item>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<n-space>
|
||||||
|
<n-button type="primary" @click="formSubmit">更新显示信息</n-button>
|
||||||
|
</n-space>
|
||||||
|
</div>
|
||||||
|
</n-form>
|
||||||
|
</n-grid-item>
|
||||||
|
</n-grid>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, reactive, ref, toRefs } from 'vue'
|
||||||
|
import { useDialog, useMessage } from 'naive-ui'
|
||||||
|
|
||||||
|
const rules = {
|
||||||
|
name: {
|
||||||
|
required: true,
|
||||||
|
message: '请输入网站名称',
|
||||||
|
trigger: 'blur'
|
||||||
|
},
|
||||||
|
mobile: {
|
||||||
|
required: true,
|
||||||
|
message: '请输入联系电话',
|
||||||
|
trigger: 'input'
|
||||||
|
},
|
||||||
|
}
|
||||||
|
const watermarkPlaceList = [
|
||||||
|
{
|
||||||
|
label: '左上',
|
||||||
|
value: 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '右上',
|
||||||
|
value: 2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '居中',
|
||||||
|
value: 3
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '右下',
|
||||||
|
value: 4
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const pricePreciseNumList = [
|
||||||
|
{
|
||||||
|
label: '2位',
|
||||||
|
value: 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '3位',
|
||||||
|
value: 2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '4位',
|
||||||
|
value: 3
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const pricePreciseList = [
|
||||||
|
{
|
||||||
|
label: '四舍五入',
|
||||||
|
value: 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '向上取整',
|
||||||
|
value: 2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '向下取整',
|
||||||
|
value: 3
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
setup() {
|
||||||
|
const formRef: any = ref(null)
|
||||||
|
const message = useMessage()
|
||||||
|
const dialog = useDialog()
|
||||||
|
|
||||||
|
const state = reactive({
|
||||||
|
formValue: {
|
||||||
|
bigWidth: '',
|
||||||
|
bigHeight: '',
|
||||||
|
smallWidth: '',
|
||||||
|
smallHeight: '',
|
||||||
|
watermarkClarity: null,
|
||||||
|
pricePrecise: 1,
|
||||||
|
isMarketPrice: true,
|
||||||
|
pricePreciseNum:null,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function systemOpenChange(value) {
|
||||||
|
if (!value) {
|
||||||
|
dialog.warning({
|
||||||
|
title: '提示',
|
||||||
|
content: '您确定要关闭系统访问吗？该操作立马生效，请慎重操作！',
|
||||||
|
positiveText: '确定',
|
||||||
|
negativeText: '取消',
|
||||||
|
onPositiveClick: () => {
|
||||||
|
message.success('操作成功')
|
||||||
|
},
|
||||||
|
onNegativeClick: () => {
|
||||||
|
state.formValue.systemOpen = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function formSubmit(e) {
|
||||||
|
formRef.value.validate((errors) => {
|
||||||
|
if (!errors) {
|
||||||
|
message.success('验证成功')
|
||||||
|
} else {
|
||||||
|
message.error('验证失败，请填写完整信息')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetForm() {
|
||||||
|
formRef.value.restoreValidation()
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
formRef,
|
||||||
|
...toRefs(state),
|
||||||
|
pricePreciseList,
|
||||||
|
watermarkPlaceList,
|
||||||
|
pricePreciseNumList,
|
||||||
|
rules,
|
||||||
|
formSubmit,
|
||||||
|
resetForm,
|
||||||
|
systemOpenChange
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
96
src/views/setting/system/system.vue
Normal file
96
src/views/setting/system/system.vue
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<n-grid :x-gap="24">
|
||||||
|
<n-grid-item span="6">
|
||||||
|
<n-card :bordered="false" size="small" class="proCard">
|
||||||
|
<n-thing
|
||||||
|
class="thing-cell"
|
||||||
|
v-for="item in typeTabList" :key="item.key"
|
||||||
|
:class="{'thing-cell-on':type===item.key}"
|
||||||
|
@click="switchType(item)"
|
||||||
|
>
|
||||||
|
<template #header>{{ item.name }}</template>
|
||||||
|
<template #description>{{ item.desc }}</template>
|
||||||
|
</n-thing>
|
||||||
|
</n-card>
|
||||||
|
</n-grid-item>
|
||||||
|
<n-grid-item span="18">
|
||||||
|
<n-card :bordered="false" size="small" :title="typeTitle" class="proCard">
|
||||||
|
<BasicSetting v-if="type === 1"></BasicSetting>
|
||||||
|
<RevealSetting v-if="type === 2"></RevealSetting>
|
||||||
|
<EmailSetting v-if="type === 3"></EmailSetting>
|
||||||
|
</n-card>
|
||||||
|
</n-grid-item>
|
||||||
|
</n-grid>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, reactive, toRefs } from 'vue'
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
import BasicSetting from "./BasicSetting.vue"
|
||||||
|
import RevealSetting from "./RevealSetting.vue"
|
||||||
|
import EmailSetting from "./EmailSetting.vue"
|
||||||
|
|
||||||
|
const typeTabList = [
|
||||||
|
{
|
||||||
|
name: '基本设置',
|
||||||
|
desc: '系统常规设置',
|
||||||
|
key: 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '显示设置',
|
||||||
|
desc: '系统显示设置',
|
||||||
|
key: 2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '邮件设置',
|
||||||
|
desc: '系统邮件设置',
|
||||||
|
key: 3
|
||||||
|
}
|
||||||
|
]
|
||||||
|
export default defineComponent({
|
||||||
|
components: { BasicSetting, RevealSetting, EmailSetting },
|
||||||
|
setup() {
|
||||||
|
const router = useRouter()
|
||||||
|
const state = reactive({
|
||||||
|
type: 1,
|
||||||
|
typeTitle: '基本设置'
|
||||||
|
})
|
||||||
|
|
||||||
|
function switchType(e) {
|
||||||
|
state.type = e.key
|
||||||
|
state.typeTitle = e.name
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
...toRefs(state),
|
||||||
|
switchType,
|
||||||
|
typeTabList
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.thing-cell {
|
||||||
|
margin: 0 -16px 10px;
|
||||||
|
padding: 5px 16px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #f3f3f3;
|
||||||
|
cursor: pointer
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.thing-cell-on {
|
||||||
|
background: #f0faff;
|
||||||
|
color: #2d8cf0;
|
||||||
|
|
||||||
|
::v-deep(.n-thing-main .n-thing-header .n-thing-header__title) {
|
||||||
|
color: #2d8cf0
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #f0faff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user