|
@@ -57,30 +57,30 @@
|
|
|
|
|
|
<el-tabs v-model="activeName" class="demo-tabs">
|
|
<el-tabs v-model="activeName" class="demo-tabs">
|
|
<el-tab-pane label="列表页初始化" name="init">
|
|
<el-tab-pane label="列表页初始化" name="init">
|
|
- <el-form ref="formInit" label-width="60px">
|
|
|
|
- <el-row v-for="(row, index) in tabData.initList" :key="row.id" class="form-init-row">
|
|
|
|
- <el-col :span="8">
|
|
|
|
|
|
+ <el-form ref="formInit" label-width="66px" class="form-init">
|
|
|
|
+ <div v-for="(row, index) in tabData.initList" :key="row.id" class="form-init-row">
|
|
|
|
+ <div class="form-init-row-js">
|
|
<el-form-item label="动作JS" required class="pointer-input">
|
|
<el-form-item label="动作JS" required class="pointer-input">
|
|
<el-input v-model="row.actionJs" readonly placeholder="click to input" @click="showEditActionCodeDialog(row, 'actionJs')"></el-input>
|
|
<el-input v-model="row.actionJs" readonly placeholder="click to input" @click="showEditActionCodeDialog(row, 'actionJs')"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- </el-col>
|
|
|
|
- <el-col :span="8">
|
|
|
|
|
|
+ </div>
|
|
|
|
+ <div class="form-init-row-js">
|
|
<el-form-item label="检查JS" class="pointer-input">
|
|
<el-form-item label="检查JS" class="pointer-input">
|
|
<el-input v-model="row.checkJs" readonly placeholder="click to input" @click="showEditActionCodeDialog(row, 'checkJs')"></el-input>
|
|
<el-input v-model="row.checkJs" readonly placeholder="click to input" @click="showEditActionCodeDialog(row, 'checkJs')"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- </el-col>
|
|
|
|
- <el-col :span="4">
|
|
|
|
|
|
+ </div>
|
|
|
|
+ <div class="form-init-row-ms">
|
|
<el-form-item label="延迟(MS)" required label-width="90px">
|
|
<el-form-item label="延迟(MS)" required label-width="90px">
|
|
<el-input v-model.trim="row.sleepTime"></el-input>
|
|
<el-input v-model.trim="row.sleepTime"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- </el-col>
|
|
|
|
- <el-col :span="3">
|
|
|
|
|
|
+ </div>
|
|
|
|
+ <div class="form-init-row-actions">
|
|
<el-button-group class="mark-buttons">
|
|
<el-button-group class="mark-buttons">
|
|
<el-button type="success" size="small" :icon="CirclePlusFilled" @click="addInitItem(index)" v-if="tabData.initList.length < tabData.initLengthMax"></el-button>
|
|
<el-button type="success" size="small" :icon="CirclePlusFilled" @click="addInitItem(index)" v-if="tabData.initList.length < tabData.initLengthMax"></el-button>
|
|
<el-button type="danger" size="small" :icon="RemoveFilled" @click="removeInitItem(row)"></el-button>
|
|
<el-button type="danger" size="small" :icon="RemoveFilled" @click="removeInitItem(row)"></el-button>
|
|
</el-button-group>
|
|
</el-button-group>
|
|
- </el-col>
|
|
|
|
- </el-row>
|
|
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
<div class="no-init-list-container" v-if="tabData.initList.length === 0">
|
|
<div class="no-init-list-container" v-if="tabData.initList.length === 0">
|
|
<el-button type="success" :icon="CirclePlusFilled" @click="addInitItem(index)"></el-button>
|
|
<el-button type="success" :icon="CirclePlusFilled" @click="addInitItem(index)"></el-button>
|
|
</div>
|
|
</div>
|
|
@@ -273,7 +273,7 @@ class InitListItem {
|
|
}
|
|
}
|
|
|
|
|
|
const tabData = reactive({
|
|
const tabData = reactive({
|
|
- initLengthMax: 5,
|
|
|
|
|
|
+ initLengthMax: 10,
|
|
initList: [
|
|
initList: [
|
|
// {
|
|
// {
|
|
// actionJs: '', //动作JS
|
|
// actionJs: '', //动作JS
|
|
@@ -730,11 +730,28 @@ defineExpose({
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+.form-init {
|
|
|
|
+ padding-bottom: 16px;
|
|
|
|
+}
|
|
.form-init-row {
|
|
.form-init-row {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: space-between;
|
|
::v-deep {
|
|
::v-deep {
|
|
- .el-form-item__label {
|
|
|
|
- white-space: nowrap;
|
|
|
|
|
|
+ .el-form-item {
|
|
|
|
+ margin-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+ .form-init-row-js {
|
|
|
|
+ flex: 8;
|
|
|
|
+ }
|
|
|
|
+ .form-init-row-ms {
|
|
|
|
+ flex: 4;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &:not(:last-of-type) {
|
|
|
|
+ margin-bottom: 16px;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|