Commit 19175cfe authored by miaojiale's avatar miaojiale

Merge branch 'dev_lyj' into dev_Miaojiale

parents 48e43636 e734b407
<template>
<el-row :gutter="options.gutter" class="form-content">
<template
v-for="(item, columnIndex) in columns.column || columns.children.column"
>
<template v-for="(item, columnIndex) in columns.column || columns.children.column">
<div
v-if="item.type === 'dynamic'"
v-show="item.display"
......@@ -10,12 +8,7 @@
style="width: 100%"
class="dynamic-form-container"
>
<el-form-item
:prop="item.prop"
:label-width="'0px'"
style="display: none"
>
</el-form-item>
<el-form-item :prop="item.prop" :label-width="'0px'" style="display: none"></el-form-item>
<div class="dynamic-form-container_lable">{{ item.label }}</div>
<form-dynamic
v-model="form[item.prop]"
......@@ -32,11 +25,7 @@
style="width: 100%"
>
<el-collapse :value="item.collapse ? item.prop : ''">
<el-collapse-item
:title="item.label"
:name="item.prop"
:disabled="!item.arrow"
>
<el-collapse-item :title="item.label" :name="item.prop" :disabled="!item.arrow">
<form-content
ref="form-content"
:form="form"
......@@ -54,12 +43,7 @@
:key="columnIndex"
style="width: 100%"
>
<el-form-item
:prop="item.prop"
:label-width="'0px'"
style="display: none"
>
</el-form-item>
<el-form-item :prop="item.prop" :label-width="'0px'" style="display: none"></el-form-item>
<dental-tab-form
ref="dental"
v-model="form[item.prop]"
......@@ -75,12 +59,7 @@
:key="columnIndex"
style="width: 100%"
>
<el-form-item
:prop="item.prop"
:label-width="'0px'"
style="display: none"
>
</el-form-item>
<el-form-item :prop="item.prop" :label-width="'0px'" style="display: none"></el-form-item>
<dental-tab-tj-form
ref="dental"
v-model="form[item.prop]"
......
......@@ -10,7 +10,7 @@
:style="{ height: item.type === 'upload' ? '116px' : '53px' }"
>
<div
v-if="showIndex"
v-if="showIndex || (configForms && configForms.showIndex)"
:class="['formIndex', item.labelSuffix == '5' ? 'computeIndex' : '']"
>
{{ item.labelSuffix || columnIndex + 1 }}
......@@ -46,6 +46,7 @@
<template v-else-if="vwForm.detail">
<form-item-text :item="item" :form="form"></form-item-text>
</template>
<!-- 可输入 -->
<template v-else>
<!-- 输入框 -->
<el-input
......@@ -76,12 +77,12 @@
@click="openToothBit"
>{{ item.append || "牙位" }}</el-button
>
<template v-else-if="item.append" slot="append">{{
item.append
}}</template>
<template v-if="item.prepend" slot="prepend">{{
item.prepend
}}</template>
<template v-else-if="item.append" slot="append">
{{ item.append }}
</template>
<template v-if="item.prepend" slot="prepend">
{{ item.prepend }}
</template>
</el-input>
<!-- 密码框 -->
......@@ -104,12 +105,12 @@
"
@blur="handleBlur"
>
<template v-if="item.append" slot="append">{{
item.append
}}</template>
<template v-if="item.prepend" slot="prepend">{{
item.prepend
}}</template>
<template v-if="item.append" slot="append">
{{ item.append }}
</template>
<template v-if="item.prepend" slot="prepend">
{{ item.prepend }}
</template>
</el-input>
<!-- 文本域 -->
......@@ -150,8 +151,7 @@
:max="item.maxRows"
style="display: table-cell"
@blur="handleBlur"
>
</el-input-number>
></el-input-number>
<span
v-if="item.append"
class="el-input-group__append"
......@@ -171,8 +171,8 @@
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
:label="opt.value"
>{{ opt.label }}
</el-radio>
>{{ opt.label }}</el-radio
>
</el-radio-group>
<!-- 多选框 -->
......@@ -186,8 +186,8 @@
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
:label="opt.value"
>{{ opt.label }}
</el-checkbox>
>{{ opt.label }}</el-checkbox
>
</el-checkbox-group>
</template>
......@@ -213,8 +213,7 @@
:key="optIndex"
:label="opt.label"
:value="opt.value"
>
</el-option>
></el-option>
</el-select>
</template>
<!-- 级联 -->
......@@ -243,8 +242,7 @@
style="width: 100%"
clearable
@change="handleChange"
>
</el-time-picker>
></el-time-picker>
<!-- 时间范围 -->
<el-time-picker
v-else-if="item.type === 'timerange'"
......@@ -259,8 +257,7 @@
:disabled="item.disabled"
clearable
@change="handleChange"
>
</el-time-picker>
></el-time-picker>
<!-- 日期 -->
<el-date-picker
v-else-if="item.type === 'date'"
......@@ -271,8 +268,7 @@
:disabled="item.disabled"
clearable
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
<!-- 年 -->
<el-date-picker
v-else-if="item.type === 'year'"
......@@ -284,8 +280,7 @@
:disabled="item.disabled"
clearable
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
<!-- 月 -->
<el-date-picker
......@@ -298,8 +293,7 @@
:disabled="item.disabled"
clearable
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
<!-- 周 -->
<el-date-picker
......@@ -312,8 +306,7 @@
:disabled="item.disabled"
clearable
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
<!-- 日期范围 -->
<el-date-picker
......@@ -329,8 +322,7 @@
:disabled="item.disabled"
clearable
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
<!-- 日期时间 -->
<el-date-picker
......@@ -344,8 +336,7 @@
:value-format="item.valueFormat"
:format="item.format"
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
<!-- 日期时间范围 -->
<el-date-picker
......@@ -362,8 +353,7 @@
:format="item.format"
align="right"
@change="handleChange"
>
</el-date-picker>
></el-date-picker>
</template>
</div>
<span
......@@ -414,6 +404,10 @@ export default {
type: Function,
default: () => {},
},
configForms: {
type: Function,
default: () => {},
},
},
props: {
item: {
......
<template>
<!-- 删除display isShowIm item.importantField item.style-->
<el-row :gutter="options.gutter" class="form-content">
<template v-for="(item, columnIndex) in columns.column || columns.children.column">
<el-col
v-if="item.type === 'title'"
:key="columnIndex"
class="row12"
:xs="item.xs || 24"
:sm="item.sm || 24"
:md="item.md || 24"
:lg="item.span || 12"
>
<div class="form_title">
<span>{{ item.value }}</span>
</div>
</el-col>
<el-col
v-else
:key="columnIndex"
class="row24"
:xs="item.xs || 24"
:sm="item.sm || 24"
:md="item.md || 24"
:lg="item.lg || item.span || 12"
:xl="item.span || 12"
>
<form-item-self
:form="form"
:column-index="columnIndex"
:item="item"
:columns="columns.column || columns.children.column"
:group="options.group"
@formChange="formChange"
></form-item-self>
</el-col>
</template>
</el-row>
</template>
<script>
/**
* @description 自定义表单
*/
import FormItemSelf from "./FormItemSelf2.vue"
export default {
name: "FormContent",
components: { FormItemSelf },
props: {
form: {
type: Object,
default: () => {
return {}
},
},
options: {
type: Object,
default: () => {
return {}
},
}, //配置 数据
columns: Object, //表单数据
size: { type: String, default: "small" },
formStyle: Object,
formEdit: {
type: Object,
default: () => {
return {}
},
},
isShowImportant: {
type: Boolean,
default: false,
},
},
data() {
return {}
},
computed: {
isShowIm() {
return function (val) {
return !this.isShowImportant ? true : val
}
},
paddingLeft() {
const columns = this.columns
return columns.labelWidth ? `${columns.labelWidth}px` : ""
},
},
methods: {
handleChange(key, val) {
if (this.form.hasOwnProperty(key)) this.form[key] = val
},
// 切换不符合筛查条件的显示
formChange() {
console.log(this.form)
let arr = [
"is_one_year",
"is_subtotal_history",
"is_ppi",
"is_symptom",
"is_subtotal_history",
"is_disease",
"is_tumour",
]
let flag = 0
for (let i = 0; i < arr.length; i++) {
if (this.form[arr[i]] && this.form[arr[i]] == 0) {
flag++
}
}
if (flag == 0) {
this.$emit("showError", false)
} else {
this.$emit("showError", true)
}
},
},
watch: {
},
mounted(){
}
}
</script>
<style lang="scss" scoped>
::v-deep {
.row24.el-col-lg-12 {
&:nth-child(2n) {
border-left: 1px solid #ccc;
}
}
}
.form-content ::v-deep {
display: flex;
flex-wrap: wrap;
.el-form-item {
display: flex;
align-items: center;
.el-form-item__label {
line-height: 1.2;
}
.el-form-item__content {
margin-left: 0 !important;
flex: 1;
display: flex;
align-items: center;
}
}
}
.form_title {
background-color: #fff;
padding: 10px 0px;
margin: 3px;
span {
height: 33px;
line-height: 33px;
}
}
.dynamic-form-container {
&_lable {
font-weight: bold;
font-size: 16px;
line-height: 40px;
}
}
</style>
<template>
<el-row
:ref="item.prop"
class="custom-form-item"
:style="item.styles"
:class="{ isDefects: defectsSet.includes(item.prop) }"
>
<el-col :lg="item.width">
<div
v-if="showIndex || configForms && configForms.showIndex"
class="formIndex"
>{{ columnIndex + 1 }}</div>
<el-form-item
:label="
!hiddenLabel && item.label
? `${item.label}${item.labelSuffix || ''}`
: ''
"
:label-width="item.labelWidth ? `${item.labelWidth}px` : ''"
:prop="item.prop"
:rules="item.rules"
:class="isEmpty"
>
<div class="flex">
<div>
<!-- <el-upload-self
v-if="item.type === 'upload'"
v-model="form[item.prop]"
v-bind="item"
:upload-query="{ formId, patientId, prefix: item.prop }"
:disabled="item.disabled"
></el-upload-self>-->
<!-- 只显示 -->
<template>
<!-- 有选项 -->
<!-- item.type == 'radio'||item.type === 'checkbox'||item.type === 'select'||item.type === 'cascader' -->
<span v-if="item.dicData">
<span
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
v-show="form[item.prop]==opt.value"
>{{ opt.label }}</span>
</span>
<span v-else>{{form[item.prop]}}</span>
<!-- 输入框 -->
<!-- <el-input
v-if="item.type === 'input'"
v-model="form[item.prop]"
:class="item.toothBit ? 'toothBit' : ''"
:readonly="item.readonly"
:disabled="item.disabled"
:placeholder="
item.placeholder ||
` ${item.label ? '请输入' + item.label : ''}`
"
:clearable="item.notClearable ? false : true"
:maxlength="
item.maxlength
? item.maxlength
: item.fieldType === 'text'
? ''
: item.fieldLength
"
@blur="handleBlur"
></el-input>-->
<!-- 文本域 -->
<!-- <template v-if="item.type === 'textarea'">
<el-input
v-model="form[item.prop]"
type="textarea"
:placeholder="
item.placeholder || `请输入 ${item.label || ''}`
"
:autosize="{ minRows: item.minRows, maxRows: item.maxRows }"
:minlength="item.minlength"
:disabled="item.disabled"
:maxlength="
item.maxlength
? item.maxlength
: item.fieldType === 'text'
? ''
: item.fieldLength
"
:show-word-limit="item.showWordLimit"
@blur="handleBlur"
></el-input>
</template>-->
<!-- 计数器 -->
<!-- <div v-if="item.type === 'number'" style="display: inline-table">
<el-input-number
v-model="form[item.prop]"
:readonly="item.readonly"
:disabled="item.disabled"
:controls="item.controls ? true : false"
:controls-position="item.controlsPosition"
:placeholder="item.placeholder"
:step="item.step"
:precision="item.precision"
:min="item.minRows"
:max="item.maxRows"
style="display: table-cell"
@blur="handleBlur"
></el-input-number>
<span
v-if="item.append"
class="el-input-group__append"
style="line-height: 28px"
>{{ item.append }}</span>
</div>-->
<!-- 单选框 -->
<!-- <el-radio-group
v-if="item.type === 'radio'"
v-model="form[item.prop]"
:disabled="item.disabled"
@change="handleChange"
>
<el-radio
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
:label="opt.value"
>{{ opt.label }}</el-radio>
</el-radio-group>-->
<!-- 多选框 -->
<!-- <template v-if="item.type === 'checkbox'">
<el-checkbox-group
v-model="form[item.prop]"
:disabled="item.disabled"
@change="handleChange"
>
<el-checkbox
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
:label="opt.value"
>{{ opt.label }}</el-checkbox>
</el-checkbox-group>
</template>-->
<!-- 下拉框 -->
<!-- <template v-if="item.type === 'select'">
<el-select
v-model="form[item.prop]"
:clearable="item.clearable"
:filterable="item.filterable"
:disabled="item.disabled"
:placeholder="
item.placeholder
? item.placeholder
: `请选择 ${item.label || ''}`
"
default-first-option
:multiple="item.multiple"
:multiple-limit="item.limit"
@change="handleChange"
>
<el-option
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
:label="opt.label"
:value="opt.value"
></el-option>
</el-select>
</template>-->
<!-- 级联 -->
<!-- <el-cascader
v-else-if="item.type === 'cascader'"
v-model="form[item.prop]"
:disabled="item.disabled"
clearable
:filterable="item.filterable"
:props="{ multiple: item.multiple }"
:options="item.dicData"
:show-all-levels="item.showAllLevels"
:separator="item.separator"
style="width: 100%"
@change="handleChange"
></el-cascader>-->
<!-- 时间 -->
<!-- <el-time-picker
v-else-if="item.type === 'time'"
v-model="form[item.prop]"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat"
:format="item.format"
:disabled="item.disabled"
style="width: 100%"
clearable
@change="handleChange"
></el-time-picker>-->
<!-- 时间范围 -->
<!-- <el-time-picker
v-else-if="item.type === 'timerange'"
v-model="form[item.prop]"
is-range
range-separator="至"
:start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder"
:unlink-panels="item.unlinkPanels"
:value-format="item.valueFormat"
:format="item.format"
:disabled="item.disabled"
clearable
@change="handleChange"
></el-time-picker>-->
<!-- 日期 -->
<!-- <el-date-picker
v-else-if="item.type === 'date'"
v-model="form[item.prop]"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat"
:format="item.format"
:disabled="item.disabled"
clearable
@change="handleChange"
></el-date-picker>-->
<!-- 年 -->
<!-- <el-date-picker
v-else-if="item.type === 'year'"
v-model="form[item.prop]"
type="year"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat"
:format="item.format"
:disabled="item.disabled"
clearable
@change="handleChange"
></el-date-picker>-->
<!-- 月 -->
<!-- <el-date-picker
v-else-if="item.type === 'month'"
v-model="form[item.prop]"
type="month"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat"
:format="item.format"
:disabled="item.disabled"
clearable
@change="handleChange"
></el-date-picker>-->
<!-- 周 -->
<!-- <el-date-picker
v-else-if="item.type === 'week'"
v-model="form[item.prop]"
type="week"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat || 'yyyy-ww'"
:format="item.format || 'yyyy 第 WW 周'"
:disabled="item.disabled"
clearable
@change="handleChange"
></el-date-picker>-->
<!-- 日期范围 -->
<!-- <el-date-picker
v-else-if="item.type === 'daterange'"
v-model="form[item.prop]"
type="daterange"
range-separator="至"
:start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder"
:unlink-panels="item.unlinkPanels"
:value-format="item.valueFormat"
:format="item.format"
:disabled="item.disabled"
clearable
@change="handleChange"
></el-date-picker>-->
<!-- 日期时间 -->
<!-- <el-date-picker
v-else-if="item.type === 'datetime'"
v-model="form[item.prop]"
type="datetime"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
clearable
:disabled="item.disabled"
:picker-options="pickerOptions"
:value-format="item.valueFormat"
:format="item.format"
@change="handleChange"
></el-date-picker>-->
<!-- 日期时间范围 -->
<!-- <el-date-picker
v-else-if="item.type === 'datetimerange'"
v-model="form[item.prop]"
type="datetimerange"
:picker-options="rangeOptions"
range-separator="至"
clearable
:disabled="item.disabled"
:start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder"
:value-format="item.valueFormat"
:format="item.format"
align="right"
@change="handleChange"
></el-date-picker>-->
</template>
</div>
<span
v-if="item.importantField && !vwForm.detail"
class="important_field"
>{{ item.importantFieldDesc || "*" }}</span>
</div>
</el-form-item>
</el-col>
<dialog-tooth-bit
v-if="item.toothBit"
ref="dialog"
v-model="form[item.prop]"
append-to-body
title="牙位选择"
></dialog-tooth-bit>
</el-row>
</template>
<script>
/**
* @description 自定义单组件
*/
import ElUploadSelf from "@/components/Upload"
import { getTimePoor, getInfoByIdCard } from "@/utils/index"
import { getChineseHeadLetter } from "@/utils/chinesePingyin.js"
import { pickerOptions, rangeOptions } from "@/data/dateOption"
export default {
name: "FormItemSelf",
components: { ElUploadSelf },
inject: {
showIndex: {
default: false,
},
vwForm: {
default: {},
},
// formId: {},
getPatientId: {
type: Function,
default: () => {},
},
getDefectsSet: {
type: Function,
default: () => {},
},
configForms: {
type: Function,
default: () => {},
},
},
props: {
item: {
type: Object,
},
form: {
type: Object | Array,
},
hiddenLabel: {
type: Boolean,
default: false,
},
columns: Array,
columnIndex: Number,
group: Array,
type: String,
},
data() {
return {
pickerOptions,
rangeOptions,
}
},
computed: {
//重要字段空数据且填写表单时添加重点
isEmpty() {
const { importantField, prop } = this.item
if (!importantField || this.vwForm.detail) return ""
const value = this.form[prop] // []
let empty = !value
if (value === 0) empty = false
else if (value && typeof value !== "number") {
empty = !(Object.keys(value) || value).length
}
return empty ? "empty-tip" : ""
},
defectsSet() {
return this.getDefectsSet ? this.getDefectsSet() : []
},
patientId() {
return this.getPatientId ? this.getPatientId() : ""
},
},
created() {
this.timerangeReset()
this.numberReset()
this.checkboxReset()
},
mounted() {
this.showFormItem()
},
methods: {
scrollToView() {
if (this.$refs["JY_LCYY"]) {
this.$refs["JY_LCYY"].$el.scrollIntoView({ behavior: "smooth" })
}
},
openToothBit() {
this.$refs.dialog.open()
},
// 处理timerange 重置后不能选择的问题
timerangeReset() {
if (this.item.type === "timerange") {
this.$watch(`form.${this.item.prop}`, (val) => {
if (val && val.length === 1) {
this.form[this.item.prop] = null
}
})
}
},
// 处理number 默认为0的问题
numberReset() {
if (this.item.type === "number") {
this.$watch(
`form.${this.item.prop}`,
(val) => {
if (!val && val !== 0 && val !== undefined) {
this.form[this.item.prop] = undefined
}
},
{ immediate: true }
)
}
},
// 处理数组 默认值的问题
checkboxReset() {
const { type, multiple, value } = this.item
if (
type === "checkbox" ||
(type === "select" && multiple) ||
type === "cascader"
) {
if (value && typeof value === "string") {
this.form[this.item.prop] = value.split(",")
}
this.$watch(
`form.${this.item.prop}`,
(val) => {
if (!Array.isArray(val)) {
this.$set(this.form, this.item.prop, [])
}
},
{ immediate: true }
)
}
},
// 处理复选框排斥
checkboxRepel(val) {
const { repelValue, repel } = this.item
if (repel && repelValue) {
const len = val.length
const lastValue = val[len - 1]
if (!lastValue) return
if (lastValue === repelValue) {
this.form[this.item.prop].splice(0, len - 1)
} else {
let idx = val.findIndex((_) => _ === repelValue)
if (idx > -1) {
this.form[this.item.prop].splice(idx, 1)
}
}
}
},
// 处理运算规则
handleAlgorithm() {
const { algorithm } = this.item
if (algorithm) {
const algorithmArr = algorithm.split(";") //多个规则数组集合
algorithmArr.forEach((item) => {
if (item.includes("|")) {
// 自定义方法规则: type|target|args
const algorithmValue = item.split("|")
this.handleSelfProcess(algorithmValue)
} else {
// 直接运算 target=process
let target = this.getProp(algorithm.split("=")[0])
if (!this.form.hasOwnProperty(target)) return
let process = this.getProcess(algorithm.split("=")[1])
if (process.includes("stop")) return
try {
this.$set(this.form, target, eval(process))
} catch {}
}
})
} else {
// let { birthday } = this.form
// if (birthday) {
// birthday = new Date(birthday.replace(/-/g, "/"))
// let d = new Date()
// let age =
// d.getFullYear() -
// birthday.getFullYear() -
// (d.getMonth() < birthday.getMonth() ||
// (d.getMonth() == birthday.getMonth() &&
// d.getDate() < birthday.getDate())
// ? 1
// : 0)
// console.log(age)
// if (age == 0) {
// }
// }
}
},
// 自定义方法规则
handleSelfProcess(algorithmValue) {
const type = algorithmValue[0]
const ruleTarget = algorithmValue[1]
const ruleArgs = algorithmValue[2]
if (!ruleTarget || !ruleArgs || !this.form.hasOwnProperty(ruleTarget))
return
const args = ruleArgs.split(",").map((v) => {
if (v) {
return this.form[v]
}
return null
})
let val
switch (type) {
// 时间差
case "timepoor":
val = getTimePoor(...args)
break
case "initials":
//计算中文姓名缩写
val = getChineseHeadLetter(...args)
break
case "idcard_birthdate":
val = getInfoByIdCard(...args)
break
case "idcard_age":
val = getInfoByIdCard(...args, "age")
break
case "idcard_gender":
val = getInfoByIdCard(...args, "gender")
break
default:
break
}
val && this.$set(this.form, ruleTarget, val)
},
// 获取prop prop 以{}包裹
getProp(value) {
if (!value) return ""
return value.replace(/[{][\w]*[}]/g, (word) => {
return word.replace(/{|}/g, "")
})
},
// 获取运算过程
getProcess(value) {
return value.replace(/[{][\w]*[}]/g, (word) => {
const actualValue = this.form[word.replace(/{|}/g, "")]
return actualValue ? actualValue : "stop"
})
},
// 表单子项控制显隐
showFormItem() {
const { dynamicshSet, prop, noImmediate } = this.item
if (dynamicshSet && dynamicshSet.length > 0) {
this.$watch(
`form.${prop}`,
function (val) {
const columns = this.columns || []
const group = this.group || []
const dyMap = {} // 显示数据集合
dynamicshSet.forEach((dy) => {
if (dyMap[dy.target]) {
dyMap[dy.target].push(dy.value)
} else {
dyMap[dy.target] = [dy.value]
}
})
Object.keys(dyMap).forEach((key) => {
let targetItem = columns.find((_) => _.prop === key)
if (!targetItem) {
targetItem = group.find((_) => _.prop === key)
}
if (!targetItem) return
const values = dyMap[key]
let display = false
if (Array.isArray(val)) {
display = values.filter((v) => val.includes(v)).length > 0
} else {
display = values.includes(val)
}
if (!display && targetItem) {
// 清空数据
const newVal = Array.isArray(this.form[targetItem.prop])
? []
: targetItem.type === "number"
? undefined
: ""
this.$set(this.form, targetItem.prop, newVal)
}
if (this.type === "form") {
// 动态表格、表单处理
setTimeout(() => {
this.$set(this.form, "$_hidden" + targetItem.prop, !display)
}, 200)
} else {
this.$set(targetItem, "display", Boolean(display))
}
})
},
{
immediate: !noImmediate,
}
)
}
},
//
handleBlur() {
this.handleAlgorithm()
},
handleChange(val) {
this.checkboxRepel(val)
this.handleAlgorithm()
// 该操作判断是否符合筛查条件
this.$emit("formChange")
// ['is_one_year','is_subtotal_history','is_ppi','is_symptom','is_subtotal_history','is_disease','is_tumour']
},
},
}
</script>
<style lang="scss" scoped>
.custom-form-item {
background: white;
border-bottom: 1px solid #ccc;
// margin: 3px;
.el-col {
height: 100%;
height: 53px;
display: flex;
align-items: center;
}
.formIndex {
min-width: 53px;
height: 100%;
background: #fafafa;
border-right: 1px solid #ccc;
justify-content: center;
display: flex;
align-items: center;
// margin-right: 20px;
}
&.isDefects {
border: 1px solid red;
}
::v-deep .el-form-item {
padding: 10px 0 10px 20px;
margin-bottom: 0px;
}
.toothBit {
::v-deep .el-input-group__append {
background-color: #1890ff;
border-color: #1890ff;
color: #fff;
}
}
.el-input,
.el-select,
.el-cascader,
.el-date-editor {
width: 100%;
}
.el-input-number {
width: 100%;
}
.flex {
align-items: center;
> div {
flex: 1;
}
}
.inline-block {
> div {
display: inline-block;
}
}
.important_field {
color: #ff4d4f;
padding-left: 10px;
display: inline-block;
max-width: 150px;
line-height: 1.2;
}
::v-deep .el-input-number .el-input__inner {
padding: 0 2px !important;
}
.el-radio {
padding: 2px 0;
}
// 去除禁用样式
::v-deep .is-disabled {
input {
background-color: #fff;
color: #606266;
}
.el-textarea__inner,
.el-input__inner {
background-color: #fff;
color: #606266;
}
.el-checkbox__inner,
.el-radio__inner {
background-color: #fff;
}
+ span.el-checkbox__label,
+ span.el-radio__label {
color: #606266;
}
&.is-checked {
.el-radio__inner {
border-color: #1890ff;
background: #1890ff;
&::after {
background: #fff;
}
}
+ .el-radio__label {
color: #1890ff;
}
.el-checkbox__inner {
background-color: #1890ff;
border-color: #1890ff;
&::after {
border-color: #fff;
}
}
}
}
.empty-tip {
::v-deep .el-form-item__label {
color: #333333;
}
}
::v-deep .el-form-item__label {
font-weight: bolder;
}
// ::v-deep .el-form-item__label::after {
// content: "☑";
// color: #ff4d4f;
// margin-left: 4px;
// }
::v-deep .el-checkbox-group {
&::after,
&::before {
content: " ";
display: table;
}
&::after {
clear: both;
visibility: hidden;
font-size: 0;
height: 0;
}
.el-checkbox {
float: left;
}
}
}
</style>
<template>
<el-form
ref="form"
:model="form"
inline-message
:disabled="options.disabled"
:label-position="options.labelPosition || 'left'"
:label-width="(options.labelWidth || 100) + 'px'"
:size="size"
:style="formStyle"
class="avue-form-self"
@submit.native.prevent="handleConfirm()"
>
<template v-if="options.column && options.column.length > 0">
<form-content
ref="form-content"
:form="form"
:columns="{ column: options.column }"
:options="options"
:is-show-important="isShowImportant"
></form-content>
</template>
<template v-if="options.group && options.group.length > 0">
<!-- <el-tabs v-if="options.tabs" v-model="activeName" type="card">
<el-tab-pane
v-for="(g, gIndex) in options.group"
:key="gIndex"
:label="g.label || `标签${gIndex + 1}`"
:name="`${gIndex}`"
>
<form-content
ref="form-content"
:form="form"
:columns="g"
:options="options"
:is-show-important="isShowImportant"
></form-content>
</el-tab-pane>
</el-tabs>-->
<!-- 表单的折叠组件 -->
<el-collapse v-model="collapseNames">
<template v-for="(g, gIndex) in options.group">
<el-collapse-item
v-show="g.display"
:key="gIndex"
:name="g.prop"
:disabled="!g.arrow"
:class="g.prop == '1669858313508_15760' ? 'otherItemClass' : ''"
>
<template slot="title">
{{ g.label }}
<span v-if="g.label == '二、排除标准'" class="noCol">{{errorText}}</span>
</template>
<form-content
v-if="collapseNames.includes(g.prop)"
ref="form-content"
:form="form"
:columns="g"
:options="options"
:is-show-important="isShowImportant"
@showError="showError"
></form-content>
</el-collapse-item>
</template>
</el-collapse>
</template>
<!-- <div class="form-footer">
<template v-if="options.menuBtn">
<template v-if="options.submitBtn">
<el-button
type="primary"
:icon="options.submitText == '提交' ? 'el-icon-check' : ''"
:loading="loading"
size="large"
:disabled="disabled"
@click="handleConfirm"
>{{ options.submitText || "提交" }}</el-button>
</template>
<template v-if="options.emptyBtn">
<el-button
plain
icon="el-icon-delete "
size="large"
@click="resetForm(true)"
>{{ options.emptyText || "清空" }}</el-button>
</template>
</template>
<template v-if="nextTabBtnShow">
<el-form style="display: inline-block; margin-left: 10px">
<el-button
plain
icon="el-icon-caret-right"
size="large"
@click="nextTab"
>{{ options.nextTabText || "下一页" }}</el-button>
</el-form>
</template>
</div>-->
</el-form>
</template>
<script>
/**
* @description 自定义表单
*/
import FormContent from "./FormContent2"
import { isObject } from "@/utils/validate"
export default {
name: "CustomForm",
components: { FormContent },
props: {
options: {
//配置 数据
type: Object,
default: () => {
return {}
},
},
size: { type: String, default: "small" },
formStyle: { type: Object },
formEdit: {
type: Object,
default: () => {
return {}
},
},
},
provide() {
const vwForm = {}
for (const k in this.options) {
if (k !== "column" && k !== "group") {
vwForm[k] = this.options[k]
}
}
return {
vwForm,
}
},
data() {
return {
collapseNames: [],
activeName: "0",
loading: false,
isShowImportant: false,
form: {},
errorText: "",
disabled: false,
}
},
computed: {
nextTabBtnShow() {
const { nextTabBtn, tabs, group } = this.options
return tabs && group && group.length > 1 && nextTabBtn
},
},
watch: {
formEdit: {
handler() {
this.initfields(this.formEdit)
},
},
},
created() {
this.initforms()
this.$nextTick(() => {
// this.setformWatch(this.options, "form")
})
},
methods: {
// 显示不符合筛查条件
showError(data) {
if (data) {
this.disabled = true
this.errorText = "不符合筛查条件"
} else {
this.disabled = false
this.errorText = ""
}
},
nextTab() {
const tabsLen = this.options.group.length
let active = Number(this.activeName)
let next = ++active
if (next >= tabsLen) next = 0
this.activeName = String(next)
this.$emit("scrollTop")
},
imFieldChange(val = false) {
this.isShowImportant = val
},
// 查询
submit() {
this.$emit("submit", this.form)
},
// 重置
resetForm(flag) {
if (flag) {
this.$confirm("是否清空数据?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$message({
type: "success",
message: "清空成功!",
})
this.$refs.form.resetFields()
})
.catch(() => {})
} else {
if (this.$refs.form) this.$refs.form.resetFields()
}
},
validate(func) {
this.$refs.form.validate((valid) => {
func(valid, () => {})
})
},
handleConfirm() {
this.loading = true
this.$refs.form.validate((valid) => {
if (valid) {
const data = {}
const form = this.deepClone(this.form)
Object.keys(form).forEach((k) => {
if (form[k] === undefined) {
data[k] = ""
return false
}
if (k === "YZZKJC") {
// 牙周表格
data[k] = JSON.stringify(form[k])
} else if (
Array.isArray(form[k]) &&
form[k][0] &&
isObject(form[k][0])
) {
// 子表单 去除前端添加的显隐辅助数据($_)和 删除按钮辅助数据(showDelBtn)
data[k] = form[k].map((item) => {
for (let key in item) {
if (["$_keyField", "$_hidden", "showDelBtn"].includes(key))
delete item[key]
}
return item
})
} else {
data[k] = form[k]
}
})
this.$emit("handleConfirm", data, () => {
this.loading = false
})
} else {
this.loading = false
}
})
},
// 表单赋值
initforms() {
const form = {}
const collapseNames = []
const initFunc = (column = []) => {
if (column.length > 0) {
column.forEach((item) => {
if (!item.prop) return false
if (
item.type === "dynamic" ||
item.type === "checkbox" ||
item.type === "cascader" ||
item.type === "upload" ||
(item.type === "select" && item.multiple)
) {
form[item.prop] = []
} else if (
item.type === "dental-tab" ||
item.type === "dental-tab-tj"
) {
form[item.prop] = {}
} else if (item.type === "group") {
initFunc(item.children.column)
} else if (item.type !== "title") {
form[item.prop] = item.value ? item.value : ""
}
})
}
}
const { group, column } = this.options
initFunc(column)
group &&
group.forEach((g) => {
if (g.collapse) {
collapseNames.push(g.prop)
}
initFunc(g.column)
})
this.collapseNames = collapseNames
this.form = form
this.loading = false
this.$nextTick(() => {
// 子组件数据初始化完成后
setTimeout(() => {
this.initfields(this.formEdit)
}, 0)
if (this.$refs.form && this.$refs.form.clearValidate) {
this.$refs.form.clearValidate()
}
})
},
// 绑定部分值(此时表单已渲染)
initfields(obj) {
for (let k in obj) {
if (this.form.hasOwnProperty(k)) {
this.form[k] = obj[k]
}
}
},
},
}
</script>
<style lang="scss" scoped>
.avue-form-self {
padding: 0 11px;
::v-deep .el-collapse {
border: none;
.el-collapse-item {
&:nth-child(1) {
border-top: 1px solid #e5e5e5;
}
}
.el-collapse-item__content {
padding-bottom: 0px;
}
.el-collapse-item__header {
background: #fafafa;
padding-left: 20px;
border: 1px solid #e5e5e5;
border-bottom-color: #ccc;
border-top: 0px;
font-size: 14px;
font-family: AlibabaPuHuiTiM;
color: #333333;
}
.el-collapse-item__wrap {
border: none;
padding: 10px;
border-left: 1px solid #e5e5e5;
border-right: 1px solid #e5e5e5;
// border-bottom: 1px solid #e5e5e5 !important;
padding: 0px;
&:hover {
// background-color: #ecf8ff;
// outline: 1px dashed #ccc;
}
}
.el-collapse-item__header {
font-size: 16px;
font-weight: 600;
color: rgba(0, 0, 0, 0.85);
height: 50px;
line-height: 50px;
}
}
.form-footer {
margin-top: 20px;
text-align: center;
}
}
::v-deep .el-col {
}
::v-deep .el-radio__input.is-disabled .el-radio__inner {
// background-color: $base-color-default;
// border-color: $base-color-default;
}
.noCol {
font-size: 12px;
font-family: AlibabaPuHuiTiR;
color: #ff4d4f;
}
.otherItemClass {
::v-deep {
.row24:not(:last-child) {
border-left: 0px;
}
.row24:last-child {
border-left: 1px solid #cccccc;
}
}
}
</style>
......@@ -17,11 +17,7 @@
<div class="label">{{ item.label }}</div>
</div>
</div>
<div
v-show="curSelectedIndex != -1"
class="community"
@click="openModalFlag"
>
<div v-show="curSelectedIndex != -1" class="community" @click="openModalFlag">
<img src="~@/assets/img/DataCenter/shift.png" alt />
{{
curSelectedIndex != -1 ? screeningList[curSelectedIndex].title : ""
......@@ -284,6 +280,7 @@ export default {
<style lang="scss">
.message-pop {
padding: 40px 28px 12px;
z-index: 10;
.popper__arrow::after {
display: none;
......
......@@ -65,6 +65,18 @@ export const constantRoutes = [
},
],
},
{
path: "/followaduit",
component: Layout,
children: [
{
path: "/followaduit",
component: () => import("@/views/followupentry/followaduit"),
hidden: true,
name: "followaduit",
},
],
},
{
path: "/401",
name: "401",
......
......@@ -361,7 +361,7 @@ html {
.flex-end {
display: flex;
justify-content: end;
justify-content: flex-end;
}
.flex-wrap {
flex-wrap: wrap;
......
......@@ -13,7 +13,8 @@
<el-tab-pane label="已审核" name="1"></el-tab-pane>
</el-tabs>
<div v-show="auditStatus == 1" class="keyExplain">
字段说明<img src="~@/assets/img/DataCenter/question.png" alt="" />
字段说明
<img src="~@/assets/img/DataCenter/question.png" alt />
</div>
</div>
<div class="bot-table">
......@@ -103,7 +104,10 @@ export default {
}
},
auditHandle(data, i) {
console.log(data, i)
console.log(data,i)
if(this.type=="1"){
this.$router.push("/followaduit")
}
},
},
}
......
<template>
<!-- 随访调查录入 -->
<div>
<ConfigForms form-type="2" formClass="follow-form"></ConfigForms>
</div>
</template>
<script>
import ConfigForms from "@/views/screening/components/ConfigForms.vue"
export default {
name: "FollowupEntry",
components: {
ConfigForms,
},
data() {
return {
form:{
column: [],
labelPosition: 'right',
labelSuffix: '',
labelWidth: 100,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: '提交',
emptyBtn: true,
emptyText: '清空',
nextTabBtn: true,
nextTabText: '下一页',
menuPosition: 'center',
group: [
{
label: '个人信息',
prop: '1669858228269_22763',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [{
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'name',
label: '姓名',
fieldType: 'varchar',
fieldLength: '50',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'contact_phone',
label: '手机号',
fieldType: 'varchar',
fieldLength: '20',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'telephone',
label: '联系电话',
fieldType: 'varchar',
fieldLength: '20',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'sex',
label: '性别',
fieldType: 'tinyint',
fieldLength: '2',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'birthday',
label: '出生日期',
fieldType: 'date',
fieldLength: '',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'age',
label: '年龄',
fieldType: 'int',
fieldLength: '4',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}]
},
{
label: '第一次随访计划',
prop: '1669858313508_15760',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [{
type: 'radio',
display: true,
importantField: true,
styles: {},
prop: 'is_continue_follow',
label: '是否随访',
dicData: [{
label: '',
value: '1',
id: '1595347527757000705',
parentId: ''
}, {
label: '',
value: '0',
id: '1595347502595371010',
parentId: ''
}],
dynamicshSet: [],
dicType: 'd-sf',
props: {
label: 'label',
value: 'value'
},
fieldType: 'tinyint',
fieldLength: '2',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
value: '1',
span: 24,
autoRequired: 0,
personalRequired: 0
}, {
type: 'date',
display: true,
importantField: true,
styles: {},
prop: 'first_follow_time',
label: '随访时间',
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd',
dicType: '',
fieldType: 'date',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
span: 12,
autoRequired: 0,
personalRequired: 0,
width: 12
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'follow_contents',
label: '随访内容',
fieldType: 'text',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 12,
width: 12
}]
},
]
}
}
},
created() {},
methods: {},
}
</script>
<style lang="scss">
</style>
<template>
<!-- 随访调查录入 -->
<div>
<ConfigForms form-type="2" formClass="follow-form"></ConfigForms>
</div>
</template>
<script>
......@@ -11,17 +13,221 @@ export default {
ConfigForms,
},
data() {
return {}
return {
form:{
column: [],
labelPosition: 'right',
labelSuffix: '',
labelWidth: 100,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: '提交',
emptyBtn: true,
emptyText: '清空',
nextTabBtn: true,
nextTabText: '下一页',
menuPosition: 'center',
group: [
{
label: '个人信息',
prop: '1669858228269_22763',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [{
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'name',
label: '姓名',
fieldType: 'varchar',
fieldLength: '50',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'contact_phone',
label: '手机号',
fieldType: 'varchar',
fieldLength: '20',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'telephone',
label: '联系电话',
fieldType: 'varchar',
fieldLength: '20',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'sex',
label: '性别',
fieldType: 'tinyint',
fieldLength: '2',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'birthday',
label: '出生日期',
fieldType: 'date',
fieldLength: '',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'age',
label: '年龄',
fieldType: 'int',
fieldLength: '4',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}]
},
{
label: '第一次随访计划',
prop: '1669858313508_15760',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [{
type: 'radio',
display: true,
importantField: true,
styles: {},
prop: 'is_continue_follow',
label: '是否随访',
dicData: [{
label: '',
value: '1',
id: '1595347527757000705',
parentId: ''
}, {
label: '',
value: '0',
id: '1595347502595371010',
parentId: ''
}],
dynamicshSet: [],
dicType: 'd-sf',
props: {
label: 'label',
value: 'value'
},
fieldType: 'tinyint',
fieldLength: '2',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
value: '1',
span: 24,
autoRequired: 0,
personalRequired: 0
}, {
type: 'date',
display: true,
importantField: true,
styles: {},
prop: 'first_follow_time',
label: '随访时间',
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd',
dicType: '',
fieldType: 'date',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
span: 12,
autoRequired: 0,
personalRequired: 0,
width: 12
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'follow_contents',
label: '随访内容',
fieldType: 'text',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 12,
width: 12
}]
},
]
}
}
},
// provide() {
// if(formClass && this.activeName=='index0'){
// const showIndex = true
// return {
// showIndex,
// }
// }
// },
created() {},
methods: {},
}
......
<template>
<div id="publicContent" :class="activeName=='index0' && formClass">
<div
id="publicContent"
:class="activeName == 'index0' && formClass ? formClass : ''"
>
<div v-if="formTabs && formTabs.length > 0">
<el-button class="draftButton">{{formType == 1 ? "临时保存" : "返回"}}</el-button>
<el-button class="draftButton">{{
formType == 1 ? "临时保存" : "返回"
}}</el-button>
<el-tabs
v-model="activeName"
type="card"
......@@ -28,6 +33,7 @@
@setFormJson="setFormJson"
@handleConfirm="handleConfirm"
@onPrev="onPrev"
:survivalFlag="survivalFlag"
></form-tab>
</template>
</div>
......@@ -41,6 +47,7 @@
<script>
import mixin from "./mixin"
import CustomForm from "@/components/FormComponents/CustomForm/index"
export default {
name: "ConfigForms",
......@@ -52,7 +59,10 @@ export default {
formClass: String,
},
data() {
return {}
return {
// showIndex:false,
// survivalFlag:false
}
},
methods: {
handleConfirm(data, done, cb) {
......@@ -66,7 +76,41 @@ export default {
// 字典formType 1 筛查表单
this.getCurrentFormByType(this.formType)
},
watch: {},
watch: {
// activeName(val){
// if(val=="index0" && this.formClass){
// this.showIndex = false
// // this.survivalFlag = true
// console.log(1)
// }
// else{
// this.showIndex = true
// // this.survivalFlag = false
// console.log(2)
// }
// }
},
computed: {
survivalFlag() {
if (this.activeName == "index0" && this.formClass) {
return true
} else {
return false
}
},
showIndex() {
if (this.activeName == "index0" && this.formClass) {
return false
} else {
return true
}
},
},
provide() {
return {
configForms: this,
}
},
}
</script>
......@@ -78,7 +122,7 @@ export default {
position: absolute;
top: 46px;
right: 40px;
z-index: 999999;
z-index: 999;
border-radius: 4px;
border: 1px solid #4e68ff;
color: #4e68ff;
......
......@@ -7,7 +7,7 @@
:title="asideShow ? '收起' : '展开'"
class="arrow"
@click="asideShow = !asideShow"
></i> -->
></i>-->
<el-empty v-if="isEmpty" description="暂无数据"></el-empty>
<template v-if="!isEmpty">
<!-- 多次记录 -->
......@@ -32,7 +32,7 @@
<span class="value"
>{{ formData.percent.personalPercent }}%</span
></template
> -->
>-->
<div class="label">
<!-- 仅显示重要字段 : -->
......@@ -42,11 +42,8 @@
</el-switch>-->
</div>
</el-row>
<div
class="my-form"
ref="my-form"
:class="externalScroll ? 'no-scroll' : ''"
>
<div class="my-form" ref="my-form" :class="externalScroll ? 'no-scroll' : ''">
<read-form ref="form" :options="survivalForm" v-if="survivalFlag"></read-form>
<custom-form
ref="form"
@scrollTop="scrollTop"
......@@ -72,6 +69,7 @@
import { getPatientDetail, getRecordList } from "@/api/patient.js"
import { getFormDetail } from "@/api/field"
import CustomForm from "@/components/FormComponents/CustomForm/index"
import ReadForm from "@/components/FormComponents/ReadForm/index"
import TagsScrollBar from "@/components/TagsScrollBar/index"
export default {
name: "FormTab",
......@@ -83,8 +81,9 @@ export default {
patientId: String,
patientStandbyId: String,
getAll: Boolean, // 获取页面所有数据
survivalFlag:Boolean, //存活的显示
},
components: { CustomForm, TagsScrollBar },
components: { CustomForm, TagsScrollBar,ReadForm },
provide() {
return {
formId: this.form.formId,
......@@ -108,6 +107,218 @@ export default {
formloading: false,
repeatedlyList: [],
formCacheList: [],
survivalForm:{
column: [],
labelPosition: 'right',
labelSuffix: '',
labelWidth: 100,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: '提交',
emptyBtn: true,
emptyText: '清空',
nextTabBtn: true,
nextTabText: '下一页',
menuPosition: 'center',
group: [
{
label: '个人信息',
prop: '1669858228269_22763',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [{
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'name',
label: '姓名',
fieldType: 'varchar',
fieldLength: '50',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'contact_phone',
label: '手机号',
fieldType: 'varchar',
fieldLength: '20',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'telephone',
label: '联系电话',
fieldType: 'varchar',
fieldLength: '20',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'sex',
label: '性别',
fieldType: 'tinyint',
fieldLength: '2',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'birthday',
label: '出生日期',
fieldType: 'date',
fieldLength: '',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'age',
label: '年龄',
fieldType: 'int',
fieldLength: '4',
tableName: '存活情况',
tableCode: 'gas_survival_situation',
tableId: '1598137567272861697',
notFilter: false,
cType: '',
subfield: false
}]
},
{
label: '第一次随访计划',
prop: '1669858313508_15760',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [{
type: 'radio',
display: true,
importantField: true,
styles: {},
prop: 'is_continue_follow',
label: '是否随访',
dicData: [{
label: '',
value: '1',
id: '1595347527757000705',
parentId: ''
}, {
label: '',
value: '0',
id: '1595347502595371010',
parentId: ''
}],
dynamicshSet: [],
dicType: 'd-sf',
props: {
label: 'label',
value: 'value'
},
fieldType: 'tinyint',
fieldLength: '2',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
value: '1',
span: 24,
autoRequired: 0,
personalRequired: 0
}, {
type: 'date',
display: true,
importantField: true,
styles: {},
prop: 'first_follow_time',
label: '随访时间',
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd',
dicType: '',
fieldType: 'date',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
span: 12,
autoRequired: 0,
personalRequired: 0,
width: 12
}, {
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'follow_contents',
label: '随访内容',
fieldType: 'text',
tableName: '随访计划',
tableCode: 'gas_follow',
tableId: '1597491580053323777',
notFilter: false,
cType: '',
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 12,
width: 12
}]
},
]
}
}
},
// mixins: [resizeMixin],
......
......@@ -41,6 +41,7 @@ export default {
},
handleTabClick({ index, name }) {
const { formId, id, silent } = this.formTabs[index]
console.log('表单项', this.formTabs)
if (formId && silent) {
this.formTabs[index]["silent"] = false //控制是否获取接口数据
return
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment