新增内容
This commit is contained in:
gaoyuanwei
parent
900b3ea26d
commit
c00872b8d7
|
|
@ -0,0 +1,177 @@
|
|||
<!--
|
||||
*传参示例
|
||||
html:
|
||||
<input-select-checkbox
|
||||
:type="typeSon"
|
||||
:name="nameSon"
|
||||
:value="valueSon"
|
||||
:options="optionSon">
|
||||
</input-select-checkbox>
|
||||
js:
|
||||
this.typeSon = 'select'//类型
|
||||
this.nameSon = '算法描述'//名称
|
||||
this.valueSon = '这是一个描述'//内容
|
||||
this.optionSon = ['1', '2', '3']//选项
|
||||
-->
|
||||
<template>
|
||||
<div id="inputSelectCheckbox">
|
||||
<!-- input框 -->
|
||||
<a-input v-if="type == 'input'" v-model:value="value" :placeholder="'请输入' + name" />
|
||||
<!-- 下拉框 -->
|
||||
<el-select
|
||||
v-else-if="type === 'select'"
|
||||
style="width: 240px"
|
||||
v-model="value"
|
||||
:placeholder="'请选择' + name">
|
||||
<el-option
|
||||
:value="itemSelect.dictLabel"
|
||||
v-for="(itemSelect, indexSelect) in options"
|
||||
:key="indexSelect">
|
||||
{{ itemSelect.dictLabel }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
<!-- 多选 -->
|
||||
<div
|
||||
v-else-if="type === 'checkBox'"
|
||||
>
|
||||
<el-checkbox-group v-model="valueCheckBox">
|
||||
<el-checkbox-button v-for="val in options" :label="val.dictLabel" :key="val.dictLabel">{{val.dictLabel}}</el-checkbox-button>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<!-- 不可点的input框 -->
|
||||
<el-input
|
||||
v-else-if="type === 'disabled'"
|
||||
v-model="value"
|
||||
:placeholder="'请输入' + name"
|
||||
:disabled="true"
|
||||
/>
|
||||
<!-- 单选 -->
|
||||
<el-radio-group v-model="value" v-else-if="type == 'radio'">
|
||||
<el-radio v-for="item in options" :label="item.dictLabel" :key="item.dictLabel">{{item.dictLabel}}</el-radio>
|
||||
</el-radio-group>
|
||||
<!-- <a-radio-group
|
||||
|
||||
v-model:value="value"
|
||||
:options="item.options.dictLabel"
|
||||
/> -->
|
||||
<!-- 描述框 -->
|
||||
<!-- <a-textarea v-model:value="value" :showCount="true"
|
||||
/> -->
|
||||
<a-textarea v-else-if="type == 'textArea'" v-model:value="value" :showCount="true" :maxlength="200" :placeholder="'请填写' + name"
|
||||
/>
|
||||
<!-- <el-input type="textarea" :maxlength="200" v-model="value" :placeholder="'请输入' + item.name" ></el-input> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'inputSelectCheckbox',
|
||||
components: {
|
||||
|
||||
},
|
||||
props: {
|
||||
type: String,
|
||||
data: Array,
|
||||
name: String,
|
||||
value: String,
|
||||
options: {
|
||||
type: Array,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 多选放数据的数组
|
||||
valueCheckBox: [],
|
||||
// 单选数据
|
||||
regionSelect: '',
|
||||
showKey: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectOptions () {
|
||||
if (this.data.isLinkToDic === 'true' && this.data.linkValue) {
|
||||
this.$http
|
||||
.get(`/sys/dict/data/page?page=1&limit=20&dictTypeId=${this.data.linkValue}&deFlage=0`).then(({ data: res }) => {
|
||||
console.log(res, 'res')
|
||||
const dataList = []
|
||||
res.data.list.forEach((element) => {
|
||||
dataList.push(element)
|
||||
console.log(dataList, 'this.options')
|
||||
})
|
||||
this.options = dataList
|
||||
console.log(this.options)
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.selectOptions()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
#inputSelectCheckbox {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
|
||||
span:first-child {
|
||||
display: block;
|
||||
width: 120px;
|
||||
}
|
||||
::v-deep .el-select {
|
||||
.el-input__inner {
|
||||
resize: none;
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
::v-deep .ant-input {
|
||||
// width: 570px;
|
||||
}
|
||||
::v-deep .el-input__inner {
|
||||
resize: none;
|
||||
// width: 570px;
|
||||
}
|
||||
::v-deep .el-textarea {
|
||||
width: 570px;
|
||||
}
|
||||
::v-deep .el-textarea__inner {
|
||||
width: 570px;
|
||||
height: 76px;
|
||||
min-height: 32px;
|
||||
resize: none;
|
||||
}
|
||||
::v-deep .el-input__count {
|
||||
bottom: -20px;
|
||||
right: 5px;
|
||||
}
|
||||
::v-deep .el-checkbox-group {
|
||||
width: 570px;
|
||||
display: grid;
|
||||
margin-top: -5px;
|
||||
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
|
||||
}
|
||||
::v-deep .el-checkbox-button__inner {
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
width: 90px;
|
||||
height: 26px;
|
||||
border-radius: 13px;
|
||||
color: #333333;
|
||||
background: #f5f5f5;
|
||||
border: 1px #cccccc solid;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
font-weight: 500;
|
||||
}
|
||||
::v-deep .el-checkbox-button.is-checked .el-checkbox-button__inner {
|
||||
background: #0087ff;
|
||||
color: #fff;
|
||||
box-shadow: unset;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
<template v-if='judgmentType.filter(item => item.name==child.name).length === 0'>
|
||||
<div class="top">{{child.name}}</div>
|
||||
<div v-for="item in child.children" :key="item.id" class='item'>
|
||||
<span>{{ item.name }}</span>
|
||||
<span v-if="item.name != '来源应用'">{{ item.name }}</span>
|
||||
<upload :list="[]" v-if="item.type == 'image'" type="图片" btnName="上传图片" :maxCount="1" :data="item"
|
||||
tip="支持图片类型，大小不超过100M"></upload>
|
||||
<upload :list="[]" v-else-if="item.type == 'file' && item.name !== '使用手册'" type="文件" btnName="上传附件" :maxCount="1"
|
||||
|
|
@ -21,6 +21,13 @@
|
|||
tip="支持文件类型，大小不超过100M"></upload>
|
||||
<upload :list="[]" v-else-if="item.type == 'video'" type="视频" btnName="上传视频" :maxCount="1" :data="item"
|
||||
tip="支持视频类型，大小不超过100M"></upload>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'text'" type="disabled" :data="item" :name="item.name"></input-select-checkbox>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'text2'" type="disabled" :data="item" :name="item.name"></input-select-checkbox>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'input'" type="input" :data="item" :name="item.name"></input-select-checkbox>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'select'" type="select" :data="item" :name="item.name" :value="item.note1" :options="item.options"></input-select-checkbox>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'checkBox'" type="checkBox" :data="item" :name="item.name" :value="item.note1" :options="item.options"></input-select-checkbox>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'radio'" type="radio" :data="item" :name="item.name" :value="item.note1" :options="item.options"></input-select-checkbox>
|
||||
<input-select-checkbox :list="[]" v-else-if="item.type == 'textArea'" type="textArea" :data="item" :name="item.name" :value="item.note1"></input-select-checkbox>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
|
|
@ -31,13 +38,15 @@
|
|||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import inputSelectCheckbox from './components/inputSelectCheckbox'
|
||||
import special from './components/special'
|
||||
import upload from '@/views/modules/components/upload'
|
||||
export default {
|
||||
name: '',
|
||||
components: {
|
||||
special,
|
||||
upload
|
||||
upload,
|
||||
inputSelectCheckbox
|
||||
},
|
||||
props: {
|
||||
putOnTheShelfList: Array
|
||||
|
|
|
|||
Loading…
Reference in New Issue