fix: 新增页面,样式统一修复。

This commit is contained in:
tianyongbao
2026-06-26 15:00:39 +08:00
parent a2b891671a
commit c988be7a72
39 changed files with 1921 additions and 746 deletions

View File

@@ -9,55 +9,55 @@
<view class="section">
<view class="section-title">{{ title }}</view>
<view class="form-view">
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="180rpx"
:labelStyle="{ color: '#333333', fontSize: '30rpx', marginRight: '24rpx' }">
<u-form-item label="任务名称" prop="jobName" required>
<u--input v-model="form.jobName" placeholder="请输入任务名称"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="任务组名" prop="jobGroup" required>
<u--input v-model="form.jobGroup" placeholder="请输入任务组名"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="调用目标" prop="invokeTarget" required>
<u--input v-model="form.invokeTarget" placeholder="请输入调用目标字符串"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="cron表达式" prop="cronExpression" required>
<u--input v-model="form.cronExpression" placeholder="请输入cron执行表达式"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
<view class="input-with-arrow">
<u--input v-model="statusName" readonly disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<text class="arrow-icon"></text>
</view>
</u-form-item>
<u-form-item label="是否并发" prop="concurrentName" @click="showConcurrentPicker = true">
<u--input v-model="concurrentName" disabled disabledColor="#ffffff" placeholder="请选择是否并发"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
<view class="input-with-arrow">
<u--input v-model="concurrentName" readonly disabledColor="#ffffff" placeholder="请选择是否并发"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<text class="arrow-icon"></text>
</view>
</u-form-item>
<u-form-item label="错失策略" prop="misfirePolicyName" @click="showMisfirePolicyPicker = true">
<u--input v-model="misfirePolicyName" disabled disabledColor="#ffffff" placeholder="请选择错失执行策略"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
<view class="input-with-arrow">
<u--input v-model="misfirePolicyName" readonly disabledColor="#ffffff" placeholder="请选择错失执行策略"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<text class="arrow-icon"></text>
</view>
</u-form-item>
<u-form-item label="备注" prop="remark" labelPosition="top">
<u--textarea v-model="form.remark" placeholder="请输入备注" border="none" autoHeight inputAlign="right" count
maxlength="500" style="padding:18rpx 0;"></u--textarea>
<u--textarea v-model="form.remark" placeholder="请输入备注" autoHeight inputAlign="left" count
maxlength="500" style="border: 2rpx solid #dcdfe6 !important; height: 160rpx;"></u--textarea>
</u-form-item>
</u--form>
<view class="form-btn">
@@ -90,6 +90,15 @@ const showMisfirePolicyPicker = ref(false)
const statusName = ref('')
const concurrentName = ref('')
const misfirePolicyName = ref('')
const inputBaseStyle = {
background: '#ffffff',
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
const statusColumns = ref([])
const concurrentColumns = ref([])
const misfirePolicyColumns = ref([])
@@ -259,6 +268,22 @@ function submit() {
.form-view {
padding: 24rpx;
.input-with-arrow {
position: relative;
width: 100%;
.arrow-icon {
position: absolute;
right: 20rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 20rpx;
pointer-events: none;
z-index: 10;
}
}
.form-btn {
padding-top: 16rpx;
}