完成代码路径重构

This commit is contained in:
2026-03-18 08:36:49 +08:00
parent 4041933e42
commit c2cd6dcd95
290 changed files with 866 additions and 38459 deletions

View File

@@ -0,0 +1,253 @@
<template>
<view class="marketing-checkin-reward">
<view class="reward-card border-shadow">
<!-- Tabs -->
<view class="reward-tabs">
<view class="tab-item" :class="{ active: currentTab === 'continuous' }" @click="currentTab = 'continuous'">
<text class="tab-txt">连续签到奖励</text>
</view>
<view class="tab-item" :class="{ active: currentTab === 'cumulative' }" @click="currentTab = 'cumulative'">
<text class="tab-txt">累积签到奖励</text>
</view>
</view>
<view class="action-row">
<button v-if="currentTab === 'continuous'" class="btn-primary" @click="openModal('continuous')">添加连续签到奖励</button>
<button v-else class="btn-primary" @click="openModal('cumulative')">添加累积签到奖励</button>
</view>
<!-- Table -->
<view class="table-container">
<view class="table-head">
<view class="th cell-id">编号</view>
<view class="th cell-type">类型</view>
<view class="th cell-days">签到天数</view>
<view class="th cell-reward">奖励内容</view>
<view class="th cell-status">状态</view>
<view class="th cell-op">操作</view>
</view>
<view class="table-body">
<view v-for="item in displayList" :key="item.id" class="table-row">
<view class="td cell-id"><text class="td-txt">{{ item.id }}</text></view>
<view class="td cell-type"><text class="td-txt">{{ item.type === 'continuous' ? '连续签到' : '累积签到' }}</text></view>
<view class="td cell-days"><text class="td-txt">{{ item.days }}天</text></view>
<view class="td cell-reward">
<text class="td-txt">积分+{{ item.integral }}, 经验+{{ item.exp }}</text>
</view>
<view class="td cell-status">
<StatusSwitch v-model="item.is_open" />
</view>
<view class="td cell-op">
<text class="op-link" @click="handleEdit(item)">编辑</text>
<text class="op-link del ml-10" @click="handleDelete(item)">删除</text>
</view>
</view>
</view>
</view>
</view>
<!-- 奖励设置弹窗 -->
<view v-if="showModal" class="modal-mask">
<view class="modal-content">
<view class="modal-header">
<text class="modal-title">{{ modalType === 'continuous' ? '连续签到奖励' : '累积签到奖励' }}</text>
<text class="modal-close" @click="showModal = false">×</text>
</view>
<view class="modal-body">
<view class="form-item">
<text class="form-label">{{ modalType === 'continuous' ? '连续签到天数' : '累积签到天数' }}</text>
<input class="form-input" v-model="formData.days" type="number" placeholder="0" />
</view>
<view class="form-item">
<text class="form-label">赠送积分:</text>
<input class="form-input" v-model="formData.integral" type="number" placeholder="0" />
</view>
<view class="form-item">
<text class="form-label">赠送经验:</text>
<input class="form-input" v-model="formData.exp" type="number" placeholder="0" />
</view>
</view>
<view class="modal-footer">
<button class="btn-cancel" @click="showModal = false">取消</button>
<button class="btn-submit" @click="handleSubmit">确定</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
import { ref, reactive, computed } from 'vue'
import StatusSwitch from '@/components/StatusSwitch.uvue'
const currentTab = ref('continuous')
const showModal = ref(false)
const modalType = ref('continuous')
const formData = reactive({
days: '',
integral: '',
exp: ''
})
const continuousList = ref([
{ id: 1, type: 'continuous', days: 3, integral: 20, exp: 2, is_open: true },
{ id: 2, type: 'continuous', days: 7, integral: 50, exp: 5, is_open: true }
])
const cumulativeList = ref([
{ id: 3, type: 'cumulative', days: 15, integral: 100, exp: 10, is_open: true },
{ id: 4, type: 'cumulative', days: 30, integral: 200, exp: 20, is_open: true }
])
const displayList = computed(() => {
return currentTab.value === 'continuous' ? continuousList.value : cumulativeList.value
})
const openModal = (type: string) => {
modalType.value = type
formData.days = ''
formData.integral = ''
formData.exp = ''
showModal.value = true
}
const handleEdit = (item: any) => {
uni.showToast({ title: '编辑功能暂未对接', icon: 'none' })
}
const handleDelete = (item: any) => {
uni.showModal({
title: '提示',
content: '确认删除该奖励配置吗?',
success: (res) => {
if (res.confirm) {
if (currentTab.value === 'continuous') {
continuousList.value = continuousList.value.filter(i => i.id !== item.id)
} else {
cumulativeList.value = cumulativeList.value.filter(i => i.id !== item.id)
}
uni.showToast({ title: '已删除', icon: 'success' })
}
}
})
}
const handleSubmit = () => {
if (!formData.days) {
uni.showToast({ title: '请输入天数', icon: 'none' })
return
}
const newItem = {
id: Date.now(),
type: modalType.value,
days: parseInt(formData.days.toString()),
integral: parseInt(formData.integral.toString() || '0'),
exp: parseInt(formData.exp.toString() || '0'),
is_open: true
}
if (modalType.value === 'continuous') {
continuousList.value.push(newItem)
} else {
cumulativeList.value.push(newItem)
}
showModal.value = false
uni.showToast({ title: '添加成功', icon: 'success' })
}
</script>
<style scoped lang="scss">
.marketing-checkin-reward {
padding: 0;
background: transparent;
min-height: auto;
}
.border-shadow {
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05);
}
.reward-card { padding: 24px; }
.reward-tabs {
display: flex;
flex-direction: row;
border-bottom: 1px solid #e8eaec;
margin-bottom: 24px;
}
.tab-item {
padding: 12px 24px;
cursor: pointer;
position: relative;
}
.tab-txt { font-size: 14px; color: #515a6e; }
.tab-item.active .tab-txt { color: #1890ff; font-weight: bold; }
.tab-item.active::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
right: 0;
height: 2px;
background: #1890ff;
}
.action-row { margin-bottom: 24px; }
.btn-primary {
background: #1890ff;
color: #fff;
border: none;
height: 32px;
line-height: 32px;
padding: 0 16px;
font-size: 14px;
border-radius: 4px;
cursor: pointer;
}
.table-head { display: flex; flex-direction: row; background: #f8f8f9; border-bottom: 1px solid #e8eaec; }
.th { padding: 12px 8px; font-size: 13px; color: #515a6e; font-weight: bold; }
.table-row { display: flex; flex-direction: row; border-bottom: 1px solid #e8eaec; align-items: center; }
.td { padding: 16px 8px; }
.td-txt { font-size: 13px; color: #515a6e; }
.cell-id { width: 80px; }
.cell-type { width: 120px; }
.cell-days { width: 120px; }
.cell-reward { flex: 1; }
.cell-status { width: 100px; text-align: center; }
.cell-op { width: 150px; text-align: right; display: flex; flex-direction: row; }
.op-link { color: #1890ff; font-size: 13px; cursor: pointer; }
.op-link.del { color: #ff4d4f; }
.ml-10 { margin-left: 10px; }
/* Modal */
.modal-mask {
position: fixed; top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 1000;
}
.modal-content { width: 500px; background: #fff; border-radius: 4px; }
.modal-header { padding: 16px 24px; border-bottom: 1px solid #e8eaec; display: flex; justify-content: space-between; align-items: center; }
.modal-title { font-size: 16px; font-weight: bold; }
.modal-close { font-size: 24px; color: #999; cursor: pointer; }
.modal-body { padding: 24px; }
.modal-footer { padding: 12px 24px; border-top: 1px solid #e8eaec; display: flex; justify-content: flex-end; }
.form-item { display: flex; flex-direction: row; margin-bottom: 20px; align-items: center; }
.form-label { width: 120px; font-size: 14px; color: #606266; }
.form-input { flex: 1; height: 32px; border: 1px solid #dcdfe6; border-radius: 4px; padding: 0 12px; }
.btn-cancel { margin-right: 8px; height: 32px; line-height: 32px; padding: 0 16px; font-size: 14px; border-radius: 4px; border: 1px solid #dcdfe6; background: #fff; }
.btn-submit { height: 32px; line-height: 32px; padding: 0 16px; font-size: 14px; border-radius: 4px; background: #1890ff; color: #fff; border: none; }
</style>