主要更新uniapp相关功能
This commit is contained in:
hero920103 committed
1 parent
aa92ca40a2
commit
5b4dbb2b46
65 files changed
+8532
-1921
No files matched your search
@@ -8,16 +8,15 @@
|
||||
<view class="form-card" :class="{ 'is-disabled': isCompleted }">
|
||||
<view class="field">
|
||||
<text class="field-label">日程内容 <text class="required">*</text></text>
|
||||
<textarea
|
||||
class="field-textarea content-textarea"
|
||||
<u-textarea
|
||||
v-model="form.content"
|
||||
placeholder="输入日程内容，支持多行"
|
||||
placeholder-class="placeholder"
|
||||
maxlength="1000"
|
||||
:show-confirm-bar="false"
|
||||
:maxlength="1000"
|
||||
count
|
||||
height="120"
|
||||
border="none"
|
||||
:disabled="isCompleted"
|
||||
/>
|
||||
<text class="char-count">{{ form.content.length }}/1000</text>
|
||||
</view>
|
||||
|
||||
<view class="field">
|
||||
@@ -44,15 +43,16 @@
|
||||
<text class="field-label">提醒渠道</text>
|
||||
<text class="field-hint">可多选，接入接口后按渠道下发提醒</text>
|
||||
<view class="channel-grid">
|
||||
<view
|
||||
<u-tag
|
||||
v-for="channel in channelOptions"
|
||||
:key="channel.value"
|
||||
class="channel-chip"
|
||||
:class="{ active: form.remindChannels.includes(channel.value) }"
|
||||
@tap="!isCompleted && toggleChannel(channel.value)"
|
||||
>
|
||||
<text>{{ channel.label }}</text>
|
||||
</view>
|
||||
:text="channel.label"
|
||||
:name="channel.value"
|
||||
:type="isChannelActive(channel.value) ? 'primary' : 'info'"
|
||||
:plain="!isChannelActive(channel.value)"
|
||||
size="medium"
|
||||
@click="onChannelTap"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -68,41 +68,39 @@
|
||||
|
||||
<view class="field">
|
||||
<text class="field-label">重复提醒间隔（分钟）</text>
|
||||
<view class="number-input">
|
||||
<button class="number-btn" @tap="form.repeatIntervalMinutes = Math.max(0, form.repeatIntervalMinutes - 1)" :disabled="isCompleted">−</button>
|
||||
<input
|
||||
v-model.number="form.repeatIntervalMinutes"
|
||||
type="number"
|
||||
class="number-field"
|
||||
:disabled="isCompleted"
|
||||
@blur="form.repeatIntervalMinutes = Math.max(0, Math.min(1440, form.repeatIntervalMinutes))"
|
||||
/>
|
||||
<button class="number-btn" @tap="form.repeatIntervalMinutes = Math.min(1440, form.repeatIntervalMinutes + 1)" :disabled="isCompleted">+</button>
|
||||
</view>
|
||||
<u-number-box
|
||||
v-model="form.repeatIntervalMinutes"
|
||||
:min="0"
|
||||
:max="1440"
|
||||
integer
|
||||
:disabled="isCompleted"
|
||||
/>
|
||||
<text class="form-tip">0表示不重复，仅发送一次</text>
|
||||
</view>
|
||||
|
||||
<view class="field">
|
||||
<text class="field-label">最多提醒次数</text>
|
||||
<view class="number-input">
|
||||
<button class="number-btn" @tap="form.maxSendCount = Math.max(1, form.maxSendCount - 1)" :disabled="isCompleted">−</button>
|
||||
<input
|
||||
v-model.number="form.maxSendCount"
|
||||
type="number"
|
||||
class="number-field"
|
||||
:disabled="isCompleted"
|
||||
@blur="form.maxSendCount = Math.max(1, Math.min(100, form.maxSendCount))"
|
||||
/>
|
||||
<button class="number-btn" @tap="form.maxSendCount = Math.min(100, form.maxSendCount + 1)" :disabled="isCompleted">+</button>
|
||||
</view>
|
||||
<u-number-box
|
||||
v-model="form.maxSendCount"
|
||||
:min="1"
|
||||
:max="100"
|
||||
integer
|
||||
:disabled="isCompleted"
|
||||
/>
|
||||
<text class="form-tip">最多发送的提醒次数</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="!isCompleted" class="footer">
|
||||
<view class="btn-primary full" :class="{ disabled: saving }" @tap="onSave">
|
||||
{{ saving ? '保存中...' : '保存' }}
|
||||
</view>
|
||||
<u-button
|
||||
type="primary"
|
||||
color="#2563eb"
|
||||
shape="circle"
|
||||
:loading="saving"
|
||||
loading-text="保存中..."
|
||||
text="保存"
|
||||
@click="onSave"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -177,12 +175,18 @@ async function loadSchedule(id) {
|
||||
}
|
||||
}
|
||||
|
||||
function toggleChannel(value) {
|
||||
const index = form.remindChannels.indexOf(value)
|
||||
/** 渠道是否已选中 */
|
||||
function isChannelActive(value) {
|
||||
return form.remindChannels.includes(value)
|
||||
}
|
||||
|
||||
function onChannelTap(name) {
|
||||
if (isCompleted.value) return
|
||||
const index = form.remindChannels.indexOf(name)
|
||||
if (index >= 0) {
|
||||
form.remindChannels.splice(index, 1)
|
||||
} else {
|
||||
form.remindChannels.push(value)
|
||||
form.remindChannels.push(name)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -315,29 +319,6 @@ async function saveData(datetime) {
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
.field-textarea {
|
||||
width: 100%;
|
||||
font-size: 30rpx;
|
||||
color: $color-text;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.content-textarea {
|
||||
height: 240rpx;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
color: $color-text-muted;
|
||||
}
|
||||
|
||||
.char-count {
|
||||
display: block;
|
||||
text-align: right;
|
||||
font-size: 22rpx;
|
||||
color: $color-text-muted;
|
||||
margin-top: 12rpx;
|
||||
}
|
||||
|
||||
.picker-value {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -356,69 +337,6 @@ async function saveData(datetime) {
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.channel-chip {
|
||||
padding: 14rpx 28rpx;
|
||||
border-radius: $radius-full;
|
||||
font-size: 26rpx;
|
||||
color: $color-text-secondary;
|
||||
background: $color-bg-page;
|
||||
border: 1rpx solid transparent;
|
||||
|
||||
&.active {
|
||||
color: $color-primary;
|
||||
background: $color-primary-bg;
|
||||
border-color: $color-primary;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.number-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.number-btn {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: $radius-md;
|
||||
background: $color-bg-page;
|
||||
border: 1rpx solid $color-divider;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 28rpx;
|
||||
color: $color-text;
|
||||
flex-shrink: 0;
|
||||
|
||||
&:active:not(:disabled) {
|
||||
background: $color-primary-bg;
|
||||
color: $color-primary;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
.number-field {
|
||||
flex: 1;
|
||||
height: 60rpx;
|
||||
padding: 0 16rpx;
|
||||
background: $color-bg-page;
|
||||
border: 1rpx solid $color-divider;
|
||||
border-radius: $radius-md;
|
||||
font-size: 28rpx;
|
||||
color: $color-text;
|
||||
text-align: center;
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.form-tip {
|
||||
display: block;
|
||||
font-size: 22rpx;
|
||||
@@ -439,29 +357,4 @@ async function saveData(datetime) {
|
||||
border-top: 1rpx solid $color-border;
|
||||
box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
flex: 1;
|
||||
height: 88rpx;
|
||||
border-radius: $radius-md;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
background: $color-primary;
|
||||
color: #fff;
|
||||
|
||||
&:active {
|
||||
background: $color-primary-dark;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
&.full {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user