调整样式,修复bug

master
yujialong 3 years ago
parent f2c8e318fa
commit 991656906c
  1. 218
      src/views/Transaction.vue
  2. 3
      vue.config.js

@ -68,7 +68,7 @@
<p class="p">操作一致性规则用户完成的功能操作与下方设置的操作点一致</p>
<div class="tree-con">
<div class="block">
<el-tree
<my-tree
class="action"
:ref="'tree-'+scope.$index"
:data="treeData"
@ -79,7 +79,7 @@
@check-change="(data, checked, indeterminate) => {
handleCheckChange(data, checked, indeterminate, scope.row, scope.$index);
}"
></el-tree>
></my-tree>
</div>
<div v-show="scope.row.isDisabled" class="mask"></div>
</div>
@ -108,119 +108,131 @@
<div class="block">
<!-- type: 题目类型(1选择 2判断 3填空 4问答 5指标结果) -->
<template v-if="scope.row.type == 1">
<div class="line">
<div>{{ scope.row.name }}</div>
</div>
<div class="line">
<span class="label mini">正确答案</span>
<div class="action">
<!--multiple:多选-->
<el-select
v-model="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
size="mini"
style="width: 100%"
>
<el-option
v-for="(item, index) in scope.row.items"
:key="index"
:label="item.options"
:value="item.itemId"
></el-option>
</el-select>
<div class="box">
<div class="line">
<div>{{ scope.row.name }}</div>
</div>
<div class="line">
<span class="label mini">正确答案</span>
<div class="action">
<!--multiple:多选-->
<el-select
v-model="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
size="mini"
style="width: 100%"
>
<el-option
v-for="(item, index) in scope.row.items"
:key="index"
:label="item.options"
:value="item.itemId"
></el-option>
</el-select>
</div>
</div>
</div>
</template>
<template v-if="scope.row.type == 2">
<div class="line">
<div>{{ scope.row.name }}</div>
</div>
<div class="line">
<span class="label mini">正确答案</span>
<div class="action">
<el-select
v-model="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
size="mini"
style="width: 100%"
>
<el-option
v-for="(item, index) in scope.row.items"
:key="index"
:label="item.options"
:value="item.itemId"
></el-option>
</el-select>
<div class="box">
<div class="line">
<div>{{ scope.row.name }}</div>
</div>
<div class="line">
<span class="label mini">正确答案</span>
<div class="action">
<el-select
v-model="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
size="mini"
style="width: 100%"
>
<el-option
v-for="(item, index) in scope.row.items"
:key="index"
:label="item.options"
:value="item.itemId"
></el-option>
</el-select>
</div>
</div>
</div>
</template>
<template v-if="scope.row.type == 3">
<div class="line">
<div class="box">
<div class="line" style="min-height: 100%;">
<span class="label">
<el-checkbox v-model="scope.row.fieldOfReq" :disabled="isView || scope.row.isDisabled">字段要求</el-checkbox>
<!--<el-checkbox v-model="scope.row.fieldOfReq" :disabled="isView || scope.row.isDisabled">字段要求</el-checkbox>-->
字段要求
</span>
<div class="action">
<el-input
class="mini-textarea"
type="textarea"
rows="6"
size="mini"
v-model.trim="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
></el-input>
<div class="action">
<el-input
class="mini-textarea"
type="textarea"
rows="6"
size="mini"
v-model.trim="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
></el-input>
</div>
</div>
</div>
</template>
<template v-if="scope.row.type == 4">
<div class="line">
<div class="box">
<div class="line">
<span class="label">
<el-checkbox v-model="scope.row.numOfWords" :disabled="isView || scope.row.isDisabled">字数要求</el-checkbox>
<!--<el-checkbox v-model="scope.row.numOfWords" :disabled="isView || scope.row.isDisabled">字数要求</el-checkbox>-->
字数要求
</span>
<div class="action a-line">
<el-select
v-model="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
size="mini"
>
<el-option label=">" value=">"></el-option>
<el-option label="<" value="<"></el-option>
<el-option label="=" value="="></el-option>
<el-option label=">=" value=">="></el-option>
<el-option label="<=" value="<="></el-option>
<el-option label="无限制" value="无限制"></el-option>
</el-select>
<el-input
class="number-input"
v-model.trim="scope.row.value2"
:disabled="isView || scope.row.isDisabled"
type="number"
min="1"
size="mini"
style="margin-left: 5px;"
></el-input>
<div class="action a-line">
<el-select
v-model="scope.row.value1"
:disabled="isView || scope.row.isDisabled"
size="mini"
>
<el-option label=">" value=">"></el-option>
<el-option label="<" value="<"></el-option>
<el-option label="=" value="="></el-option>
<el-option label=">=" value=">="></el-option>
<el-option label="<=" value="<="></el-option>
<el-option label="无限制" value="无限制"></el-option>
</el-select>
<el-input
class="number-input"
v-model.trim="scope.row.value2"
:disabled="isView || scope.row.isDisabled"
type="number"
min="1"
size="mini"
style="margin-left: 5px;"
></el-input>
</div>
</div>
</div>
<div class="line">
<span class="label">
<el-checkbox v-model="scope.row.fieldOfReq" :disabled="isView || scope.row.isDisabled">字段要求</el-checkbox>
</span>
<div class="action">
<el-input
class="mini-textarea"
type="textarea"
rows="5"
size="mini"
v-model.trim="scope.row.value3"
:disabled="isView || scope.row.isDisabled"
></el-input>
<div class="line">
<span class="label">
<!--<el-checkbox v-model="scope.row.fieldOfReq" :disabled="isView || scope.row.isDisabled">字段要求</el-checkbox>-->
字段要求
</span>
<div class="action">
<el-input
class="mini-textarea"
type="textarea"
rows="5"
size="mini"
v-model.trim="scope.row.value3"
:disabled="isView || scope.row.isDisabled"
></el-input>
</div>
</div>
</div>
</template>
</template>
<template v-if="scope.row.type == 5">
<template v-if="scope.row.type == 5">
<div class="box">
<div class="line">
<!--
<span class="label">选择指标</span>
@ -279,6 +291,7 @@
</div>
</div>
</div>
</div>
</template>
</div>
</template>
@ -288,7 +301,7 @@
<el-button v-show="scope.row.isDisabled" size="mini" type="text" @click="handleEdit(scope.row)">编辑</el-button>
<el-button v-show="!scope.row.isDisabled" size="mini" type="text" @click="handleSave(scope.row, scope.$index)">保存</el-button>
<el-button v-show="!scope.row.isDisabled" size="mini" type="text" @click="handleCancel(scope.row, scope.$index)">取消</el-button>
<el-button size="mini" type="text" @click="handleDelete(scope.row, scope.$index)">删除</el-button>
<el-button v-show="scope.row.isDisabled" size="mini" type="text" @click="handleDelete(scope.row, scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table>
@ -300,9 +313,10 @@
<script>
import quill from '@/components/quill'
import MyTree from '@/components/myTree/src/tree'
import {deepCopy} from '@/utils/deepCopy'
export default {
components: {quill},
components: {quill, MyTree},
data() {
return {
lcId: "", // id
@ -434,6 +448,11 @@ export default {
handleCheckChange(data, checked, indeterminate, row, index) { //
if (checked && data.isNode === 1) {
this.tableData[index].operationIds = data.id; // id
row.value1 = "";
row.value2 = "";
row.value3 = "";
row.value4 = "";
row.value5 = "";
if (data.subjectId) { // id
this.currentNodeData = data;
this.$refs[`tree-${index}`].setCheckedNodes([data]);
@ -464,6 +483,9 @@ export default {
data.forEach(item => {
if (item.isNode === 0) {
item.disabled = true;
item.showCheckbox = false;
} else {
item.showCheckbox = true;
}
if (item.children && item.children.length) {
item.id = `${parentId},${item.id}`;
@ -829,13 +851,15 @@ export default {
height: 230px;
background-color: #fff;
overflow: auto;
.box{
padding: 0 24px;
}
.line {
display: flex;
align-items: center;
margin: 24px 0;
margin: 12px 0;
.label {
width: 100px;
//width: 100px;
margin-right: 10px;
text-align: right;
font-size: 12px;

@ -20,9 +20,10 @@ module.exports = {
}
},
publicPath: '/',
publicPath: process.env.NODE_ENV === "development" ? "./" : "",
outputDir: 'dist',
assetsDir: 'static',
lintOnSave: true,
devServer: {
port: 8087
}

Loading…
Cancel
Save