huangzhenbao/medical-mall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修复大部分页面状态组件

Browse Source
This commit is contained in:
huangzhenbao
2026-03-09 15:59:53 +08:00
parent a1ab7f4faa
commit 05049e728e
5 changed files with 14 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
pages/mall/admin/cms/category/list.uvue
View File

@@ -44,9 +44,7 @@
<view class="img-box-placeholder"></view>
</view>
<view class="td col-status">
<view :class="['switch-mock', item.status ? 'active' : '']" @click="toggleStatus(item)">
<view class="switch-handle"></view>
</view>
<StatusSwitch v-model="item.status" />
</view>
<view class="td col-op">
<view class="op-links">
@@ -123,16 +121,7 @@
<view class="form-item row">
<view class="label-box"><text class="label-txt">状态:</text></view>
<view class="radio-group">
<view class="radio-item" @click="formStatus = true">
<view :class="['radio-circle', formStatus ? 'checked' : '']"><view v-if="formStatus" class="radio-in"></view></view>
<text class="radio-la">显示</text>
</view>
<view class="radio-item" @click="formStatus = false">
<view :class="['radio-circle', !formStatus ? 'checked' : '']"><view v-if="!formStatus" class="radio-in"></view></view>
<text class="radio-la">隐藏</text>
</view>
</view>
<StatusSwitch v-model="formStatus" activeText="显示" inactiveText="隐藏" />
</view>
</scroll-view>
@@ -147,6 +136,7 @@
<script setup lang="uts">
import { ref } from 'vue'
import StatusSwitch from '@/components/StatusSwitch.uvue'
const filterKeyword = ref('')
const categoryList = ref([
@@ -206,10 +196,6 @@ const handleEdit = (item: any) => {
showDrawer.value = true
}
const toggleStatus = (item: any) => {
item.status = !item.status
}
const closeDrawer = () => {
isClosing.value = true
setTimeout(() => {
@@ -265,10 +251,7 @@ const handleQuery = () => { console.log('Querying...') }
.col-status { width: 120px; justify-content: center; }
.col-op { width: 220px; justify-content: center; }
.img-box-placeholder { width: 40px; height: 40px; background-color: #f5f7fa; border-radius: 4px; }
.switch-mock { width: 40px; height: 20px; background-color: #dcdfe6; border-radius: 10px; position: relative; transition: all 0.3s; }
.switch-mock.active { background-color: #2d8cf0; }
.switch-handle { width: 16px; height: 16px; background-color: #fff; border-radius: 8px; position: absolute; top: 2px; left: 2px; transition: all 0.3s; }
.active .switch-handle { left: 22px; }
.op-links { display: flex; flex-direction: row; align-items: center; }
.link-txt { font-size: 13px; color: #2d8cf0; cursor: pointer; }
.danger { color: #ed4014; }
@@ -331,13 +314,6 @@ const handleQuery = () => { console.log('Querying...') }
}
.img-icon { font-size: 30px; color: #ccc; }
.radio-group { display: flex; flex-direction: row; gap: 30px; }
.radio-item { display: flex; flex-direction: row; align-items: center; cursor: pointer; }
.radio-circle { width: 16px; height: 16px; border: 1px solid #dcdee2; border-radius: 50%; margin-right: 8px; display: flex; align-items: center; justify-content: center; }
.radio-circle.checked { border-color: #2d8cf0; }
.radio-in { width: 8px; height: 8px; background-color: #2d8cf0; border-radius: 50%; }
.radio-la { font-size: 14px; color: #606266; }
.drawer-footer { height: 60px; border-top: 1px solid #f0f0f0; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; padding: 0 24px; }
.btn-cancel { padding: 8px 20px; border: 1px solid #dcdee2; border-radius: 4px; margin-right: 15px; }
.btn-confirm { padding: 8px 20px; background-color: #2d8cf0; border-radius: 4px; }