...
 
Commits (124)
NODE_ENV = 'production' NODE_ENV = 'production'
VUE_APP_BASE_API = '/disease-api/' VUE_APP_BASE_API = '/geca-api/'
...@@ -17,7 +17,6 @@ ...@@ -17,7 +17,6 @@
<el-input-number <el-input-number
v-model="data.labelWidth" v-model="data.labelWidth"
:min="80" :min="80"
:max="500"
:step="10" :step="10"
controls-position="right" controls-position="right"
placeholder="标签宽度" placeholder="标签宽度"
...@@ -39,10 +38,10 @@ ...@@ -39,10 +38,10 @@
<el-form-item label="多分组转标签"> <el-form-item label="多分组转标签">
<el-switch v-model="data.tabs" active-color="#409EFF"></el-switch> <el-switch v-model="data.tabs" active-color="#409EFF"></el-switch>
</el-form-item> </el-form-item>
<el-form-item label="显示跳转按钮" v-if="data.tabs"> <el-form-item v-if="data.tabs" label="显示跳转按钮">
<el-switch v-model="data.nextTabBtn" active-color="#409EFF"></el-switch> <el-switch v-model="data.nextTabBtn" active-color="#409EFF"></el-switch>
</el-form-item> </el-form-item>
<el-form-item label="跳转按钮的文字" v-if="data.tabs && data.nextTabBtn"> <el-form-item v-if="data.tabs && data.nextTabBtn" label="跳转按钮的文字">
<el-input <el-input
v-model="data.nextTabText" v-model="data.nextTabText"
placeholder="跳转按钮的文字" placeholder="跳转按钮的文字"
...@@ -77,7 +76,10 @@ ...@@ -77,7 +76,10 @@
value="right"></el-option> value="right"></el-option>
</el-select> </el-select>
</el-form-item> --> </el-form-item> -->
<el-form-item label="显示提交按钮" v-if="data.menuBtn"> <el-form-item v-if="data.menuBtn" label="显示上一步按钮">
<el-switch v-model="data.prevBtn" active-color="#409EFF"></el-switch>
</el-form-item>
<el-form-item v-if="data.menuBtn" label="显示提交按钮">
<el-switch v-model="data.submitBtn" active-color="#409EFF"></el-switch> <el-switch v-model="data.submitBtn" active-color="#409EFF"></el-switch>
</el-form-item> </el-form-item>
<!-- <el-form-item label="提交按钮的大小" <!-- <el-form-item label="提交按钮的大小"
...@@ -93,8 +95,8 @@ ...@@ -93,8 +95,8 @@
</el-select> </el-select>
</el-form-item> --> </el-form-item> -->
<el-form-item <el-form-item
label="提交按钮的文字"
v-if="data.menuBtn && data.submitBtn" v-if="data.menuBtn && data.submitBtn"
label="提交按钮的文字"
> >
<el-input <el-input
v-model="data.submitText" v-model="data.submitText"
...@@ -102,7 +104,7 @@ ...@@ -102,7 +104,7 @@
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="显示清空按钮" v-if="data.menuBtn"> <el-form-item v-if="data.menuBtn" label="显示清空按钮">
<el-switch v-model="data.emptyBtn" active-color="#409EFF"></el-switch> <el-switch v-model="data.emptyBtn" active-color="#409EFF"></el-switch>
</el-form-item> </el-form-item>
<!-- <el-form-item label="清空按钮的大小" <!-- <el-form-item label="清空按钮的大小"
...@@ -117,7 +119,7 @@ ...@@ -117,7 +119,7 @@
value="mini"></el-option> value="mini"></el-option>
</el-select> </el-select>
</el-form-item> --> </el-form-item> -->
<el-form-item label="清空按钮的文字" v-if="data.menuBtn && data.emptyBtn"> <el-form-item v-if="data.menuBtn && data.emptyBtn" label="清空按钮的文字">
<el-input <el-input
v-model="data.emptyText" v-model="data.emptyText"
placeholder="清空按钮的文字" placeholder="清空按钮的文字"
...@@ -153,7 +155,7 @@ ...@@ -153,7 +155,7 @@
<script> <script>
export default { export default {
name: "form-config", name: "FormConfig",
props: ["data"], props: ["data"],
} }
</script> </script>
<template>
<div class="widget-config">
<el-form
label-suffix=":"
v-if="this.data && Object.keys(this.data).length > 0"
labelPosition="left"
labelWidth="110px"
size="small"
>
<el-collapse v-model="collapse">
<el-collapse-item name="1" title="基本属性">
<el-form-item label="类型" v-if="data.type && !data.component">
<el-select
v-model="data.type"
style="width: 100%"
placeholder="请选择类型"
@change="handleChangeType"
:disabled="fieldNotEdit"
>
<el-option-group
v-for="group in fields"
:key="group.title"
:label="group.title"
>
<el-option
v-for="item in group.list"
:key="item.type"
:label="item.label"
:value="item.type"
>
</el-option>
</el-option-group>
</el-select>
</el-form-item>
<el-form-item label="属性值">
<el-input
v-model="data.prop"
clearable
placeholder="属性值"
:disabled="fieldNotEdit || propNotEdit"
></el-input>
</el-form-item>
<el-form-item label="标题">
<el-input
v-model="data.label"
clearable
placeholder="标题"
:disabled="
fieldNotEdit && !['group', 'dynamic'].includes(data.type)
"
></el-input>
</el-form-item>
<el-form-item label="宽度" v-if="data.subfield">
<el-input-number
style="width: 100%"
v-model="data.width"
controls-position="right"
placeholder="宽度"
:min="100"
></el-input-number>
</el-form-item>
<el-form-item
label="表单栅格"
v-if="!data.subfield && !['group'].includes(data.type)"
>
<el-input-number
style="width: 100%"
v-model="data.span"
controls-position="right"
placeholder="表单栅格"
:min="8"
:max="24"
></el-input-number>
</el-form-item>
<el-form-item
label="数据类型"
v-if="
[
'cascader',
'checkbox',
'radio',
'select',
'tree',
'upload',
'img',
'array',
'slider',
'timerange',
'daterange',
'datetimerange',
].includes(data.type)
"
>
<template slot="label">
<el-link
:underline="false"
href="https://avuejs.com/doc/dataType"
target="_blank"
>数据类型 <i class="el-icon-question"></i
></el-link>
</template>
<el-select
v-model="data.dataType"
placeholder="数据类型"
clearable
style="width: 100%"
>
<el-option label="String" value="string"></el-option>
<el-option label="Number" value="number"></el-option>
<el-option label="Array" value="array"></el-option>
</el-select>
</el-form-item>
<el-form-item label="深结构" v-if="data.type && !data.component">
<template slot="label">
<el-link
:underline="false"
href="https://avuejs.com/doc/form/form-bind"
target="_blank"
>深结构 <i class="el-icon-question"></i
></el-link>
</template>
<el-input
v-model="data.bind"
clearable
placeholder="深结构"
></el-input>
</el-form-item>
<el-form-item label="字段提示">
<template slot="label">
<el-link
:underline="false"
href="https://avuejs.com/doc/form/form-tip"
target="_blank"
>字段提示 <i class="el-icon-question"></i
></el-link>
</template>
<el-input
v-model="data.tip"
clearable
placeholder="字段提示"
></el-input>
</el-form-item>
<el-form-item
v-if="data.tip && !['upload'].includes(data.type)"
label="字段提示位置"
label-width="110px"
>
<el-select
v-model="data.tipPlacement"
placeholder="字段提示位置"
style="width: 100%"
clearable
>
<el-option label="上" value="top"></el-option>
<el-option label="下" value="bottom"></el-option>
<el-option label="左" value="left"></el-option>
<el-option label="右" value="right"></el-option>
</el-select>
</el-form-item>
<el-form-item label="标题提示">
<template slot="label">
<el-link
:underline="false"
href="https://avuejs.com/doc/form/form-tip"
target="_blank"
>标题提示 <i class="el-icon-question"></i
></el-link>
</template>
<el-input
v-model="data.labelTip"
clearable
placeholder="标题提示"
></el-input>
</el-form-item>
<el-form-item
v-if="data.labelTip && !['upload'].includes(data.type)"
label="标题提示位置"
label-width="110px"
>
<el-select
v-model="data.labelTipPlacement"
placeholder="标题提示位置"
clearable
>
<el-option label="上" value="top"></el-option>
<el-option label="下" value="bottom"></el-option>
<el-option label="左" value="left"></el-option>
<el-option label="右" value="right"></el-option>
</el-select>
</el-form-item>
<component :is="getComponent" :data="data"></component>
</el-collapse-item>
<el-collapse-item
name="2"
title="事件属性"
v-if="!['group', 'dynamic'].includes(data.type)"
>
<el-form-item label="change">
<el-input
v-model="data.change"
type="textarea"
placeholder="改变事件"
rows="5"
clearable
></el-input>
</el-form-item>
<el-form-item label="click">
<el-input
v-model="data.click"
type="textarea"
placeholder="点击事件"
rows="5"
></el-input>
</el-form-item>
<el-form-item label="focus">
<el-input
v-model="data.focus"
type="textarea"
placeholder="获取焦点事件"
rows="5"
></el-input>
</el-form-item>
<el-form-item label="blur">
<el-input
v-model="data.blur"
type="textarea"
placeholder="失去焦点事件"
rows="5"
></el-input>
</el-form-item>
</el-collapse-item>
<slot name="dbtable"></slot>
<el-collapse-item
name="99"
title="其他"
v-if="!['group', 'dynamic', 'title'].includes(data.type)"
>
<dynamic-sh :data="data"></dynamic-sh>
</el-collapse-item>
</el-collapse>
</el-form>
<div>拖拽字段进行配置</div>
</div>
</template>
<script>
import fields from "./fieldsConfig.js"
import DynamicSh from "./components/DynamicSh"
const dateArr = [
"year",
"month",
"week",
"date",
"datetime",
"time",
"daterange",
"timerange",
"datetimerange",
"dates",
]
export default {
name: "widget-config",
components: { DynamicSh },
props: {
data: {
type: Array | Object,
},
fieldNotEdit: {
type: Boolean,
default: false,
},
propNotEdit: {
type: Boolean,
default: false,
},
},
computed: {
getComponent() {
const prefix = "config-"
const { type, component } = this.data
if ((!type || component) && type != "ueditor") return prefix + "custom"
let result = "input"
if ([undefined, "input", "password", "url"].includes(type))
result = "input"
else if (dateArr.includes(type)) result = "date"
else if (["array", "img"].includes(type)) result = "array"
else if (["tree", "cascader"].includes(type)) result = "tree"
else if (["radio", "checkbox", "select"].includes(type)) result = "select"
else result = type
return prefix + result
},
},
data() {
return {
fields,
collapse: "1",
}
},
methods: {
async handleChangeType(type) {
if (type) {
const config = await this.getConfigByType(type)
config.prop = this.data.prop
for (let key in config) {
if (
config &&
Object.prototype.hasOwnProperty.call(config, key) &&
!["icon", "label", "span"].includes(key)
) {
const val = config[key]
this.$set(this.data, key, val)
}
}
}
},
getConfigByType(type) {
return new Promise((resolve, reject) => {
fields.forEach((field) => {
field.list.forEach((config) => {
if (config.type == type) resolve(config)
})
})
reject()
})
},
},
}
</script>
<style lang="scss">
.widget-config {
ul {
margin: 0;
padding: 0;
li {
display: flex;
align-items: center;
width: 100%;
.ghost {
list-style: none;
font-size: 0;
height: 35px;
}
}
}
}
</style>
...@@ -40,9 +40,6 @@ ...@@ -40,9 +40,6 @@
:disabled="propNotEdit" :disabled="propNotEdit"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="数据库">
<el-input :value="data.tableCode" clearable disabled></el-input>
</el-form-item>
<el-form-item label="标题"> <el-form-item label="标题">
<el-input <el-input
v-model="data.label" v-model="data.label"
...@@ -50,10 +47,10 @@ ...@@ -50,10 +47,10 @@
placeholder="标题" placeholder="标题"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="标题缀"> <el-form-item label="标题缀">
<el-input <el-input
v-model="data.labelSuffix" v-model="data.labelSuffix"
placeholder="标题缀" placeholder="标题缀"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="左侧内边距" v-if="data.type === 'group'"> <el-form-item label="左侧内边距" v-if="data.type === 'group'">
...@@ -80,7 +77,6 @@ ...@@ -80,7 +77,6 @@
controls-position="right" controls-position="right"
placeholder="标题宽度" placeholder="标题宽度"
:min="0" :min="0"
:max="400"
></el-input-number> ></el-input-number>
</el-form-item> </el-form-item>
<template <template
......
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
> >
<el-form-item <el-form-item
:label=" :label="
item.label ? `${item.label}${item.labelSuffix || ':'}` : '' item.label ? `${item.labelSuffix || ''}${item.label}` : ''
" "
:prop="item.prop" :prop="item.prop"
:label-width=" :label-width="
......
<template>
<div>
<span
v-if="item.type == 'title'"
:style="item.styles"
style="margin-left: 5px"
>
{{ item.value }}
</span>
<component
v-else
:is="getComponent(item.type, item.component)"
v-bind="
Object.assign(deepClone(item), params, { size: item.size || 'small' })
"
:multiple="false"
:placeholder="item.placeholder || getPlaceholder(item)"
:dic="item.dicData"
:value="
['time', 'timerange', 'checkbox'].includes(item.type)
? item.dicData
: undefined
"
>
<span v-if="params.html" v-html="params.html"></span>
</component>
</div>
</template>
<script>
export default {
name: "widget-form-item",
props: {
item: {
type: Object,
default: () => {
return {}
},
},
params: {
type: Object,
default: () => {
return {}
},
},
},
data() {
return {
form: {},
}
},
methods: {
getComponent(type, component) {
let KEY_COMPONENT_NAME = "avue-"
let result = "input"
if (component) return component
else if (["array", "img", "url"].includes(type)) result = "array"
else if (type === "select") result = "select"
else if (type === "radio") result = "radio"
else if (type === "checkbox") result = "checkbox"
else if (["time", "timerange"].includes(type)) result = "time"
else if (
[
"dates",
"date",
"datetime",
"datetimerange",
"daterange",
"week",
"month",
"year",
].includes(type)
)
result = "date"
else if (type === "cascader") result = "cascader"
else if (type === "number") result = "input-number"
else if (type === "password") result = "input"
else if (type === "switch") result = "switch"
else if (type === "rate") result = "rate"
else if (type === "upload") result = "upload"
else if (type === "slider") result = "slider"
else if (type === "dynamic") result = "dynamic"
else if (type === "icon") result = "input-icon"
else if (type === "color") result = "input-color"
else if (type === "map") result = "input-map"
return KEY_COMPONENT_NAME + result
},
getPlaceholder(item) {
const label = item.label
if (
[
"select",
"checkbox",
"radio",
"tree",
"color",
"dates",
"date",
"datetime",
"datetimerange",
"daterange",
"week",
"month",
"year",
"map",
"icon",
].includes(item.type)
)
return `请选择 ${label}`
else return `请输入 ${label}`
},
},
}
</script>
...@@ -224,6 +224,9 @@ export default { ...@@ -224,6 +224,9 @@ export default {
if (data.type === "dynamic") { if (data.type === "dynamic") {
data.prop = "fixed_field" data.prop = "fixed_field"
} }
if (data.type == "title") {
delete data.label
}
data.cType = column.children.type === "form" ? "form" : "table" data.cType = column.children.type === "form" ? "form" : "table"
data.subfield = true data.subfield = true
delete data.icon delete data.icon
......
<template> <template>
<div> <div>
<template v-if="data.type.indexOf('range') != -1"> <template v-if="data.type.indexOf('range') != -1">
<el-form-item label="开始占位内容" <el-form-item label="开始占位内容" label-width="110px">
label-width="110px"> <el-input
<el-input v-model="data.startPlaceholder" v-model="data.startPlaceholder"
clearable clearable
placeholder="开始占位内容"></el-input> placeholder="开始占位内容"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="结束占位内容" <el-form-item label="结束占位内容" label-width="110px">
label-width="110px"> <el-input
<el-input v-model="data.endPlaceholder" v-model="data.endPlaceholder"
clearable clearable
placeholder="结束占位内容"></el-input> placeholder="结束占位内容"
></el-input>
</el-form-item> </el-form-item>
</template> </template>
<el-form-item label="占位内容" <el-form-item label="占位内容" v-else>
v-else> <el-input
<el-input v-model="data.placeholder" v-model="data.placeholder"
clearable clearable
placeholder="占位内容"></el-input> placeholder="占位内容"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="默认值"> <el-form-item label="默认值">
<el-input v-model="data.value" <el-input v-model="data.value" clearable placeholder="默认值"></el-input>
clearable
placeholder="默认值"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="显示格式化" <el-form-item label="显示格式化" label-width="100px">
label-width="100px"> <el-input
<el-input v-model="data.format" v-model="data.format"
clearable clearable
placeholder="显示格式化"></el-input> placeholder="显示格式化"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="值格式化"> <el-form-item label="值格式化">
<el-input v-model="data.valueFormat" <el-input
v-model="data.valueFormat"
clearable clearable
placeholder="值格式化"></el-input> placeholder="值格式化"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="取消范围联动" <el-form-item
label="取消范围联动"
label-width="110px" label-width="110px"
v-if="['timerange', 'daterange', 'datetimerange'].includes(data.type)"> v-if="['timerange', 'daterange', 'datetimerange'].includes(data.type)"
>
<el-switch v-model="data.unlinkPanels"></el-switch> <el-switch v-model="data.unlinkPanels"></el-switch>
</el-form-item> </el-form-item>
<el-form-item label="是否禁用"> <el-form-item label="是否禁用">
...@@ -49,40 +55,96 @@ ...@@ -49,40 +55,96 @@
</el-form-item> </el-form-item>
<el-form-item label="是否必填"> <el-form-item label="是否必填">
<el-switch v-model="data.required"></el-switch> <el-switch v-model="data.required"></el-switch>
<el-input
v-if="data.required"
v-model.lazy="data.pattern"
placeholder="校验方法"
></el-input>
</el-form-item> </el-form-item>
</div> </div>
</template> </template>
<script> <script>
let checkAge = (rule, value, callback) => {
if (!value) {
return callback(new Error("请选择出生日期"))
}
let birthday = new Date(value.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 < 40 || age > 80) {
callback(new Error("年龄不符合筛查条件"))
} else {
callback()
}
}
export default { export default {
name: "config-date", name: "config-date",
props: ['data'], props: ["data"],
data() { data() {
return { return {
validator: { validator: {
type: null, type: null,
required: null, required: null,
pattern: null, pattern: null,
length: null length: null,
} },
} }
}, },
methods: { methods: {
generateRule() { generateRule() {
const rules = []; const rules = []
Object.keys(this.validator).forEach(key => { Object.keys(this.validator).forEach((key) => {
if (this.validator[key]) rules.push(this.validator[key]) if (this.validator[key]) rules.push(this.validator[key])
}) })
this.data.rules = rules this.data.rules = rules
console.log(this.data.rules)
},
// 在表单配置中增加checkAge字段,可以增加校验年龄的方法
ageRule() {
// const rules = []
// Object.keys(this.validator).forEach((key) => {
// if (this.validator[key]) rules.push(this.validator[key])
// })
// this.data.rules = rules
let i = this.data.rules.findIndex((e) => e.trigger)
this.data.rules[i] = { validator: checkAge, trigger: "change" }
console.log(this.data.rules)
}, },
}, },
watch: { watch: {
'data.required': function (val) { "data.required": function (val) {
if (val) this.validator.required = { required: true, message: `${this.data.label}必须填写` } if (val) {
else this.validator.required = null this.validator.required = {
required: true,
message: `${this.data.label}必须填写`,
}
} else {
this.validator.required = null
}
this.generateRule() this.generateRule()
},
"data.pattern": function (val) {
if (val) {
// console.log(val)
if (val == "checkAge") {
this.ageRule()
} }
} else {
this.validator.pattern = null
} }
// delete this.data.pattern
// this.generateRule()
},
},
} }
</script> </script>
...@@ -35,6 +35,9 @@ ...@@ -35,6 +35,9 @@
<el-form-item label="是否只读"> <el-form-item label="是否只读">
<el-switch v-model="data.readonly"></el-switch> <el-switch v-model="data.readonly"></el-switch>
</el-form-item> </el-form-item>
<el-form-item label="是否禁用">
<el-switch v-model="data.disabled"></el-switch>
</el-form-item>
<el-form-item label="是否可见"> <el-form-item label="是否可见">
<el-switch v-model="data.display"></el-switch> <el-switch v-model="data.display"></el-switch>
</el-form-item> </el-form-item>
...@@ -50,6 +53,18 @@ ...@@ -50,6 +53,18 @@
</template> </template>
<script> <script>
let checkTel = (rule, value, callback) => {
if (!value) {
return callback(new Error("请输入手机号"))
}
const reg = /^1[3,4,5,6,7,8,9][0-9]{9}$/
reg.test(value)
if (!reg.test(value)) {
callback(new Error("请输入正确的手机号"))
} else {
callback()
}
}
export default { export default {
name: "config-input", name: "config-input",
props: ["data"], props: ["data"],
...@@ -71,6 +86,9 @@ export default { ...@@ -71,6 +86,9 @@ export default {
}) })
this.data.rules = rules this.data.rules = rules
}, },
telRule() {
this.data.rules[1] = { validator: checkTel, trigger: "blur" }
},
}, },
watch: { watch: {
"data.required": function (val) { "data.required": function (val) {
...@@ -84,15 +102,21 @@ export default { ...@@ -84,15 +102,21 @@ export default {
this.generateRule() this.generateRule()
}, },
"data.pattern": function (val) { "data.pattern": function (val) {
if (val) if (val) {
if (val == "checkTel") {
this.telRule()
} else {
this.validator.pattern = { this.validator.pattern = {
pattern: new RegExp(val), pattern: new RegExp(val),
message: `${this.data.label}格式不匹配`, message: `${this.data.label}格式不匹配`,
} }
else this.validator.pattern = null
// delete this.data.pattern
this.generateRule() this.generateRule()
}
} else {
this.validator.pattern = null
this.generateRule()
}
// delete this.data.pattern
}, },
}, },
} }
......
<template> <template>
<div> <div>
<el-form-item v-if="data.type == 'select'" label="占位内容"> <el-form-item v-if="data.type == 'select'" label="占位内容">
<el-input <el-input
v-model="data.placeholder" v-model="data.placeholder"
...@@ -235,6 +234,9 @@ ...@@ -235,6 +234,9 @@
<el-form-item label="是否必填"> <el-form-item label="是否必填">
<el-switch v-model="data.required"></el-switch> <el-switch v-model="data.required"></el-switch>
</el-form-item> </el-form-item>
<el-form-item label="必填提示文本">
<el-input v-model="data.pattern"></el-input>
</el-form-item>
</div> </div>
</template> </template>
...@@ -315,7 +317,16 @@ export default { ...@@ -315,7 +317,16 @@ export default {
this.generateRule() this.generateRule()
}, },
"data.pattern": function (val) {
if (val)
this.validator.required = {
required: true,
message: val,
}
else this.validator.required = null
this.generateRule()
},
}, },
} }
</script> </script>
...@@ -4,12 +4,12 @@ module.exports = { ...@@ -4,12 +4,12 @@ module.exports = {
useTabs: false, useTabs: false,
semi: false, semi: false,
singleQuote: false, singleQuote: false,
quoteProps: 'as-needed', quoteProps: "as-needed",
jsxSingleQuote: false, jsxSingleQuote: false,
trailingComma: 'es5', trailingComma: "es5",
bracketSpacing: true, bracketSpacing: true,
jsxBracketSameLine: false, jsxBracketSameLine: false,
arrowParens: 'always', arrowParens: "always",
vueIndentScriptAndStyle: false, vueIndentScriptAndStyle: false,
endOfLine: 'lf', endOfLine: "auto",
} }
...@@ -18,6 +18,9 @@ export default { ...@@ -18,6 +18,9 @@ export default {
} }
#vue-admin-beautiful { #vue-admin-beautiful {
height: 100vh;
min-width: 1400px;
overflow: auto;
margin-right: calc(100% - 100vw); margin-right: calc(100% - 100vw);
} }
</style> </style>
import request from "@/utils/request"
/* 首页 */
export function addMedicalunion(data = {}) {
return request({
url: "/cloud-upms/sys/union/addOrUpdate",
method: "post",
data,
})
}
// 医联体授权
export function baseUnion(data = {}) {
return request({
url: "/cloud-upms/user/base/union",
method: "post",
data,
})
}
// 累计上报
export function getRankTotal(params = {}) {
return request({
url: "/disease-data/rank/total",
method: "get",
params,
})
}
//当前季度
export function getCurrentQuarter(params = {}) {
return request({
url: "/disease-data/rank/currentQuarter",
method: "get",
params,
})
}
export function deleteUnion(id) {
return request({
url: `/cloud-upms/sys/union/${id}`,
method: "delete",
})
}
...@@ -341,7 +341,7 @@ export function getQualityDetail(patientId) { ...@@ -341,7 +341,7 @@ export function getQualityDetail(patientId) {
// 协作组参数配置新增/修改 // 协作组参数配置新增/修改
export function setParamConfig(data) { export function setParamConfig(data) {
return request({ return request({
url: `/disease-data/sys/paramConfig/addOrUpdate`, url: `/disease-data/param/config`,
method: "post", method: "post",
data, data,
}) })
...@@ -350,7 +350,7 @@ export function setParamConfig(data) { ...@@ -350,7 +350,7 @@ export function setParamConfig(data) {
// 协作组参数配置列表 // 协作组参数配置列表
export function getParamConfigList(params) { export function getParamConfigList(params) {
return request({ return request({
url: `/disease-data/sys/paramConfig/list`, url: `/disease-data/param/config/page`,
method: "get", method: "get",
params, params,
}) })
...@@ -359,7 +359,7 @@ export function getParamConfigList(params) { ...@@ -359,7 +359,7 @@ export function getParamConfigList(params) {
// 删除配置 // 删除配置
export function delParamConfig(id) { export function delParamConfig(id) {
return request({ return request({
url: `/disease-data/sys/paramConfig/${id}`, url: `/disease-data/param/config?id=${id}`,
method: "delete", method: "delete",
}) })
} }
import request from "@/utils/request"
import { add } from "lodash"
/* 数据库管理 */
export function getDbPage(params = {}) {
return request({
url: "/cloud-upms/sys/db/info/page",
method: "get",
params,
})
}
export function getDbList(params = {}) {
return request({
url: "/cloud-upms/sys/db/info/list",
method: "get",
params,
})
}
export function addDb(data = {}) {
return request({
url: "/cloud-upms/sys/db/info",
method: "post",
data,
})
}
// 测试连接
export function testDb(data = {}) {
return request({
url: "/cloud-upms/sys/db/info/test/connection",
method: "post",
data,
})
}
// 根据数据库id 查数据表
export function getTableList(id) {
return request({
url: `/cloud-upms/sys/table/list?dbId=${id}`,
method: "get",
})
}
// 新增数据表
export function addDbTable(data = {}) {
return request({
url: "/cloud-upms/sys/table",
method: "post",
data,
})
}
import request from "@/utils/request"
/* 数据概览 */
// 累计上报
export function getPatientPage(params = {}) {
return request({
url: "/disease-data/data/report/page",
method: "get",
params,
})
}
...@@ -12,6 +12,7 @@ export function getFieldPage(params = {}) { ...@@ -12,6 +12,7 @@ export function getFieldPage(params = {}) {
params, params,
}) })
} }
export function delField(id) { export function delField(id) {
return request({ return request({
url: `/cloud-upms/field/dict/${id}`, url: `/cloud-upms/field/dict/${id}`,
...@@ -84,7 +85,7 @@ export function copyForm(data = {}) { ...@@ -84,7 +85,7 @@ export function copyForm(data = {}) {
// 获取 // 获取
export function getFormDetail(id) { export function getFormDetail(id) {
return request({ return request({
url: `/cloud-upms//org/form/${id}`, url: `/cloud-upms/org/form/${id}`,
method: "get", method: "get",
}) })
} }
......
import request from "@/utils/request";
/**
* 随访
*
* */
//随访查询 列表
export function getFollowSearch(params = {}) {
return request({
url: "/disease-data/follow/search",
method: "get",
params,
});
}
//随访调查 列表
export function getFollowSurvey(params = {}) {
return request({
url: "/disease-data/follow/survey",
method: "get",
params,
});
}
///////////////审核质控/////////////////////
//随访已审核列表
export function getFollowCheck(params = {}) {
return request({
url: "/disease-data/dataCheck/follow/check",
method: "get",
params,
});
}
//随访待审核列表
export function getFollowUncheck(params = {}) {
return request({
url: "/disease-data/dataCheck/follow/unCheck",
method: "get",
params,
});
}
//随访病例待审核(详情数据)
export function getFollowUnCheckDetail(id) {
return request({
url: `/disease-data/dataCheck/follow/unCheck/detail/${id}`,
method: "get",
});
}
//随访病例审核
export function putFollowCheck(data = {}) {
return request({
url: "/disease-data/dataCheck/follow/check",
method: "put",
data,
})
}
//修改随访审核意见
export function putFollowCheckAdvice(data = {}) {
return request({
url: "/disease-data/dataCheck/follow/check/advice",
method: "put",
data,
})
}
\ No newline at end of file
import request from "@/utils/request"
/* 数据库管理 */
export function addMedicalunion(data = {}) {
return request({
url: "/cloud-upms/sys/union/addOrUpdate",
method: "post",
data,
})
}
// 医联体授权
export function baseUnion(data = {}) {
return request({
url: "/cloud-upms/user/base/union",
method: "post",
data,
})
}
export function medicalunionList(params = {}) {
return request({
url: "/cloud-upms/sys/union/list",
method: "get",
params,
})
}
// 添加标准获取医联体
export function getMedicalunionList(params = {}) {
return request({
url: "/cloud-upms/sys/union/select",
method: "get",
params,
})
}
export function deleteUnion(id) {
return request({
url: `/cloud-upms/sys/union/${id}`,
method: "delete",
})
}
import request from "@/utils/request";
/**
* 审核标签
*
* */
// 获取审核意见标签
export function getSysCheckNote(params = {}) {
return request({
url: "/disease-data/sysCheckNote",
method: "get",
params,
});
}
//保存意见标签
export function postSysCheckNote(data = {}) {
return request({
url: "/disease-data/sysCheckNote",
method: "post",
data
});
}
// //修改意见标签
// export function putSysCheckNote(data = {}) {
// return request({
// url: "/disease-data/sysCheckNote",
// method: "put",
// data
// });
// }
// //删除意见标签
// export function delSysCheckNote(id) {
// return request({
// url: `/disease-data/sysCheckNote/${id}`,
// method: "delete",
// });
// }
\ No newline at end of file
import request from "@/utils/request"
/* 数据库管理 */
export function addArticle(data = {}) {
return request({
url: "/cloud-upms/sys/article/addOrUpdate",
method: "post",
data,
})
}
// 获取列表
export function articleList(params = {}) {
return request({
url: "/cloud-upms/sys/article/list",
method: "get",
params,
})
}
// 启用禁用状态
export function articleEnable(params = {}) {
return request({
url: "/cloud-upms/sys/article/enable",
method: "get",
params,
})
}
// 删除文章
export function deleteArticle(id) {
return request({
url: `/cloud-upms/sys/article/${id}`,
method: "delete",
})
}
import request from "@/utils/request"
/* 患者数据 */
export function getPatientPage(params = {}) {
let url = "/disease-data/data/patient/page?"
let keys = Object.keys(params)
for (let key of keys) {
url += `${encodeURIComponent(key)}=${params[key]}&`
}
url = url.substring(0, url.length - 1)
return request({
url: url,
method: "get",
})
}
// 随访分页
export function getPatientFollowPage(params = {}) {
let url = "/disease-data/data/patient/follow/page?"
let keys = Object.keys(params)
for (let key of keys) {
url += `${encodeURIComponent(key)}=${params[key]}&`
}
url = url.substring(0, url.length - 1)
return request({
url: url,
method: "get",
})
}
export function delPatient(id) {
return request({
url: `/cloud-upms/sys/menu/${id}`,
method: "delete",
})
}
// 填报
export function addPatient(data = {}, type = "") {
return request({
url: `/disease-data/data/patient/${type}`,
method: "post",
data,
})
}
// 删除草稿
export function deletePatient(data) {
return request({
url: `/disease-data/data/patient/${data}`,
method: "delete",
})
}
/* 患者数据详情 */
export function getPatientDetail(params = {}) {
return request({
url: "/disease-data/data/patient/info",
method: "get",
params,
})
}
/* 获取表单填报记录list*/
export function getRecordList(params = {}) {
return request({
url: "/disease-data/data/patient/form/record/list",
method: "get",
params,
})
}
// 患者质控列表 分页查询
export function getQcPage(params = {}) {
return request({
url: "/disease-data/data/qc/page",
method: "get",
params,
})
}
// 质控
export function qcPatient(data = {}, type = "") {
return request({
url: `/disease-data/data/qc`,
method: "post",
data,
})
}
// 获取九院口腔癌患者信息(同屏对照使用)
export function getJYpatientInfo(params = {}) {
return request({
url: "/jiuyuan-gather/patient/kqa/info",
method: "get",
params,
})
}
// 获取九院口腔癌随访表(同屏对照使用)
export function getJYFollowInfo(params = {}) {
return request({
url: "/jiuyuan-gather/patient/kqa/follow/info",
method: "get",
params,
})
}
// 获取同济口腔 牙周病(yzb) | 口腔癌(kqa) 患者信息(同屏对照使用)
export function getTJpatientInfo(params = {}, diseases = "yzb") {
return request({
url: `/tjkq-gather/patient/${diseases}/info`,
method: "get",
params,
})
}
// 获取九院牙周炎患者信息(同屏对照使用)
export function getJYyzyPatientInfo(params = {}) {
return request({
url: "/jiuyuan-gather/patient/yzy/info",
method: "get",
params,
})
}
// 获取急性胰腺炎患者信息/检查信息/术治疗(同屏对照使用)
export function getJxyzyPatientInfo(type, params = {}) {
return request({
url: `/changhai-gather/patient/${type}/info`,
method: "get",
params,
})
}
// 获取中山医院病历/检查信息/治疗(同屏对照使用)
export function getZsyzyPatientInfo(params = {}) {
return request({
url: "/zsyzy-gather/patient/yzb/info",
method: "get",
params,
})
}
// 急性胰腺炎-评分表
// 评分表新增修改
export function saveApScore(data = {}) {
return request({
url: `disease-data/ap/score`,
method: "post",
data,
})
}
// 根据patientId查询评分表数据
export function getApScore(patientId) {
return request({
url: `/disease-data/ap/score/list?patientId=${patientId}`,
method: "get",
})
}
// 根据patientId+type查询(评分趋势图用)
export function getApScoreTypeList(params = {}) {
return request({
url: "disease-data/ap/score/type/list",
method: "get",
params,
})
}
// 根据patientId, scoreId查询detailList
export function getApScoreDetailList(params = {}) {
return request({
url: "/disease-data/ap/score/detail/list",
method: "get",
params,
})
}
import request from "@/utils/request"
/**
* 筛查审核
*
* */
///////////////筛查质控/////////////////////
//筛查已审核列表
export function getScreeningCheck(params = {}) {
return request({
url: "/disease-data/dataCheck/screening/check",
method: "get",
params,
})
}
//筛查待审核列表
export function getScreeningUncheck(params = {}) {
return request({
url: "/disease-data/dataCheck/screening/unCheck",
method: "get",
params,
})
}
//筛查病例待审核(用户)
export function getScreeningUser(id) {
return request({
url: `/disease-data/dataCheck/screening/unCheck/detail/${id}`,
method: "get",
})
}
//筛查病例审核
export function putScreeningCheck(data = {}) {
return request({
url: "/disease-data/dataCheck/screening/uncheck",
method: "put",
data,
})
}
// 获取意见标签
export function getSysCheckNote() {
return request({
url: "/disease-data/sysCheckNote",
method: "get",
})
}
// 删除意见标签
export function saveSysCheckNote(data = {}) {
return request({
url: "/disease-data/sysCheckNote",
method: "post",
data,
})
}
// //修改筛查病例审核意见
// export function putFollowCheckAdvice(data = {}) {
// return request({
// url: "/disease-data/dataCheck/follow/check/advice",
// method: "put",
// data,
// })
// }
...@@ -141,25 +141,21 @@ export function ssoLogin(token) { ...@@ -141,25 +141,21 @@ export function ssoLogin(token) {
}) })
} }
//异常反馈 //异常反馈
export function getAbnormalList(params) { export function getAbnormalList(params) {
return request({ return request({
url: `/disease-data/sys/message/exception/feedBack/select/all/msg`, url: `/disease-data/sys/message/exception/feedBack/select/all/msg`,
method: "get", method: "get",
params params,
}) })
} }
// 修改系统信息-点击单条消息(进行已读操作) // 修改系统信息-点击单条消息(进行已读操作)
export function setAbnormalStatus(params) { export function setAbnormalStatus(params) {
return request({ return request({
url: `/disease-data/sys/message/exception/feedBack/do/read`, url: `/disease-data/sys/message/exception/feedBack/do/read`,
method: "get", method: "get",
params params,
}) })
} }
...@@ -171,3 +167,11 @@ export function getFeedBackNumber(id) { ...@@ -171,3 +167,11 @@ export function getFeedBackNumber(id) {
}) })
} }
// 获取B端日志
export function getLogPage(params = {}) {
return request({
url: "/cloud-upms/sys/log/page",
method: "get",
params,
})
}
@charset "UTF-8";
/*针对英文单词,强制让单词换行,break-word不拆分单词, break-all拆分单词*/
* {
word-wrap: break-word; /*word-break: break-all;*/
}
html {
//font-size: calc(100vw / 7.5); /*1rem = 100px*/
}
body {
font-family: "Helvetica", "Tahoma", "Arial", "PingFang SC", "Microsoft Yahei",
"SimSun", "SimHei", "sans-serif";
color: #666;
background: #fff;
font-size: 14px;
}
.break-all {
word-break: break-all;
}
/*对齐方式*/
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
/*图片居左、右、中*/
.img-left {
display: inline;
float: left;
}
.img-right {
display: inline;
float: right;
}
.img-center {
clear: both;
display: block;
margin: auto;
}
/*父容器要清除浮动*/
/*隐藏文字*/
.text-indent {
text-indent: -9999em;
}
.seo-text {
font-size: 0;
line-height: 0;
overflow: hidden;
}
/*图片控制尺寸*/
.img-overflow {
width: 100%;
height: 100%;
overflow: hidden;
}
/*img自适应*/
.img-responsive {
max-width: 100%;
height: auto;
display: block;
}
img {
border: none;
}
/*清除浮动*/
.fl {
float: left;
_display: inline;
*zoom: 1;
}
.fr {
float: right;
_display: inline;
*zoom: 1;
}
.clearfix {
*zoom: 1;
}
.clearfix:before,
.clearfix:after {
display: table;
line-height: 0;
content: "";
}
.clearfix:after {
clear: both;
}
/*外边距px*/
.margin-auto {
margin-left: auto;
margin-right: auto;
}
.mb30 {
margin-bottom: 30px;
}
/*字体加粗*/
.bold {
font-weight: bold;
}
/*1行显示省略号*/
.ellipsis {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: block;
}
/*默认2行显示省略号 只适用于webkit内核*/
.ellipses-line2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.ellipses-line4 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
}
/*placeholder重置字体颜色*/
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #999 !important;
font-size: 12px;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
color: #999 !important;
font-size: 12px;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #999 !important;
font-size: 12px;
}
// 美化滚动条
::-webkit-scrollbar-track-piece {
background-color: #fff;
-webkit-border-radius: 0;
opacity: 0.5;
}
::-webkit-scrollbar {
width: 6px;
height: 10px;
}
::-webkit-scrollbar-thumb {
height: 30px;
background-color: #b8b8b8;
-webkit-border-radius: 6px;
outline: 1px solid transparent;
outline-offset: -2px;
border: 1px solid transparent;
filter: alpha(opacity = 30);
-moz-opacity: .5;
opacity: .5;
}
::-webkit-scrollbar-thumb:hover {
height: 30px;
background-color: #878987;
-webkit-border-radius: 6px;
}
/*隐藏*/
.hidden {
display: none;
}
.visible {
display: block;
}
/*将dcss容器里的所有元素设为默认值*/
.dcss html,
.dcss address,
.dcss blockquote,
.dcss body,
.dcss dd,
.dcss div,
.dcss dl,
.dcss dt,
.dcss fieldset,
.dcss form,
.dcss frame,
.dcss frameset,
.dcss h1,
.dcss h2,
.dcss h3,
.dcss h4,
.dcss h5,
.dcss h6,
.dcss noframes,
.dcss ol,
.dcss p,
.dcss ul,
.dcss center,
.dcss dir,
.dcss hr,
.dcss menu,
.dcss pre {
display: block;
}
.dcss li {
display: list-item;
}
.dcss head {
display: none;
}
.dcss table {
display: table;
}
.dcss tr {
display: table-row;
}
.dcss thead {
display: table-header-group;
}
.dcss tbody {
display: table-row-group;
}
.dcss tfoot {
display: table-footer-group;
}
.dcss col {
display: table-column;
}
.dcss colgroup {
display: table-column-group;
}
.dcss td,
.dcss th {
display: table-cell;
}
.dcss caption {
display: table-caption;
}
.dcss th {
font-weight: bolder;
text-align: center;
}
.dcss caption {
text-align: center;
}
.dcss body {
margin: 8px;
line-height: 1.12;
}
.dcss h1 {
font-size: 2em;
margin: 0.67em 0;
line-height: 1.5em;
}
.dcss h2 {
font-size: 1.5em;
margin: 0.75em 0;
line-height: 1.5em;
}
.dcss h3 {
font-size: 1.17em;
margin: 0.83em 0;
line-height: 1.5em;
}
.dcss h4 {
font-size: 1.09em;
margin: 1.12em 0;
line-height: 1.5em;
}
.dcss h4,
.dcss p,
.dcss blockquote,
.dcss ul,
.dcss fieldset,
.dcss form,
.dcss ol,
.dcss dl,
.dcss dir,
.dcss menu {
margin: 1.12em 0;
}
.dcss h5 {
font-size: 0.83em;
margin: 1.5em 0;
line-height: 1.5em;
}
.dcss h6 {
font-size: 0.75em;
margin: 1.67em 0;
line-height: 1.5em;
}
.dcss h1,
.dcss h2,
.dcss h3,
.dcss h4,
.dcss h5,
.dcss h6,
.dcss b,
.dcss strong {
font-weight: bolder;
}
.dcss blockquote {
margin-left: 40px;
margin-right: 40px;
}
.dcss i,
.dcss cite,
.dcss em,
.dcss var,
.dcss address {
font-style: italic;
}
.dcss pre,
.dcss tt,
.dcss code,
.dcss kbd,
.dcss samp {
font-family: monospace;
}
.dcss pre {
white-space: pre;
}
.dcss button,
.dcss textarea,
.dcss input,
.dcss object,
.dcss select {
display: inline-block;
}
.dcss big {
font-size: 1.17em;
}
.dcss small,
.dcss sub,
.dcss sup {
font-size: 0.83em;
}
.dcss sub {
vertical-align: sub;
}
.dcss sup {
vertical-align: super;
}
.dcss table {
border-spacing: 2px;
}
.dcss thead,
.dcss tbody,
.dcss tfoot {
vertical-align: middle;
}
.dcss td,
.dcss th {
vertical-align: inherit;
}
.dcss s,
.dcss strike,
.dcss del {
text-decoration: line-through;
}
.dcss hr {
border: 1px inset;
}
.dcss ol,
.dcss ul,
.dcss dir,
.dcss menu,
.dcss dd {
margin-left: 40px;
}
.dcss ol,
.dcss ul,
.dcss li {
list-style-type: decimal;
}
.dcss ol ul,
.dcss ul ol,
.dcss ul ul,
.dcss ol ol {
margin-top: 0;
margin-bottom: 0;
}
.dcss u,
.dcss ins {
text-decoration: underline;
}
.dcss br:before {
content: "A";
}
.dcss :before,
.dcss :after {
white-space: pre-line;
}
.dcss center {
text-align: center;
}
.dcss abbr,
.dcss acronym {
font-variant: small-caps;
letter-spacing: 0.1em;
}
.dcss :link,
.dcss :visited {
text-decoration: underline;
}
.dcss :focus {
outline: thin dotted invert;
}
.dcss BDO[DIR="ltr"] {
direction: ltr;
unicode-bidi: bidi-override;
}
.dcss BDO[DIR="rtl"] {
direction: rtl;
unicode-bidi: bidi-override;
}
.dcss *[DIR="ltr"] {
direction: ltr;
unicode-bidi: embed;
}
.dcss *[DIR="rtl"] {
direction: rtl;
unicode-bidi: embed;
}
@media print {
.dcss h1 {
page-break-before: always;
}
.dcss h1,
.dcss h2,
.dcss h3,
.dcss h4,
.dcss h5,
.dcss h6 {
page-break-after: avoid;
}
.dcss ul,
.dcss ol,
.dcss dl {
page-break-before: avoid;
}
}
//间距
$size-map: (
-2: -2px,
4: 4px,
5: 5px,
8: 8px,
10: 10px,
12: 12px,
15: 15px,
16: 16px,
20: 20px,
24: 24px,
25: 25px,
30: 30px,
32: 32px,
40: 40px,
50: 50px,
80: 80px,
140: 140px
);
@each $name in map-keys($size-map) {
$value: map-get($size-map, $name);
.mt-#{$name} {
margin-top: $value;
}
.mr-#{$name} {
margin-right: $value;
}
.mb-#{$name} {
margin-bottom: $value;
}
.ml-#{$name} {
margin-left: $value;
}
.margin-#{$name} {
margin: $value;
}
.pt-#{$name} {
padding-top: $value !important;
}
.pr-#{$name} {
padding-right: $value;
}
.pb-#{$name} {
padding-bottom: $value;
}
.pl-#{$name} {
padding-left: $value;
}
.pd-#{$name} {
padding: $value;
}
}
//字号
$font-map: (
10: 10px,
11: 11px,
14: 14px,
15: 15px,
18: 18px,
20: 20px,
24: 24px,
25: 25px,
30: 30px,
36: 36px,
40: 40px,
50: 50px,
80: 80px,
140: 140px
);
@each $size in map-keys($font-map) {
$value: map-get($font-map, $size);
.font-#{$size} {
font-size: $value;
}
}
.message-pop {
padding: 40px 28px;
box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.3);
border-radius: 8px;
.popper__arrow::after {
display: none;
}
.popper__arrow {
display: none;
}
}
\ No newline at end of file
@charset "UTF-8";
/*防止用户自定义背景颜色对网页的影响,添加让用户可以自定义字体 */
html {
-webkit-text-size-adjust: 100%; /*禁用Webkit内核浏览器的文字大小调整功能,默认是auto;*/
-ms-text-size-adjust: 100%; /*禁用IE内核浏览器的文字大小调整功能,默认是auto;*/
font-family: sans-serif;
-webkit-font-smoothing: antialiased;
height: 100%;
touch-action: manipulation; /*取消移动端click300ms的延迟*/
}
body {
height: 100%;
}
*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-tap-highlight-color: transparent;
}
/*此处增加dt,label针对bootstrap的加粗定义*/
dt,
label {
font-weight: normal;
font-size: 100%;
}
input,
button,
textarea,
select,
optgroup,
option {
font-size: 100%;
font-weight: normal;
outline: none;
}
h1,h2,h3,h4,h5{
padding: 0;
margin: 0;
font-weight: normal;
}
input,
button,
textarea {
-webkit-appearance: none;
}
/*去除ios按钮内阴影、圆角,对单选框、复选框有影响*/
input[type="checkbox"] {
-webkit-appearance: checkbox;
}
input[type="radio"] {
-webkit-appearance: radio;
}
input::-webkit-input-safebox-button {
display: none;
}
/*解决搜狗浏览器密码框自带安全键盘*/
input:focus,
textarea:focus {
outline: none;
}
th,
td,
button,
input,
select,
textarea {
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
}
/*页面的字体抗锯齿,字体会更清晰圆滑*/
textarea {
resize: none;
border: 1px solid #ddd;
padding: 5px;
width: 100%;
border-radius: 0;
}
address, caption, cite, code, dfn, th, var, /*em,*/ i {
font-style: normal;
font-weight: normal;
}
sub,
sup {
vertical-align: baseline;
}
button {
overflow: visible;
vertical-align: middle;
outline: none;
height: auto;
}
/*去掉列表标签的默认样式*/
ul,
ol,
li {
list-style-type: none;
}
/*重置table样式*/
table {
border-collapse: collapse;
border-spacing: 0; /*table-layout: fixed;*/
}
/*table-layout: fixed; 表格布局尺寸固定(默认等分表格),表格的宽度不再由单元格的内容多少而决定,可自定义宽度(给th,td不起作用)*/
/*border-collapse: separate(独立边框); border-spacing:20px 20px(边框单元格间距离);*/
button {
cursor: pointer;
}
fieldset,
img {
border: 0;
}
/*a链接*/
a {
outline: none;
text-decoration: none;
color: #848484;
cursor: pointer;
}
a:focus {
outline: none;
text-decoration: none;
color: inherit;
}
a:hover {
outline: none;
color: #157df1;
text-decoration: none;
}
input::-webkit-inner-spin-button {
display: none;
}
@charset "utf-8";
// 全局
@import "reset";
@import "base";
//@import "reset-iview";
@import "index";
@function bvw($vw) {
@return $vw / 1440 * 100vw;
}
@function bvh($vh) {
@return $vh / 1024 * 100vh;
}
\ No newline at end of file
@charset "utf-8";
// 通用 全局
<template>
<el-row class="el-table-self">
<el-table
ref="selftab"
v-loading="listLoading"
:max-height="maxHeight || maxTableHeight"
:height="tableHeight"
:data="tableData"
:show-overflow-tooltip="true"
:highlight-current-row="highLight"
:header-row-class-name="headerClass"
style="width: 100%"
>
<el-table-column v-if="showIndex" type="index" width="120" label="序号"></el-table-column>
<template v-for="(column, index) in columns">
<template v-if="!column.type && !column.operType">
<el-table-column
:key="column.value"
:show-overflow-tooltip="true"
:fixed="column.fixed"
:prop="column.value"
:label="column.label"
:width="column.width"
:min-width="column.minWidth"
align="center"
:sortable="column.sortable"
:formatter="column.formatter"
:class-name="column.className"
:label-class-name="column.labelClassName"
>
<!-- 表头插槽 -->
<template slot="header" slot-scope="scope">
<span :style="{ fontSize: fontSize + 'px' }">{{column.label}}</span>
</template>
<!-- 表内容插槽 -->
<template slot-scope="scope">
<span :style="{ fontSize: fontSize + 'px' }">
<span>{{scope.row[column.value]|| "--"}}</span>
</span>
</template>
</el-table-column>
</template>
<template v-else>
<el-table-column
:key="index"
:show-overflow-tooltip="column.type === 'img' ? false : true"
:fixed="column.fixed"
:prop="column.value"
:label="column.label"
:sortable="column.sortable"
:width="column.width"
:min-width="column.minWidth"
align="center"
>
<!-- 表头插槽 -->
<template slot="header" slot-scope="scope">
<span :style="{ fontSize: fontSize + 'px' }">
{{
column.label
}}
</span>
</template>
<!-- 表内容插槽 -->
<template slot-scope="scope">
<!-- 按钮 -->
<template v-if="column.type === 'button' || column.operType === 'button'">
<!-- 按钮数组 -->
<template v-for="(op, opIndex) in column.operations">
<el-button
:key="opIndex"
:disabled="
op.formatter ? op.formatter(scope.row).disabled : false
"
:style="[{ fontSize: fontSize + 'px' }, op.style]"
:type="
op.formatter
? op.formatter(scope.row).type
: op.type || ''
"
:icon="op.icon"
@click="op.func(scope.row, scope.$index)"
>
{{
op.formatter
? op.formatter(scope.row).label
: op.label
? op.label
: scope.row[column.value]
}}
</el-button>
</template>
</template>
<!-- 图片 -->
<template v-if="column.type === 'img'">
<el-image
style="width: 100px; height: 100px"
:src="
scope.row[column.value]
? 'https://ds.cixincloud.com/geca-api' +
'/disease-data/file/info/' +
scope.row[column.value][0].bucketName +
'/' +
scope.row[column.value][0].uuidName
: ''
"
:preview-src-list="[
scope.row[column.value]
? 'https://ds.cixincloud.com/geca-api' +
'/disease-data/file/info/' +
scope.row[column.value][0].bucketName +
'/' +
scope.row[column.value][0].uuidName
: '',
]"
></el-image>
</template>
<!-- 文件 -->
<template v-if="column.type === 'file'">
<span>
{{
scope.row[column.value]
? scope.row[column.value][0].fileName
: ""
}}
</span>
</template>
<!-- html -->
<template v-if="column.type === 'html'">
<div class="highlight" v-html="scope.row[column.value]"></div>
</template>
<!-- switch切换 启用 -->
<template v-if="column.type === 'switch'">
<el-switch
v-model="scope.row[column.value]"
:active-value="1"
:inactive-value="0"
@change="column.func(scope.row, scope.$index)"
></el-switch>
</template>
</template>
</el-table-column>
</template>
</template>
</el-table>
<!-- 分页 -->
<div v-if="pageSize && totalCounts > 0" class="pagination-footer">
<!-- <span class="description">{{ description }}</span> -->
<el-pagination
background
:current-page="currentPage"
:page-sizes="pageSizes"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalCounts"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
></el-pagination>
</div>
</el-row>
</template>
<script>
import resize from "../TabComponents/resize.js"
import { mapGetters } from "vuex"
export default {
mixins: [resize],
props: {
tableHeight: Number, // 表格的高度
maxHeight: Number, // 表格的最大高度
listLoading: Boolean, // table 加载层
pageSizes: Array, // 决定每页显示的条数[10,15,20,25]
pageSize: Number,
totalCount: [Number, String], // 表格数据总数
currentPage: { type: Number, default: 1 },
highLight: { type: Boolean, default: true },
headerClass: { type: String, default: "default" }, // 头部背景色Class名称,默认default
columns: Array, // 表格列配置数据,{vlaue:对应数据对象中的属性,label:对应的是标题文字,fixed:列是否固定,width:列宽, sortable:是否可排序,formatter:列格式化, className:对应的是列的样式类名}
tableData: Array, // 表格数据
showIndex: { default: false }, // 是否展示索引
},
data() {
return {
httpPrefix:
process.env.NODE_ENV === "development"
? "/api"
: process.env.VUE_APP_BASE_API,
}
},
computed: {
...mapGetters({
fontSize: "table/fontSize",
}),
totalCounts() {
return this.totalCount - 0
},
},
watch: {},
mounted() {},
methods: {
// 切换页面显示条数
handleSizeChange(val) {
this.$emit("pageSizeChange", val)
},
// 跳转页码
handleCurrentChange(val) {
this.$emit("currentPageChange", val)
},
},
}
</script>
<style lang="scss" scoped>
.el-table__empty-block {
position: relative;
min-height: 60px;
text-align: center;
width: 100%;
height: 100%;
}
.el-table__empty-text {
position: absolute;
left: 50%;
width: 110px;
height: 110px;
top: 50%;
line-height: 220px;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: #5e7382;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
::v-deep {
.el-table {
thead {
.newHeader {
height: 60px;
background: #f6f6f6;
}
}
}
}
</style>
...@@ -160,8 +160,10 @@ ...@@ -160,8 +160,10 @@
filterable filterable
remote remote
reserve-keyword reserve-keyword
:multiple="item.multiple ? true : false"
:placeholder="item.placeholder" :placeholder="item.placeholder"
:remote-method="item.remoteFunc" :remote-method="item.remoteFunc"
v-el-select-loadmore="loadmore"
@change="item.func ? item.func($event) : {}" @change="item.func ? item.func($event) : {}"
> >
<el-option <el-option
...@@ -272,7 +274,7 @@ ...@@ -272,7 +274,7 @@
</div> </div>
<div slot="footer"> <div slot="footer">
<el-button size="medium" v-if="btnCancel" @click="visible = false" <el-button size="medium" v-if="btnCancel" @click="visible = false"
>取消</el-button > </el-button
> >
<el-button <el-button
size="medium" size="medium"
...@@ -281,6 +283,7 @@ ...@@ -281,6 +283,7 @@
@click="handleConfirm" @click="handleConfirm"
>{{ confirmText }}</el-button >{{ confirmText }}</el-button
> >
<slot name="otherButton" :form="form"></slot>
</div> </div>
</el-dialog> </el-dialog>
</template> </template>
...@@ -301,7 +304,7 @@ export default { ...@@ -301,7 +304,7 @@ export default {
props: { props: {
confirmText: { confirmText: {
type: String, type: String,
default: "确认", default: " ",
}, },
appendToBody: { appendToBody: {
type: Boolean, type: Boolean,
...@@ -331,6 +334,7 @@ export default { ...@@ -331,6 +334,7 @@ export default {
type: Boolean, type: Boolean,
default: true, default: true,
}, },
current: Number,
formData: { formData: {
type: Array, type: Array,
}, },
...@@ -349,7 +353,27 @@ export default { ...@@ -349,7 +353,27 @@ export default {
type: Array, type: Array,
}, },
}, },
directives: {
/** 下拉框懒加载 */
"el-select-loadmore": {
bind(el, binding) {
const SELECTWRAP_DOM = el.querySelector(
".el-select-dropdown .el-select-dropdown__wrap"
)
SELECTWRAP_DOM.addEventListener("scroll", function () {
const condition =
this.scrollHeight - this.scrollTop <= this.clientHeight
if (condition) {
binding.value()
}
})
},
},
},
methods: { methods: {
loadmore() {
this.$emit("loadMore", this.current + 1)
},
open() { open() {
this.visible = true this.visible = true
}, },
...@@ -489,9 +513,6 @@ export default { ...@@ -489,9 +513,6 @@ export default {
text-align: center; text-align: center;
} }
} }
.el-input-group__prepend {
padding: 0;
}
.input-with-input { .input-with-input {
.el-input-group__prepend { .el-input-group__prepend {
background-color: #ffffff; background-color: #ffffff;
......
<template> <template>
<el-row <el-row :gutter="options.gutter" class="form-content">
:gutter="options.gutter"
class="form-content"
:style="{
paddingLeft,
}"
>
<template <template
v-for="(item, columnIndex) in columns.column || columns.children.column" v-for="(item, columnIndex) in columns.column || columns.children.column"
> >
<div <div
v-if="item.type === 'dynamic'" v-if="item.type === 'dynamic'"
v-show="item.display"
:key="columnIndex" :key="columnIndex"
style="width: 100%" style="width: 100%"
v-show="item.display"
class="dynamic-form-container" class="dynamic-form-container"
> >
<el-form-item <el-form-item
:prop="item.prop" :prop="item.prop"
:label-width="'0px'" :label-width="'0px'"
style="display: none" style="display: none"
> ></el-form-item>
</el-form-item>
<div class="dynamic-form-container_lable">{{ item.label }}</div> <div class="dynamic-form-container_lable">{{ item.label }}</div>
<form-dynamic <form-dynamic
v-model="form[item.prop]"
:options="item.children" :options="item.children"
:dynamic-data="item.dynamicData" :dynamic-data="item.dynamicData"
:is-show-important="isShowImportant" :is-show-important="isShowImportant"
v-model="form[item.prop]"
></form-dynamic> ></form-dynamic>
</div> </div>
<div <div
v-else-if="item.type === 'group'" v-else-if="item.type === 'group'"
v-show="item.display"
:key="columnIndex" :key="columnIndex"
style="width: 100%" style="width: 100%"
v-show="item.display"
> >
<el-collapse :value="item.collapse ? item.prop : ''"> <el-collapse :value="item.collapse ? item.prop : ''">
<el-collapse-item <el-collapse-item
...@@ -56,20 +48,19 @@ ...@@ -56,20 +48,19 @@
<div <div
v-else-if="item.type === 'dental-tab'" v-else-if="item.type === 'dental-tab'"
v-show="item.display && isShowIm(item.importantField)"
:key="columnIndex" :key="columnIndex"
style="width: 100%" style="width: 100%"
v-show="item.display && isShowIm(item.importantField)"
> >
<el-form-item <el-form-item
:prop="item.prop" :prop="item.prop"
:label-width="'0px'" :label-width="'0px'"
style="display: none" style="display: none"
> ></el-form-item>
</el-form-item>
<dental-tab-form <dental-tab-form
ref="dental" ref="dental"
:item="item"
v-model="form[item.prop]" v-model="form[item.prop]"
:item="item"
:disabled="options.disabled" :disabled="options.disabled"
@change="handleChange" @change="handleChange"
></dental-tab-form> ></dental-tab-form>
...@@ -77,32 +68,32 @@ ...@@ -77,32 +68,32 @@
<div <div
v-else-if="item.type === 'dental-tab-tj'" v-else-if="item.type === 'dental-tab-tj'"
v-show="item.display && isShowIm(item.importantField)"
:key="columnIndex" :key="columnIndex"
style="width: 100%" style="width: 100%"
v-show="item.display && isShowIm(item.importantField)"
> >
<el-form-item <el-form-item
:prop="item.prop" :prop="item.prop"
:label-width="'0px'" :label-width="'0px'"
style="display: none" style="display: none"
> ></el-form-item>
</el-form-item>
<dental-tab-tj-form <dental-tab-tj-form
ref="dental" ref="dental"
:item="item"
v-model="form[item.prop]" v-model="form[item.prop]"
:item="item"
:disabled="options.disabled" :disabled="options.disabled"
></dental-tab-tj-form> ></dental-tab-tj-form>
</div> </div>
<el-col <el-col
v-else-if="item.type === 'title'" v-else-if="item.type === 'title'"
v-show="item.display"
:key="columnIndex"
class="row12"
:xs="item.xs || 24" :xs="item.xs || 24"
:sm="item.sm || 24" :sm="item.sm || 24"
:md="item.md || 24" :md="item.md || 24"
:lg="item.span || 12" :lg="item.span || 12"
:key="columnIndex"
v-show="item.display"
> >
<div class="form_title" :style="item.styles"> <div class="form_title" :style="item.styles">
<span>{{ item.value }}</span> <span>{{ item.value }}</span>
...@@ -111,19 +102,23 @@ ...@@ -111,19 +102,23 @@
<el-col <el-col
v-else v-else
v-show="item.display && isShowIm(item.importantField)"
:key="columnIndex"
class="row24"
:xs="item.xs || 24" :xs="item.xs || 24"
:sm="item.sm || 24" :sm="item.sm || 24"
:md="item.md || 24" :md="item.md || 24"
:lg="item.lg || item.span || 12" :lg="item.lg || item.span || 12"
:xl="item.span || 12" :xl="item.span || 12"
:key="columnIndex"
v-show="item.display && isShowIm(item.importantField)"
> >
<form-item-self <form-item-self
ref="formSelf"
:form="form" :form="form"
:column-index="columnIndex"
:item="item" :item="item"
:columns="columns.column || columns.children.column" :columns="columns.column || columns.children.column"
:group="options.group" :group="options.group"
@formChange="formChange"
></form-item-self> ></form-item-self>
</el-col> </el-col>
</template> </template>
...@@ -173,11 +168,6 @@ export default { ...@@ -173,11 +168,6 @@ export default {
data() { data() {
return {} return {}
}, },
methods: {
handleChange(key, val) {
if (this.form.hasOwnProperty(key)) this.form[key] = val
},
},
computed: { computed: {
isShowIm() { isShowIm() {
...@@ -190,10 +180,61 @@ export default { ...@@ -190,10 +180,61 @@ export default {
return columns.labelWidth ? `${columns.labelWidth}px` : "" return columns.labelWidth ? `${columns.labelWidth}px` : ""
}, },
}, },
methods: {
clearAge() {
for (let i = 0; i < this.$refs.formSelf.length; i++) {
this.$refs.formSelf[i].age = ""
}
},
handleChange(key, val) {
if (this.form.hasOwnProperty(key)) this.form[key] = val
},
// 切换不符合筛查条件的显示
formChange() {
// 入选,排除标准,一个填写是就不符合筛查条件
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]] == 1) {
flag++
}
}
if (this.form.is_know && this.form.is_know == 0) {
flag = 1
}
if (flag == 0) {
this.$emit("showError", false)
} else {
this.$emit("showError", true)
}
},
},
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.25s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active in <2.1.8 */ {
opacity: 0;
}
::v-deep {
.row24.el-col-lg-12 {
&:nth-child(2n) {
border-left: 1px solid #ccc;
}
}
}
.form-content ::v-deep { .form-content ::v-deep {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
...@@ -206,6 +247,8 @@ export default { ...@@ -206,6 +247,8 @@ export default {
.el-form-item__content { .el-form-item__content {
margin-left: 0 !important; margin-left: 0 !important;
flex: 1; flex: 1;
display: flex;
align-items: center;
} }
} }
} }
......
...@@ -67,7 +67,19 @@ ...@@ -67,7 +67,19 @@
:is-show-important="isShowImportant" :is-show-important="isShowImportant"
></form-dynamic> ></form-dynamic>
</div> </div>
<el-col
v-else-if="c.type === 'title'"
:xs="c.xs || 24"
:sm="c.sm || 24"
:md="c.md || 24"
:lg="c.span || 12"
:key="columnIndex"
v-show="c.display"
>
<div class="form_title" :style="c.styles">
<span>{{ c.value }}</span>
</div>
</el-col>
<el-col <el-col
:xs="c.xs || 24" :xs="c.xs || 24"
:sm="c.sm || 24" :sm="c.sm || 24"
......
<template> <template>
<el-row <el-row
class="custom-form-item"
:ref="item.prop" :ref="item.prop"
class="custom-form-item"
:style="item.styles" :style="item.styles"
:class="{ isDefects: defectsSet.includes(item.prop) }" :class="{ isDefects: defectsSet.includes(item.prop) }"
> >
<el-col :lg="item.width"> <el-col :lg="item.width" :style="{ height: item.type === 'upload' ? '116px' : '53px' }">
<el-form-item <div
v-if="
showIndex || (configForms && configForms.showIndex) || item.showIndex
"
:class="['formIndex', item.labelSuffix == '5' ? 'computeIndex' : '']"
>{{ item.labelSuffix || columnIndex + 1 }}</div>
<!-- <el-form-item
:label=" :label="
!hiddenLabel && item.label !hiddenLabel && item.label
? `${item.label}${item.labelSuffix || ''}` ? `${item.label}${item.labelSuffix || ''}`
: '' : ''
" "
:label-width="item.labelWidth ? `${item.labelWidth}px` : ''" :label-width="item.labelWidth ? `${item.labelWidth}px` : ''"
:prop="item.prop" :prop="item.prop"
:rules="item.rules" :rules="item.rules"
:class="isEmpty" :class="isEmpty"
>-->
<el-form-item
:label="!hiddenLabel && item.label ? `${item.label}` : ''"
:label-width="item.labelWidth ? `${item.labelWidth}px` : ''"
:prop="item.prop"
:rules="item.rules"
:class="isEmpty"
> >
<div class="flex"> <div class="flex">
<div> <div>
<el-upload-self
v-if="item.type === 'upload'"
v-model="form[item.prop]"
:btn-type="'text'"
v-bind="item"
:list-type="item.listType"
:upload-query="{ formId, patientId, prefix: item.prop }"
:accept="item.accept"
:limit="item.limit"
:disabled="item.disabled"
></el-upload-self>
<!-- 表单改文本 --> <!-- 表单改文本 -->
<template v-if="vwForm.detail"> <template v-else-if="getVwForm.detail">
<form-item-text :item="item" :form="form"></form-item-text> <form-item-text :item="item" :form="form" :union-list="unionList"></form-item-text>
</template> </template>
<!-- 可输入 -->
<template v-else> <template v-else>
<!-- 输入框 --> <!-- 输入框 -->
<el-input <el-input
:class="item.toothBit ? 'toothBit' : ''"
v-if="item.type === 'input'" v-if="item.type === 'input'"
v-model="form[item.prop]" v-model="form[item.prop]"
:class="item.prop == 'other_sickness' ? 'needlong' : item.readonly ? 'read-input' :''"
:readonly="item.readonly" :readonly="item.readonly"
:disabled="item.disabled" :disabled="item.disabled"
:placeholder=" :placeholder="item.disabled || item.readonly ? '':
item.placeholder || item.placeholder ||
` ${item.label ? '请输入' + item.label : ''}` ` ${item.label ? '请输入' + item.label : ''}`
" "
@blur="handleBlur"
:clearable="item.notClearable ? false : true" :clearable="item.notClearable ? false : true"
:maxlength=" :maxlength="
item.maxlength item.maxlength
...@@ -44,21 +68,25 @@ ...@@ -44,21 +68,25 @@
? '' ? ''
: item.fieldLength : item.fieldLength
" "
@blur="handleBlur"
> >
<!-- 牙位按钮 --> <!-- 牙位按钮 -->
<el-button <el-button
slot="append"
v-if="item.toothBit" v-if="item.toothBit"
@click="openToothBit" slot="append"
class="toothBit" class="toothBit"
>{{ item.append || "牙位" }}</el-button @click="openToothBit"
> >{{ item.append || "牙位" }}</el-button>
<template slot="append" v-else-if="item.append">{{ <template v-else-if="item.append" slot="append">
{{
item.append item.append
}}</template> }}
<template slot="prepend" v-if="item.prepend">{{ </template>
<template v-if="item.prepend" slot="prepend">
{{
item.prepend item.prepend
}}</template> }}
</template>
</el-input> </el-input>
<!-- 密码框 --> <!-- 密码框 -->
...@@ -70,7 +98,6 @@ ...@@ -70,7 +98,6 @@
:placeholder="item.placeholder || `请输入 ${item.label || ''}`" :placeholder="item.placeholder || `请输入 ${item.label || ''}`"
:readonly="item.readonly" :readonly="item.readonly"
:disabled="item.disabled" :disabled="item.disabled"
@blur="handleBlur"
:show-password="item.showPassword" :show-password="item.showPassword"
clearable clearable
:maxlength=" :maxlength="
...@@ -80,25 +107,29 @@ ...@@ -80,25 +107,29 @@
? '' ? ''
: item.fieldLength : item.fieldLength
" "
@blur="handleBlur"
> >
<template slot="append" v-if="item.append">{{ <template v-if="item.append" slot="append">
{{
item.append item.append
}}</template> }}
<template slot="prepend" v-if="item.prepend">{{ </template>
<template v-if="item.prepend" slot="prepend">
{{
item.prepend item.prepend
}}</template> }}
</template>
</el-input> </el-input>
<!-- 文本域 --> <!-- 文本域 -->
<template v-if="item.type === 'textarea'"> <template v-if="item.type === 'textarea'">
<el-input <el-input
v-model="form[item.prop]"
type="textarea" type="textarea"
:placeholder=" :placeholder="
item.placeholder || `请输入 ${item.label || ''}` item.placeholder || `请输入 ${item.label || ''}`
" "
@blur="handleBlur"
:autosize="{ minRows: item.minRows, maxRows: item.maxRows }" :autosize="{ minRows: item.minRows, maxRows: item.maxRows }"
v-model="form[item.prop]"
:minlength="item.minlength" :minlength="item.minlength"
:disabled="item.disabled" :disabled="item.disabled"
:maxlength=" :maxlength="
...@@ -109,6 +140,7 @@ ...@@ -109,6 +140,7 @@
: item.fieldLength : item.fieldLength
" "
:show-word-limit="item.showWordLimit" :show-word-limit="item.showWordLimit"
@blur="handleBlur"
></el-input> ></el-input>
</template> </template>
...@@ -125,32 +157,43 @@ ...@@ -125,32 +157,43 @@
:precision="item.precision" :precision="item.precision"
:min="item.minRows" :min="item.minRows"
:max="item.maxRows" :max="item.maxRows"
@blur="handleBlur"
style="display: table-cell" style="display: table-cell"
> @blur="handleBlur"
</el-input-number> ></el-input-number>
<span <span
v-if="item.append" v-if="item.append"
class="el-input-group__append" class="el-input-group__append"
style="line-height: 28px" style="line-height: 28px"
>{{ item.append }}</span >{{ item.append }}</span>
>
</div> </div>
<!-- 单选框 --> <!-- 单选框 -->
<el-radio-group <el-radio-group
v-if="item.type === 'radio'" v-if="item.type === 'radio' && !item.disabled"
@change="handleChange"
v-model="form[item.prop]" v-model="form[item.prop]"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange"
> >
<el-radio <el-radio
v-for="(opt, optIndex) in item.dicData" v-for="(opt, optIndex) in item.dicData"
:key="optIndex" :key="optIndex"
:label="opt.value" :label="opt.value"
>{{ opt.label }} >{{ opt.label }}</el-radio>
</el-radio>
</el-radio-group> </el-radio-group>
<!-- 单选框只读 -->
<div
v-for="(opt, optIndex) in item.dicData"
:key="optIndex"
v-else-if="item.type === 'radio' && item.disabled "
>
<el-radio
v-model="form[item.prop]"
:class="item.class ? item.class : item.disabled ? 'read-radio':''"
:label="opt.value"
v-show="opt.value == form[item.prop]"
@change="item.func ? item.func($event) : {}"
>{{ opt.label}}</el-radio>
</div>
<!-- 多选框 --> <!-- 多选框 -->
<template v-if="item.type === 'checkbox'"> <template v-if="item.type === 'checkbox'">
...@@ -163,18 +206,17 @@ ...@@ -163,18 +206,17 @@
v-for="(opt, optIndex) in item.dicData" v-for="(opt, optIndex) in item.dicData"
:key="optIndex" :key="optIndex"
:label="opt.value" :label="opt.value"
>{{ opt.label }} >{{ opt.label }}</el-checkbox>
</el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</template> </template>
<!-- 下拉框 --> <!-- 下拉框 -->
<template v-if="item.type === 'select'"> <template v-if="item.type === 'select'">
<el-select <el-select
v-model="form[item.prop]"
:clearable="item.clearable" :clearable="item.clearable"
:filterable="item.filterable" :filterable="item.filterable"
:disabled="item.disabled" :disabled="item.disabled"
v-model="form[item.prop]"
:placeholder=" :placeholder="
item.placeholder item.placeholder
? item.placeholder ? item.placeholder
...@@ -185,13 +227,22 @@ ...@@ -185,13 +227,22 @@
:multiple-limit="item.limit" :multiple-limit="item.limit"
@change="handleChange" @change="handleChange"
> >
<template v-if="item.prop == 'union_id'">
<el-option
v-for="(opt, optIndex) in unionList"
:key="optIndex"
:label="opt.unionName"
:value="opt.unionNo"
></el-option>
</template>
<template v-else>
<el-option <el-option
v-for="(opt, optIndex) in item.dicData" v-for="(opt, optIndex) in item.dicData"
:key="optIndex" :key="optIndex"
:label="opt.label" :label="opt.label"
:value="opt.value" :value="opt.value"
> ></el-option>
</el-option> </template>
</el-select> </el-select>
</template> </template>
<!-- 级联 --> <!-- 级联 -->
...@@ -205,8 +256,8 @@ ...@@ -205,8 +256,8 @@
:options="item.dicData" :options="item.dicData"
:show-all-levels="item.showAllLevels" :show-all-levels="item.showAllLevels"
:separator="item.separator" :separator="item.separator"
@change="handleChange"
style="width: 100%" style="width: 100%"
@change="handleChange"
></el-cascader> ></el-cascader>
<!-- 时间 --> <!-- 时间 -->
...@@ -217,16 +268,16 @@ ...@@ -217,16 +268,16 @@
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
:disabled="item.disabled" :disabled="item.disabled"
:class="item.disabled ? 'read-time' : ''"
style="width: 100%" style="width: 100%"
@change="handleChange"
clearable clearable
> @change="handleChange"
</el-time-picker> ></el-time-picker>
<!-- 时间范围 --> <!-- 时间范围 -->
<el-time-picker <el-time-picker
v-else-if="item.type === 'timerange'" v-else-if="item.type === 'timerange'"
is-range
v-model="form[item.prop]" v-model="form[item.prop]"
is-range
range-separator="至" range-separator="至"
:start-placeholder="item.startPlaceholder" :start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder" :end-placeholder="item.endPlaceholder"
...@@ -234,95 +285,99 @@ ...@@ -234,95 +285,99 @@
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange" :class="item.disabled ? 'read-time' : ''"
clearable clearable
> @change="handleChange"
</el-time-picker> ></el-time-picker>
<!-- 日期 --> <!-- 日期 -->
<el-date-picker <div
v-else-if="item.type === 'date'" v-else-if="item.type === 'date'"
class="flex"
:class="item.disabled ? 'read-time' : ''"
>
<el-date-picker
v-model="form[item.prop]" v-model="form[item.prop]"
:placeholder="item.placeholder ? item.placeholder : '请选择'" :placeholder="item.placeholder ? item.placeholder : item.disabled ? '':'请选择'"
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange"
clearable clearable
> @change="handleChange"
</el-date-picker> ></el-date-picker>
<span
v-if="item.prop == 'birthday'"
style="margin-left: 12px"
>{{ age + (age ? "岁" : "") }}</span>
</div>
<!-- 年 --> <!-- 年 -->
<el-date-picker <el-date-picker
v-else-if="item.type === 'year'" v-else-if="item.type === 'year'"
type="year"
v-model="form[item.prop]" v-model="form[item.prop]"
type="year"
:placeholder="item.placeholder ? item.placeholder : '请选择'" :placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange"
clearable clearable
> @change="handleChange"
</el-date-picker> ></el-date-picker>
<!-- 月 --> <!-- 月 -->
<el-date-picker <el-date-picker
type="month"
v-else-if="item.type === 'month'" v-else-if="item.type === 'month'"
v-model="form[item.prop]" v-model="form[item.prop]"
type="month"
:placeholder="item.placeholder ? item.placeholder : '请选择'" :placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange"
clearable clearable
> @change="handleChange"
</el-date-picker> ></el-date-picker>
<!-- 周 --> <!-- 周 -->
<el-date-picker <el-date-picker
type="week"
v-else-if="item.type === 'week'" v-else-if="item.type === 'week'"
v-model="form[item.prop]" v-model="form[item.prop]"
type="week"
:placeholder="item.placeholder ? item.placeholder : '请选择'" :placeholder="item.placeholder ? item.placeholder : '请选择'"
:value-format="item.valueFormat || 'yyyy-ww'" :value-format="item.valueFormat || 'yyyy-ww'"
:format="item.format || 'yyyy 第 WW 周'" :format="item.format || 'yyyy 第 WW 周'"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange"
clearable clearable
> @change="handleChange"
</el-date-picker> ></el-date-picker>
<!-- 日期范围 --> <!-- 日期范围 -->
<el-date-picker <el-date-picker
v-else-if="item.type === 'daterange'" v-else-if="item.type === 'daterange'"
v-model="form[item.prop]"
type="daterange" type="daterange"
range-separator="至" range-separator="至"
:start-placeholder="item.startPlaceholder" :start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder" :end-placeholder="item.endPlaceholder"
:unlink-panels="item.unlinkPanels" :unlink-panels="item.unlinkPanels"
v-model="form[item.prop]"
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
:disabled="item.disabled" :disabled="item.disabled"
@change="handleChange"
clearable clearable
> @change="handleChange"
</el-date-picker> ></el-date-picker>
<!-- 日期时间 --> <!-- 日期时间 -->
<el-date-picker <el-date-picker
v-model="form[item.prop]"
v-else-if="item.type === 'datetime'" v-else-if="item.type === 'datetime'"
v-model="form[item.prop]"
type="datetime" type="datetime"
:placeholder="item.placeholder ? item.placeholder : '请选择'" :placeholder="item.placeholder ? item.placeholder : item.disabled ? '':'请选择'"
clearable clearable
:disabled="item.disabled" :disabled="item.disabled"
:class="item.disabled ? 'read-time' : ''"
:picker-options="pickerOptions" :picker-options="pickerOptions"
:value-format="item.valueFormat" :value-format="item.valueFormat"
:format="item.format" :format="item.format"
@change="handleChange" @change="handleChange"
> ></el-date-picker>
</el-date-picker>
<!-- 日期时间范围 --> <!-- 日期时间范围 -->
<el-date-picker <el-date-picker
...@@ -339,30 +394,22 @@ ...@@ -339,30 +394,22 @@
:format="item.format" :format="item.format"
align="right" align="right"
@change="handleChange" @change="handleChange"
> ></el-date-picker>
</el-date-picker>
</template> </template>
<el-upload-self
v-if="item.type === 'upload'"
v-bind="item"
v-model="form[item.prop]"
:disabled="item.disabled"
></el-upload-self>
</div> </div>
<span <span
v-if="item.importantField && !getVwForm.detail"
class="important_field" class="important_field"
v-if="item.importantField && !vwForm.detail" >{{ item.importantFieldDesc || "*" }}</span>
>{{ item.importantFieldDesc || "*" }}</span
>
</div> </div>
</el-form-item> </el-form-item>
</el-col> </el-col>
<dialog-tooth-bit <dialog-tooth-bit
v-if="item.toothBit" v-if="item.toothBit"
ref="dialog" ref="dialog"
v-model="form[item.prop]"
append-to-body append-to-body
title="牙位选择" title="牙位选择"
v-model="form[item.prop]"
></dialog-tooth-bit> ></dialog-tooth-bit>
</el-row> </el-row>
</template> </template>
...@@ -371,7 +418,7 @@ ...@@ -371,7 +418,7 @@
/** /**
* @description 自定义单组件 * @description 自定义单组件
*/ */
import { getMedicalunionList } from "@/api/medicalunion-management"
import ElUploadSelf from "@/components/Upload" import ElUploadSelf from "@/components/Upload"
import FormItemText from "./FormItemText" import FormItemText from "./FormItemText"
import DialogToothBit from "./DialogToothBit" import DialogToothBit from "./DialogToothBit"
...@@ -382,13 +429,25 @@ export default { ...@@ -382,13 +429,25 @@ export default {
name: "FormItemSelf", name: "FormItemSelf",
components: { ElUploadSelf, FormItemText, DialogToothBit }, components: { ElUploadSelf, FormItemText, DialogToothBit },
inject: { inject: {
vwForm: { showIndex: {
default: {}, default: false,
},
vwForm: {},
formId: {
default: () => "",
},
getPatientId: {
type: Function,
default: () => {},
}, },
getDefectsSet: { getDefectsSet: {
type: Function, type: Function,
default: () => {}, default: () => {},
}, },
configForms: {
type: Function,
default: () => {},
},
}, },
props: { props: {
item: { item: {
...@@ -402,20 +461,26 @@ export default { ...@@ -402,20 +461,26 @@ export default {
default: false, default: false,
}, },
columns: Array, columns: Array,
columnIndex: Number,
group: Array, group: Array,
type: String,
}, },
data() { data() {
return { return {
age: "",
pickerOptions, pickerOptions,
rangeOptions, rangeOptions,
unionList: [],
showChildren: false, // 用来控制不同表单
} }
}, },
computed: { computed: {
getVwForm() {
return this.vwForm()
},
//重要字段空数据且填写表单时添加重点 //重要字段空数据且填写表单时添加重点
isEmpty() { isEmpty() {
const { importantField, prop } = this.item const { importantField, prop } = this.item
if (!importantField || this.vwForm.detail) return "" if (!importantField || this.getVwForm.detail) return ""
const value = this.form[prop] // [] const value = this.form[prop] // []
let empty = !value let empty = !value
...@@ -428,8 +493,52 @@ export default { ...@@ -428,8 +493,52 @@ export default {
defectsSet() { defectsSet() {
return this.getDefectsSet ? this.getDefectsSet() : [] return this.getDefectsSet ? this.getDefectsSet() : []
}, },
patientId() {
return this.getPatientId ? this.getPatientId() : ""
},
},
created() {
this.timerangeReset()
this.numberReset()
this.checkboxReset()
//! 处理医联体名称,新增直接请求,其他等union_id后再请求
if (this.item.prop == "union_id") {
this.unionList = []
// this.getMedicalunionList()
if (this.$route.path == "/screening/add") {
this.getMedicalunionList()
} else {
this.$watch(
() => this.form[this.item.prop],
(newVal, oldVal) => {
// console.log("----------有值----------")
this.getMedicalunionList()
// 做点什么
}
)
}
}
},
mounted() {
this.showFormItem()
},
beforeDestroy() {
this.$watch(
() => this.form[this.item.prop],
(newVal, oldVal) => {}
)
}, },
methods: { methods: {
// 获取医联体列表
getMedicalunionList() {
getMedicalunionList().then((res) => {
if (res.code == 1) {
this.unionList = [...res.data]
} else {
this.unionList = []
}
})
},
scrollToView() { scrollToView() {
if (this.$refs["JY_LCYY"]) { if (this.$refs["JY_LCYY"]) {
this.$refs["JY_LCYY"].$el.scrollIntoView({ behavior: "smooth" }) this.$refs["JY_LCYY"].$el.scrollIntoView({ behavior: "smooth" })
...@@ -565,6 +674,24 @@ export default { ...@@ -565,6 +674,24 @@ export default {
} }
val && this.$set(this.form, ruleTarget, val) val && this.$set(this.form, ruleTarget, val)
}, },
// 根据生日设置年龄回显
getAge() {
if (this.form.birthday) {
var birthday = new Date(this.form.birthday.replace(/-/g, "/"))
var d = new Date()
var age =
d.getFullYear() -
birthday.getFullYear() -
(d.getMonth() < birthday.getMonth() ||
(d.getMonth() == birthday.getMonth() &&
d.getDate() < birthday.getDate())
? 1
: 0)
this.age = age + ""
} else {
this.age = ""
}
},
// 获取prop prop 以{}包裹 // 获取prop prop 以{}包裹
getProp(value) { getProp(value) {
if (!value) return "" if (!value) return ""
...@@ -585,10 +712,18 @@ export default { ...@@ -585,10 +712,18 @@ export default {
if (dynamicshSet && dynamicshSet.length > 0) { if (dynamicshSet && dynamicshSet.length > 0) {
this.$watch( this.$watch(
`form.${prop}`, `form.${prop}`,
function (val) { (val) => {
//! val 表单的当前属性值
const columns = this.columns || [] const columns = this.columns || []
const group = this.group || [] const group = this.group || []
const dyMap = {} // 显示数据集合 const dyMap = {} //! 显示数据集合
let filterArr = [
"early_esophagus_cancer",
"period_esophagus_cancer",
"early_gastric_cancer",
"pathology_path",
"esophagus_level",
]
dynamicshSet.forEach((dy) => { dynamicshSet.forEach((dy) => {
if (dyMap[dy.target]) { if (dyMap[dy.target]) {
dyMap[dy.target].push(dy.value) dyMap[dy.target].push(dy.value)
...@@ -596,21 +731,80 @@ export default { ...@@ -596,21 +731,80 @@ export default {
dyMap[dy.target] = [dy.value] dyMap[dy.target] = [dy.value]
} }
}) })
Object.keys(dyMap).forEach((key) => { Object.keys(dyMap).forEach((key) => {
// !获取显隐目标
let targetItem = columns.find((_) => _.prop === key) let targetItem = columns.find((_) => _.prop === key)
if (!targetItem) { if (!targetItem) {
// !没有在表单子组件中找到,查找大表单id
targetItem = group.find((_) => _.prop === key) targetItem = group.find((_) => _.prop === key)
} }
//没有找到再细化查找
if (!targetItem) {
group.forEach((_) =>{
if(_.column){
_.column.find((item)=> {
if(item.prop === key){
targetItem = item
return
}
else{
if(item.children && item.children.column){
targetItem = item.children.column.find((e)=> e.prop=== key)
}
}
})
}
})
}
if (!targetItem) return if (!targetItem) return
const values = dyMap[key]
let display = false let display = false
const values = dyMap[key]
if (Array.isArray(val)) { if (Array.isArray(val)) {
display = values.filter((v) => val.includes(v)).length > 0 display = values.filter((v) => val.includes(v)).length > 0
} else { } else {
display = values.includes(val) display = values.includes(val + "")
} }
//! 胃上皮瘤变(高级别)胃癌和进展性胃癌控制显隐+自定义规则
if (
prop == "early_gastric_cancer" ||
prop == "period_gastric_cancer" ||
prop == "inogm_level"
) {
let flag = false
this.form.inogm_level == "high" ? (flag = true) : (flag = false)
if (!flag) {
if (this.form.early_gastric_cancer) {
this.form.early_gastric_cancer.length > 0
? (flag = true)
: (flag = false)
}
}
if (!flag) {
if (this.form.period_gastric_cancer) {
this.form.period_gastric_cancer.length > 0
? (flag = true)
: (flag = false)
}
}
// console.log(flag, targetItem)
display = flag
if (display) {
targetItem.rules = [
{
required: true,
message: "请上传病理报告",
},
]
} else {
if (targetItem.rules.length > 0) {
targetItem.rules[0].required = false
}
}
}
if (!display && targetItem) { if (!display && targetItem) {
// 清空数据 // 清空数据
const newVal = Array.isArray(this.form[targetItem.prop]) const newVal = Array.isArray(this.form[targetItem.prop])
...@@ -620,13 +814,72 @@ export default { ...@@ -620,13 +814,72 @@ export default {
: "" : ""
this.$set(this.form, targetItem.prop, newVal) this.$set(this.form, targetItem.prop, newVal)
} }
if (this.type === "form") { if (this.type === "form") {
// 动态表格、表单处理 // 动态表格、表单处理
setTimeout(() => { setTimeout(() => {
this.$set(this.form, "$_hidden" + targetItem.prop, !display) this.$set(this.form, "$_hidden" + targetItem.prop, !display)
}, 200) }, 200)
} else { } else {
// ! 设置每个表单中每项的rules
if (!filterArr.includes(targetItem.prop)) {
if (targetItem.rules && Boolean(display)) {
if (targetItem.type == "checkbox") {
targetItem.rules = [
{
required: true,
message: "请选择" + targetItem.label,
},
]
} else {
targetItem.rules = [
{
required: true,
message: "请输入" + targetItem.label,
},
]
}
} else if (targetItem.rules && !Boolean(display)) {
targetItem.rules = []
}
}
// !设置大表单里的每个小表单rules
if (targetItem.prop == "1669874397313_56690") {
console.log(display)
// !只能写死,当前情况下,定义一个字段用来缓存是否回显,根据val
// if (val == 0) {
// this.showChildren = false
targetItem.column.forEach((e, index) => {
// 去除esd报告
if (e.prop == "esd_path") {
return
}
// console.log(e.label, ":", e.rules)
if (e.rules && val == 0) {
targetItem.column[index].rules = []
} else if (e.rules && val == 1) {
if (filterArr.includes(targetItem.column[index].prop)) {
return
}
if (targetItem.column[index].type == "checkbox") {
targetItem.column[index].rules = [
{
required: true,
message: "请选择" + targetItem.column[index].label,
},
]
} else {
targetItem.column[index].rules = [
{
required: true,
message: "请输入" + targetItem.column[index].label,
},
]
}
}
})
}
this.$set(targetItem, "display", Boolean(display)) this.$set(targetItem, "display", Boolean(display))
} }
}) })
...@@ -641,31 +894,49 @@ export default { ...@@ -641,31 +894,49 @@ export default {
handleBlur() { handleBlur() {
this.handleAlgorithm() this.handleAlgorithm()
}, },
// 每个表单值改变的方法
handleChange(val) { handleChange(val) {
this.checkboxRepel(val) this.checkboxRepel(val)
this.handleAlgorithm() this.handleAlgorithm()
// !设置年龄
if (this.item.prop == "birthday") {
this.getAge()
}
// 该操作判断是否符合筛查条件
this.$emit("formChange")
// ['is_one_year','is_subtotal_history','is_ppi','is_symptom','is_subtotal_history','is_disease','is_tumour']
}, },
}, },
created() {
this.timerangeReset()
this.numberReset()
this.checkboxReset()
},
mounted() {
this.showFormItem()
},
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.custom-form-item { .custom-form-item {
background: white; background: white;
margin: 3px; border-bottom: 1px solid #ccc;
// margin: 3px;
.el-col {
height: 100%;
display: flex;
align-items: center;
}
.formIndex {
min-width: 53px;
height: 100%;
background: #fafafa;
border-right: 1px solid #ccc;
font-size: 14px;
justify-content: center;
display: flex;
align-items: center;
// margin-right: 20px;
}
&.isDefects { &.isDefects {
border: 1px solid red; border: 1px solid red;
} }
::v-deep .el-form-item { ::v-deep .el-form-item {
padding: 10px 2px; padding: 10px 0 10px 20px;
margin-bottom: 0px; margin-bottom: 0px;
} }
.toothBit { .toothBit {
...@@ -755,7 +1026,7 @@ export default { ...@@ -755,7 +1026,7 @@ export default {
.empty-tip { .empty-tip {
::v-deep .el-form-item__label { ::v-deep .el-form-item__label {
color: red; color: #333333;
} }
} }
...@@ -785,4 +1056,7 @@ export default { ...@@ -785,4 +1056,7 @@ export default {
} }
} }
} }
::v-deep .needlong {
width: 260px !important;
}
</style> </style>
<template> <template>
<div class="form-item-text"> <div class="form-item-text">
<template v-if="form[item.prop]"> <template v-if="String(form[item.prop])">
<span v-if="item.prepend">{{ item.prepend }}</span> <span v-if="item.prepend">{{ item.prepend }}</span>
<span style="margin: 0 5px">{{ <span>
form[item.prop] | getItemText(item.dicData, item.type) <span
v-if="item.prop == 'risk_rank'"
:style="{
color:
form[item.prop] == 'medium'
? '#FF9F33'
: form[item.prop] == 'low'
? 'green'
: form[item.prop] == 'high'
? 'red'
: '',
}"
>
{{ riskRank[form[item.prop]] }}
</span>
<span
v-else-if="item.prop == 'screening_advise'"
style="color: #4e68ff"
>
{{ screeningAdvise[form[item.prop]] }}
</span>
<span v-else-if="item.prop == 'union_id'">
{{ unionName }}
</span>
<span v-else style="margin: 0 5px">{{
String(form[item.prop]) | getItemText(item.dicData, item.type)
}}</span> }}</span>
</span>
<span v-if="item.append && !item.toothBit" class="append">{{ <span v-if="item.append && !item.toothBit" class="append">{{
item.append item.append
}}</span> }}</span>
</template> </template>
<template v-else> -- </template>
</div> </div>
</template> </template>
...@@ -19,9 +46,22 @@ export default { ...@@ -19,9 +46,22 @@ export default {
props: { props: {
item: Object, item: Object,
form: Object | Array, form: Object | Array,
unionList: Array,
}, },
data() { data() {
return {} return {
riskRank: {
low: "低危",
medium: "中危",
high: "高危",
},
unionName: "",
screeningAdvise: {
1: "可定期随访",
2: "推荐胶囊内镜或胃镜检查",
3: "强烈推荐胶囊内镜或胃镜检查",
},
}
}, },
filters: { filters: {
getItemText(val, list, type) { getItemText(val, list, type) {
...@@ -35,6 +75,16 @@ export default { ...@@ -35,6 +75,16 @@ export default {
return val return val
}, },
}, },
watch: {
unionList(v) {
if (v.length > 0 && this.form[this.item.prop]) {
// console.log("获取到了医联体列表", this.form[this.item.prop])
this.unionName = v.filter(
(e) => e.unionNo == this.form[this.item.prop]
)[0].unionName
}
},
},
} }
</script> </script>
<style scoped> <style scoped>
......
...@@ -2,17 +2,18 @@ ...@@ -2,17 +2,18 @@
<el-form <el-form
ref="form" ref="form"
:model="form" :model="form"
inline-message
:disabled="options.disabled" :disabled="options.disabled"
:label-position="options.labelPosition || 'left'" :label-position="options.labelPosition || 'left'"
:label-width="(options.labelWidth || 100) + 'px'" :label-width="(options.labelWidth || 100) + 'px'"
:size="size" :size="size"
@submit.native.prevent="handleConfirm()"
:style="formStyle" :style="formStyle"
class="avue-form-self" class="avue-form-self"
@submit.native.prevent="handleConfirm()"
> >
<template v-if="options.column && options.column.length > 0"> <template v-if="options.column && options.column.length > 0">
<form-content <form-content
ref="form-content" ref="formContent"
:form="form" :form="form"
:columns="{ column: options.column }" :columns="{ column: options.column }"
:options="options" :options="options"
...@@ -22,13 +23,13 @@ ...@@ -22,13 +23,13 @@
<template v-if="options.group && options.group.length > 0"> <template v-if="options.group && options.group.length > 0">
<el-tabs v-if="options.tabs" v-model="activeName" type="card"> <el-tabs v-if="options.tabs" v-model="activeName" type="card">
<el-tab-pane <el-tab-pane
:label="g.label || `标签${gIndex + 1}`"
:name="`${gIndex}`"
v-for="(g, gIndex) in options.group" v-for="(g, gIndex) in options.group"
:key="gIndex" :key="gIndex"
:label="g.label || `标签${gIndex + 1}`"
:name="`${gIndex}`"
> >
<form-content <form-content
ref="form-content" ref="formContent"
:form="form" :form="form"
:columns="g" :columns="g"
:options="options" :options="options"
...@@ -36,40 +37,58 @@ ...@@ -36,40 +37,58 @@
></form-content> ></form-content>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<!-- 表单的折叠组件 -->
<el-collapse v-model="collapseNames" v-else> <el-collapse v-else v-model="collapseNames">
<template v-for="(g, gIndex) in options.group"> <template v-for="(g, gIndex) in options.group">
<el-collapse-item <el-collapse-item
:title="g.label"
:name="g.prop"
:key="gIndex"
v-show="g.display" v-show="g.display"
:key="gIndex"
:name="g.prop"
:disabled="!g.arrow" :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 <form-content
v-if="collapseNames.includes(g.prop)" v-if="collapseNames.includes(g.prop)"
ref="form-content" ref="formContent"
:form="form" :form="form"
:columns="g" :columns="g"
:options="options" :options="options"
:is-show-important="isShowImportant" :is-show-important="isShowImportant"
@showError="showError"
></form-content> ></form-content>
</el-collapse-item> </el-collapse-item>
</template> </template>
</el-collapse> </el-collapse>
</template> </template>
<div class="form-footer"> <div v-if="!options.closeBtn" class="form-footer">
<template v-if="options.menuBtn"> <template v-if="options.menuBtn">
<template v-if="options.prevBtn">
<el-button
type="primary"
:loading="loading"
size="large"
:disabled="disabled"
@click="onPrev"
>上一步</el-button
>
</template>
<!-- 下一步按钮 -->
<template v-if="options.submitBtn"> <template v-if="options.submitBtn">
<el-button <el-button
type="primary" type="primary"
icon="el-icon-check" :icon="options.submitText == '提交' ? 'el-icon-check' : ''"
@click="handleConfirm"
:loading="loading" :loading="loading"
size="large" size="large"
:disabled="disabled"
@click="handleConfirm"
>{{ options.submitText || "提交" }}</el-button
> >
{{ options.submitText || "提交" }}
</el-button>
</template> </template>
<template v-if="options.emptyBtn"> <template v-if="options.emptyBtn">
<el-button <el-button
...@@ -77,9 +96,8 @@ ...@@ -77,9 +96,8 @@
icon="el-icon-delete " icon="el-icon-delete "
size="large" size="large"
@click="resetForm(true)" @click="resetForm(true)"
>{{ options.emptyText || "清空" }}</el-button
> >
{{ options.emptyText || "清空" }}
</el-button>
</template> </template>
</template> </template>
<template v-if="nextTabBtnShow"> <template v-if="nextTabBtnShow">
...@@ -89,9 +107,8 @@ ...@@ -89,9 +107,8 @@
icon="el-icon-caret-right" icon="el-icon-caret-right"
size="large" size="large"
@click="nextTab" @click="nextTab"
>{{ options.nextTabText || "下一页" }}</el-button
> >
{{ options.nextTabText || "下一页" }}
</el-button>
</el-form> </el-form>
</template> </template>
</div> </div>
...@@ -108,8 +125,10 @@ import { isObject } from "@/utils/validate" ...@@ -108,8 +125,10 @@ import { isObject } from "@/utils/validate"
export default { export default {
name: "CustomForm", name: "CustomForm",
components: { FormContent }, components: { FormContent },
mixins: [handleFormData],
props: { props: {
options: { //配置 数据 options: {
//配置 数据
type: Object, type: Object,
default: () => { default: () => {
return {} return {}
...@@ -125,18 +144,19 @@ export default { ...@@ -125,18 +144,19 @@ export default {
}, },
}, },
provide() { provide() {
return {
vwForm: () => {
const vwForm = {} const vwForm = {}
for (const k in this.options) { for (const k in this.options) {
if (k !== "column" && k !== "group") { if (k !== "column" && k !== "group") {
vwForm[k] = this.options[k] vwForm[k] = this.options[k]
} }
} }
return vwForm
return { },
vwForm, // formId: "",
} }
}, },
mixins: [handleFormData],
data() { data() {
return { return {
collapseNames: [], collapseNames: [],
...@@ -144,17 +164,70 @@ export default { ...@@ -144,17 +164,70 @@ export default {
loading: false, loading: false,
isShowImportant: false, isShowImportant: false,
form: {}, form: {},
errorText: "",
disabled: false,
}
},
computed: {
nextTabBtnShow() {
const { nextTabBtn, tabs, group } = this.options
return tabs && group && group.length > 1 && nextTabBtn
},
},
watch: {
formEdit: {
handler() {
// console.log("configforms:", this.formEdit)
this.initfields(this.formEdit)
},
},
},
created() {
this.initforms()
this.$nextTick(() => {
// this.setformWatch(this.options, "form")
})
},
mounted() {
// 处理computeIndex
let domArr = document.querySelectorAll(".computeIndex")
for (let i = 0; i < domArr.length; i++) {
domArr[i].style.height = "54px"
domArr[i].innerHTML = ""
if ((domArr.length - 1) / i == 2) {
domArr[i].innerHTML = "6"
}
if (i == domArr.length - 1) {
domArr[i].style.height = "53px"
}
} }
}, },
methods: { methods: {
clearAge() {
// 去除年龄文本
for (let i = 0; i < this.$refs.formContent.length; i++) {
this.$refs.formContent[i].clearAge()
}
},
// 显示不符合筛查条件
showError(data) {
if (data) {
this.disabled = true
this.errorText = "不符合筛查条件"
} else {
this.disabled = false
this.errorText = ""
}
},
nextTab() { nextTab() {
this.initforms()
const tabsLen = this.options.group.length const tabsLen = this.options.group.length
let active = Number(this.activeName) let active = Number(this.activeName)
let next = ++active let next = ++active
if (next >= tabsLen) next = 0 if (next >= tabsLen) next = 0
this.activeName = String(next) this.activeName = String(next)
this.$emit("scrollTop") this.$emit("scrollTop")
console.log(this.activeName)
}, },
imFieldChange(val = false) { imFieldChange(val = false) {
...@@ -191,7 +264,54 @@ export default { ...@@ -191,7 +264,54 @@ export default {
func(valid, () => {}) func(valid, () => {})
}) })
}, },
onPrev() {
this.$emit("onPrev", () => {
// 完成之后的回调
this.loading = false
})
},
// 临时保存
temporarySave() {
//? 只传数据 获取当前步数,如果个人信息已经提交可以临时保存
// 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("temporaryConfirm", data, () => {
// 完成之后的回调
this.loading = false
})
// } else {
// this.loading = false
// }
// })
},
handleConfirm() { handleConfirm() {
this.loading = true this.loading = true
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
...@@ -224,6 +344,7 @@ export default { ...@@ -224,6 +344,7 @@ export default {
} }
}) })
this.$emit("handleConfirm", data, () => { this.$emit("handleConfirm", data, () => {
// 完成之后的回调
this.loading = false this.loading = false
}) })
} else { } else {
...@@ -287,30 +408,11 @@ export default { ...@@ -287,30 +408,11 @@ export default {
// 绑定部分值(此时表单已渲染) // 绑定部分值(此时表单已渲染)
initfields(obj) { initfields(obj) {
for (let k in obj) { for (let k in obj) {
if (this.form.hasOwnProperty(k)) { // if (this.form.hasOwnProperty(k)) {
this.form[k] = obj[k] this.form[k] = obj[k]
// }
} }
}
},
}, },
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")
})
}, },
} }
</script> </script>
...@@ -318,20 +420,38 @@ export default { ...@@ -318,20 +420,38 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.avue-form-self { .avue-form-self {
padding: 0 11px; padding: 0 11px;
::v-deep .el-collapse { ::v-deep .el-collapse {
border: none; border: none;
.el-collapse-item {
.el-collapse-item__header.is-active { &:nth-child(1) {
border-bottom-color: #ebeef5; border-top: 1px solid #cccccc;
}
}
.el-collapse-item__content {
padding-bottom: 0px;
}
.el-collapse-item__header {
border-radius: 4px;
background: #fafafa;
padding-left: 20px;
border: 1px solid #cccccc;
border-bottom-color: #ccc;
border-top: 0px;
font-size: 14px;
font-family: AlibabaPuHuiTiM;
color: #333333;
} }
.el-collapse-item__wrap { .el-collapse-item__wrap {
border: none; border: none;
padding: 10px; padding: 10px;
&:hover { border-left: 1px solid #cccccc;
background-color: #ecf8ff; border-right: 1px solid #cccccc;
outline: 1px dashed #ccc; // border-bottom: 1px solid #cccccc !important;
} padding: 0px;
// &:hover {
// background-color: #ecf8ff;
// outline: 1px dashed #ccc;
// }
} }
.el-collapse-item__header { .el-collapse-item__header {
font-size: 16px; font-size: 16px;
...@@ -342,7 +462,12 @@ export default { ...@@ -342,7 +462,12 @@ export default {
} }
} }
.form-footer { .form-footer {
// position: absolute;
// left: 50%;
// transform: translateX(-50%);
// bottom: -50px;
margin-top: 20px; margin-top: 20px;
margin-bottom: 20px;
text-align: center; text-align: center;
} }
} }
...@@ -352,4 +477,20 @@ export default { ...@@ -352,4 +477,20 @@ export default {
// background-color: $base-color-default; // background-color: $base-color-default;
// border-color: $base-color-default; // border-color: $base-color-default;
} }
.noCol {
font-size: 12px;
margin-left: 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> </style>
let formJson = {
column: [],
labelPosition: "right",
labelSuffix: "",
labelWidth: 180,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: "下一步",
emptyBtn: false,
emptyText: "清空",
nextTabBtn: true,
nextTabText: "下一页",
menuPosition: "center",
prevBtn: true,
group: [
{
label: "实验室检查",
prop: "1669789802778_28648",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "G_17",
label: "胃泌素17",
fieldType: "varchar",
fieldLength: "255",
tableName: "实验室检查",
tableCode: "gas_exam",
tableId: "1597466741234040833",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
required: true,
rules: [{ required: true, message: "胃泌素17必须填写" }],
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "PG_I",
label: "胃蛋白酶原I(PG I)",
fieldType: "varchar",
fieldLength: "255",
tableName: "实验室检查",
tableCode: "gas_exam",
tableId: "1597466741234040833",
notFilter: false,
cType: "",
subfield: false,
rules: [{ required: true, message: "胃蛋白酶原I(PG I)必须填写" }],
required: true,
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "PG_II",
label: "胃蛋白酶原II(PG II)",
fieldType: "varchar",
fieldLength: "255",
tableName: "实验室检查",
tableCode: "gas_exam",
tableId: "1597466741234040833",
notFilter: false,
cType: "",
subfield: false,
rules: [{ required: true, message: "胃蛋白酶原II(PG II)必须填写" }],
required: true,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
prop: "IgG",
label: "Hp抗体(IgG)检测",
fieldType: "varchar",
fieldLength: "255",
tableName: "实验室检查",
tableCode: "gas_exam",
tableId: "1597466741234040833",
notFilter: false,
cType: "",
subfield: false,
dicData: [
{
label: "阳性",
value: "2",
id: "1598150992287858689",
parentId: "",
},
{
label: "阴性",
value: "1",
id: "1598150963816923138",
parentId: "",
},
],
dynamicshSet: [],
dicType: "hp_antibody",
props: { label: "label", value: "value" },
disabled: false,
required: true,
rules: [{ required: true, message: "请选择Hp抗体(IgG)检测" }],
},
{
type: "upload",
display: true,
importantField: false,
styles: {},
prop: "patient_avatar",
label: "血检报告单",
fieldType: "varchar",
fieldLength: "10",
showFileList: true,
multiple: true,
bucketName: "pacs",
limit: 5,
dicType: "",
tableName: "附件",
tableCode: "gas_attachment",
tableId: "1595978031963398145",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
listType: "picture-card",
required: true,
rules: [{ required: true, message: "血检报告单必须填写" }],
lg: 24,
width: 24,
xs: 24,
sm: 24,
span: 24,
md: 24,
},
{
type: "upload",
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: "exam_img",
label: "实验室报告",
required: true,
rules: [{ required: true, message: "实验室报告必须填写" }],
showFileList: true,
multiple: true,
bucketName: "exam",
limit: 5,
dicType: "",
listType: "picture-card",
fieldType: "varchar",
fieldLength: "255",
tableName: "附件",
tableCode: "gas_attachment",
tableId: "1595978031963398145",
notFilter: false,
cType: "",
subfield: false,
},
],
},
],
}
formJson = {
column: [],
labelPosition: "left",
labelSuffix: "",
labelWidth: 100,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: "下一步",
emptyBtn: false,
emptyText: "清空",
nextTabBtn: true,
nextTabText: "下一页",
menuPosition: "center",
group: [
{
label: "筛查点信息",
prop: "1669195600018_27976",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "input",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
label: "医联体编号",
prop: "union_id",
fieldType: "varchar",
fieldLength: "127",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
width: 12,
required: true,
rules: [{ required: true, message: "医联体编号必须填写" }],
xs: 24,
sm: 24,
md: 24,
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "screen_point_number",
label: "筛查点编号",
fieldType: "varchar",
fieldLength: "20",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
width: 12,
rules: [{ required: true, message: "筛查点编号必须填写" }],
required: true,
xs: 24,
sm: 24,
md: 24,
},
],
},
{
label: "一、入选标准",
prop: "1669195610048_55035",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "date",
display: true,
importantField: false,
styles: {},
prop: "birthday",
label: "出生日期",
fieldType: "date",
fieldLength: "",
format: "yyyy-MM-dd",
valueFormat: "yyyy-MM-dd",
dicType: "",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 1,
span: 24,
width: 12,
required: true,
rules: [
{ required: true, message: "出生日期必须填写" },
{
validator: function checkAge(rule, value, callback) {
if (!value) {
return callback(new Error("请选择出生日期"))
}
var birthday = new Date(value.replace(/-/g))
var d = new Date()
var age =
d.getFullYear() -
birthday.getFullYear() -
(d.getMonth() < birthday.getMonth() ||
(d.getMonth() == birthday.getMonth() &&
d.getDate() < birthday.getDate())
? 1
: 0)
console.log(age)
if (age < 40 || age > 80) {
callback(new Error("年龄不符合筛查条件"))
} else {
callback()
}
},
trigger: "change",
},
],
disabled: false,
pattern: "checkAge",
xs: 24,
sm: 24,
md: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_know",
label: "知情同意",
fieldType: "tinyint",
fieldLength: "2",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
width: 12,
required: true,
rules: [{ required: true, message: "请选择知情同意" }],
},
],
},
{
label: "二、排除标准",
prop: "1669707112356_13663",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
label: "距上次胃镜检查间隔时间一年内",
prop: "is_one_year",
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_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
label: "胃大部切除术手术史",
prop: "is_subtotal_history",
fieldType: "tinyint",
fieldLength: "2",
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
autoRequired: 0,
personalRequired: 0,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
prop: "is_ppi",
label:
"两周内服用PPI(埃索美拉唑、泮托拉唑、雷贝拉唑、兰索拉唑等)或H2受体拮抗剂(法莫替丁等)",
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_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_symptom",
label:
"有下列一种或多种症状: 6个月内缺铁性贫血;12个月内消化道出血(黑便、血便等);体重减轻(非减肥原因6个月内体重减轻≥4.5Kg);经常性腹泻;吞咽困难或哽噎感;腹部肿块",
fieldType: "tinyint",
fieldLength: "2",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_disease",
label:
"有以下任何一种疾病史 食管癌、胃癌、结直肠肿瘤、炎症性肠病、其它器官恶性肿瘤(乳腺、卵巢、子宫及泌尿系统等)",
fieldType: "tinyint",
fieldLength: "2",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_tumour",
label: "影像、肿瘤标志物等检查高度怀疑罹患肿瘤可能",
fieldType: "tinyint",
fieldLength: "2",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_Incomplete",
label: "严重心、肺、肝、肾功能不全,或严重精神疾患",
fieldType: "tinyint",
fieldLength: "2",
tableName: "入排选标准",
tableCode: "gas_exclusion_criteria",
tableId: "1595341111042252802",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelWidth: 850,
width: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
},
],
},
],
}
let formJson = {
column: [],
labelPosition: "right",
labelSuffix: "",
labelWidth: 180,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: "下一步",
emptyBtn: false,
emptyText: "清空",
nextTabBtn: true,
nextTabText: "下一页",
menuPosition: "center",
prevBtn: true,
group: [
{
label: "是否接受胃镜检查",
prop: "1669874329243_67285",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "radio",
display: true,
importantField: false,
styles: {},
label: "是否接受检查",
prop: "is_accept",
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [
{ value: "1", target: "1669874397313_56690" },
{ value: "1", target: "check_time" },
{ value: "1", target: "check_type" },
{ value: "1", target: "check_result" },
],
dicType: "d-sf",
props: { label: "label", value: "value" },
fieldType: "tinyint",
fieldLength: "2",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
disabled: false,
required: true,
rules: [{ required: true, message: "请选择是否接受检查" }],
},
],
},
{
label: "胃镜检查结果",
prop: "1669874397313_56690",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "date",
display: true,
importantField: true,
styles: {},
label: "检查时间",
prop: "check_time",
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicOption: "static",
dicType: "",
props: { label: "label", value: "value" },
fieldType: "datetime",
fieldLength: "",
format: "yyyy-MM-dd",
valueFormat: "yyyy-MM-dd",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
noImmediate: false,
span: 24,
required: true,
rules: [{ required: true, message: "检查时间必须填写" }],
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
prop: "check_type",
label: "检查方式",
fieldType: "int",
fieldLength: "11",
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "磁控胶囊胃镜检查",
value: "3",
id: "1597475763517489154",
parentId: "",
},
{
label: "胃镜普通白光检查+LCI检查",
value: "2",
id: "1597475677853024258",
parentId: "",
},
{
label: "胃镜普通白光检查",
value: "1",
id: "1597475602204557314",
parentId: "",
},
],
dynamicshSet: [
{ value: "1", target: "inner_check_path" },
{ value: "2", target: "inner_check_path" },
{ value: "3", target: "inner_check_path" },
],
dicType: "gas_check_type",
props: { label: "label", value: "value" },
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
required: true,
rules: [{ required: true, message: "请选择检查方式" }],
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "异常",
value: "2",
id: "1597476229722767361",
parentId: "",
},
{
label: "未见异常",
value: "1",
id: "1597476184780800001",
parentId: "",
},
],
dynamicshSet: [
{ value: "2", target: "detail_check_type" },
{ value: "2", target: "diagnosis" },
],
dicType: "check_result",
props: { label: "label", value: "value" },
prop: "check_result",
label: "检查结果",
fieldType: "tinyint",
fieldLength: "2",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
rules: [{ required: true, message: "请选择检查结果" }],
required: true,
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "化学染色",
value: "8",
id: "1597477133691748353",
parentId: "",
},
{
label: "荧光内镜",
value: "7",
id: "1597477097977249793",
parentId: "",
},
{
label: "激光共聚焦显微内镜",
value: "6",
id: "1597477062287917057",
parentId: "",
},
{
label: "放大内镜",
value: "5",
id: "1597477029488459778",
parentId: "",
},
{
label: "BLI",
value: "4",
id: "1597476996303126529",
parentId: "",
},
{
label: "I-SC",
value: "3",
id: "1597476961561706498",
parentId: "",
},
{
label: "FICE",
value: "2",
id: "1597476919312482306",
parentId: "",
},
{
label: "NBI",
value: "1",
id: "1597476883899973634",
parentId: "",
},
],
dynamicshSet: [],
dicType: "gas_detail_check_type",
props: { label: "label", value: "value" },
prop: "detail_check_type",
label: "胃镜精查方式",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
required: true,
rules: [{ required: true, message: "请选择胃镜精查方式" }],
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "异常",
value: "2",
id: "1597476229722767361",
parentId: "",
},
{
label: "未见异常",
value: "1",
id: "1597476184780800001",
parentId: "",
},
],
dynamicshSet: [
{ value: "2", target: "esophagus_level" },
{ value: "2", target: "esophagus_position" },
{ value: "2", target: "early_esophagus_cancer" },
{ value: "2", target: "period_esophagus_cancer" },
{ value: "2", target: "is_barret_esophagus" },
{ value: "2", target: "is_back_esophagus" },
{ value: "2", target: "inogm_level" },
{ value: "2", target: "inogm_position" },
{ value: "2", target: "early_gastric_cancer" },
{ value: "2", target: "period_gastric_cancer" },
{ value: "2", target: "atrophic_gastriti" },
{ value: "2", target: "gastric_ulcer" },
{ value: "2", target: "gastric_polyp_type" },
{ value: "2", target: "gastric_polyp" },
{ value: "2", target: "non_atrophic_gastriti" },
{ value: "2", target: "is_duodenal_ulcer" },
{ value: "2", target: "other_pathology" },
{ value: "2", target: "1675147677493_64987" },
],
dicType: "check_result",
props: { label: "label", value: "value" },
prop: "diagnosis",
label: "最后诊断",
fieldType: "tinyint",
fieldLength: "4",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "",
rules: [{ required: true, message: "请选择最后诊断" }],
required: true,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
label: "食管粘膜上皮内瘤变级别",
prop: "esophagus_level",
dicData: [
{
label: "低级别",
value: "low",
id: "1597478564247207938",
parentId: "",
},
{
label: "高级别",
value: "high",
id: "1597478502163120130",
parentId: "",
},
],
dynamicshSet: [],
dicType: "risk_level",
props: { label: "label", value: "value" },
fieldType: "tinyint",
fieldLength: "4",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
rules: [],
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "食管下段",
value: "3",
id: "1597480132849795074",
parentId: "",
},
{
label: "食管中段",
value: "2",
id: "1597480056861589506",
parentId: "",
},
{
label: "食管上段",
value: "1",
id: "1597480026914258945",
parentId: "",
},
],
dynamicshSet: [],
dicType: "gas_position",
props: { label: "label", value: "value" },
prop: "early_esophagus_cancer",
label: "早期食管癌",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
rules: [],
required: false,
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "食管下段",
value: "3",
id: "1597480132849795074",
parentId: "",
},
{
label: "食管中段",
value: "2",
id: "1597480056861589506",
parentId: "",
},
{
label: "食管上段",
value: "1",
id: "1597480026914258945",
parentId: "",
},
],
dynamicshSet: [],
dicType: "gas_position",
props: { label: "label", value: "value" },
prop: "period_esophagus_cancer",
label: "进展期食管癌",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
rules: [],
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_barret_esophagus",
label: "Barret食管",
fieldType: "tinyint",
fieldLength: "4",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_back_esophagus",
label: "反流性食管炎",
fieldType: "tinyint",
fieldLength: "4",
labelSuffix: "5",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: "inogm_level",
label: "胃粘膜上皮内瘤变级别",
dicData: [
{
label: "低级别",
value: "low",
id: "1597478564247207938",
parentId: "",
},
{
label: "高级别",
value: "high",
id: "1597478502163120130",
parentId: "",
},
],
dynamicshSet: [{ value: "high", target: "pathology_path" }],
dicType: "risk_level",
props: { label: "label", value: "value" },
fieldType: "varchar",
fieldLength: "10",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
labelWidth: 180,
span: 24,
labelSuffix: "5",
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
prop: "inogm_position",
label: "胃粘膜上皮内瘤变部位",
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dynamicshSet: [],
dicType: "gas_area",
props: { label: "label", value: "value" },
fieldType: "varchar",
fieldLength: "10",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
labelSuffix: "5",
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dynamicshSet: [
{ value: "1", target: "pathology_path" },
{ value: "2", target: "pathology_path" },
{ value: "3", target: "pathology_path" },
{ value: "4", target: "pathology_path" },
{ value: "5", target: "pathology_path" },
],
dicType: "gas_area",
props: { label: "label", value: "value" },
prop: "early_gastric_cancer",
label: "早期胃癌",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
rules: [],
required: false,
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dicType: "gas_area",
props: { label: "label", value: "value" },
prop: "period_gastric_cancer",
label: "进展期胃癌",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
dynamicshSet: [
{ value: "1", target: "pathology_path" },
{ value: "2", target: "pathology_path" },
{ value: "3", target: "pathology_path" },
{ value: "4", target: "pathology_path" },
{ value: "5", target: "pathology_path" },
],
labelSuffix: "5",
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dicType: "gas_area",
props: { label: "label", value: "value" },
prop: "atrophic_gastriti",
label: "萎缩性胃炎",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
labelSuffix: "5",
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dicType: "gas_area",
props: { label: "label", value: "value" },
prop: "gastric_ulcer",
label: "胃溃疡",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
autoRequired: 0,
personalRequired: 0,
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dicType: "gas_area",
props: { label: "label", value: "value" },
prop: "gastric_polyp",
label: "胃息肉",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "胃窦",
value: "5",
id: "1597481813276721153",
parentId: "",
},
{
label: "胃角",
value: "4",
id: "1597481781530034178",
parentId: "",
},
{
label: "胃体",
value: "3",
id: "1597481745282859010",
parentId: "",
},
{
label: "胃底",
value: "2",
id: "1597481706678484993",
parentId: "",
},
{
label: "贲门",
value: "1",
id: "1597481677293191169",
parentId: "",
},
],
dicType: "gas_area",
props: { label: "label", value: "value" },
prop: "non_atrophic_gastriti",
label: "非萎缩性胃炎",
fieldType: "varchar",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
labelSuffix: "5",
},
{
type: "checkbox",
display: true,
importantField: false,
styles: {},
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dicType: "d-sf",
props: { label: "label", value: "value" },
prop: "is_duodenal_ulcer",
label: "十二指肠球部溃疡",
fieldType: "tinyint",
fieldLength: "2",
autoRequired: 0,
personalRequired: 0,
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "5",
},
{
type: "input",
display: true,
importantField: false,
styles: {},
fieldType: "varchar",
prop: "other_pathology",
label: "其他病变",
fieldLength: "255",
tableName: "胃镜检查",
tableCode: "gas_troscope",
tableId: "1597468524048121858",
notFilter: false,
cType: "",
subfield: false,
span: 24,
autoRequired: 0,
personalRequired: 0,
labelSuffix: "5",
},
{
type: "upload",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: "pathology_path",
label: "病理报告",
required: true,
rules: [{ required: true, message: "实验室报告必须填写" }],
showFileList: true,
multiple: true,
bucketName: "pathology",
limit: 5,
dicType: "",
listType: "picture-card",
fieldType: "varchar",
fieldLength: "255",
tableName: "附件",
tableCode: "gas_attachment",
tableId: "1595978031963398145",
notFilter: false,
cType: "",
subfield: false,
span: 24,
},
{
type: "upload",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: "inner_check_path",
label: "内镜报告",
required: true,
rules: [{ required: true, message: "实验室报告必须填写" }],
showFileList: true,
multiple: true,
bucketName: "endoscop",
limit: 5,
dicType: "",
listType: "picture-card",
fieldType: "varchar",
fieldLength: "255",
tableName: "附件",
tableCode: "gas_attachment",
tableId: "1595978031963398145",
notFilter: false,
cType: "",
subfield: false,
span: 24,
},
{
type: "upload",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: "esd_path",
label: "ESD手术报告",
required: false,
rules: [],
showFileList: true,
multiple: true,
bucketName: "esd",
limit: 5,
dicType: "",
listType: "picture-card",
fieldType: "varchar",
fieldLength: "255",
tableName: "附件",
tableCode: "gas_attachment",
tableId: "1595978031963398145",
notFilter: false,
cType: "",
subfield: false,
span: 24,
},
],
},
],
}
let formJson = {
column: [],
labelPosition: "left",
labelSuffix: "",
labelWidth: 180,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: "下一步",
emptyBtn: false,
emptyText: "上一步",
nextTabBtn: true,
nextTabText: "下一页",
menuPosition: "center",
prevBtn: true,
group: [
{
label: "个人信息",
prop: "1669708504829_2651",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "name",
label: "姓名",
fieldType: "varchar",
fieldLength: "15",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
lg: 12,
span: 12,
width: 24,
xs: 12,
sm: 12,
md: 12,
readonly: false,
required: true,
rules: [{ required: true, message: "姓名必须填写" }],
},
{
type: "date",
display: true,
importantField: false,
styles: {},
format: "yyyy-MM-dd",
valueFormat: "yyyy-MM-dd",
prop: "survey_time",
dicType: "",
label: "调查时间",
fieldType: "datetime",
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
span: 12,
xs: 12,
sm: 12,
md: 12,
lg: 12,
required: true,
rules: [{ required: true, message: "调查时间必须填写" }],
personalRequired: 0,
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "phone",
label: "手机号",
fieldType: "varchar",
fieldLength: "15",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
span: 12,
xs: 12,
sm: 12,
md: 12,
lg: 12,
required: true,
rules: [],
pattern: "checkTel",
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "link_phone",
label: "联系号码",
fieldType: "varchar",
fieldLength: "128",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
span: 12,
xs: 12,
sm: 12,
md: 12,
lg: 12,
width: 24,
rules: [{ required: true, message: "联系号码必须填写" }],
required: true,
},
{
type: "date",
display: true,
importantField: false,
styles: {},
prop: "birthday",
label: "出生日期",
fieldType: "date",
fieldLength: "",
format: "yyyy-MM-dd",
valueFormat: "yyyy-MM-dd",
dicType: "",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
span: 12,
xs: 12,
sm: 12,
md: 12,
lg: 12,
required: true,
rules: [{ required: true, message: "出生日期必须填写" }],
disabled: true,
value: " ",
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "age",
label: "年龄",
fieldType: "int",
fieldLength: "11",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
span: 12,
xs: 12,
sm: 12,
md: 12,
lg: 12,
required: true,
rules: [{ required: true, message: "年龄必须填写" }],
readonly: false,
disabled: true,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: "sex",
dicData: [
{
label: "",
value: "2",
id: "1595351964546281474",
parentId: "",
},
{
label: "",
value: "1",
id: "1595351940139626497",
parentId: "",
},
],
dynamicshSet: [],
dicType: "d-sex",
props: { label: "label", value: "value" },
label: "性别",
fieldType: "varchar",
fieldLength: "20",
tableName: "患者信息",
tableCode: "gas_patient_info",
tableId: "1595347991491833857",
notFilter: false,
cType: "",
subfield: false,
span: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
required: true,
rules: [{ required: true, message: "请选择性别" }],
},
],
},
{
label: "家族史",
prop: "1669708827460_97007",
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
type: "radio",
display: true,
importantField: false,
styles: {},
prop: "is_first_degree",
label: "一级亲属(父母、子女、兄弟姐妹)罹患胃癌情况",
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [
{ value: "1", target: "family_count" },
{ value: "1", target: "min_age" },
],
dicType: "d-sf",
props: { label: "label", value: "value" },
fieldType: "tinyint",
fieldLength: "2",
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
xs: 24,
sm: 24,
md: 24,
lg: 24,
required: true,
rules: [
{
required: true,
message: "请选择一级亲属(父母、子女、兄弟姐妹)罹患胃癌情况",
},
],
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "family_count",
label: "数量",
fieldType: "int",
fieldLength: "11",
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
span: 24,
labelSuffix: "(1)",
xs: 24,
sm: 24,
md: 24,
lg: 24,
required: true,
rules: [{ required: true, message: "数量必须填写" }],
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "min_age",
label: "诊断时最小年龄",
fieldType: "int",
fieldLength: "11",
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
labelSuffix: "(2)",
xs: 24,
sm: 24,
md: 24,
lg: 24,
width: 24,
rules: [{ required: true, message: "诊断时最小年龄必须填写" }],
required: true,
},
{
type: "radio",
display: true,
importantField: false,
styles: {},
prop: "is_other_sickness",
label: "一级亲属罹患其他恶性肿瘤情况",
fieldType: "tinyint",
fieldLength: "2",
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [
{ value: "1", target: "family_other_count" },
{ value: "1", target: "other_sickness" },
],
dicType: "d-sf",
props: { label: "label", value: "value" },
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
xs: 24,
sm: 24,
md: 24,
lg: 24,
span: 24,
width: 24,
rules: [
{ required: true, message: "请选择一级亲属罹患其他恶性肿瘤情况" },
],
required: true,
autoRequired: 0,
personalRequired: 0,
labelSuffix: "2",
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "family_other_count",
label: "一级亲属罹患其他恶性肿瘤数量",
fieldType: "int",
fieldLength: "11",
dicData: [
{
label: "",
value: "1",
id: "1595347527757000705",
parentId: "",
},
{
label: "",
value: "0",
id: "1595347502595371010",
parentId: "",
},
],
dynamicshSet: [],
dicOption: "static",
dicType: "",
props: { label: "label", value: "value" },
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
lg: 24,
xs: 24,
sm: 24,
md: 24,
autoRequired: 0,
personalRequired: 0,
span: 24,
width: 24,
labelSuffix: "(1)",
required: true,
rules: [
{ required: true, message: "一级亲属罹患其他恶性肿瘤数量必须填写" },
],
},
{
type: "input",
display: true,
importantField: false,
styles: {},
prop: "other_sickness",
label: "一级亲属罹患其它恶性肿瘤名称",
fieldType: "varchar",
fieldLength: "255",
tableName: "问卷调查",
tableCode: "gas_question",
tableId: "1597462007689347074",
notFilter: false,
cType: "",
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
labelSuffix: "(2)",
xs: 24,
sm: 24,
md: 24,
lg: 24,
width: 24,
rules: [
{ required: true, message: "一级亲属罹患其它恶性肿瘤名称必须填写" },
],
required: true,
},
],
},
],
}
<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"
:showIndex="showIndex"
></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,
},
showIndex: {
type: Boolean,
},
},
data() {
return {}
},
provide(){
return{
showIndex: this.showIndex
}
},
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"
:class="isEmpty"
>
<!-- :rules="item.rules" -->
<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"
:style="{color:item.color}"
>{{ opt.label }}</span>
<span class="ml-10">{{item.unit}}</span>
</span>
<span v-else>
<span :style="{color:item.color}">{{form[item.prop]}}</span>
<span class="ml-10">{{item.unit}}</span>
</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"
:showIndex="g.showIndex"
:class="g.showIndex ? 'simple-form' : 'index-form'"
></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: {
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()
}
this.$forceUpdate()
})
},
// 绑定部分值(此时表单已渲染)
initfields(obj) {
console.log("通用表单",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 #cccccc;
}
}
.el-collapse-item__content {
padding-bottom: 0px;
}
.el-collapse-item__header {
background: #fafafa;
padding-left: 20px;
border: 1px solid #cccccc;
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 #cccccc;
// border-right: 1px solid #cccccc;
// border-bottom: 1px solid #cccccc !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;
}
}
}
.index-form {
::v-deep {
// .el-form-item {
.el-form-item__label {
text-align: left;
background: #fafafa;
font-size: 14px;
color: #333333;
border-right: 1px solid #cccccc;
width: 80px !important;
padding: 18px 10px;
margin-right: 20px;
text-align: center;
}
}
// }
}
.simple-form {
::v-deep {
.el-form-item__label {
margin-left: 20px;
}
}
}
</style>
<template> <template>
<el-form ref="form" :model="form" :label-position="labelPosition" :inline="inlineFlag" :label-width="labelWidth" :size="size" @submit.native.prevent="handleSearch()" class="el-form-self" :style="formStyle"> <el-form
<el-col :xs="item.xs?item.xs:24" :sm="item.sm?item.sm:12" :md="item.md?item.md:8" :lg="item.lg?item.lg:8" :xl="item.xl?item.xl:6" v-for="(item,index) in forms" :key="index" v-if="!item.hidden"> ref="form"
<el-form-item :label="item.label?item.label+(item.hiddenColon?'':':'):''" :prop="item.prop" :rules="item.rules" :label-width="item.labelWidth || '110px'"> :model="form"
:label-position="labelPosition"
:inline="inlineFlag"
:label-width="labelWidth"
:size="size"
class="el-form-self"
:style="formStyle"
@submit.native.prevent="handleSearch()"
>
<el-col
v-for="(item, index) in forms"
v-if="!item.hidden"
:key="index"
:xs="item.xs ? item.xs : 24"
:sm="item.sm ? item.sm : 12"
:md="item.md ? item.md : 8"
:lg="item.lg ? item.lg : 8"
:xl="item.xl ? item.xl : 6"
>
<el-form-item
v-if="item.type != 'btn'"
:label="item.label ? item.label + (item.hiddenColon ? '' : ':') : ''"
:prop="item.prop"
:rules="item.rules"
:label-width="item.labelWidth || '110px'"
>
<!-- 输入框 --> <!-- 输入框 -->
<el-input v-if="item.type === 'input'" :id="item.id?item.id:''" v-model="form[item.prop]" :readonly="item.readonly" :disabled="item.disabled" :placeholder="item.placeholder" @focus="item.focusFunc?item.focusFunc($event):{}" @change="item.func?item.func($event):{}"> <el-input
<span :slot="item.slot?item.slot:'append'" v-if="item.unit">{{item.unit}}</span> v-if="item.type === 'input'"
:id="item.id ? item.id : ''"
v-model="form[item.prop]"
:readonly="item.readonly"
:disabled="item.disabled"
:placeholder="item.placeholder"
@focus="item.focusFunc ? item.focusFunc($event) : {}"
@change="item.func ? item.func($event) : {}"
>
<span v-if="item.unit" :slot="item.slot ? item.slot : 'append'">
{{
item.unit
}}
</span>
</el-input> </el-input>
<template v-if="item.type === 'textarea'"> <template v-if="item.type === 'textarea'">
<el-input type="textarea" :placeholder="item.placeholder" :rows="item.rows" :autosize="item.autosize" v-model="form[item.prop]" :minlength="item.minlength" :maxlength="item.maxlength" :show-word-limit="item.showLimit"></el-input> <el-input
v-model="form[item.prop]"
type="textarea"
:placeholder="item.placeholder"
:rows="item.rows"
:autosize="item.autosize"
:minlength="item.minlength"
:maxlength="item.maxlength"
:show-word-limit="item.showLimit"
></el-input>
</template> </template>
<!-- 模糊查询输入 --> <!-- 模糊查询输入 -->
<el-autocomplete :popper-class="item.popperClass" style="width:100%;" v-else-if="item.type === 'autocomplete'" v-model="form[item.prop]" :fetch-suggestions="item.func" :placeholder="item.placeholder" @select="item.selectfun?item.selectfun($event):{}" clearable> <el-autocomplete
v-else-if="item.type === 'autocomplete'"
v-model="form[item.prop]"
:popper-class="item.popperClass"
style="width: 100%"
:fetch-suggestions="item.func"
:placeholder="item.placeholder"
clearable
@select="item.selectfun ? item.selectfun($event) : {}"
>
<template slot-scope="{ item }"> <template slot-scope="{ item }">
<div class="name">{{ item.value }}</div> <div class="name">{{ item.value }}</div>
<span class="description">{{ item.description }}</span> <span class="description">{{ item.description }}</span>
...@@ -20,93 +76,189 @@ ...@@ -20,93 +76,189 @@
</el-autocomplete> </el-autocomplete>
<!-- 模糊查询选择 --> <!-- 模糊查询选择 -->
<el-select v-else-if="item.type === 'remote'" v-model="form[item.prop]" filterable remote reserve-keyword :placeholder="item.placeholder" :remote-method="item.remoteFunc"> <el-select
<el-option v-for="(opt,optIndex) in item.opts" :key="optIndex" :label="opt.label" :value="item.isSelect?opt.selectValue:opt.value"> v-else-if="item.type === 'remote'"
</el-option> v-model="form[item.prop]"
filterable
remote
reserve-keyword
:placeholder="item.placeholder"
:remote-method="item.remoteFunc"
>
<el-option
v-for="(opt, optIndex) in item.opts"
:key="optIndex"
:label="opt.label"
:value="item.isSelect ? opt.selectValue : opt.value"
></el-option>
</el-select> </el-select>
<!-- 日期区间 --> <!-- 日期区间 -->
<el-date-picker v-else-if="item.type === 'daterange'" v-model="form[item.prop]" type="daterange" align="right" unlink-panels range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="item.options" :format="item.format" :value-format="item.valueFormat"> <el-date-picker
</el-date-picker> v-else-if="item.type === 'daterange'"
v-model="form[item.prop]"
type="daterange"
align="right"
unlink-panels
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="item.options"
:format="item.format"
:value-format="item.valueFormat"
></el-date-picker>
<!-- 日期 --> <!-- 日期 -->
<el-date-picker v-else-if="item.type === 'date'" v-model="form[item.prop]" :type="item.dateType?item.dateType:'date'" :placeholder="item.placeholder" :picker-options="item.options" :format="item.format" :value-format="item.valueFormat"> <el-date-picker
</el-date-picker> v-else-if="item.type === 'date'"
v-model="form[item.prop]"
:type="item.dateType ? item.dateType : 'date'"
:placeholder="item.placeholder"
:picker-options="item.options"
:format="item.format"
:value-format="item.valueFormat"
></el-date-picker>
<!-- 下拉框 --> <!-- 下拉框 -->
<el-select v-else-if="item.type === 'select'" clearable filterable :disabled="item.disabled" v-model="form[item.prop]" :placeholder="item.placeholder?item.placeholder:'请选择'" @change="item.func?item.func($event):{}"> <el-select
<el-option v-for="(opt,optIndex) in item.opts" :key="optIndex" :label="opt.label" :value="item.isSelect?opt.selectValue:opt.value"> v-else-if="item.type === 'select'"
</el-option> v-model="form[item.prop]"
clearable
filterable
:disabled="item.disabled"
:placeholder="item.placeholder ? item.placeholder : '请选择'"
@change="item.func ? item.func($event) : {}"
>
<el-option
v-for="(opt, optIndex) in item.opts"
:key="optIndex"
:label="opt.label"
:value="item.isSelect ? opt.selectValue : opt.value"
></el-option>
</el-select> </el-select>
<!-- 单选框 --> <!-- 单选框 -->
<el-radio :class="item.class" v-else-if="item.type === 'radio'" v-model="form[item.prop]" v-for="(opt,optIndex) in item.opts" :key="optIndex" :label="opt.value" @change="item.func?item.func($event):{}">{{opt.label}} <el-radio
</el-radio> v-for="(opt, optIndex) in item.opts"
v-else-if="item.type === 'radio'"
:key="optIndex"
v-model="form[item.prop]"
:class="item.class"
:label="opt.value"
@change="item.func ? item.func($event) : {}"
>{{ opt.label }}</el-radio>
<!-- 级联 --> <!-- 级联 -->
<el-cascader v-else-if="item.type === 'cascader'" v-model="form[item.prop]" :style="'width:'+item.width" :options="item.list" :change-on-select="item.changeSelect" :show-all-levels="item.showLevel"></el-cascader> <el-cascader
v-else-if="item.type === 'cascader'"
v-model="form[item.prop]"
:style="'width:' + item.width"
:options="item.list"
:change-on-select="item.changeSelect"
:show-all-levels="item.showLevel"
></el-cascader>
<!-- 文字 --> <!-- 文字 -->
<span v-else-if="item.type === 'text'"> <span v-else-if="item.type === 'text'">{{ item.text ? item.text : form[item.prop] }}</span>
{{item.text?item.text:form[item.prop]}}
</span>
<!-- 数字输入框 --> <!-- 数字输入框 -->
<el-input-number v-else-if="item.type === 'number'" :controls="false" :min="item.min || 0" :precision="item.precision" v-model="form[item.prop]" :disabled="item.disabled || disabled" /> <el-input-number
v-else-if="item.type === 'number'"
v-model="form[item.prop]"
:controls="false"
:min="item.min || 0"
:precision="item.precision"
:disabled="item.disabled || disabled"
/>
<!-- 图标 --> <!-- 图标 -->
<span v-else-if="item.type === 'svg'"> <span v-else-if="item.type === 'svg'">
<svg-icon :style="item.style" :icon-class="item.iconClass" @click.native="clickSvg(item.func)" class="form-svg"></svg-icon> <svg-icon
:style="item.style"
:icon-class="item.iconClass"
class="form-svg"
@click.native="clickSvg(item.func)"
></svg-icon>
</span> </span>
</el-form-item> </el-form-item>
<div v-if="item.type == 'btn'" class="flex">
<template v-for="(btn, index) in item.list">
<el-button
v-if="btn.btnType == 'button'"
:key="index"
:type="btn.type"
:size="size"
:icon="btn.icon"
:style="btn.style"
@click="btn.func(form)"
>{{ btn.btnText }}</el-button>
<div
v-if="btn.btnType == 'tobeModified'"
:key="index"
class="tobeModified"
:style="{ backgroundColor: modifiedFlag ? '#4E68FF' : '#fff' }"
@click="changeModified"
>
<i :style="{ color: modifiedFlag ? '#fff' : '#d9d9d9' }" class="el-icon-check"></i>
<span :style="{ color: modifiedFlag ? '#fff' : '#000' }">待修改({{ btn.tobeModified }}</span>
</div>
</template>
</div>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :lg="24" v-if="lists" style="padding-left:120px;"> <el-col v-if="lists" :xs="24" :sm="24" :lg="24" style="padding-left: 120px">
<el-button v-for="(btn,index) in lists" :key="index" :type="btn.type" :size="size" :icon="btn.icon" @click="btn.func" :style="btn.style"> <el-button
{{btn.btnText}} v-for="(btn, index) in lists"
</el-button> :key="index"
:type="btn.type"
:size="size"
:icon="btn.icon"
:style="btn.style"
@click="btn.func"
>{{ btn.btnText }}</el-button>
</el-col> </el-col>
</el-form> </el-form>
</template> </template>
<script> <script>
export default { export default {
props: {
size: { type: String, default: "small" },
labelPosition: { type: String, default: "right" },
labelWidth: { type: String },
formStyle: { type: Object },
inlineFlag: { type: Boolean, default: false },
forms: { type: Array }, // 表单组,
lists: { type: Array }, // 按钮组
formEdit:{type: Object}
},
data() { data() {
const form = {} const form = {}
const { forms } = this.$props const { forms } = this.$props
forms.forEach(item => { forms.forEach((item) => {
if (!item.prop || item.hidden) return false if (!item.prop || item.hidden) return false
if ( if (
item.type === 'daterange' || item.type === "daterange" ||
item.type === 'checkboxList' || item.type === "checkboxList" ||
item.type === 'checkbox' || item.type === "checkbox" ||
item.type === 'cascader' || item.type === "cascader" ||
(item.type === 'select' && item.multiple) (item.type === "select" && item.multiple)
) { ) {
form[item.prop] = [] form[item.prop] = []
} else { } else {
form[item.prop] = '' form[item.prop] = ""
} }
}) })
return { return {
form form,
modifiedFlag: false,
} }
}, },
props: {
size: { type: String, default: 'small' },
labelPosition: { type: String, default: 'right' },
labelWidth: { type: String },
formStyle: { type: Object },
inlineFlag: { type: Boolean, default: false },
forms: { type: Array }, // 表单组,
lists: { type: Array } // 按钮组
},
methods: { methods: {
// 查询 // 查询
handleSearch() { handleSearch() {
this.$emit('handleSearch', this.form) console.log("this.form",this.form)
this.$emit("handleSearch", this.form)
}, },
// 重置 // 重置
...@@ -117,9 +269,9 @@ export default { ...@@ -117,9 +269,9 @@ export default {
handleConfirm() { handleConfirm() {
this.loading = true this.loading = true
this.$refs.form.validate(valid => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
this.$emit('handleConfirm', this.form) this.$emit("handleConfirm", this.form)
} else { } else {
this.loading = false this.loading = false
} }
...@@ -130,18 +282,18 @@ export default { ...@@ -130,18 +282,18 @@ export default {
initforms(formEdit) { initforms(formEdit) {
this.$nextTick(() => { this.$nextTick(() => {
const form = {} const form = {}
this.forms.forEach(item => { this.forms.forEach((item) => {
if (!item.prop || item.hidden) return false if (!item.prop || item.hidden) return false
if ( if (
item.type === 'daterange' || item.type === "daterange" ||
item.type === 'checkboxList' || item.type === "checkboxList" ||
item.type === 'checkbox' || item.type === "checkbox" ||
item.type === 'cascader' || item.type === "cascader" ||
(item.type === 'select' && item.multiple) (item.type === "select" && item.multiple)
) { ) {
form[item.prop] = [] form[item.prop] = []
} else { } else {
form[item.prop] = '' form[item.prop] = ""
} }
}) })
if (formEdit) { if (formEdit) {
...@@ -164,6 +316,16 @@ export default { ...@@ -164,6 +316,16 @@ export default {
// 点击图标 // 点击图标
clickSvg(str) { clickSvg(str) {
this.$emit(str) this.$emit(str)
},
// 修改
changeModified() {
this.modifiedFlag = !this.modifiedFlag
},
},
watch: {
formEdit(val){
this.initforms(val)
} }
} }
} }
...@@ -171,6 +333,7 @@ export default { ...@@ -171,6 +333,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.el-form-self { .el-form-self {
width: 100%;
margin: 20px 0; margin: 20px 0;
overflow: hidden; overflow: hidden;
zoom: 1; zoom: 1;
...@@ -183,7 +346,29 @@ export default { ...@@ -183,7 +346,29 @@ export default {
.form-svg { .form-svg {
cursor: pointer; cursor: pointer;
} }
.el-form-item {
margin-right: 20px;
}
}
.tobeModified {
// width: 134px;
height: 31px;
margin-left: 20px;
background: #ffffff;
border-radius: 4px;
padding: 0px 8px;
border: 1px solid #d9d9d9;
display: flex;
align-items: center;
cursor: pointer;
.el-icon-check {
font-size: 18px;
margin-right: 8px;
}
span {
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #333333;
}
} }
</style> </style>
...@@ -9,7 +9,6 @@ ...@@ -9,7 +9,6 @@
:show-summary="showSummary" :show-summary="showSummary"
:span-method="spanMethod" :span-method="spanMethod"
:data="tableData" :data="tableData"
border
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
:highlight-current-row="highLight" :highlight-current-row="highLight"
:max-height="maxHeight || maxTableHeight" :max-height="maxHeight || maxTableHeight"
...@@ -17,15 +16,17 @@ ...@@ -17,15 +16,17 @@
:header-row-class-name="headerClass" :header-row-class-name="headerClass"
:row-style="rowStyle" :row-style="rowStyle"
:expand-row-keys="expands" :expand-row-keys="expands"
@row-click="rowClick"
:cell-style="cellStyle" :cell-style="cellStyle"
@sort-change="sortChange"
style="width: 100%" style="width: 100%"
:default-expand-all="defaultExpandAll"
:style="{ fontSize: fontSize + 'px' }"
:header-cell-style="{ fontSize: fontSize + 'px' }"
@row-click="rowClick"
@sort-change="sortChange"
@select="selectChange" @select="selectChange"
@selection-change="selectionChange" @selection-change="selectionChange"
@select-all="selectAll" @select-all="selectAll"
@cell-click="cellClick" @cell-click="cellClick"
:default-expand-all="defaultExpandAll"
> >
<el-table-column <el-table-column
v-if="tabType" v-if="tabType"
...@@ -35,8 +36,7 @@ ...@@ -35,8 +36,7 @@
:label="tabLabel" :label="tabLabel"
:selectable="selecTable" :selectable="selecTable"
:index="tabIndex" :index="tabIndex"
> ></el-table-column>
</el-table-column>
<template v-for="(column, index) in columns"> <template v-for="(column, index) in columns">
<template v-if="!column.hidden"> <template v-if="!column.hidden">
...@@ -100,9 +100,7 @@ ...@@ -100,9 +100,7 @@
" "
> >
<template v-for="(op, opIndex) in col2.operations"> <template v-for="(op, opIndex) in col2.operations">
<template <template v-if="!op.isHidden || !op.isHidden(scope.row)">
v-if="!op.isHidden || !op.isHidden(scope.row)"
>
<el-button <el-button
:key="opIndex" :key="opIndex"
:disabled=" :disabled="
...@@ -168,9 +166,11 @@ ...@@ -168,9 +166,11 @@
: {} : {}
" "
/> />
<span v-else class="tableSpan">{{ <span v-else class="tableSpan">
{{
scope.row[col2.value] scope.row[col2.value]
}}</span> }}
</span>
</template> </template>
<template v-else> <template v-else>
<el-input <el-input
...@@ -202,9 +202,11 @@ ...@@ -202,9 +202,11 @@
: {} : {}
" "
/> />
<span v-else class="tableSpan">{{ <span v-else class="tableSpan">
{{
scope.row[col2.value] scope.row[col2.value]
}}</span> }}
</span>
</template> </template>
</template> </template>
...@@ -216,6 +218,10 @@ ...@@ -216,6 +218,10 @@
placeholder="请选择" placeholder="请选择"
no-data-text=" " no-data-text=" "
no-match-text=" " no-match-text=" "
:disabled="disabled"
:remote="col2.remote"
:allow-create="col2.allowCreate"
:remote-method="col2.remoteMethod"
@change=" @change="
col2.enterFunc col2.enterFunc
? col2.enterFunc(scope.row, scope.$index) ? col2.enterFunc(scope.row, scope.$index)
...@@ -224,11 +230,7 @@ ...@@ -224,11 +230,7 @@
scope.$index scope.$index
) )
" "
:disabled="disabled"
:remote="col2.remote"
:allow-create="col2.allowCreate"
@focus="changeSelect(scope.row)" @focus="changeSelect(scope.row)"
:remote-method="col2.remoteMethod"
> >
<el-option <el-option
v-for="item in col2.opts v-for="item in col2.opts
...@@ -268,8 +270,8 @@ ...@@ -268,8 +270,8 @@
column.tabType === 'selection' && column.tabType === 'selection' &&
column.operType === 'checkbox' column.operType === 'checkbox'
" "
style="margin-left: 4px"
v-model="column['checkAll']" v-model="column['checkAll']"
style="margin-left: 4px"
@change="handleCheckAllChange($event, column)" @change="handleCheckAllChange($event, column)"
></el-checkbox> ></el-checkbox>
</template> </template>
...@@ -283,15 +285,18 @@ ...@@ -283,15 +285,18 @@
<template v-for="(op, opIndex) in column.operations"> <template v-for="(op, opIndex) in column.operations">
<template v-if="!op.isHidden || !op.isHidden(scope.row)"> <template v-if="!op.isHidden || !op.isHidden(scope.row)">
<el-dropdown <el-dropdown
size="large"
v-if="op.type === 'dropdown'" v-if="op.type === 'dropdown'"
:key="opIndex" :key="opIndex"
size="large"
style="margin: 0 10px" style="margin: 0 10px"
trigger="click" trigger="click"
> >
<el-button type="primary" :size="size"> <el-button type="primary" :size="size">
{{ op.title || "更多操作" {{ op.title || "更多操作"
}}<i class="el-icon-arrow-down el-icon--right"></i> }}
<i
class="el-icon-arrow-down el-icon--right"
></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item
...@@ -329,24 +334,24 @@ ...@@ -329,24 +334,24 @@
v-else-if="op.type === 'switch'" v-else-if="op.type === 'switch'"
:key="opIndex" :key="opIndex"
class="switch-cell" class="switch-cell"
@click="handleSwitch(scope.row, scope.$index, op)"
:disabled=" :disabled="
op.formatter op.formatter
? op.formatter(scope.row).disabled ? op.formatter(scope.row).disabled
: false : false
" "
@click="handleSwitch(scope.row, scope.$index, op)"
> >
<el-switch <el-switch
v-model="scope.row[column.value]" v-model="scope.row[column.value]"
:active-value="op.activeValue" :active-value="op.activeValue"
:inactive-value="op.inactiveValue" :inactive-value="op.inactiveValue"
> ></el-switch>
</el-switch>
</div> </div>
<!-- 操作文字按钮 -->
<el-button <el-button
v-else v-else
:size="size"
:key="opIndex" :key="opIndex"
:size="size"
:disabled=" :disabled="
op.formatter op.formatter
? op.formatter(scope.row).disabled ? op.formatter(scope.row).disabled
...@@ -359,7 +364,7 @@ ...@@ -359,7 +364,7 @@
: op.type || '' : op.type || ''
" "
:icon="op.icon" :icon="op.icon"
@click="op.func(scope.row, scope.$index)" @click="op.isIndex ? op.func(scope.row, scope.$index,opIndex) :op.func(scope.row, scope.$index)"
> >
{{ {{
op.formatter op.formatter
...@@ -378,9 +383,7 @@ ...@@ -378,9 +383,7 @@
? column.operations.formatter(scope.row) ? column.operations.formatter(scope.row)
: column.operations" : column.operations"
> >
<template <template v-if="!operate.isHidden || !operate.isHidden(scope.row)">
v-if="!operate.isHidden || !operate.isHidden(scope.row)"
>
<el-tooltip <el-tooltip
v-if="operate.tips" v-if="operate.tips"
:key="operIndex + Date.parse(new Date())" :key="operIndex + Date.parse(new Date())"
...@@ -452,9 +455,11 @@ ...@@ -452,9 +455,11 @@
: {} : {}
" "
/> />
<span v-else class="tableSpan">{{ <span v-else class="tableSpan">
{{
scope.row[column.value] scope.row[column.value]
}}</span> }}
</span>
</template> </template>
<template v-else> <template v-else>
<el-input <el-input
...@@ -486,9 +491,11 @@ ...@@ -486,9 +491,11 @@
: {} : {}
" "
/> />
<span v-else class="tableSpan">{{ <span v-else class="tableSpan">
{{
scope.row[column.value] scope.row[column.value]
}}</span> }}
</span>
</template> </template>
</template> </template>
...@@ -505,9 +512,11 @@ ...@@ -505,9 +512,11 @@
:value-format="column.valueFormat" :value-format="column.valueFormat"
:size="column.size" :size="column.size"
></el-date-picker> ></el-date-picker>
<span v-else class="tableSpan">{{ <span v-else class="tableSpan">
{{
scope.row[column.value] scope.row[column.value]
}}</span> }}
</span>
</template> </template>
<template v-if="column.operType === 'textarea'"> <template v-if="column.operType === 'textarea'">
...@@ -531,19 +540,19 @@ ...@@ -531,19 +540,19 @@
no-data-text=" " no-data-text=" "
no-match-text=" " no-match-text=" "
:disabled="disabled" :disabled="disabled"
:remote="column.remote"
:allow-create="column.allowCreate"
:remote-method="column.remoteMethod"
@change=" @change="
column.enterFunc column.enterFunc
? column.enterFunc(scope.row, scope.$index) ? column.enterFunc(scope.row, scope.$index)
: changeProject(scope.row[column.value], scope.$index) : changeProject(scope.row[column.value], scope.$index)
" "
:remote="column.remote"
:allow-create="column.allowCreate"
@focus=" @focus="
column.focusFunc column.focusFunc
? column.focusFunc(scope.row, scope.$index) ? column.focusFunc(scope.row, scope.$index)
: {} : {}
" "
:remote-method="column.remoteMethod"
> >
<el-option <el-option
v-for="item in column.opts v-for="item in column.opts
...@@ -557,9 +566,7 @@ ...@@ -557,9 +566,7 @@
</template> </template>
<template v-if="column.operType === 'checkbox'"> <template v-if="column.operType === 'checkbox'">
<el-checkbox <el-checkbox v-model="scope.row[column.value]"></el-checkbox>
v-model="scope.row[column.value]"
></el-checkbox>
</template> </template>
<!-- 模糊查询输入 --> <!-- 模糊查询输入 -->
...@@ -615,7 +622,7 @@ ...@@ -615,7 +622,7 @@
<template v-else-if="column.operType === 'label'"> <template v-else-if="column.operType === 'label'">
<span>{{scope.row[column.value]}}</span> <span>{{scope.row[column.value]}}</span>
</template> --> </template>-->
<template v-else-if="column.operType === 'upload'"> <template v-else-if="column.operType === 'upload'">
<el-button <el-button
...@@ -623,8 +630,7 @@ ...@@ -623,8 +630,7 @@
style="float: left" style="float: left"
type="primary" type="primary"
@click="column.func(scope.$index)" @click="column.func(scope.$index)"
>上传</el-button >上传</el-button>
>
<span <span
v-if="scope.row.imgUrl" v-if="scope.row.imgUrl"
style=" style="
...@@ -635,15 +641,13 @@ ...@@ -635,15 +641,13 @@
color: #409eff; color: #409eff;
" "
@click="column.enlargeFunc(scope.row.imgUrl)" @click="column.enlargeFunc(scope.row.imgUrl)"
>{{ scope.row.imgUrl }}</span >{{ scope.row.imgUrl }}</span>
>
<el-button <el-button
v-if="scope.row.imgUrl" v-if="scope.row.imgUrl"
style="float: left; margin-left: 5px" style="float: left; margin-left: 5px"
type="primary" type="primary"
@click="column.delFunc(scope.row, scope.$index)" @click="column.delFunc(scope.row, scope.$index)"
>删除</el-button >删除</el-button>
>
</template> </template>
<!-- 图片 --> <!-- 图片 -->
<template v-if="column.operType === 'img'"> <template v-if="column.operType === 'img'">
...@@ -661,37 +665,26 @@ ...@@ -661,37 +665,26 @@
<!-- 消息 --> <!-- 消息 -->
<template v-if="column.operType === 'txt'"> <template v-if="column.operType === 'txt'">
<div :style="column.style1"> <div :style="column.style1">{{ scope.row[column.value1] }}</div>
{{ scope.row[column.value1] }} <div :style="column.style2">{{ scope.row[column.value2] }}</div>
</div>
<div :style="column.style2">
{{ scope.row[column.value2] }}
</div>
</template> </template>
<!-- html --> <!-- html -->
<template v-if="column.type === 'html'"> <template v-if="column.type === 'html'">
<div <div class="highlight" v-html="scope.row[column.value]"></div>
v-html="scope.row[column.value]"
class="highlight"
></div>
</template> </template>
<!-- 展开列表 --> <!-- 展开列表 -->
<template v-if="column.tabType === 'expand'"> <template v-if="column.tabType === 'expand'">
<el-form <el-form label-position="right" class="demo-table-expand" label-width="130px">
label-position="right"
class="demo-table-expand"
label-width="130px"
>
<template v-for="(expand, index) in column.expandColumns"> <template v-for="(expand, index) in column.expandColumns">
<el-form-item <el-form-item
:label="`【${expand.label}】`"
:key="index"
v-if="!expand.hidden" v-if="!expand.hidden"
:key="index"
:label="`【${expand.label}】`"
> >
<!-- 字体高亮 --> <!-- 字体高亮 -->
<div <div
class="el-alert el-alert--info is-light"
v-if="scope.row[expand.value]" v-if="scope.row[expand.value]"
class="el-alert el-alert--info is-light"
> >
<div <div
class="el-alert__content highlight" class="el-alert__content highlight"
...@@ -712,6 +705,7 @@ ...@@ -712,6 +705,7 @@
<div v-if="pageSize && totalCounts > 0" class="pagination-footer"> <div v-if="pageSize && totalCounts > 0" class="pagination-footer">
<span class="description">{{ description }}</span> <span class="description">{{ description }}</span>
<el-pagination <el-pagination
background
:current-page="currentPage" :current-page="currentPage"
:page-sizes="pageSizes" :page-sizes="pageSizes"
:page-size="pageSize" :page-size="pageSize"
...@@ -726,8 +720,20 @@ ...@@ -726,8 +720,20 @@
<script> <script>
import resize from "./resize.js" import resize from "./resize.js"
import { mapGetters } from "vuex"
export default { export default {
name: "ElTableSelf", name: "ElTableSelf",
// filters: {
// statusFilter(status) {
// const typeMap = ['warm', 'success', 'danger']
// return typeMap[status]
// },
// statusFilter2(status) {
// const typeMap = ['danger', 'success']
// return typeMap[status]
// }
// },
mixins: [resize],
props: { props: {
listLoading: Boolean, // tab 加载层 listLoading: Boolean, // tab 加载层
...@@ -761,21 +767,13 @@ export default { ...@@ -761,21 +767,13 @@ export default {
rowStyle: Function, rowStyle: Function,
defaultExpandAll: Boolean, defaultExpandAll: Boolean,
}, },
// filters: {
// statusFilter(status) {
// const typeMap = ['warm', 'success', 'danger']
// return typeMap[status]
// },
// statusFilter2(status) {
// const typeMap = ['danger', 'success']
// return typeMap[status]
// }
// },
mixins: [resize],
computed: { computed: {
totalCounts() { totalCounts() {
return this.totalCount - 0 return this.totalCount - 0
}, },
...mapGetters({
fontSize: "table/fontSize",
}),
}, },
methods: { methods: {
// switch点击 // switch点击
...@@ -857,6 +855,7 @@ export default { ...@@ -857,6 +855,7 @@ export default {
} }
} }
.el-table-self { .el-table-self {
border: 1px solid #f6f6f6;
margin-top: 20px; margin-top: 20px;
.tab-svg { .tab-svg {
width: 24px; width: 24px;
...@@ -930,7 +929,7 @@ export default { ...@@ -930,7 +929,7 @@ export default {
::v-deep .default { ::v-deep .default {
th { th {
background-color: #eef5fd !important; background-color: #f6f6f6 !important;
color: #586276; color: #586276;
} }
} }
......
<template> <template>
<el-row class="el-upload-self"> <el-row class="el-upload-self">
<el-upload <el-upload
:multiple="multiple"
ref="upload" ref="upload"
:multiple="multiple"
class="avatar-uploader"
:action="action" :action="action"
:headers="headers" :headers="headers"
:list-type="listType" :list-type="listType"
...@@ -19,27 +20,27 @@ ...@@ -19,27 +20,27 @@
:drag="drag" :drag="drag"
:disabled="disabled" :disabled="disabled"
> >
<!-- :http-request="handleUpload" -->
<template v-if="drag"> <template v-if="drag">
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> <div class="el-upload__text">
将文件拖到此处,或
<em>点击上传</em>
</div>
</template> </template>
<template v-else-if="listType === 'picture-card'"> <template v-else-if="listType === 'picture-card'">
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
</template> </template>
<template v-else> <template v-else>
<el-button size="small" type="primary">点击上传</el-button> <!-- <el-button size="middle" :type="btnType">点击上传</el-button> -->
<!-- <img v-if="imageUrl" :src="imageUrl" class="avatar" /> -->
<i class="el-icon-plus avatar-uploader-icon"></i>
</template> </template>
<div slot="tip" class="el-upload__tip">{{ tip }}</div> <div slot="tip" class="el-upload__tip">{{ tip }}</div>
</el-upload> </el-upload>
<el-image <el-image ref="image" style="display: none" :src="imgUrl" :preview-src-list="previewList"></el-image>
style="display: none"
:src="imgUrl"
:preview-src-list="previewList"
ref="image"
>
</el-image>
</el-row> </el-row>
</template> </template>
...@@ -47,14 +48,19 @@ ...@@ -47,14 +48,19 @@
import { getAccessToken } from "@/utils/accessToken" import { getAccessToken } from "@/utils/accessToken"
import { delFile } from "@/api/file" import { delFile } from "@/api/file"
export default { export default {
name: "el-upload-self", name: "ElUploadSelf",
props: { props: {
accept: { type: String, default: "image/*" }, accept: { type: String, default: "image/*" },
disabled: { disabled: {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
bucketName: { type: String }, //后端上传文件路径(参数) uploadQuery: {
type: Object,
default: () => {
return {}
},
}, //后端上传文件路径(参数)
listType: String, listType: String,
tip: String, tip: String,
multiple: Boolean, multiple: Boolean,
...@@ -72,7 +78,11 @@ export default { ...@@ -72,7 +78,11 @@ export default {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
value: Array,//上传文件数组 绑定数组 btnType: {
type: String,
default: "primary",
},
value: Array, //上传文件数组 绑定数组
}, },
data() { data() {
return { return {
...@@ -85,25 +95,6 @@ export default { ...@@ -85,25 +95,6 @@ export default {
fileList: [], fileList: [],
} }
}, },
watch: {
value: {
handler(newValue, oldValue) {
if (newValue === oldValue) return
this.fileList = newValue.map((_) => {
return {
name: _.fileName,
url:
this.httpPrefix +
"/disease-data/file/" +
_.bucketName +
"-" +
_.uuidName,
}
})
},
immediate: true,
},
},
computed: { computed: {
headers() { headers() {
return { return {
...@@ -113,8 +104,7 @@ export default { ...@@ -113,8 +104,7 @@ export default {
action() { action() {
return ( return (
this.httpPrefix + this.httpPrefix +
"/disease-data/file/upload?bucketName=" + `/disease-data/file/upload?formId=${this.uploadQuery.formId}&patientId=${this.uploadQuery.patientId}&prefix=${this.uploadQuery.prefix}`
this.bucketName
) )
}, },
// 预览list // 预览list
...@@ -123,16 +113,40 @@ export default { ...@@ -123,16 +113,40 @@ export default {
return this.value.map((_) => { return this.value.map((_) => {
return ( return (
_.url || _.url ||
this.httpPrefix + `https://ds.cixincloud.com/geca-api/disease-data/file/info/${_.bucket_name}/${_.prefix}-${_.uuid_name}`
"/disease-data/file/" +
_.bucketName +
"-" +
_.uuidName
) )
}) })
}, },
}, },
watch: {
value: {
handler(newValue, oldValue) {
// console.log(this.value)
if (newValue === oldValue) return
this.fileList = newValue.map((_) => {
return {
name: _.file_name,
url: `https://ds.cixincloud.com/geca-api/disease-data/file/info/${_.bucket_name}/${_.prefix}-${_.uuid_name}`,
}
})
},
immediate: true,
},
},
methods: { methods: {
// 自定义上传方法
// handleUpload(param) {
// let formData = new FormData()
// fd.append("file", param.file) //传文件
// fd.append("formld", this.formld) //传formld
// // ajax.axiosPost(
// // url, //接口地址
// // fd, //formdata对象参数
// // (res) => {
// // console.log(res)
// // }
// // )
// },
// 上传前回调 // 上传前回调
beforeUpload(file) { beforeUpload(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
...@@ -154,7 +168,7 @@ export default { ...@@ -154,7 +168,7 @@ export default {
handleSuccess(res, file, fileList) { handleSuccess(res, file, fileList) {
const { data } = res const { data } = res
if (data) { if (data) {
this.value.push({ ...data, url: file.url }) this.value.push({ ...data })
} else { } else {
this.$message.warning(res.msg) this.$message.warning(res.msg)
this.$refs.upload.clearFiles() this.$refs.upload.clearFiles()
...@@ -163,27 +177,47 @@ export default { ...@@ -163,27 +177,47 @@ export default {
// 移除提醒 // 移除提醒
beforeRemove(file, fileList) { beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${file.fileName || file.name}?`) // console.log(file, fileList)
return this.$confirm(
`确定移除 ${file.file_name || file.name || "该照片"}?`
)
}, },
// 移除 // 移除
handleRemove({ url }, fileList) { handleRemove({ uuid_name }, fileList) {
const i = this.value.findIndex((_) => url.endsWith(_.uuidName)) const i = this.value.findIndex((_) => uuid_name == _.uuidName)
if (i > -1) this.value.splice(i, 1)// 静态移除 if (i > -1) this.value.splice(i, 1)
console.log("删了", this.value)
}, },
// 查看 // 查看/下载
handlePreview(file) { handlePreview(file) {
const name = file.fileName || file.name const name = file.fileName || file.name
this.title = name this.title = name
let responseUrl
if (file.response) {
const _ = file.response.data
responseUrl = `https://ds.cixincloud.com/geca-api/disease-data/file/info/${_.bucket_name}/${_.prefix}-${_.uuid_name}`
}
try {
if (name.match(/\.(png|jpg|jpeg)/)) { if (name.match(/\.(png|jpg|jpeg)/)) {
this.imgUrl = file.url this.imgUrl = file.url || responseUrl
this.$refs.image.clickHandler() this.$refs.image.clickHandler()
} else { } else {
const elink = document.createElement("a") const elink = document.createElement("a")
elink.download = name elink.download = name
elink.style.display = "none" elink.style.display = "none"
elink.href = file.url elink.href = file.url || responseUrl
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href) // 释放URL 对象
document.body.removeChild(elink)
}
} catch {
const elink = document.createElement("a")
elink.download = name
elink.style.display = "none"
elink.href = file.url || responseUrl
document.body.appendChild(elink) document.body.appendChild(elink)
elink.click() elink.click()
URL.revokeObjectURL(elink.href) // 释放URL 对象 URL.revokeObjectURL(elink.href) // 释放URL 对象
...@@ -204,6 +238,46 @@ export default { ...@@ -204,6 +238,46 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.el-upload-self { .el-upload-self {
font-size: 14px; font-size: 14px;
margin-bottom: 15px; }
.avatar-uploader {
display: flex;
align-items: center;
}
::v-deep .avatar-uploader .el-upload {
border: 1px solid #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
::v-deep .avatar-uploader .el-upload:hover {
border-color: #409eff;
}
::v-deep .el-upload-list {
display: flex;
align-items: center;
transform: translateY(4px);
}
::v-deep .el-upload--picture-card {
width: 88px;
height: 88px;
line-height: 88px;
}
::v-deep .el-upload-list__item {
width: 88px;
height: 88px;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 88px;
height: 88px;
line-height: 88px;
text-align: center;
}
.avatar {
width: 88px;
height: 88px;
display: block;
} }
</style> </style>
<template>
<el-row class="el-upload-self">
<el-upload
ref="upload"
:multiple="multiple"
:class="[
'avatar-uploader',
value.length > 0 ? 'textUpload' : '',
accept == 'application/pdf' ? 'pdfUpload' : '',
]"
:action="action"
:headers="headers"
:list-type="listType"
:on-preview="handlePreview"
:on-remove="handleRemove"
:on-success="handleSuccess"
:on-exceed="handleExceed"
:on-change="handleSelectFile"
:before-upload="beforeUpload"
:before-remove="beforeRemove"
:file-list="fileList"
:show-file-list="showFileList"
:accept="accept"
:limit="limit"
:drag="drag"
:disabled="disabled"
>
<template v-if="drag">
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
</template>
<template v-else-if="value.length">
<el-button size="middle" type="text">点击更换</el-button>
</template>
<template v-else-if="listType === 'picture-card' && !value.length">
<el-button size="middle" type="text">点击上传</el-button>
</template>
<template v-else>
<!-- <el-button size="middle" :type="btnType">点击上传</el-button> -->
<!-- <img v-if="imageUrl" :src="imageUrl" class="avatar" /> -->
<el-button size="middle" type="text">点击上传</el-button>
</template>
<div slot="file" slot-scope="{ file }">
<img
v-if="accept == 'image/*'"
class="el-upload-list__item-thumbnail"
:src="file.url"
alt=""
/>
<span v-if="accept == 'image/*'" class="el-upload-list__item-actions">
<span
class="el-upload-list__item-preview"
@click="handlePreview(file)"
>
<i class="el-icon-download"></i>
</span>
</span>
<el-tooltip
class="item"
effect="dark"
:content="file.name"
placement="top"
>
<div
v-if="accept != 'image/*'"
style="cursor: pointer"
class="fileNameText"
@click="handlePreview(file)"
>
{{ file.name }}
</div>
</el-tooltip>
</div>
<!-- <div slot="tip" class="el-upload__tip">{{ tip }}</div> -->
</el-upload>
<el-image
ref="image"
style="display: none"
:src="imgUrl"
:preview-src-list="previewList"
>
</el-image>
</el-row>
</template>
<script>
import { getAccessToken } from "@/utils/accessToken"
import { delFile } from "@/api/file"
export default {
name: "ElUploadSelf",
props: {
accept: { type: String, default: "image/*" },
disabled: {
type: Boolean,
default: false,
},
uploadQuery: {
type: Object,
default: () => {
return {}
},
}, //后端上传文件路径(参数)
listType: String,
tip: String,
multiple: Boolean,
limit: {
type: Number,
default: 9,
},
fileSize: Number,
loadText: String,
showFileList: {
type: Boolean,
default: true,
},
drag: {
type: Boolean,
default: false,
},
btnType: {
type: String,
default: "primary",
},
value: {
type: Array,
default: () => [],
}, //上传文件数组 绑定数组
},
data() {
return {
imgUrl: "",
title: "",
httpPrefix:
process.env.NODE_ENV === "development"
? "/api"
: process.env.VUE_APP_BASE_API,
fileList: [],
}
},
computed: {
headers() {
return {
Authorization: `Bearer ${getAccessToken()}`,
}
},
action() {
return this.httpPrefix + `/cloud-upms/file/upload`
},
// 预览list
previewList() {
console.log(this.value)
if (!this.value.length || this.accept != "image/*") return []
return this.value.map((_) => {
return (
_.url ||
`https://ds.cixincloud.com/geca-api/disease-data/file/info/${_.bucketName}/${_.uuidName}`
)
})
},
},
watch: {
value: {
handler(newValue, oldValue) {
if (newValue === oldValue) return
this.fileList = newValue.map((_) => {
return {
name: _.fileName,
url: `https://ds.cixincloud.com/geca-api/disease-data/file/info/${_.bucketName}/${_.uuidName}`,
}
})
},
immediate: true,
},
},
methods: {
handleSelectFile(file, fileList) {
if (fileList.length > 1) {
this.value.shift()
fileList.shift()
}
},
// 上传前回调
beforeUpload(file) {
return new Promise((resolve, reject) => {
const size = this.fileSize
if (size && file.size > size) {
this.$message.error("大小超出限制" + this.tip)
reject()
}
resolve()
})
},
// 超出限制
handleExceed(files, fileList) {
this.$message.error(`最多可上传${this.limit}个文件!`)
},
// 上传成功
handleSuccess(res, file, fileList) {
const { data } = res
if (data) {
this.value.push({ ...data, url: file.url })
// 上传成功
this.$emit("input", this.value)
this.$emit("fileSuccess")
} else {
this.$message.warning(res.msg)
this.$refs.upload.clearFiles()
}
},
// 移除提醒
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${file.file_name || file.name}?`)
},
// 移除
handleRemove({ url }, fileList) {
if (fileList.length > 1) {
fileList.shift()
}
this.value = []
this.$emit("input", this.value)
// const i = this.value.findIndex((_) => url.endsWith(_.uuid_name))
// if (i > -1) this.value.splice(i, 1) // 静态移除
},
// 查看
handlePreview(file) {
const name = file.fileName || file.name
this.title = name
let responseUrl
if (file.response) {
const _ = file.response.data
responseUrl = `https://ds.cixincloud.com/geca-api/disease-data/file/info/${_.bucketName}/${_.uuidName}`
}
try {
if (name.match(/\.(png|jpg|jpeg)/)) {
this.imgUrl = file.url || responseUrl
this.$refs.image.clickHandler()
} else {
const elink = document.createElement("a")
elink.download = name
elink.style.display = "none"
elink.href = file.url || responseUrl
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href) // 释放URL 对象
document.body.removeChild(elink)
}
} catch {
const elink = document.createElement("a")
elink.download = name
elink.style.display = "none"
elink.href = file.url || responseUrl
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href) // 释放URL 对象
document.body.removeChild(elink)
}
},
},
}
</script>
<style lang="scss">
.el-upload-self {
.el-upload {
position: relative;
}
}
</style>
<style lang="scss" scoped>
.el-upload-self {
font-size: 14px;
}
::v-deep .avatar-uploader {
display: flex;
align-items: center;
.el-upload--picture-card {
height: 20px;
transform: translateY(-4px);
}
}
::v-deep .pdfUpload {
display: flex;
flex-direction: row-reverse;
justify-content: flex-end;
.el-upload--text {
height: 20px;
transform: translateY(-4px);
}
.el-upload-list__item {
transform: translateY(-6px);
// width: 158px;
height: 20px;
}
}
::v-deep .avatar-uploader .el-upload {
border: none;
width: 80px;
height: 30px;
line-height: 0px;
}
::v-deep .textUpload {
align-items: flex-start;
.el-upload {
border: none;
width: 80px;
height: 30px;
line-height: 0px;
}
.el-upload--text {
height: 20px;
transform: translateY(-4px);
}
}
::v-deep .avatar-uploader .el-upload:hover {
border-color: #409eff;
}
::v-deep .el-upload-list__item {
width: 88px;
height: 88px;
&:hover {
background-color: #fff;
}
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 88px;
height: 88px;
line-height: 88px;
text-align: center;
}
.avatar {
width: 88px;
height: 88px;
display: block;
}
.fileNameText {
width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
// ::v-deep .el-upload--picture-card {
// width: none;
// height: none;
// line-height: 0px;
// border: none;
// }
</style>
<template>
<div style="min-width: 1440px; overflow: overlay">
<header class="layout-header">
<div class="logotitle">
<div class="leftLogo"></div>
<div class="rightText">
国家消化道早癌防治中心联盟 <br />早期胃癌筛查项目
</div>
</div>
<div v-if="!allianceToken" class="login">
<div class="login_title text-center">
筛查随访数据库登录
<el-form
ref="form"
label-position="top"
:model="form"
label-suffix=":"
label-width="100%"
:rules="rules"
>
<el-form-item prop="username" label="登录名">
<el-input
v-model="form.username"
placeholder="请输入登录名"
></el-input>
</el-form-item>
<el-form-item prop="password" label="密码">
<el-input
v-model="form.password"
type="password"
placeholder="请输入密码"
></el-input>
</el-form-item>
<el-form-item>
<el-button
type="primary"
class="login_button"
:loading="loading"
@click="handleSubmit('form')"
>登录</el-button
>
</el-form-item>
</el-form>
</div>
</div>
<div v-if="allianceToken" class="userInfo">
<div class="top">
<div class="text">欢迎,{{ userInfo.name }}</div>
<div class="exit" @click="logout">退出</div>
</div>
<div class="bot" @click="$router.push('/')">
<div class="left_chart">
<img src="@/assets/img/Home/chart.png" alt="" />
</div>
<div class="right_text">数据中心</div>
</div>
</div>
</header>
<div class="sider">
<el-menu
mode="horizontal"
:default-active="currentRoute"
class="siderMenu"
router
>
<el-menu-item
v-for="(item, index) in menuList"
:key="index"
:index="item.route"
style="width: 10%; text-align: center; min-width: 120px"
>
{{ item.name }}
</el-menu-item>
</el-menu>
</div>
<section style="overflow: hidden; padding: 32px 10%; background: #f3f3f3">
<transition name="fade-transform" mode="out-in">
<router-view></router-view>
</transition>
</section>
<footer class="layout-footer-center text-center">
copyright@ 联盟信息等
</footer>
</div>
</template>
<script>
import { loginRSA } from "@/config/settings"
import { getAccessToken } from "@/utils/accessToken"
import { encrypt, decrypt } from "@/utils/encryption"
export default {
data() {
return {
form: {
username: "",
password: "",
},
menuList: [
{
route: "/home",
name: "首页",
},
{
route: "/allianceintroduction",
name: "联盟介绍",
},
{
route: "/healthpopularization",
name: "健康科普",
},
{
route: "/scientificresearch",
name: "科学研究",
},
{
route: "/casesharing",
name: "案例分享",
},
{
route: "/solution",
name: "解决方案",
},
],
loading: false,
rules: {
username: [
{ required: true, message: "请输入用户名", trigger: "blur" },
],
password: [
{ required: true, message: "请输入密码", trigger: "blur" },
{
type: "string",
min: 6,
message: "The password length cannot be less than 6 bits",
trigger: "blur",
},
],
},
allianceToken: getAccessToken(),
currentRoute: this.$route.path,
userInfo: {},
}
},
watch: {
$route: {
handler(v) {
this.currentRoute = this.$route.path
},
deep: true,
},
},
mounted() {
// if (localStorage.getItem('allianceToken')) {
// this.$router.push('/datacenter/home')
// }
this.userInfo = JSON.parse(localStorage.getItem("userInfo"))
},
methods: {
handleSubmit(name) {
this.$refs[name].validate((valid) => {
if (valid) {
this.loading = true
const data = Object.assign({}, this.form)
if (loginRSA) {
data.password = encodeURIComponent(encrypt(data.password))
data.userName = encodeURIComponent(encrypt(data.username))
}
this.$store
.dispatch("user/login", data)
.then(() => {
const routerPath =
!this.redirect || this.redirect === "/404" ? "/" : this.redirect
this.$router.push({ path: routerPath }).catch((e) => {})
setTimeout(() => {
this.loading = false
}, 800)
})
.catch((e) => {
this.loading = false
})
}
})
},
logout() {
const h = this.$createElement
this.$msgbox({
title: "提示",
message: h("p", null, [h("span", null, "是否确认退出登录?")]),
showCancelButton: true,
confirmButtonText: "确定",
cancelButtonText: "取消",
beforeClose: (action, instance, done) => {
if (action === "confirm") {
instance.confirmButtonLoading = true
instance.confirmButtonText = "执行中..."
this.$store.dispatch("user/logout").then(() => {
this.allianceToken = ""
done()
instance.confirmButtonLoading = false
})
} else {
done()
}
},
}).then((action) => {
// this.$message({
// type: "info",
// message: "action: " + action,
// })
})
},
},
}
</script>
<style lang="scss" scoped>
.layout-header {
height: 400px;
width: 100%;
background: url("~@/assets/img/Home/homeheaderbg.png") no-repeat;
background-position: center;
background-size: cover;
display: flex;
padding: 0 10% 0 5%;
justify-content: space-between;
align-items: center;
.logotitle {
height: 220px;
display: flex;
.leftLogo {
width: 72px;
height: 72px;
background: url("~@/assets/img/Home/stomach.png") no-repeat;
background-position: center;
background-size: cover;
}
.rightText {
min-width: 570px;
font-size: 42px;
font-family: AlibabaPuHuiTiB;
color: #ffffff;
margin-left: 14px;
}
}
.login {
width: 23%;
min-width: 334px;
height: 326px;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0px 12px 36px 0px rgba(26, 35, 87, 0.4);
border-radius: 8px;
padding: 18px 40px;
.login_title {
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: #4e68ff;
// line-height: 60px;
}
.login_button {
width: 100%;
height: 40px;
margin-top: 20px;
background: #4e68ff;
}
}
.userInfo {
height: 160px;
display: flex;
flex-direction: column;
align-items: flex-end;
.top {
display: flex;
align-items: center;
.text {
font-size: 20px;
font-family: AlibabaPuHuiTiM;
color: #ffffff;
margin: 10px 24px;
}
.exit {
font-size: 16px;
cursor: pointer;
font-family: AlibabaPuHuiTiR;
text-decoration: underline;
color: rgba(255, 255, 255, 0.8);
line-height: 16px;
&:active {
color: #4e68ff;
}
}
}
.bot {
width: 183px;
height: 60px;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0px 12px 36px 0px rgba(23, 44, 105, 0.3);
border-radius: 8px;
display: flex;
margin-top: 32px;
cursor: pointer;
.left_chart {
width: 60px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
img {
width: 36px;
height: 36px;
}
}
.right_text {
flex: 1;
background: #4e68ff;
border-radius: 0px 8px 8px 0px;
line-height: 60px;
font-size: 22px;
font-family: PingFangSC-Medium, PingFang SC;
color: #f1f5fd;
text-align: center;
}
}
}
}
.siderMenu {
padding: 0 10%;
background: #edefff;
}
.layout-footer-center {
width: 100%;
height: 108px;
background: #efefef;
line-height: 108px;
}
.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover,
.el-menu--horizontal > .el-menu-item:not(.is-disabled):focus {
background-color: transparent;
}
.el-form-item {
text-align: left;
}
/* fade-transform */
.fade-transform-leave-active,
.fade-transform-enter-active {
transition: all 0.3s;
}
.fade-transform-enter {
opacity: 0;
transform: translateX(-30px);
}
.fade-transform-leave-to {
opacity: 0;
transform: translateX(30px);
}
</style>
...@@ -27,16 +27,16 @@ router.beforeResolve(async (to, from, next) => { ...@@ -27,16 +27,16 @@ router.beforeResolve(async (to, from, next) => {
let hasToken = store.getters["user/accessToken"] let hasToken = store.getters["user/accessToken"]
if (!loginInterception) hasToken = true if (!loginInterception) hasToken = true
if (hasToken) { if (hasToken) {
if (to.path === "/login") { if (to.path === "/home") {
next({ next()
path: "/", // { path: "/" }
})
if (progressBar) VabProgress.done() if (progressBar) VabProgress.done()
} else if (routesWhiteList.indexOf(to.path) !== -1) { } else if (routesWhiteList.indexOf(to.path) !== -1) {
next() next()
} else { } else {
const userInfo = store.getters["user/userInfo"] const userInfo = store.getters["user/userInfo"]
if (userInfo) { if (userInfo) {
console.log(to.path)
next() next()
} else { } else {
try { try {
...@@ -48,6 +48,7 @@ router.beforeResolve(async (to, from, next) => { ...@@ -48,6 +48,7 @@ router.beforeResolve(async (to, from, next) => {
accessRoutes = await store.dispatch("routes/setAllRoutes", menulist) accessRoutes = await store.dispatch("routes/setAllRoutes", menulist)
} }
router.addRoutes(accessRoutes) router.addRoutes(accessRoutes)
console.log(router)
if (accessRoutes.length === 1) { if (accessRoutes.length === 1) {
Message({ Message({
message: "暂无菜单权限,请联系管理员", message: "暂无菜单权限,请联系管理员",
...@@ -56,7 +57,7 @@ router.beforeResolve(async (to, from, next) => { ...@@ -56,7 +57,7 @@ router.beforeResolve(async (to, from, next) => {
}) })
await store.dispatch("user/resetAccessToken") await store.dispatch("user/resetAccessToken")
await resetRouter() await resetRouter()
next(`/login`) next(`/home`)
if (progressBar) VabProgress.done() if (progressBar) VabProgress.done()
} else { } else {
store.dispatch("dict/getDictData") //字典获取 store.dispatch("dict/getDictData") //字典获取
...@@ -67,7 +68,7 @@ router.beforeResolve(async (to, from, next) => { ...@@ -67,7 +68,7 @@ router.beforeResolve(async (to, from, next) => {
} }
} catch (error) { } catch (error) {
await store.dispatch("user/resetAccessToken") await store.dispatch("user/resetAccessToken")
next(`/login?redirect=${to.path}`) next(`/home?redirect=${to.path}`)
if (progressBar) VabProgress.done() if (progressBar) VabProgress.done()
} }
} }
...@@ -76,7 +77,7 @@ router.beforeResolve(async (to, from, next) => { ...@@ -76,7 +77,7 @@ router.beforeResolve(async (to, from, next) => {
if (routesWhiteList.indexOf(to.path) !== -1) { if (routesWhiteList.indexOf(to.path) !== -1) {
next() next()
} else { } else {
next(`/login?redirect=${to.path}`) next(`/home?redirect=${to.path}`)
if (progressBar) VabProgress.done() if (progressBar) VabProgress.done()
} }
} }
......
...@@ -24,7 +24,18 @@ module.exports = { ...@@ -24,7 +24,18 @@ module.exports = {
// 路由模式,可选值为 history 或 hash // 路由模式,可选值为 history 或 hash
routerMode: "hash", routerMode: "hash",
//不经过token校验的路由 //不经过token校验的路由
routesWhiteList: ["/login", "/404", "/401", "/sso", "/test"], routesWhiteList: [
// "/login",
"/404",
"/401",
"/sso",
"/test",
"/home",
"/allianceintroduction",
"/casesharing",
"/scientificresearch",
"/healthpopularization",
],
//加载时显示文字 //加载时显示文字
loadingText: "正在加载中...", loadingText: "正在加载中...",
//token名称 //token名称
...@@ -33,6 +44,8 @@ module.exports = { ...@@ -33,6 +44,8 @@ module.exports = {
tokenTableName: "agcs", tokenTableName: "agcs",
//token存储位置localStorage sessionStorage cookie //token存储位置localStorage sessionStorage cookie
storage: "localStorage", storage: "localStorage",
// 前缀名
storagePrefixName: "agcs",
//是否显示logo //是否显示logo
logo: true, logo: true,
//是否国定头部 固定fixed 不固定noFixed //是否国定头部 固定fixed 不固定noFixed
......
...@@ -58,14 +58,14 @@ export default { ...@@ -58,14 +58,14 @@ export default {
}, },
}, },
watch: { watch: {
// $route: { $route: {
// handler(route) { handler(route) {
// if ("mobile" === this.device) { if ("mobile" === this.device) {
// this.$store.dispatch("settings/foldSideBar") this.$store.dispatch("settings/foldSideBar")
// } }
// }, },
// immediate: true, immediate: true,
// }, },
}, },
created() { created() {
//重载所有路由 //重载所有路由
......
...@@ -53,7 +53,8 @@ export default { ...@@ -53,7 +53,8 @@ export default {
async () => { async () => {
const fullPath = this.$route.fullPath const fullPath = this.$route.fullPath
await this.$store.dispatch("user/logout") await this.$store.dispatch("user/logout")
this.$router.push(`/login?redirect=${fullPath}`) this.$store.commit("table/removeSelectedIndex")
this.$router.push(`/home?redirect=${fullPath}`)
} }
) )
}, },
......
...@@ -4,10 +4,69 @@ ...@@ -4,10 +4,69 @@
<vab-remix-icon class="logo" icon-class="logo" /> <vab-remix-icon class="logo" icon-class="logo" />
<span class="hidden-xs-only">无症状人群胃癌筛查随访数据中心</span> <span class="hidden-xs-only">无症状人群胃癌筛查随访数据中心</span>
</div> </div>
<div class="right-panel"> <div class="userInfo">
<error-log></error-log> <error-log></error-log>
<!-- <avatar></avatar> -->
<div v-if="$route.path != '/auditqualitycontrol'" class="fontSelect">
<div
v-for="(item, index) in fontList"
:key="index"
class="font"
@click="changeFont(index)"
>
<div class="label">{{ item.label }}</div>
</div>
</div>
<div
v-show="curSelectedIndex != -1 && $route.path != '/auditqualitycontrol'"
class="community"
@click="openModalFlag"
>
<img src="~@/assets/img/DataCenter/shift.png" alt />
{{
curSelectedIndex != -1
? screeningList[curSelectedIndex - 1]
? screeningList[curSelectedIndex - 1].title
: ""
: ""
}}
</div>
<div class="user">
<img src="~@/assets/img/DataCenter/user.png" alt />
<avatar></avatar> <avatar></avatar>
</div> </div>
<el-popover
placement="top-start"
width="200"
trigger="click"
popper-class="message-pop"
>
<div
v-for="(item, index) in messageList"
:key="index"
class="message-box mb-24"
>
<div class="top-box mb-12">
<span class="blue-dot mt-5 mr-8"></span>
<span class="top-text">{{ item.date }}</span>
</div>
<div class="main-text ml-8">{{ item.message }}</div>
</div>
<template slot="reference">
<el-badge :value="messageCount" :class-name="'badge'">
<div class="user">
<img src="~@/assets/img/DataCenter/message.png" alt />
消息
</div>
</el-badge>
</template>
</el-popover>
<div class="user" @click="$router.push('/home')">
<img src="~@/assets/img/DataCenter/backhome.png" alt />
<span>返回首页</span>
</div>
</div>
</div> </div>
</template> </template>
...@@ -31,10 +90,50 @@ export default { ...@@ -31,10 +90,50 @@ export default {
FullScreenBar, FullScreenBar,
ThemeBar, ThemeBar,
}, },
props: {
curSelectedIndex: {
type: String,
default: "",
},
},
data() { data() {
return { return {
pulse: false, pulse: false,
isDot: true, isDot: true,
messageCount: 10,
screeningList: [
{
title: "社区筛查",
src: require("@/assets/img/DataCenter/shequ.png"),
},
{
title: "医院筛查",
src: require("@/assets/img/DataCenter/yiyuan.png"),
},
{
title: "体检筛查",
src: require("@/assets/img/DataCenter/tijian.png"),
},
],
fontList: [
{ fontSize: "-", label: "A-" },
{ fontSize: 14, label: "A" },
{ fontSize: "+", label: "A+" },
],
fontSize: localStorage.getItem("fontSize") - 0 || 14,
messageList: [
{
date: "2022-12-12",
message: "驳回修改病例【6条】",
},
{
date: "2022-12-12",
message: "驳回修改病例【6条】",
},
],
} }
}, },
computed: { computed: {
...@@ -46,6 +145,8 @@ export default { ...@@ -46,6 +145,8 @@ export default {
feedBackNumber: "user/feedBackNumber", feedBackNumber: "user/feedBackNumber",
}), }),
}, },
created() {},
mounted() {},
methods: { methods: {
handleCollapse() { handleCollapse() {
this.$store.dispatch("settings/changeCollapse") this.$store.dispatch("settings/changeCollapse")
...@@ -60,6 +161,27 @@ export default { ...@@ -60,6 +161,27 @@ export default {
this.pulse = false this.pulse = false
}, 1000) }, 1000)
}, },
openModalFlag() {
this.$emit("openModalFlag")
},
changeFont(i) {
let fontSize = this.fontList[i].fontSize
if (fontSize == "-") {
if (this.fontSize > 12) {
this.fontSize = this.fontSize - 2
}
} else if (fontSize == "+") {
if (this.fontSize < 18) {
this.fontSize = this.fontSize + 2
}
} else {
this.fontSize = 14
}
// this.fontIndex = i
this.$store.commit("table/setFontSize", this.fontSize)
localStorage.setItem("fontSize", this.fontSize)
console.log(this.fontSize)
},
}, },
} }
</script> </script>
...@@ -75,6 +197,7 @@ export default { ...@@ -75,6 +197,7 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
color: #fff; color: #fff;
border-radius: 0px 0px 4px 4px;
.left-panel { .left-panel {
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -104,63 +227,103 @@ export default { ...@@ -104,63 +227,103 @@ export default {
} }
} }
} }
.userInfo {
.right-panel {
display: flex; display: flex;
align-content: center;
align-items: center; align-items: center;
justify-content: flex-end; padding-right: 40px;
height: 74px; .fontSelect {
display: flex;
::v-deep { margin-right: 20px;
.user-avatar { .font {
margin-top: 2px; width: 40px;
margin-right: 5px; height: 40px;
font-weight: 600; background: #4e68ff;
border-radius: 4px;
border: 1px solid #ffffff;
text-align: center;
line-height: 40px;
cursor: pointer; cursor: pointer;
margin-left: 20px;
&:active {
box-sizing: border-box;
background: #ffffff;
height: 40px;
color: #4e68ff;
padding: 1px;
.label {
height: 36px;
border: 1px solid #4e68ff;
} }
.user-name {
position: relative;
margin-right: 35px;
margin-left: 5px;
font-weight: 600;
cursor: pointer;
} }
.user-name + i {
position: absolute;
top: 4px;
right: 15px;
} }
}
svg { .community {
width: 1em; width: 106px;
height: 1em; height: 30px;
margin-right: 20px; white-space: nowrap;
font-size: $base-font-size-big; background: rgba(255, 255, 255, 0.1);
color: $base-color-gray; color: #fff;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer; cursor: pointer;
fill: $base-color-gray; img {
margin-right: 4px;
width: 18px;
height: 18px;
} }
}
button { .user {
svg { white-space: nowrap;
margin-right: 0; margin-left: 40px;
color: $base-color-white; height: 30px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer; cursor: pointer;
fill: $base-color-white; color: #fff;
img {
margin-right: 4px;
width: 18px;
height: 18px;
} }
} }
}
.el-badge { }
margin-right: 20px; .message-box {
padding: 0 5px; .top-box {
svg { display: flex;
margin-right: 0px; flex-direction: row;
.blue-dot {
width: 4px;
height: 4px;
background: #4b65ff;
display: block;
border-radius: 100%;
}
.top-text {
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #999999;
} }
} }
}
// .el-popper {
// ::v-deep .popper__arrow {
// display: none;
// }
// }
</style>
<style lang="scss">
.message-pop {
padding: 40px 28px 12px;
z-index: 10;
.popper__arrow::after {
display: none;
} }
.popper__arrow {
display: none;
} }
} }
</style> </style>
<template> <template>
<span v-if="themeBar"> <span v-if="themeBar">
<vab-icon <vab-icon title="主题配置" :icon="['fas', 'palette']" @click="handleChangeTheme" />
title="主题配置"
:icon="['fas', 'palette']"
@click="handleChangeTheme"
/>
<div class="theme-bar-setting"> <div class="theme-bar-setting">
<div @click="handleChangeTheme"> <div @click="handleChangeTheme">
<vab-icon :icon="['fas', 'palette']" /> <vab-icon :icon="['fas', 'palette']" />
...@@ -86,11 +82,7 @@ ...@@ -86,11 +82,7 @@
></el-color-picker> ></el-color-picker>
</el-form-item> </el-form-item>
<el-form-item label="菜单文字色"> <el-form-item label="菜单文字色">
<el-color-picker <el-color-picker v-model="theme.menuColor" :predefine="['#000', '#fff']" show-alpha></el-color-picker>
v-model="theme.menuColor"
:predefine="['#000', '#fff']"
show-alpha
></el-color-picker>
</el-form-item> </el-form-item>
<el-form-item label="标签主题色"> <el-form-item label="标签主题色">
<el-color-picker <el-color-picker
...@@ -115,13 +107,11 @@ ...@@ -115,13 +107,11 @@
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button @click="handleSetDfaultTheme">恢复默认</el-button> <el-button @click="handleSetDfaultTheme">恢复默认</el-button>
<el-button type="primary" @click="handleSaveTheme" <el-button type="primary" @click="handleSaveTheme">保存</el-button>
>保存</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div></el-scrollbar </div>
> </el-scrollbar>
</el-drawer> </el-drawer>
</span> </span>
</template> </template>
......
export { default as TagsBar } from "zx-layouts/zx-tags-bar" export { default as TagsBar } from "zx-layouts/zx-tags-bar"
export { default as SideBar } from "zx-layouts/zx-side-bar" export { default as SideBar } from "@/layouts/components/zx-side-bar"
export { default as Breadcrumb } from "zx-layouts/zx-breadcrumb" export { default as Breadcrumb } from "zx-layouts/zx-breadcrumb"
export { default as FullScreenBar } from "zx-layouts/zx-full-screen-bar" export { default as FullScreenBar } from "zx-layouts/zx-full-screen-bar"
export { default as ErrorLog } from "zx-layouts/zx-error-log" export { default as ErrorLog } from "zx-layouts/zx-error-log"
......
<template>
<div v-if="!item.hidden">
<template
v-if="
handleChildren(item.children, item) &&
(!onlyOneChildren.children || onlyOneChildren.notShowChildren) &&
!item.alwaysShow
"
>
<app-link
v-if="onlyOneChildren.meta"
:target="onlyOneChildren.meta.target ? onlyOneChildren.meta.target : ''"
:to="handlePath(onlyOneChildren.path)"
>
<el-menu-item
:class="{ 'submenu-title-noDropdown': !isNest }"
:index="handlePath(onlyOneChildren.path)"
>
<vab-icon
v-if="onlyOneChildren.meta && onlyOneChildren.meta.icon"
:icon="['fas', onlyOneChildren.meta.icon]"
class="vab-nav-icon"
/>
<vab-remix-icon
v-if="onlyOneChildren.meta && onlyOneChildren.meta.remixIcon"
:icon-class="onlyOneChildren.meta.remixIcon"
class="vab-nav-icon"
/>
<span slot="title">{{ onlyOneChildren.meta.title }}</span>
<el-tag
v-if="onlyOneChildren.meta && onlyOneChildren.meta.badge"
type="danger"
effect="dark"
>{{ onlyOneChildren.meta.badge }}</el-tag>
</el-menu-item>
</app-link>
</template>
<el-submenu v-else ref="subMenu" :index="handlePath(item.path)">
<template slot="title">
<vab-icon
v-if="item.meta && item.meta.icon"
:icon="['fas', item.meta.icon]"
class="vab-nav-icon"
/>
<vab-remix-icon
v-if="item.meta && item.meta.remixIcon"
:icon-class="item.meta.remixIcon"
class="vab-nav-icon"
/>
<span>{{ item.meta.title }}</span>
</template>
<side-bar-item
v-for="child in item.children"
:key="child.path"
:base-path="handlePath(child.path)"
:is-nest="true"
:item="child"
class="nest-menu"
/>
</el-submenu>
</div>
</template>
<script>
import path from "path"
import { isExternal } from "@/utils/validate"
import AppLink from "@/layouts/components/Link"
export default {
name: "SideBarItem",
components: { AppLink },
props: {
item: {
type: Object,
required: true,
},
isNest: {
type: Boolean,
default: false,
},
basePath: {
type: String,
default: "",
},
},
data() {
this.onlyOneChild = null
return {}
},
methods: {
handleChildren(children = [], parent) {
if (children === null) children = []
const showChildren = children.filter((item) => {
if (item.hidden) {
return false
} else {
this.onlyOneChildren = item
return true
}
})
if (showChildren.length === 1) {
return true
}
if (showChildren.length === 0) {
this.onlyOneChildren = {
...parent,
path: "",
notShowChildren: true,
}
return true
}
return false
},
handlePath(routePath) {
if (isExternal(routePath)) {
return routePath
}
if (isExternal(this.basePath)) {
return this.basePath
}
return path.resolve(this.basePath, routePath)
},
},
}
</script>
<style lang="scss" scoped>
.vab-nav-icon {
margin-right: 4px;
}
::v-deep {
.el-tag {
margin-top: 15px;
padding-left: 3px;
padding-right: 3px;
height: 16px;
line-height: 13px;
float: right;
}
}
</style>
<template>
<el-scrollbar class="side-bar-container" :class="{ 'is-collapse': collapse }">
<logo />
<el-menu
:background-color="variables['menu-background']"
:text-color="variables['menu-color']"
:active-text-color="variables['menu-color-active']"
:default-active="activeMenu"
:collapse="collapse"
:collapse-transition="false"
:default-openeds="defaultOpens"
:unique-opened="uniqueOpened"
mode="vertical"
class="undefineMenu"
>
<side-bar-item
v-for="route in routes"
:key="route.path"
:base-path="route.path"
:item="route"
/>
<div class="qrcode">
<div class="img"></div>
<div class="text">问题反馈群</div>
</div>
</el-menu>
</el-scrollbar>
</template>
<script>
import Logo from "@/layouts/components/Logo"
import SideBarItem from "./components/SideBarItem"
import variables from "@/styles/variables.scss"
import { mapGetters } from "vuex"
import { defaultOopeneds, uniqueOpened } from "@/config/settings"
export default {
name: "SideBar",
components: { SideBarItem, Logo },
data() {
return {
uniqueOpened,
}
},
computed: {
...mapGetters({
collapse: "settings/collapse",
routes: "routes/routes",
}),
defaultOpens() {
if (this.collapse) {
}
return defaultOopeneds
},
activeMenu() {
const route = this.$route
const { meta, path } = route
if (meta.activeMenu) {
return meta.activeMenu
}
console.log("path",path)
return path
},
variables() {
return variables
},
},
// mounted() {
// console.log(this.routes)
// },
}
</script>
<style lang="scss" scoped>
.qrcode {
width: 108px;
height: 136px;
background: #546184;
border-radius: 4px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
padding: 8px;
display: flex;
flex-direction: column;
align-items: center;
.img {
width: 92px;
height: 92px;
background: url("~@/assets/img/DataCenter/qrcode.png") no-repeat;
background-size: cover;
background-position: center center;
border-radius: 2px;
}
.text {
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #ffffff;
text-align: center;
margin-top: 8px;
}
}
@mixin active {
&:hover {
color: $base-color-white !important;
background-color: $base-menu-background-active !important;
}
&.is-active {
color: $base-color-white !important;
background-color: $base-menu-background-active !important;
}
}
.undefineMenu {
min-height: calc(100vh - 120px);
padding-bottom: 166px;
}
.side-bar-container {
position: fixed;
top: 0;
bottom: 0;
left: 0;
z-index: $base-z-index;
width: $base-left-menu-width;
height: 100vh;
overflow: hidden;
background: $base-menu-background;
box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
transition: all 0.1s;
padding: 8px 0 14px;
&.is-collapse {
width: $base-left-menu-width-min;
border-right: 0 !important;
::v-deep {
.el-menu {
transition: all 0.1s;
}
.el-menu--collapse {
border-right: 0 !important;
.el-submenu__icon-arrow {
right: 10px;
margin-top: -3px;
}
.el-submenu__title {
span {
display: none;
}
}
}
}
}
::v-deep {
.el-scrollbar__wrap {
overflow-x: hidden;
}
.el-menu {
border: 0;
}
.svg-inline {
&--fa {
width: 1rem;
}
}
.el-menu-item {
height: 46px !important;
overflow: hidden;
line-height: 46px !important;
text-overflow: ellipsis;
white-space: nowrap;
@include active;
}
.nest-menu {
.el-menu-item {
background-color: $base-menu-children-background !important;
@include active;
}
.el-submenu .el-menu-item {
background-color: $base-menu-children-background !important;
@include active;
}
}
}
}
</style>
...@@ -32,7 +32,10 @@ ...@@ -32,7 +32,10 @@
}" }"
> >
<div :class="header === 'fixed' ? 'fixed-header' : ''"> <div :class="header === 'fixed' ? 'fixed-header' : ''">
<nav-bar></nav-bar> <nav-bar
:cur-selected-index="curSelectedIndex"
@openModalFlag="openModalFlag"
></nav-bar>
</div> </div>
<side-bar></side-bar> <side-bar></side-bar>
<div class="vab-main" :class="collapse ? 'is-collapse-main' : ''"> <div class="vab-main" :class="collapse ? 'is-collapse-main' : ''">
...@@ -40,6 +43,137 @@ ...@@ -40,6 +43,137 @@
</div> </div>
</div> </div>
<back-to-top transition-name="fade"></back-to-top> <back-to-top transition-name="fade"></back-to-top>
<el-dialog
custom-class="homeDialog"
:title="''"
:visible="modalFlag"
:close-on-click-modal="false"
:close-on-press-escape="false"
:show-close="false"
width="70%"
top="10vh"
>
<div class="modalContent">
<div class="title">请选择您的筛查填报场景</div>
<ul class="list">
<li
v-for="(item, index) in screeningList"
:key="index"
@click="selectedIndex = item.value"
>
<div class="screeningItem">
<div class="circle">
<img
v-if="selectedIndex !== item.value"
src="~@/assets/img/DataCenter/circle.png"
alt
srcset
/>
<img
v-if="selectedIndex == item.value"
src="~@/assets/img/DataCenter/selected.png"
alt
srcset
/>
</div>
<div class="itemTitle">{{ item.title }}</div>
</div>
<div class="desc">
{{ item.desc }}
</div>
<div class="ItemIamge">
<img :src="item.src" alt />
</div>
</li>
</ul>
<div class="submit">
<el-button type="primary" class="btn" @click="setSelectedIndex"
>确定</el-button
>
</div>
<div class="tips">
注意,本系统筛查对象为:<br />
无消化道症状(腹痛,腹泻,消化道出血等)的一般人群,住院及胃癌术后患者切勿上传至本系统,详细条件见入排标准。<br />
<el-button type="text" @click="innerVisible = true"
>点击查看详情</el-button
>
</div>
</div>
<el-dialog
width="70%"
custom-class="homeDialog"
:title="''"
:close-on-click-modal="false"
:close-on-press-escape="false"
:show-close="false"
:visible.sync="innerVisible"
append-to-body
top="10vh"
>
<div class="innerBody">
<div class="title">入排标准</div>
<div class="innerTable">
<div
v-for="(item, index) in innerTable"
:key="index"
class="col_item"
>
<div
class="left"
:style="{ borderBottom: index == 0 ? '1px solid #eff0f3' : '' }"
>
{{ item.title }}
</div>
<div class="right">
<div
v-for="(listItem, i) in item.list"
:key="i"
class="r_col_item"
:style="{
borderBottom:
index == innerTable.length - 1 &&
i == item.list.length - 1
? ''
: '1px solid #eff0f3',
}"
>
<img
v-if="index == 0"
src="@/assets/img/DataCenter/right.png"
alt=""
/>
<img v-else src="@/assets/img/DataCenter/wrong.png" alt="" />
<template v-if="listItem.type == 'text'">
<span class="r_text">{{ listItem.value }}</span>
</template>
<template v-if="listItem.type == 'list'">
<div class="r_list">
<div class="r_list_title r_text">
{{ listItem.value.value }}
</div>
<ul>
<li
v-for="listItem_item in listItem.value.list"
:key="listItem_item"
>
{{ listItem_item }}
</li>
</ul>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
<div class="submit">
<el-button type="primary" class="btn" @click="innerVisible = false"
>返回</el-button
>
</div>
</el-dialog>
</el-dialog>
</div> </div>
</template> </template>
...@@ -68,7 +202,77 @@ export default { ...@@ -68,7 +202,77 @@ export default {
}, },
mixins: [Media], mixins: [Media],
data() { data() {
return {} return {
modalFlag: false,
innerVisible: false,
screeningList: [
{
title: "社区筛查",
value: "1",
desc: "在社区对该地区居民进行招募与筛查",
src: require("@/assets/img/DataCenter/shequ.png"),
},
{
title: "医院筛查",
value: "2",
desc: "无消化道症状的门诊人群",
src: require("@/assets/img/DataCenter/yiyuan.png"),
},
{
title: "体检筛查",
value: "3",
desc: "参加单位或个人体检的人群",
src: require("@/assets/img/DataCenter/tijian.png"),
},
],
selectedIndex: "1",
curSelectedIndex: "",
innerTable: [
{
title: "纳入标准(同时满足2条)",
list: [{ type: "text", value: "男性年龄40~79岁,女性50~79岁;" }],
},
{
title: "排除标准(任意一条符合即排除)",
list: [
{ type: "text", value: "距上次胃镜检查间隔时间一年内;" },
{ type: "text", value: "胃大部切除术手术史;" },
{
type: "text",
value:
"两周内服用PPI(埃索美拉唑、泮托拉唑、雷贝拉唑、兰索拉唑等)或H2受体拮抗剂(法莫替丁等);",
},
{
type: "list",
value: {
value: "有下列一种或多种症状:",
list: [
"6个月内缺铁性贫血;",
"12个月内消化道出血(黑便、血便等);",
"体重减轻(非减肥原因6个月内体重减轻≥4.5Kg);",
"经常性腹泻;",
"吞咽困难或哽噎感;",
"腹部肿块。",
],
},
},
{
type: "text",
value:
"有以下任何一种疾病史:食管癌、胃癌、结直肠肿瘤、息肉病、炎症性肠病、其它器官恶性肿瘤(乳腺、卵巢、子宫及泌尿系统等);",
},
{
type: "text",
value: "影像、肿瘤标志物等检查高度怀疑罹患肿瘤可能;",
},
{
type: "text",
value: "严重心、肺、肝、肾功能不全,或严重精神疾患。",
},
],
},
],
}
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
...@@ -77,6 +281,7 @@ export default { ...@@ -77,6 +281,7 @@ export default {
collapse: "settings/collapse", collapse: "settings/collapse",
header: "settings/header", header: "settings/header",
device: "settings/device", device: "settings/device",
// selectedIndex: "table/selectedIndex",
}), }),
classObj() { classObj() {
return { return {
...@@ -84,7 +289,22 @@ export default { ...@@ -84,7 +289,22 @@ export default {
} }
}, },
}, },
created() {
this.selectedIndex = sessionStorage.getItem("selectedIndex") || ""
this.curSelectedIndex = String(this.selectedIndex) ? this.selectedIndex : ""
},
mounted() { mounted() {
if (!this.selectedIndex) {
this.modalFlag = true
this.selectedIndex = "1"
} else {
this.selectedIndex = this.selectedIndex
this.curSelectedIndex = String(this.selectedIndex)
? this.selectedIndex
: ""
}
// console.log(this.curSelectedIndex)
this.$nextTick(() => { this.$nextTick(() => {
window.addEventListener( window.addEventListener(
"storage", "storage",
...@@ -100,6 +320,15 @@ export default { ...@@ -100,6 +320,15 @@ export default {
...mapActions({ ...mapActions({
handleFoldSideBar: "settings/foldSideBar", handleFoldSideBar: "settings/foldSideBar",
}), }),
setSelectedIndex() {
console.log(this.selectedIndex)
this.curSelectedIndex = this.selectedIndex
this.$store.commit("table/setSelectedIndex", this.selectedIndex)
this.modalFlag = false
},
openModalFlag() {
this.modalFlag = true
},
}, },
} }
</script> </script>
...@@ -128,7 +357,7 @@ export default { ...@@ -128,7 +357,7 @@ export default {
} }
&.fixed.no-tags-bar { &.fixed.no-tags-bar {
padding-top: 56px; // padding-top: 56px;
} }
::v-deep { ::v-deep {
...@@ -190,7 +419,7 @@ export default { ...@@ -190,7 +419,7 @@ export default {
} }
&.fixed.no-tags-bar { &.fixed.no-tags-bar {
padding-top: 56px; // padding-top: 56px;
} }
.vab-main { .vab-main {
...@@ -236,6 +465,153 @@ export default { ...@@ -236,6 +465,153 @@ export default {
.side-bar-container { .side-bar-container {
top: 90px; top: 90px;
height: calc(100vh - 90px); height: calc(100vh - 90px);
border-radius: 0px 4px 4px 0px;
box-shadow: none;
}
}
::v-deep .homeDialog {
min-width: 1036px;
}
::v-deep .homeDialog .el-dialog__header {
display: none;
}
.modalContent {
padding: 60px;
.title {
text-align: center;
height: 30px;
font-size: 24px;
font-family: AlibabaPuHuiTiM;
color: #333333;
line-height: 30px;
margin-bottom: 60px;
}
.list {
display: flex;
justify-content: space-between;
li {
cursor: pointer;
}
.desc {
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #666666;
text-indent: 38px;
}
.screeningItem {
display: flex;
.circle {
width: 26px;
height: 26px;
margin-right: 12px;
img {
width: 100%;
height: 100%;
}
}
.itemTitle {
height: 24px;
font-size: 18px;
font-family: AlibabaPuHuiTiM;
color: #333333;
font-weight: bold;
line-height: 24px;
}
}
.ItemIamge {
width: 90%;
// height: 180px;
margin-top: 14px;
img {
width: 100%;
height: 100%;
}
}
}
.tips {
width: 100%;
background: #f5f5f5;
border-radius: 4px;
line-height: 22px;
padding: 20px;
margin-top: 40px;
}
}
.innerBody {
padding: 0 40px;
.title {
font-size: 24px;
font-family: AlibabaPuHuiTiM;
color: #333333;
text-align: center;
margin-bottom: 40px;
}
.innerTable {
border-radius: 4px;
border: 1px solid #dddddd;
border-radius: 4px;
.col_item {
display: flex;
.left {
width: 35%;
min-height: 72px;
display: flex;
justify-content: flex-start;
padding-left: 20px;
align-items: center;
font-size: 18px;
font-family: AlibabaPuHuiTiM;
font-weight: bold;
color: #333333;
border-right: 1px solid #eff0f3;
// border-bottom: 1px solid #eff0f3;
}
.right {
flex: 1;
.r_col_item:nth-child(4) {
img {
align-self: flex-start;
}
}
.r_col_item {
min-height: 72px;
display: flex;
justify-content: flex-start;
align-items: center;
padding: 20px 0 20px 20px;
img {
width: 26px;
height: 26px;
}
.r_text {
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: #333333;
font-weight: bold;
}
ul {
li {
height: 30px;
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: #666666;
line-height: 30px;
}
}
}
}
}
}
}
.submit {
margin-top: 60px;
text-align: center;
.btn {
width: 100px;
border-radius: 4px;
height: 32px;
} }
} }
</style> </style>
...@@ -6,10 +6,9 @@ import store from "./store" ...@@ -6,10 +6,9 @@ import store from "./store"
import router from "./router" import router from "./router"
import "./plugins" import "./plugins"
import "./mixins" import "./mixins"
import "@/assets/style/common.scss"
// const { mockXHR } = require("../mock/static") // const { mockXHR } = require("../mock/static")
// mockXHR() // mockXHR()
Vue.config.productionTip = false Vue.config.productionTip = false
new Vue({ new Vue({
......
/* 公共引入,勿随意修改,修改时需经过确认 */ /* 公共引入,勿随意修改,修改时需经过确认 */
import Vue from "vue" import Vue from "vue"
import "./element" import "./element"
import './vue-virtual-scroller' import "./vue-virtual-scroller"
import "./avue" import "./avue"
import "./vxe-table" import "./vxe-table"
import "./support" import "./support"
...@@ -10,7 +10,7 @@ import vab from "@/utils/vab" ...@@ -10,7 +10,7 @@ import vab from "@/utils/vab"
import "@/remixIcon" import "@/remixIcon"
import "@/colorfulIcon" import "@/colorfulIcon"
import "@/config/permission" import "@/config/permission"
import "@/utils/errorLog" // import "@/utils/errorLog"
import "./f12" import "./f12"
import permission from "@/directive/permission" import permission from "@/directive/permission"
import print from "./print" import print from "./print"
......
import Vue from "vue" import Vue from "vue"
import VueRouter from "vue-router" import VueRouter from "vue-router"
import Layout from "@/layouts" import Layout from "@/layouts"
import layout from "@/components/layout"
import EmptyLayout from "@/layouts/EmptyLayout" import EmptyLayout from "@/layouts/EmptyLayout"
Vue.use(VueRouter) Vue.use(VueRouter)
export const constantRoutes = [ export const constantRoutes = [
{ {
path: "/login", path: "/home",
component: () => import("@/views/login/index"), name: "Home",
// redirect: "/home",
hidden: true, hidden: true,
name: "login", component: layout,
children: [
{
path: "/home",
component: () => import("@/views/Home/index"),
},
{
path: "/allianceintroduction",
component: () => import("@/views/Home/AllianceIntroduction/index"),
},
{
path: "/healthpopularization",
component: () => import("@/views/Home/HealthPopularization/index"),
},
{
path: "/casesharing",
component: () => import("@/views/Home/CaseSharing/index"),
},
{
path: "/scientificresearch",
component: () => import("@/views/Home/ScientificResearch/index"),
},
{
path: "/solution",
component: () => import("@/views/Home/Solution/index"),
},
],
},
// {
// path: "/login",
// component: () => import("@/views/login/index"),
// hidden: true,
// name: "login",
// },
{
path: "/auditdetail",
component: Layout,
children: [
{
path: "/auditdetail",
component: () => import("@/views/audit-detail/index"),
hidden: true,
name: "auditdetail",
},
],
},
// 审核详情
{
path: "/followupentry",
component: Layout,
children: [
{
path: "/followupentry",
component: () => import("@/views/followupentry/index"),
hidden: true,
name: "followupEntry",
},
],
},
{
path: "/followaudit",
component: Layout,
children: [
{
path: "/followaudit",
component: () => import("@/views/followupentry/followaudit"),
hidden: true,
name: "followaudit",
},
],
}, },
{ {
path: "/401", path: "/401",
...@@ -219,5 +290,8 @@ export function resetRouter() { ...@@ -219,5 +290,8 @@ export function resetRouter() {
routes: constantRoutes, routes: constantRoutes,
}).matcher }).matcher
} }
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch((err) => err)
}
export default router export default router
...@@ -56,10 +56,12 @@ const actions = { ...@@ -56,10 +56,12 @@ const actions = {
}, },
// 更新字典分类 // 更新字典分类
async updateDictType({ commit, state }, data) { async updateDictType({ commit, state }, data) {
console.log('执行updateDictType')
commit("setDictSet", data) commit("setDictSet", data)
}, },
// 更新字典详情 // 更新字典详情
async updateDictDetail({ commit, state }, { type, data }) { async updateDictDetail({ commit, state }, { type, data }) {
console.log('执行updateDictDetail')
const dictMap = state.dictMap const dictMap = state.dictMap
if (type) { if (type) {
const list = data.map((item) => { const list = data.map((item) => {
......
...@@ -3,10 +3,10 @@ ...@@ -3,10 +3,10 @@
* @description 所有全局配置的状态管理,如无必要请勿修改 * @description 所有全局配置的状态管理,如无必要请勿修改
*/ */
import defaultSettings from "@/config/settings"; import defaultSettings from "@/config/settings"
const { tagsBar, logo, layout, header, themeBar, skeleton } = defaultSettings; const { tagsBar, logo, layout, header, themeBar, skeleton } = defaultSettings
const theme = JSON.parse(localStorage.getItem("BYUI-VUE-THEME")) || ""; const theme = JSON.parse(localStorage.getItem("BYUI-VUE-THEME")) || ""
const state = { const state = {
tagsBar: theme.tagsBar || tagsBar, tagsBar: theme.tagsBar || tagsBar,
logo, logo,
...@@ -16,7 +16,7 @@ const state = { ...@@ -16,7 +16,7 @@ const state = {
skeleton, skeleton,
device: "desktop", device: "desktop",
themeBar, themeBar,
}; }
const getters = { const getters = {
collapse: (state) => state.collapse, collapse: (state) => state.collapse,
device: (state) => state.device, device: (state) => state.device,
...@@ -26,51 +26,51 @@ const getters = { ...@@ -26,51 +26,51 @@ const getters = {
tagsBar: (state) => state.tagsBar, tagsBar: (state) => state.tagsBar,
themeBar: (state) => state.themeBar, themeBar: (state) => state.themeBar,
skeleton: (state) => state.skeleton, skeleton: (state) => state.skeleton,
}; }
const mutations = { const mutations = {
changeLayout: (state, layout) => { changeLayout: (state, layout) => {
if (layout) state.layout = layout; if (layout) state.layout = layout
}, },
changeHeader: (state, header) => { changeHeader: (state, header) => {
if (header) state.header = header; if (header) state.header = header
}, },
changeTagsBar: (state, tagsBar) => { changeTagsBar: (state, tagsBar) => {
if (tagsBar) state.tagsBar = tagsBar; if (tagsBar) state.tagsBar = tagsBar
}, },
changeCollapse: (state) => { changeCollapse: (state) => {
state.collapse = !state.collapse; state.collapse = !state.collapse
}, },
foldSideBar: (state) => { foldSideBar: (state) => {
state.collapse = true; // state.collapse = true;
}, },
openSideBar: (state) => { openSideBar: (state) => {
state.collapse = false; state.collapse = false
}, },
toggleDevice: (state, device) => { toggleDevice: (state, device) => {
state.device = device; state.device = device
}, },
}; }
const actions = { const actions = {
changeLayout({ commit }, layout) { changeLayout({ commit }, layout) {
commit("changeLayout", layout); commit("changeLayout", layout)
}, },
changeHeader({ commit }, header) { changeHeader({ commit }, header) {
commit("changeHeader", header); commit("changeHeader", header)
}, },
changeTagsBar({ commit }, tagsBar) { changeTagsBar({ commit }, tagsBar) {
commit("changeTagsBar", tagsBar); commit("changeTagsBar", tagsBar)
}, },
changeCollapse({ commit }) { changeCollapse({ commit }) {
commit("changeCollapse"); commit("changeCollapse")
}, },
foldSideBar({ commit }) { foldSideBar({ commit }) {
commit("foldSideBar"); commit("foldSideBar")
}, },
openSideBar({ commit }) { openSideBar({ commit }) {
commit("openSideBar"); commit("openSideBar")
}, },
toggleDevice({ commit }, device) { toggleDevice({ commit }, device) {
commit("toggleDevice", device); commit("toggleDevice", device)
}, },
}; }
export default { state, getters, mutations, actions }; export default { state, getters, mutations, actions }
const state = {
fontSize: localStorage.getItem("fontSize") || 1,
selectedIndex: sessionStorage.getItem("selectedIndex") || "",
refreshFlag: 0,
}
const getters = {
fontSize: (state) => state.fontSize,
selectedIndex: (state) => state.selectedIndex,
refreshFlag: (state) => state.refreshFlag,
}
const mutations = {
setFontSize(state, fontSize) {
state.fontSize = fontSize
},
setSelectedIndex(state, selectedIndex) {
state.selectedIndex = selectedIndex
sessionStorage.setItem("selectedIndex", selectedIndex)
},
removeSelectedIndex() {
state.selectedIndex = ""
sessionStorage.removeItem("selectedIndex")
},
setRefreshFlag(state, refreshFlag) {
state.refreshFlag = refreshFlag
},
}
const actions = {}
export default {
state,
getters,
mutations,
actions,
}
...@@ -35,6 +35,7 @@ const mutations = { ...@@ -35,6 +35,7 @@ const mutations = {
setAccessToken(accessToken) setAccessToken(accessToken)
}, },
setUserInfo(state, userInfo) { setUserInfo(state, userInfo) {
localStorage.setItem("userInfo", JSON.stringify(userInfo))
state.userInfo = userInfo state.userInfo = userInfo
}, },
setGroup(state, group) { setGroup(state, group) {
...@@ -82,7 +83,7 @@ const actions = { ...@@ -82,7 +83,7 @@ const actions = {
} }
let { menuList, user, roleList, group } = data let { menuList, user, roleList, group } = data
if (menuList && user) { if (menuList && user) {
dispatch("getFeedBackNumber", user.id) // dispatch("getFeedBackNumber", user.id)
commit("setMenuList", menuList) commit("setMenuList", menuList)
commit("setUserInfo", user) commit("setUserInfo", user)
commit("setRoles", roleList) commit("setRoles", roleList)
......
...@@ -184,7 +184,7 @@ html { ...@@ -184,7 +184,7 @@ html {
.cell { .cell {
overflow: hidden; overflow: hidden;
font-size: $base-font-size-default; // font-size: $base-font-size-default;
font-weight: normal; font-weight: normal;
color: #606266; color: #606266;
text-overflow: ellipsis; text-overflow: ellipsis;
...@@ -213,6 +213,20 @@ html { ...@@ -213,6 +213,20 @@ html {
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
} }
.is-background {
button,
.el-pager li {
border-radius: 6px !important;
}
button,
.el-pager li:not(.active) {
border: 1px solid #d9d9d9;
background: transparent !important;
}
.el-input__inner {
border-radius: 6px !important;
}
}
/* 分页结束 */ /* 分页结束 */
...@@ -258,7 +272,7 @@ html { ...@@ -258,7 +272,7 @@ html {
border-top: 1px solid $base-border-color; border-top: 1px solid $base-border-color;
.el-form { .el-form {
padding-right: 30px; // padding-right: 30px;
} }
} }
...@@ -345,7 +359,6 @@ html { ...@@ -345,7 +359,6 @@ html {
} }
} }
.flex { .flex {
display: flex; display: flex;
} }
...@@ -361,7 +374,7 @@ html { ...@@ -361,7 +374,7 @@ html {
.flex-end { .flex-end {
display: flex; display: flex;
justify-content: end; justify-content: flex-end;
} }
.flex-wrap { .flex-wrap {
flex-wrap: wrap; flex-wrap: wrap;
...@@ -374,4 +387,3 @@ html { ...@@ -374,4 +387,3 @@ html {
.fr { .fr {
float: right; float: right;
} }
...@@ -8,9 +8,9 @@ ...@@ -8,9 +8,9 @@
$base-color-default: #4e68ff; $base-color-default: #4e68ff;
$base-z-index: 999; $base-z-index: 999;
$base-menu-background: #08203d; $base-menu-background: #252C49;
$base-menu-children-background: #08203d; $base-menu-children-background: #252C49;
$base-menu-background-active: #164884; $base-menu-background-active: #546184;
$base-menu-color: hsla(0, 0%, 100%, 0.95); $base-menu-color: hsla(0, 0%, 100%, 0.95);
$base-menu-color-active: hsla(0, 0%, 100%, 0.95); $base-menu-color-active: hsla(0, 0%, 100%, 0.95);
$base-title-color: #fff; $base-title-color: #fff;
...@@ -30,7 +30,7 @@ $base-color-orange: #ff6700; ...@@ -30,7 +30,7 @@ $base-color-orange: #ff6700;
$base-color-red: #ff4d4f; $base-color-red: #ff4d4f;
$base-color-gray: rgba(0, 0, 0, 0.65); $base-color-gray: rgba(0, 0, 0, 0.65);
$base-main-width: 1279px; $base-main-width: 1279px;
$base-border-radius: 2px; $base-border-radius: 4px;
$base-border-color: #dcdfe6; $base-border-color: #dcdfe6;
$base-form-width: 600px; $base-form-width: 600px;
$base-input-height: 32px; $base-input-height: 32px;
......
...@@ -470,8 +470,8 @@ export function excelExport(data, title = "结果") { ...@@ -470,8 +470,8 @@ export function excelExport(data, title = "结果") {
export function formatDicList(list, value, connector = ",") { export function formatDicList(list, value, connector = ",") {
if (!list) return "" if (!list) return ""
if (list.constructor !== Array) return "" if (list.constructor !== Array) return ""
if (!value && value != 0) return "" // if (!value && value != 0) return ""
let result = "" let result = "--"
let multiple = Array.isArray(value) ? true : false let multiple = Array.isArray(value) ? true : false
if (multiple) { if (multiple) {
const resultList = [] const resultList = []
......
...@@ -126,7 +126,7 @@ service.interceptors.response.use( ...@@ -126,7 +126,7 @@ service.interceptors.response.use(
store.dispatch("user/resetAccessToken").then(() => { store.dispatch("user/resetAccessToken").then(() => {
// location.reload() // location.reload()
router.push({ router.push({
path: "/login", path: "/home",
}) })
}) })
return Promise.reject(error) return Promise.reject(error)
......
const ls = window.localStorage const ls = window.localStorage
const ss = window.sessionStorage const ss = window.sessionStorage
import { storagePrefixName } from "@/config/settings"
export const Local = { export const Local = {
get(key, def) { get(key, def) {
let value = null let value = null
try { try {
value = JSON.parse(ls.getItem(key)) value = JSON.parse(ls.getItem(storagePrefixName + "-" + key))
} catch (e) { } catch (e) {
console.log(" ") console.log(" ")
} }
...@@ -19,14 +20,14 @@ export const Local = { ...@@ -19,14 +20,14 @@ export const Local = {
ls.setItem(i, JSON.stringify(setting[i])) ls.setItem(i, JSON.stringify(setting[i]))
} }
} else { } else {
ls.setItem(key, JSON.stringify(val)) ls.setItem(storagePrefixName + "-" + key, JSON.stringify(val))
} }
} catch (e) { } catch (e) {
console.log("'") console.log("'")
} }
}, },
remove(key) { remove(key) {
ls.removeItem(key) ls.removeItem(storagePrefixName + "-" + key)
}, },
clear() { clear() {
ls.clear() ls.clear()
...@@ -36,7 +37,7 @@ export const Local = { ...@@ -36,7 +37,7 @@ export const Local = {
export const Session = { export const Session = {
get(key) { get(key) {
try { try {
return JSON.parse(ss.getItem(key)) return JSON.parse(ss.getItem(storagePrefixName + "-" + key))
} catch (e) { } catch (e) {
return null return null
} }
...@@ -48,11 +49,11 @@ export const Session = { ...@@ -48,11 +49,11 @@ export const Session = {
ss.setItem(i, JSON.stringify(setting[i])) ss.setItem(i, JSON.stringify(setting[i]))
} }
} else { } else {
ss.setItem(key, JSON.stringify(val)) ss.setItem(storagePrefixName + "-" + key, JSON.stringify(val))
} }
}, },
remove(key) { remove(key) {
ss.removeItem(key) ss.removeItem(storagePrefixName + "-" + key)
}, },
clear() { clear() {
ss.clear() ss.clear()
......
<template>
<div>联盟介绍</div>
</template>
<script>
export default {
data () {
return {}
},
methods: {},
mounted () { },
watch: {}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<template>
<div>案例分享</div>
</template>
<script>
export default {
data () {
return {}
},
methods: {},
mounted () { },
watch: {}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<template>
<div class="commonList">
<ul class="left_bar">
<li
v-for="(item, index) in leftBar"
:key="index"
:class="index == activeBar ? 'activeBar' : ''"
@click="changeActive(index)"
>
{{ item.name }}
</li>
</ul>
<div v-if="!showText" class="right_list">
<div class="list_title">
{{ leftBar[activeBar].name }}
</div>
<ul class="list">
<li v-for="(item, index) in leftBar[activeBar].list" :key="index">
<div class="leftImg">
<img src="~@/assets/img/Home/shenghuo.png" alt="" />
</div>
<div class="rightCon">
<div class="top">
<div class="rc_title">{{ item.title }}</div>
<div class="rc_date">{{ item.time }}</div>
</div>
<div class="bottom" @click="viewDetail(index)">查看</div>
</div>
</li>
</ul>
</div>
<div v-if="showText" class="right_content">
<div class="breadcum">
<div
v-for="(item, index) in showTitle"
:key="index"
:class="[index != showTitle.length - 1 ? 'before' : 'now']"
@click="back(index)"
>
{{ item }}<span v-if="index != showTitle.length - 1"> / </span>
</div>
</div>
{{ showText }}
</div>
</div>
</template>
<script>
export default {
data() {
return {
activeBar: 0,
leftBar: [
{
name: "筛查",
list: [
{
id: 1,
title: "筛查数据的科学性",
text: "123",
time: "2022/06-30",
},
{
id: 2,
title: "筛查数据的科学性",
text: "1",
time: "2022/06-30",
},
],
},
{
name: "生活",
},
{
name: "医学知识",
},
{
name: "其他",
},
],
showText: "",
showTitle: [],
}
},
mounted() {
console.log(this.$route)
if (this.$route.query.tabIndex) {
this.activeBar = this.$route.query.tabIndex
}
},
methods: {
changeActive(i) {
this.activeBar = i
this.showText = ""
},
viewDetail(i) {
this.showText = this.leftBar[this.activeBar].list[i].text
this.showTitle[0] = this.leftBar[this.activeBar].name
this.showTitle[1] = this.leftBar[this.activeBar].list[i].title
console.log(this.showText)
},
back(index) {
if (index == 0) {
this.showText = ""
}
},
},
}
</script>
<style lang="scss" scoped>
.commonList {
display: flex;
justify-content: space-between;
.left_bar {
width: 188px;
height: 760px;
background: #ffffff;
border-radius: 4px;
padding: 20px 0;
li {
width: 188px;
height: 52px;
font-size: 16px;
font-family: AlibabaPuHuiTiM;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
// background: rgba(78, 104, 255, 0.1);
}
.activeBar {
color: #4e68ff;
background: rgba(78, 104, 255, 0.1);
}
}
.right_list {
width: calc(100% - 208px);
height: 760px;
background: #ffffff;
border-radius: 4px;
padding: 32px;
.list_title {
height: 37px;
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: rgba(0, 0, 0, 0.8);
border-bottom: 1px solid #efefef;
}
.list {
li {
display: flex;
align-items: center;
margin-top: 20px;
.leftImg {
width: 132px;
height: 98px;
border-radius: 4px;
margin-right: 20px;
img {
width: 100%;
height: 100%;
}
}
.rightCon {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 98px;
.rc_title {
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: #333333;
}
.rc_date {
font-size: 14px;
font-family: Roboto-Regular, Roboto;
font-weight: 400;
color: #999999;
}
.bottom {
cursor: pointer;
width: 68px;
height: 28px;
background: rgba(78, 104, 255, 0.1);
border-radius: 16px;
text-align: center;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #4e68ff;
line-height: 28px;
&:hover {
background: rgba(78, 104, 255, 0.2);
}
}
}
}
}
}
.right_content {
width: calc(100% - 208px);
height: 760px;
background: #ffffff;
border-radius: 4px;
padding: 32px;
}
}
.breadcum {
display: flex;
.before {
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: rgba(0, 0, 0, 0.4);
cursor: pointer;
&:hover {
color: #4e68ff;
}
}
.now {
margin-left: 5px;
font-size: 16px;
font-family: AlibabaPuHuiTiR;
}
}
</style>
<template>
<div class="commonList">
<ul class="left_bar">
<li
v-for="(item, index) in leftBar"
:key="index"
:class="index == activeBar ? 'activeBar' : ''"
@click="changeActive(index)"
>
{{ item.name }}
</li>
</ul>
<div class="right_list">
<div class="list_title">
{{ leftBar[activeBar].name }}
</div>
<ul class="list">
<li v-for="(item, index) in leftBar[activeBar].list" :key="index">
<div class="left_text">
<div class="circle"></div>
<div class="title">{{ item.title }}</div>
</div>
<div class="rig_date">
{{ item.time }}
</div>
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
data() {
return {
activeBar: 0,
leftBar: [
{
name: "筛查技术方案",
list: [
{
title: "筛查数据的科学性",
text: "",
time: "2022/06-30",
},
{
title: "筛查数据的科学性",
text: "",
time: "2022/06-30",
},
],
},
{
name: "筛查指南",
},
{
name: "学术成果",
},
{
name: "项目进展与成果",
},
],
}
},
watch: {},
mounted() {
if (this.$route.query.tabIndex) {
this.activeBar = this.$route.query.tabIndex
}
},
methods: {
changeActive(i) {
this.activeBar = i
// this.$router.replace("/scientificresearch")
},
},
}
</script>
<style lang="scss" scoped>
.commonList {
display: flex;
justify-content: space-between;
.left_bar {
width: 188px;
height: 760px;
background: #ffffff;
border-radius: 4px;
padding: 20px 0;
li {
width: 188px;
height: 52px;
font-size: 16px;
font-family: AlibabaPuHuiTiM;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
// background: rgba(78, 104, 255, 0.1);
}
.activeBar {
color: #4e68ff;
background: rgba(78, 104, 255, 0.1);
}
}
.right_list {
width: calc(100% - 208px);
height: 760px;
background: #ffffff;
border-radius: 4px;
padding: 32px;
.list_title {
height: 37px;
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: rgba(0, 0, 0, 0.8);
border-bottom: 1px solid #efefef;
}
.list {
li {
height: 22px;
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: #333333;
line-height: 22px;
margin-top: 20px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
.left_text {
display: flex;
align-items: center;
.circle {
width: 6px;
height: 6px;
background: #4e68ff;
border-radius: 50%;
margin-right: 8px;
}
}
.rig_date {
font-size: 14px;
font-family: Roboto-Regular, Roboto;
font-weight: 400;
color: #999999;
}
}
}
}
}
</style>
<template>
<div>解决方案</div>
</template>
<script>
export default {
data() {
return {}
},
methods: {},
mounted() {},
watch: {},
}
</script>
<style lang="scss" scoped></style>
<template>
<div id="con">
<div class="top flex">
<div class="left box">
<video :src="videoSrc" controls class="video" />
</div>
<!-- 新闻会议tab -->
<div class="right box tabbox videoboxs">
<el-tabs v-model="curTab" @tab-click="handleClick">
<el-tab-pane
v-for="(e, index) in tabList"
:key="index"
:label="e.title"
:name="index + 1 + ''"
>
<ul class="tabslist">
<li v-for="(item, index) in noticeList" :key="index">
<div class="left">
<div class="circle"></div>
{{ item.articleTitle }}
</div>
<div class="right">
{{ item.createTime }}
</div>
</li>
</ul>
</el-tab-pane>
</el-tabs>
</div>
</div>
<!-- 联盟地图 -->
<div class="dataAnalysis map_box">
<div class="flex">
<div class="left box cenbox">
<div class="box_title text-center">联盟地图</div>
<img class="map" src="~@/assets/img/Home/map.png" alt="" />
</div>
<div class="right box tabbox" style="height: 458px">
<el-tabs v-model="exTab">
<el-tab-pane
v-for="(e, index) in example"
:key="index"
:label="e.title"
:name="e.title"
>
<ul class="tabslist" style="height: 380px" :loading="listLoading">
<li v-for="(item, index) in exampleList" :key="index">
<div class="left">
<div class="circle"></div>
{{ item.title }}
</div>
<div class="right">
{{ item.date }}
</div>
</li>
</ul>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
<!-- 机构排名 -->
<div class="dataAnalysis" style="background: #fff">
<div class="flex" style="margin-bottom: 0px">
<div class="box cenbox cenboxs">
<div class="range left_range">
<div class="text-center">
<span class="range_title text-center">
累计上报合格病例数机构排名
</span>
</div>
<div class="rangecontent">
<div class="top20"></div>
<ul class="rangeList">
<li
v-for="(item, index) in rangeList"
:key="index"
:style="{
color: index < 3 ? '#4E68FF' : '#333333',
alignSelf: index > 9 ? 'flex-end' : '',
}"
>
<div>{{ index + 1 }}</div>
<div>{{ item.unionName }}</div>
<div>{{ item.nums }}</div>
</li>
</ul>
</div>
</div>
<div class="range">
<div class="text-center">
<span class="range_title text-center">近90天上报量机构排名</span>
</div>
<div class="rangecontent">
<div class="top10"></div>
<ul class="rangeList">
<li
v-for="(item, index) in curQuarterList"
:key="index"
:style="{
color: index < 3 ? '#4E68FF' : '#333333',
}"
>
<div>{{ index + 1 }}</div>
<div>{{ item.unionName }}</div>
<div>{{ item.nums }}</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 健康科普 -->
<div class="healthPopularization">
<div class="title_box">
<div class="title">健康科普</div>
<div class="empty"></div>
</div>
<ul class="typeList">
<li
v-for="(item, index) in typeList"
:key="index"
:style="{ backgroundImage: 'url(' + item.src + ')' }"
@click="
$router.push({
path: '/healthpopularization',
query: { tabIndex: index },
})
"
>
{{ item.name }}
</li>
</ul>
</div>
<!-- 科学研究 -->
<div class="scientificresearch">
<div class="title_box">
<div class="title">科学研究</div>
<div class="empty"></div>
</div>
<ul class="researchList">
<li
v-for="(item, index) in researchList"
:key="index"
@click="
$router.push({
path: '/scientificresearch',
query: { tabIndex: index },
})
"
>
{{ item }}
</li>
</ul>
</div>
<!-- 粘性定位 -->
<div v-show="showFixed" class="fixed_box">
<ul class="f_list">
<el-popover
popper-class="poperbackground"
v-for="(item, index) in rigBarList"
:key="index"
placement="left-start"
title=""
width="200"
trigger="hover"
:content="item.content"
>
<li
slot="reference"
:style="{ background: fixIndex == index ? '#4e68ff' : '#fff' }"
@mouseenter="fixIndex = index"
@mouseleave="fixIndex = -1"
>
<template v-if="fixIndex == index">
<img :src="item.src2" alt="" /><span style="color: #fff">{{
item.name
}}</span>
</template>
<template v-else>
<img :src="item.src1" alt="" /><span>{{ item.name }}</span>
</template>
</li>
</el-popover>
</ul>
</div>
</div>
</template>
<script>
import { getRankTotal, getCurrentQuarter } from "@/api/Home"
import { articleList } from "@/api/operation-management"
export default {
data() {
return {
fixIndex: -1,
// videoSrc: require("../../../public/aaa.mp4"),
videoSrc: "",
exTab: "浙江省典型案例",
example: [
{
title: "浙江省典型案例",
},
],
exampleList: [
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
],
tabList: [
{
title: "新闻会议",
},
{
title: "通知公告",
},
{
title: "学术动态",
},
],
noticeList: [
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
],
curTab: "1",
listLoading: false,
rangeList: [], // 上报排名
curQuarterList: [], //当前季度排名
typeList: [
{
src: require("@/assets/img/Home/shaicha.png"),
name: "筛查",
route: "/healthpopularization",
},
{
src: require("@/assets/img/Home/shenghuo.png"),
name: "生活",
},
{
src: require("@/assets/img/Home/yixuezhishi.png"),
name: "医学知识",
},
{
src: require("@/assets/img/Home/qita.png"),
name: "其他",
},
],
rigBarList: [
{
src1: require("@/assets/img/Home/kefu.png"),
src2: require("@/assets/img/Home/kefuwhite.png"),
content: "021-31161236",
name: "客服",
},
{
src1: require("@/assets/img/Home/youxiang.png"),
src2: require("@/assets/img/Home/youxiangwhite.png"),
content: "service@gecachina.cn",
name: "邮箱",
},
{
src1: require("@/assets/img/Home/dizhi.png"),
src2: require("@/assets/img/Home/dizhiwhite.png"),
content: "上海市杨浦区长海路168号综合保障楼4楼",
name: "地址",
},
],
researchList: ["筛查技术方案", "筛查指南", "学术成果", "项目进展与成果"],
showFixed: false,
}
},
created() {
this.getArticleList("1")
},
mounted() {
this.getRankTotal()
this.getCurrentQuarter()
// console.log(document.querySelector("#vue-admin-beautiful"))
this.$nextTick(() => {
document
.querySelector("#vue-admin-beautiful")
.addEventListener("scroll", () => {
let scrollTop = document.querySelector("#vue-admin-beautiful")
.scrollTop
if (scrollTop >= 700) {
this.showFixed = true
} else {
this.showFixed = false
}
})
})
},
methods: {
handleClick() {
this.getArticleList(this.curTab)
},
// 获取新闻会议tab的数据
getArticleList(moduleType) {
this.listLoading = true
let params = {
size: 10,
current: 1,
moduleType: moduleType,
}
articleList(params)
.then((res) => {
if (res.code == 1) {
if (["1", "2", "3"].includes(moduleType)) {
this.noticeList = [...res.data.records]
}
}
})
.catch((e) => {
this.listLoading = false
})
},
getRankTotal() {
getRankTotal().then((res) => {
if (res.code == 1) {
this.rangeList = res.data
}
})
},
getCurrentQuarter() {
getCurrentQuarter().then((res) => {
if (res.code == 1) {
this.curQuarterList = res.data
}
})
},
},
}
</script>
<style lang="scss" scoped>
#con {
.flex {
height: 100%;
display: flex;
justify-content: space-between;
margin-bottom: 38px;
.box {
width: 48%;
height: 100%;
// background: blue;
background: #fff;
.video {
width: 100%;
border-radius: 5px;
height: 420px;
object-fit: fill;
}
}
.tabbox {
padding: 8px 16px;
border-radius: 8px;
overflow: hidden;
.tabslist {
height: 352px;
padding-right: 8px;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: space-between;
// &:hover {
// overflow: overlay;
// }
li {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #666666;
margin-bottom: 16px;
cursor: pointer;
.left {
display: flex;
align-items: center;
.circle {
width: 4px;
height: 4px;
background: #7085fe;
border-radius: 50%;
margin-right: 8px;
}
}
}
}
}
.videoboxs {
height: 100%;
}
}
.dataAnalysis {
margin-bottom: 32px;
padding: 32px;
.box_title {
width: 180px;
height: 36px;
background: #4e68ff;
border-radius: 0px 0px 4px 4px;
font-size: 16px;
font-family: AlibabaPuHuiTiM;
color: #ffffff;
margin: 0 auto;
line-height: 36px;
}
.range_title {
position: relative;
font-size: 20px;
font-family: AlibabaPuHuiTiB;
color: #333333;
font-weight: bold;
&::after {
content: "实时统计";
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #4e68ff;
background: rgba(78, 104, 255, 0.1);
border-radius: 2px;
width: 62px;
height: 20px;
font-weight: normal;
position: absolute;
right: -74px;
top: 4px;
}
}
.cenbox {
height: 458px;
.map {
width: 100%;
height: 422px;
object-fit: contain;
}
}
.cenboxs {
width: 100%;
display: flex;
justify-content: space-between;
.range {
width: 32%;
background: #ffffff;
border-radius: 4px;
padding: 0 7px;
.rangecontent {
margin-top: 24px;
height: 408px;
background: rgba(78, 104, 255, 0.04);
border-radius: 4px;
padding: 24px 32px;
font-size: 14px;
font-family: AlibabaPuHuiTiM;
// color: #4e68ff;
.rangeList {
li {
margin-bottom: 14px;
display: flex;
justify-content: space-between;
div:nth-child(1) {
width: 20px;
}
div:nth-child(2) {
flex: 1;
}
div:nth-child(3) {
text-align: right;
}
}
}
}
.top10 {
height: 32px;
background: url("~@/assets/img/Home/top10.png") no-repeat center
center;
background-size: contain;
margin-bottom: 18px;
}
.top20 {
height: 32px;
background: url("~@/assets/img/Home/top20.png") no-repeat center
center;
background-size: contain;
margin-bottom: 18px;
}
}
.left_range {
width: 60%;
.rangecontent {
.rangeList {
height: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
li {
width: 40%;
margin-bottom: 14px;
display: flex;
justify-content: space-between;
div:nth-child(1) {
width: 20px;
}
div:nth-child(2) {
flex: 1;
}
div:nth-child(3) {
text-align: right;
}
}
}
}
}
}
}
.map_box {
padding: 0;
}
.healthPopularization {
.typeList {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
li {
cursor: pointer;
width: 23%;
margin-bottom: 24px;
height: 188px;
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
color: #ffffff;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
}
}
.scientificresearch {
.researchList {
display: flex;
margin-bottom: 20px;
li {
width: 188px;
height: 64px;
background: #ffffff;
box-shadow: 0px 4px 1px 1px #3d58f9;
text-align: center;
line-height: 64px;
border-radius: 4px;
border: 1px solid rgba(78, 104, 255, 0.12);
font-size: 16px;
font-family: AlibabaPuHuiTiM;
color: #333333;
margin-right: 20px;
cursor: pointer;
}
}
}
.title_box {
display: flex;
margin-bottom: 24px;
.title {
width: 64px;
height: 30px;
font-size: 16px;
font-family: AlibabaPuHuiTiM;
color: #4e68ff;
line-height: 22px;
border-bottom: 2px solid #4e68ff;
}
.empty {
flex: 1;
height: 30px;
border-bottom: 2px solid #ffffff;
}
}
.fixed_box {
background: #fff;
position: fixed;
padding: 20px 0px;
right: 30px;
bottom: 300px;
z-index: 1000;
.f_list {
li {
display: flex;
align-items: center;
padding: 16px 14px;
cursor: pointer;
img {
width: 20px;
height: 20px;
margin-right: 5px;
}
span {
width: 28px;
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #333333;
}
}
}
}
}
</style>
<style lang="scss">
.poperbackground {
background-color: #4e68ff !important;
border-color: #4e68ff !important;
color: #ffffff;
}
.poperbackground[x-placement^="left"] .popper__arrow::after {
border-left-color: #4e68ff;
}
</style>
<template>
<div>
<el-dialog
center
:visible.sync="dialogVisible"
width="40%"
show-close
@closed="cancelSubmit"
:close-on-click-modal="false"
:show-close="showClose"
>
<slot name="content"></slot>
<slot name="footer"></slot>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return { dialogVisible: false, loading: false }
},
props: {
showClose: {
default: false,
},
},
watch: {},
mounted() {},
methods: {
cancelSubmit() {
this.dialogVisible = false
this.$emit("onCancel")
},
// onSubmit() {
// this.$emit("onSubmit")
// },
},
}
</script>
<style lang="scss" scoped>
::v-deep .el-dialog__body {
border-top: none;
text-align: center;
}
</style>
<template>
<!-- 组件 -->
<div>
<el-container v-loading="fromLoading">
<el-main class="transition-box">
<el-empty v-if="!isEmpty && noData" description="暂无数据"></el-empty>
<template v-if="isEmpty && !noData">
<div ref="my-form" class="my-form">
<template v-for="(item, index) in jsonList">
<custom-form
:key="index"
ref="customForm"
class="mb-20"
:options="item"
:form-edit="formList"
></custom-form
></template>
</div>
</template>
</el-main>
<el-aside
:width="sideWidth"
class="transition-box"
:class="{ hidden: !asideShow }"
>
<div class="side-content">
<ul class="list">
<li v-for="(item, index) in screenList" :key="index">
<div class="time">{{ item.time }}</div>
<div class="time">{{ item.code }}</div>
<div class="time">{{ item.name }}</div>
</li>
</ul>
</div>
</el-aside>
</el-container>
</div>
</template>
<script>
import { mapGetters } from "vuex"
import CustomForm from "@/components/FormComponents/CustomForm/index"
import { getCurrentFormByType } from "@/api/coop-group.js"
import { getFormDetail } from "@/api/field"
import { getPatientDetail } from "@/api/patient.js"
export default {
nameL: "组件",
components: { CustomForm },
props: {
patientId: String,
noData: Boolean,
},
data() {
return {
fromLoading: false,
formTabs: [],
formTabsList: [],
jsonList: [],
formList: {},
asideShow: true,
screenList: [
{
time: "2020-12-12 11:11:11",
code: "UK102",
name: "修改第一次随访计划",
},
],
}
},
provide() {
return {
showIndex: true,
}
},
computed: {
...mapGetters({
group: ["user/group"],
}),
isEmpty() {
return this.jsonList.length
},
sideWidth() {
return this.asideShow ? "200px" : "0px"
},
},
watch: {
patientId(v) {
this.getCurrentFormByType()
},
},
created() {},
mounted() {},
methods: {
// 获取当前用户的表单
getPatientDetail() {
console.log(this.formTabs)
for (let i = 0; i < this.formTabs.length; i++) {
getPatientDetail({
patientId: this.patientId,
formId: this.formTabs[i].formId,
}).then((res) => {
if (res.code == 1) {
const { data } = res.data
this.formList = { ...this.formList, ...data }
// console.log(this.formList)
}
})
}
},
getCurrentFormByType(type = 1) {
this.fromLoading = true
getCurrentFormByType({
type,
groupId: this.group.groupId,
})
.then((res) => {
if (res.code === 1) {
const formTabs = []
this.formTabsList = res.data.map((item, index) => {
if (index === 0) {
// formTabs.push({
// silent: false,
// ...item,
// label: item.tabName,
// })
} else {
formTabs.push({
id: item.id,
formId: item.formId,
silent: true,
label: item.tabName,
})
}
return {
...item,
silent: false,
label: item.tabName,
}
})
this.formTabs = formTabs
}
})
.finally(() => {
this.jsonList = []
let i = 0
this.initForm(i)
})
},
initForm(i) {
let formId = this.formTabs[i].formId
this.formloading = true
getFormDetail(formId)
.then((res) => {
if (res.code === 1 && res.data) {
const formJson = res.data.formJson
const obj = eval("(" + formJson + ")")
obj.disabled = true
obj.closeBtn = true
obj.detail = true
this.jsonList.push(obj)
if (i == this.formTabs.length - 1) {
// console.log(this.jsonList)
this.fromLoading = false
}
}
})
.finally(() => {
// console.log(this.formTabs)
if (i < this.formTabs.length - 1) {
i++
this.initForm(i)
}
// console.log(this.jsonList)
if (this.jsonList.length == this.formTabs.length) {
this.$nextTick(() => {
this.getPatientDetail()
})
}
})
},
},
}
</script>
<style lang="scss" scoped>
.md-20 {
margin-bottom: 20px;
}
.el-aside {
padding: 20px 0 38.5px;
.side-content {
width: 100%;
height: 100%;
border: 1px solid #ccc;
border-radius: 4px;
.list {
li {
padding: 20px 30px;
border-bottom: 1px solid #ccc;
cursor: pointer;
.time {
font-size: 14px;
margin-bottom: 8px;
font-family: AlibabaPuHuiTiR;
text-align: left;
&:first-child {
color: #4e68ff;
}
}
}
}
}
}
</style>
<template>
<div id="audit-detail">
<div class="top">
<div class="audit-detail_header p-24">
<div class="left">
<span v-if="!isEmpty">当前审核</span>
<span v-if="!isEmpty" class="f-b"
>{{ curUnion }}】【剩余{{ auditNum }}</span
>
</div>
<div class="right">
<el-button class="btn" @click="$router.go(-1)">返回</el-button>
</div>
</div>
</div>
<div class="table-content p-24">
<component
:is="curComponent"
:patient-id="patientId"
:no-data="isEmpty"
></component>
</div>
<div v-if="!isEmpty" class="choose-handle p-24">
<span v-if="!editStatus">请选择审核结果:</span>
<div class="btn_group">
<el-button
v-for="(item, index) in btnGroup"
:key="index"
type="primary"
class="p-btn"
size="medium"
@click="showDialog(item.value)"
>{{ item.text }}</el-button
>
<span v-if="editStatus" class="op">驳回修改建议:胃镜图片不合规</span>
</div>
</div>
<div class="p-24 empty"></div>
<public-dialog ref="editDialog" @onSubmit="onSubmit" @onCancel="onCancel">
<!-- 修改审核结果 优先触发提示 -->
<template v-if="!confirmStatus" slot="content">
<div class="title">温馨提示</div>
<div class="content">
<div class="showTips">
该病例已经审核【驳回修改】,需要改为{{
btnGroup[curBtn - 1] ? btnGroup[curBtn - 1].text : ""
}}
</div>
</div>
<div class="btn">
<el-button type="primary" :loading="loading" @click="onCancel"
></el-button
>
<el-button type="primary" :loading="loading" @click="editSubmit"
></el-button
>
</div>
</template>
</public-dialog>
<public-dialog
ref="publicDialog"
:show-close="showClose"
@onSubmit="onSubmit"
@onCancel="onCancel"
>
<!-- 审核结果回显 -->
<template v-if="!confirmStatus && !editLabelFlag" slot="content">
<div class="title">
{{ btnGroup[curBtn - 1] ? btnGroup[curBtn - 1].text : "" }}
</div>
<div class="content">
<div v-if="curBtn != 1" class="noPass">
<el-form
ref="form"
label-position="top"
:model="form"
:rules="rules"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item
:label="curBtn == 2 ? '不合格原因' : '驳回修改建议'"
prop="reason"
>
<el-input
v-model="form.reason"
type="textarea"
:placeholder="
curBtn == 2 ? '请填写不合格原因' : '请填写驳回修改建议'
"
></el-input>
</el-form-item>
</el-form>
<div class="labelPlace">
<div class="labelList">
<template v-for="(item, index) in reasonList">
<div
v-if="item.note ? item.note.length < 8 : false"
:key="index"
:class="[
'listItem',
selectedReason.includes(item.note) ? 'active' : '',
]"
@click="setReason(item)"
>
<!-- selectedReason.includes(item) ? 'active' : '', -->
{{ item.note }}
</div>
<template v-if="item.note ? item.note.length >= 8 : false">
<el-tooltip
:key="index"
class="item"
effect="dark"
:content="item"
placement="top"
>
<div
:class="[
'listItem',
selectedReason.includes(item.note) ? 'active' : '',
]"
@click="setReason(item)"
>
<!-- selectedReason.includes(item) ? 'active' : '', -->
{{ item.note }}
</div>
</el-tooltip>
</template>
</template>
</div>
<div class="labelEdit">
<span @click="editLabel">编辑标签</span>
</div>
</div>
</div>
</div>
<div class="btn">
<el-button type="primary" :loading="loading" @click="onSubmit"
>确认并进入下一列审核</el-button
>
</div>
</template>
<template v-if="!confirmStatus && editLabelFlag" slot="content">
<div class="left-back" @click="editLabelFlag = false">
<i class="el-icon-back"></i>
</div>
<div class="title">编辑标签</div>
<div class="content">
<ul class="edit_reasonList">
<li v-for="(item, index) in reasonList" :key="index">
<el-input
v-model="item.note"
style="width: 86%"
placeholder="请输入标签内容"
clearable
>
</el-input>
<el-button
type="text"
style="color: red"
:disabled="reasonList.length == 1 && item.note == ''"
@click="deleteLabel(index)"
>删除</el-button
>
<el-button
v-show="index == reasonList.length - 1"
type="text"
@click="addLabel"
>新增</el-button
>
</li>
</ul>
</div>
<div class="btn">
<el-button
type="primary"
:loading="loading"
style="padding: 0 30px"
@click="saveLabel"
>保存</el-button
>
</div>
</template>
<!-- 提交后结果 -->
<template v-if="confirmStatus" slot="content">
<div class="title">{{ btnGroup[curBtn - 1].text }}</div>
<div class="content">
<div v-if="curBtn == 1" class="pass">该病例审核合格成功!</div>
<div v-if="curBtn != 1" class="noPass">
<!-- 不合格和驳回 -->
<div class="label">
{{ curBtn == 2 ? "不合格原因" : "驳回修改建议" }}
</div>
<div class="reason">{{ form.reason }}</div>
</div>
</div>
<div v-if="curBtn != 1" class="showTips">
该病例审核{{ curBtn == 2 ? "不合格原因" : "驳回修改建议" }}提交成功!
</div>
<div class="btn">
<el-button type="primary" @click="nextExample"
>确认并进入下一列审核</el-button
>
</div>
</template>
</public-dialog>
</div>
</template>
<script>
import publicDialog from "./components/publicDialog.vue"
import screenReview from "./components/screenReview.vue"
import {
getScreeningUser,
putScreeningCheck,
saveSysCheckNote,
getSysCheckNote,
} from "@/api/screeningAudit"
export default {
components: { publicDialog, screenReview },
data() {
return {
isEmpty: false,
editLabelFlag: false,
auditNum: 0,
editStatus: false, //进入的状态是第一次审核还是修改审核,false为第一次,true为修改
form: {
reason: "",
},
patientId: "", // 当前人的patientId
curUnion: "", // 当前医联体
id: "",
rules: {
reason: [{ required: true, message: "请填写", trigger: "blur" }],
},
reasonList: [],
selectedReason: [],
btnGroup: [
{
text: "合格",
value: 1,
},
{
text: "不合格",
value: 2,
},
{
text: "驳回修改",
value: 3,
},
],
loading: false,
curBtn: 0,
curComponent: "screenReview",
confirmStatus: false,
}
},
computed: {
showClose() {
return this.curBtn == 1 ? false : true
},
},
watch: {},
created() {
let id = this.$route.query.id
this.getUser(id)
},
mounted() {
// this.$refs.publicDialog.dialogVisible = true
},
methods: {
// 获取标签
getSysCheckNote() {
getSysCheckNote().then((res) => {
if (res.code == 1) {
let { data } = res
if (data && data.length > 0) {
console.log(data)
this.reasonList = data
} else {
this.reasonList = [{ note: "" }]
}
}
})
},
// 编辑标签
editLabel() {
this.editLabelFlag = true
},
// 提交接口
putScreeningCheck(checkStatus, func) {
let params = {
id: this.id,
checkStatus: checkStatus,
checkNote: this.form.reason,
patientId: this.patientId,
}
putScreeningCheck(params).then((res) => {
if (res.code == 1 && res.data) {
func()
// this.confirmStatus = true
this.$refs.publicDialog.dialogVisible = true
}
})
},
// 设置理由
setReason({ note }) {
if (this.selectedReason.includes(note)) {
this.selectedReason = this.selectedReason.filter((e) => e != note)
} else {
this.selectedReason.push(note)
}
// console.log("点击标签设置原因", reason)
this.form.reason = this.selectedReason.join("")
},
// 获取当前用户
getUser(id, func) {
getScreeningUser(id)
.then((res) => {
if (res.code == 1 && res.data.detail) {
this.patientId = res.data.detail.patientId
this.curUnion = res.data.detail.unionName
this.id = res.data.detail.id
this.auditNum = res.data.nums
this.isEmpty = false
} else {
this.isEmpty = true
}
})
.finally(() => {
if (func) {
func()
}
})
},
//! checkStatus 合格-3 不合格-4 驳回修改-2 待审核-1
showDialog(val) {
this.curBtn = val
if (val == 1) {
this.$confirm("确定要提交审核吗?", "警告", {
type: "warning",
})
.then(() => {
if (!this.editStatus) {
if (this.curBtn == 1) {
// 走接口,保存合格
this.putScreeningCheck("3", () => {
this.confirmStatus = true
})
}
} else {
this.$refs.editDialog.dialogVisible = true
}
})
.catch(() => {})
} else {
this.getSysCheckNote()
if (!this.editStatus) {
if (this.curBtn == 2) {
this.rules.reason[0].message = "请输入不合格原因"
} else {
this.rules.reason[0].message = "请输入驳回修改建议"
}
this.$refs.publicDialog.dialogVisible = true
} else {
this.$refs.editDialog.dialogVisible = true
}
}
},
// 不合格提交
onSubmit() {
this.loading = true
// 切换文本
if (this.curBtn != 1) {
this.$refs.form.validate((valid) => {
if (valid) {
this.putScreeningCheck("4", () => {
this.$message.success("提交审核成功")
this.nextExample()
})
} else {
console.log("error submit!!")
this.loading = false
return false
}
})
}
// this.$refs.publicDialog.dialogVisible = true
},
onCancel() {
this.confirmStatus = false
this.editLabelFlag = false
if (this.curBtn != 1) {
this.form = { reason: "" }
}
this.$refs.editDialog.dialogVisible = false
this.$refs.publicDialog.dialogVisible = false
if (this.$refs.form) {
this.$refs.form.clearValidate()
}
},
editSubmit() {
// this.$refs.editDialog.dialogVisible = false
if (this.curBtn == 1) {
// 走接口,保存合格
this.confirmStatus = true
} else if (this.curBtn == 2) {
this.rules.reason[0].message = "请输入不合格原因"
} else {
this.rules.reason[0].message = "请输入驳回修改建议"
}
this.$refs.publicDialog.dialogVisible = true
},
nextExample() {
this.getUser(this.$route.query.id, () => {
this.loading = false
this.onCancel()
})
},
deleteLabel(i) {
this.$confirm("确定要删除该标签吗?", "警告", {
type: "warning",
})
.then(() => {
this.reasonList = this.reasonList.filter((e, index) => index != i)
if (this.reasonList.length == 0) {
this.reasonList = [
{
note: "",
},
]
}
})
.catch(() => {})
},
// 增加标签
addLabel() {
this.reasonList.push({
note: "",
})
},
// 保存标签
saveLabel() {
let arr = this.reasonList.map((e) => e.note)
saveSysCheckNote(arr).then((res) => {
if (res.code == 1) {
this.$message.success("保存标签成功")
this.getSysCheckNote()
this.editLabelFlag = false
}
})
},
},
}
</script>
<style lang="scss" scoped>
.tips {
font-size: 16px;
}
.p-24 {
padding: 0 24px;
}
.f-b {
font-weight: bold;
font-size: 14px;
}
#audit-detail {
display: flex;
flex-direction: column;
// padding: 22px 24px;
.audit-detail_header {
height: 65px;
border-bottom: 1px solid #f3f3f3;
line-height: 65px;
display: flex;
justify-content: space-between;
.right {
.btn {
width: 80px;
height: 32px;
border-radius: 4px;
}
}
}
.choose-handle {
width: 100%;
height: 72px;
line-height: 72px;
font-size: 14px;
font-family: AlibabaPuHuiTiM;
color: #333333;
// box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
border-top: 1px solid rgba(0, 0, 0, 0.1);
display: flex;
.btn_group {
margin-left: 24px;
::v-deep .p-btn {
width: 100px;
border-radius: 4px;
}
}
}
}
.title {
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
}
.content {
margin: 58px;
.pass {
font-size: 18px;
font-family: AlibabaPuHuiTiM;
color: #30b9a6;
letter-spacing: 1px;
}
}
.btn {
margin-top: 20px;
.el-button {
// width: 100px;
border-radius: 5px;
height: 32px;
}
}
::v-deep .el-form-item__label {
width: 100%;
text-align: left;
}
.reason {
margin-top: 20px;
}
.showTips {
color: #4e68ff;
}
.op {
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #fa6400;
margin-left: 20px;
}
.table-content {
// height: calc(100vh - 260px);
// overflow: auto;
padding-top: 20px;
padding-bottom: 20px;
}
.empty {
width: 100%;
height: 15px;
background: #f6f8f9;
}
.left-back {
position: absolute;
padding: 7px 5px;
top: 10px;
font-size: 20px;
text-align: left;
cursor: pointer;
}
.labelPlace {
.labelList {
display: flex;
flex-wrap: wrap;
.listItem {
cursor: pointer;
max-width: 200px;
white-space: nowrap;
display: block;
overflow: hidden;
text-overflow: ellipsis;
padding: 8px 12px;
border: 1px solid rgba(78, 104, 255, 0.06);
background: rgba(78, 104, 255, 0.06);
border-radius: 2px;
margin: 0 12px 12px 0;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
color: #353a45;
user-select: none;
}
.active {
background: rgba(78, 104, 255, 0.1);
color: #4e68ff;
border-radius: 2px;
border: 1px solid #4e68ff;
}
}
.labelEdit {
font-size: 14px;
text-align: right;
span {
cursor: pointer;
}
user-select: none;
font-family: PingFangSC-Medium, PingFang SC;
color: rgba(78, 120, 255);
text-decoration: underline;
&:active {
color: rgba(78, 50, 255);
}
}
}
.edit_reasonList {
li {
display: flex;
margin-bottom: 16px;
.el-button {
margin-left: 12px;
font-size: 14px;
}
}
}
</style>
<template>
<div class="audit-qualitycontrol">
<div class="aq-top-tab">
<el-tabs v-model="type" @tab-click="handleClick">
<el-tab-pane label="筛查病例数据" name="0"></el-tab-pane>
<el-tab-pane label="随访病例数据" name="1"></el-tab-pane>
</el-tabs>
</div>
<div class="aq-bot-table">
<div class="table-top-tab">
<el-tabs v-model="auditStatus" type="card" @tab-click="handleClick">
<el-tab-pane label="待审核" name="0"></el-tab-pane>
<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 />
</div>
</div>
<div class="bot-table">
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
</div>
</div>
</template>
<script>
// import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import { getFollowCheck, getFollowUncheck } from "@/api/followup"
import { getScreeningCheck, getScreeningUncheck } from "@/api/screeningAudit"
export default {
components: {
// CustomsTable,
},
mixins: [paginationMixin],
data() {
return {
type: "", // 0是筛查 1是随访
auditStatus: "", // 0 待审核 1 已审核
listLoading: false,
tableData: [
// {
// unionId: "2",
// unionName: "合肥高新附院",
// unCheckNums: 2,
// checkNums: 0,
// reportTime: "2022-12-09 09:12:35",
// },
],
}
},
watch: {
auditStatus(val) {
sessionStorage.setItem("audit-status", val)
switch (this.type) {
case "1":
this.handleSearch()
break
}
console.log("status", val)
},
type(val) {
console.log("type", val)
sessionStorage.setItem("audit-type", val)
switch (val) {
case "1":
this.handleSearch()
break
}
},
},
computed: {
columns() {
const unCkeckColumns = [
{
label: "医联体",
minWidth: 120,
value: "unionName",
},
{
label: "已审核(例)",
minWidth: 120,
value: "checkNums",
},
{
label: "待审核(例)备份",
minWidth: 120,
value: "unCheckNums",
},
{
label: "最新上报时间",
minWidth: 120,
value: "reportTime",
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.auditHandle,
label: "审核",
type: "text",
},
],
},
]
const checkColumns = [
{
label: "筛查编号",
minWidth: 120,
value: "unionId",
},
{
label: "医联体",
minWidth: 120,
value: "unionName",
},
{
label: "姓名",
minWidth: 120,
formatter: (row) => {
return row.name ? row.name : "--"
},
value: "name",
},
{
label: "年龄",
minWidth: 120,
value: "age",
formatter: (row) => {
return row.age ? row.age : "--"
},
},
{
label: "风险评估",
minWidth: 120,
value: "checkNums",
},
{
label: "审核状态",
minWidth: 120,
value: "checkStatus",
formatter: (row) => {
let text = ""
if (row.checkStatus == 3) {
text = "合格"
} else if (row.checkStatus == 4) {
text = "不合格"
} else if (row.checkStatus == 5) {
text = "驳回修改"
} else if (row.checkStatus) {
text = "--"
}
return text
},
},
{
label: "上报时间",
minWidth: 120,
value: "reportTime",
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.auditHandle,
label: "审核",
type: "text",
},
],
},
]
return this.auditStatus == "1" ? checkColumns : unCkeckColumns
},
},
mounted() {
if (
sessionStorage.getItem("audit-status") ||
sessionStorage.getItem("audit-type")
) {
this.auditStatus = sessionStorage.getItem("audit-status") || "0"
this.type = sessionStorage.getItem("audit-type") || "0"
}
this.handleSearch()
},
methods: {
handleClick() {
if (this.auditStatus == 1) {
this.columns[this.columns.length - 1].operations[0].label =
"修改审核意见"
} else {
this.columns[this.columns.length - 1].operations[0].label = "审核"
}
this.handleSearch()
},
auditHandle(data, i) {
if (this.type == "1") {
this.$router.push({
path: "/followaudit",
query: {
unionId: data['unionId'],
unionName:data['unionName']
},
})
} else {
this.$router.push({
path: "/auditdetail",
query: {
id: data["unionId"],
},
})
}
},
async handleSearch() {
this.listLoading = true
let params = {
pageSize: this.pageSize,
pageNum: this.pageIndex,
}
let res
switch (this.auditStatus) {
case "0":
if (this.type == "0") {
res = await getScreeningUncheck(params) //待审核
} else {
res = await getFollowUncheck(params) //待审核
}
break
case "1":
if (this.type == "0") {
res = await getScreeningCheck(params) //待审核
} else {
res = await getFollowCheck(params) //已审核
}
break
}
this.tableData = res.data.records
this.total = res.data.total
this.listLoading = false
},
},
}
</script>
<style lang="scss" scoped>
.audit-qualitycontrol {
padding: 20px 0;
.table-top-tab {
margin-bottom: 15px;
position: relative;
.keyExplain {
position: absolute;
display: flex;
align-items: center;
right: 0;
top: 10%;
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: #999999;
img {
width: 18px;
height: 18px;
margin-left: 5px;
transform: translateY(1px);
}
}
}
.aq-bot-table {
padding: 20px;
::v-deep {
.el-tabs__nav {
border: none;
}
.el-tabs__item {
margin-right: 10px;
border: 1px solid #e4e7ed;
border-radius: 5px 5px 0 0;
}
.is-active {
background: #4e68ff;
color: #fff;
}
}
}
}
::v-deep {
.el-tabs__item {
padding-left: 20px !important;
font-size: 18px;
font-family: AlibabaPuHuiTiM;
}
.is-active {
color: #4e68ff;
}
}
</style>
<template>
<div class="dataCenter">
<div class="header">
<div
v-for="(item, index) in headList"
:key="index"
:class="['btn', selectedIndex == index ? 'active' : '']"
@click="setSelectedIndex(index)"
>
{{ item }}
</div>
</div>
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import { getPatientPage } from "@/api/dataoverview.js"
export default {
// 数据概览
name: "",
components: {
CustomsTable,
},
mixins: [paginationMixin],
data() {
return {
listLoading: false,
selectedIndex: sessionStorage.getItem("homeSelectedIndex") - 0 || 0,
headList: ["筛查概览", "社区筛查", "医院筛查", "体检筛查"],
columns: [
{
label: "医联体",
minWidth: 120,
value: "unionName",
},
{
label: "累计上报量",
minWidth: 120,
value: "report",
},
{
label: "最近一季度上报量",
minWidth: 120,
value: "lastQuarter",
},
{
label: "累计审核合格量",
minWidth: 120,
value: "pass",
},
{
label: "高风险",
minWidth: 120,
value: "high",
},
{
label: "中风险",
minWidth: 120,
value: "middle",
},
{
label: "低风险",
minWidth: 120,
value: "low",
},
{
label: "胃癌",
minWidth: 120,
value: "gas",
},
{
label: "早期胃癌",
minWidth: 120,
value: "earlyGas",
},
{
label: "食道癌",
minWidth: 120,
value: "esophagus",
},
],
tableData: [],
}
},
watch: {},
mounted() {
this.getPatientPage()
},
methods: {
setSelectedIndex(i) {
console.log(this.selectedIndex)
this.selectedIndex = i
this.getPatientPage()
sessionStorage.setItem("homeSelectedIndex", this.selectedIndex)
},
getPatientPage() {
this.listLoading = true
let data = {
patientFrom: this.selectedIndex == "0" ? null : this.selectedIndex,
}
getPatientPage(data).then((res) => {
this.listLoading = false
if (res.code === 1) {
const d = res.data
this.tableData = d.records || []
this.total = Number(d.total)
}
this.listLoading = false
})
},
},
}
</script>
<style lang="scss" scoped>
.dataCenter {
padding: 24px;
height: 100%;
display: flex;
flex-direction: column;
.header {
display: flex;
margin-bottom: 20px;
.btn {
cursor: pointer;
width: 112px;
height: 48px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #dddddd;
font-size: 16px;
font-family: AlibabaPuHuiTiM;
color: #000;
text-align: center;
line-height: 48px;
margin-right: 24px;
}
.active {
background: #4e68ff;
border: none;
color: #ffffff;
}
}
}
</style>
<template>
<!-- 随访审核详情 -->
<div class="follow-form">
<!-- <ConfigForms form-type="2" formClass="follow-form"></ConfigForms> -->
<el-container>
<el-aside width="auto">
<div class="follow-tab">
<p class="tab-title">筛查病例数据</p>
<el-tabs tab-position="right" style="height: 200px;" v-model="activeTab">
<el-tab-pane
:label="'第'+ Number(index+1) + '次随访数据'"
v-for="(item,index) in formDataList"
:key="index"
:name="String(index)"
></el-tab-pane>
</el-tabs>
</div>
</el-aside>
<el-main>
<read-form ref="form" :options="followupForm" :formEdit="formEdit"></read-form>
</el-main>
<el-aside width="auto" class="transition-box">
<div class="follow-list">
<ul class="list">
<li v-for="(item, index) in screenList" :key="index">
<div class="time">{{ item.time }}</div>
<div class="time">{{ item.code }}</div>
<div class="time">{{ item.name }}</div>
</li>
</ul>
</div>
</el-aside>
</el-container>
</div>
</template>
<script>
import ConfigForms from "@/views/screening/components/ConfigForms.vue"
import ReadForm from "@/components/FormComponents/ReadForm/index"
export default {
name: "followReview",
components: {
ConfigForms,
ReadForm
},
props: {
tabActive:{
type:String,
},
formDataList: {
type: Array,
},
},
data() {
return {
followupForm:{
column: [],
labelPosition: 'left',
labelSuffix: '',
labelWidth: 180,
gutter: 0,
menuBtn: true,
submitBtn: true,
submitText: '提交',
emptyBtn: true,
emptyText: '清空',
nextTabBtn: true,
nextTabText: '下一页',
menuPosition: 'center',
group: [
{
label: '第二次随访调查',
prop: '1669858313508_15761',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
column: [
{
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: 24,
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: 24,
width: 12
}
]
},
{
label: '是否接受胃镜检查',
prop: '1669860991131_8643',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
showIndex:true,
column: [{
type: 'radio',
display: true,
importantField: true,
styles: {},
label: '是否接受检查',
prop: 'is_accept',
dicData: [{
label: '',
value: '1',
id: '1595347527757000705',
parentId: ''
}, {
label: '',
value: '0',
id: '1595347502595371010',
parentId: ''
}],
dynamicshSet: [{
value: '1',
target: '1669861007378_67152'
}],
dicType: 'd-sf',
props: {
label: 'label',
value: 'value'
},
fieldType: 'tinyint',
fieldLength: '2',
tableName: '胃镜检查',
tableCode: 'gastroscope',
tableId: '1597468524048121858',
notFilter: false,
cType: '',
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
lg: 24
}]
},
{
label: '胃镜检查结果',
prop: '1669861007378_67152',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
showIndex:true,
column: [
{
type: 'datetime',
display: true,
importantField: true,
styles: {},
color:"#4B65FF",
label: '检查时间',
prop: 'check_time',
dicData: [{
label: '',
value: '1',
id: '1595347527757000705',
parentId: ''
}, {
label: '',
value: '0',
id: '1595347502595371010',
parentId: ''
}],
dynamicshSet: [],
dicOption: 'static',
dicType: '',
props: {
label: 'label',
value: 'value'
},
fieldType: 'datetime',
fieldLength: '',
format: 'yyyy-MM-dd HH:mm:ss',
valueFormat: 'yyyy-MM-dd HH:mm:ss',
tableName: '胃镜检查',
tableCode: 'gastroscope',
tableId: '1597468524048121858',
notFilter: false,
cType: '',
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
width: 12
},
{
type: 'radio',
display: true,
importantField: true,
styles: {},
prop: 'check_type',
label: '胃镜检查方式',
fieldType: 'int',
fieldLength: '11',
autoRequired: 0,
personalRequired: 0,
dicData: [
{
label: '胃镜普通白光检查',
value: '1',
id: '1597475602204557314',
parentId: ''
}, {
label: '胃镜普通白光检查+LCI检查',
value: '2',
id: '1597475677853024258',
parentId: ''
}, {
label: '磁控胶囊胃镜检查',
value: '3',
id: '1597475763517489154',
parentId: ''
}
],
dynamicshSet: [],
dicType: 'gas_check_type',
props: {
label: 'label',
value: 'value'
},
tableName: '胃镜检查',
tableCode: 'gastroscope',
tableId: '1597468524048121858',
notFilter: false,
cType: '',
subfield: false,
span: 24
},
{
type: 'radio',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [{
label: '未见异常',
value: '1',
id: '1597476184780800001',
parentId: ''
}, {
label: '异常',
value: '2',
id: '1597476229722767361',
parentId: ''
}],
dynamicshSet: [{
value: '2',
target: 'detail_check_type'
}, {
value: '2',
target: 'diagnosis'
}],
dicType: 'check_result',
props: {
label: 'label',
value: 'value'
},
prop: 'check_result',
label: '检查结果',
fieldType: 'tinyint',
fieldLength: '2',
tableName: '胃镜检查',
tableCode: 'gastroscope',
tableId: '1597468524048121858',
notFilter: false,
cType: '',
subfield: false,
span: 24
},
{
type: 'checkbox',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [{
label: 'NBI',
value: '1',
id: '1597476883899973634',
parentId: ''
}, {
label: 'FICE',
value: '2',
id: '1597476919312482306',
parentId: ''
}, {
label: 'I-SC',
value: '3',
id: '1597476961561706498',
parentId: ''
}, {
label: 'BLI',
value: '4',
id: '1597476996303126529',
parentId: ''
}, {
label: '放大内镜',
value: '5',
id: '1597477029488459778',
parentId: ''
}, {
label: '激光共聚焦显微内镜',
value: '6',
id: '1597477062287917057',
parentId: ''
}, {
label: '荧光内镜',
value: '7',
id: '1597477097977249793',
parentId: ''
}, {
label: '化学染色',
value: '8',
id: '1597477133691748353',
parentId: ''
}],
dynamicshSet: [],
dicType: 'gas_detail_check_type',
props: {
label: 'label',
value: 'value'
},
prop: 'detail_check_type',
label: '胃镜精查方式',
fieldType: 'varchar',
fieldLength: '255',
tableName: '胃镜检查',
tableCode: 'gastroscope',
tableId: '1597468524048121858',
notFilter: false,
cType: '',
subfield: false,
span: 24
},
{
type: 'radio',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
dicData: [{
label: '未见异常',
value: '1',
id: '1597476184780800001',
parentId: ''
}, {
label: '异常',
value: '2',
id: '1597476229722767361',
parentId: ''
}],
dynamicshSet: [{
value: '2',
target: 'esophagus_level'
}, {
value: '2',
target: 'esophagus_position'
}, {
value: '2',
target: 'early_esophagus_cancer'
}, {
value: '2',
target: 'period_esophagus_cancer'
}, {
value: '2',
target: 'is_barret_esophagus'
}, {
value: '2',
target: 'is_back_esophagus'
}, {
value: '2',
target: 'inogm_level'
}, {
value: '2',
target: 'inogm_position'
}, {
value: '2',
target: 'early_gastric_cancer'
}, {
value: '2',
target: 'period_gastric_cancer'
}, {
value: '2',
target: 'atrophic_gastriti'
}, {
value: '2',
target: 'gastric_ulcer'
}, {
value: '2',
target: 'gastric_polyp_type'
}, {
value: '2',
target: 'gastric_polyp'
}, {
value: '2',
target: 'non_atrophic_gastriti'
}, {
value: '2',
target: 'is_duodenal_ulcer'
}, {
value: '2',
target: 'other_pathology'
}],
dicType: 'check_result',
props: {
label: 'label',
value: 'value'
},
prop: 'diagnosis',
label: '最后诊断',
fieldType: 'tinyint',
fieldLength: '4',
tableName: '胃镜检查',
tableCode: 'gastroscope',
tableId: '1597468524048121858',
notFilter: false,
cType: '',
subfield: false,
span: 24
},
]
},
{
label: '实验室检查',
prop: '1669863751318_50013',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
showIndex:true,
column: [
{
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'G_17',
label: '胃泌素17',
fieldType: 'varchar',
fieldLength: '255',
tableName: '实验室检查',
tableCode: 'gas_exam',
tableId: '1597466741234040833',
notFilter: false,
cType: '',
subfield: false,
autoRequired: 0,
personalRequired: 0,
span: 24,
width: 12,
unit:"pmol/L",
color:"#5972FF"
},
{
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'PG_I',
label: '胃蛋白酶原I(PG I)',
fieldType: 'varchar',
fieldLength: '255',
tableName: '实验室检查',
tableCode: 'gas_exam',
tableId: '1597466741234040833',
notFilter: false,
cType: '',
subfield: false,
span: 24,
width: 12
},
{
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'PG_II',
label: '胃蛋白酶原II(PG II)',
fieldType: 'varchar',
fieldLength: '255',
tableName: '实验室检查',
tableCode: 'gas_exam',
tableId: '1597466741234040833',
notFilter: false,
cType: '',
subfield: false,
span: 24,
width: 12
},
{
type: 'radio',
display: true,
importantField: true,
styles: {},
prop: 'IgG',
label: 'Hp抗体(IgG)检测',
fieldType: 'varchar',
fieldLength: '255',
autoRequired: 0,
personalRequired: 0,
dicData: [{
label: '阴性',
value: '1',
id: '1598150963816923138',
parentId: ''
}, {
label: '阳性',
value: '2',
id: '1598150992287858689',
parentId: ''
}],
dynamicshSet: [],
dicType: 'hp_antibody',
props: {
label: 'label',
value: 'value'
},
tableName: '实验室检查',
tableCode: 'gas_exam',
tableId: '1597466741234040833',
notFilter: false,
cType: '',
subfield: false,
span: 24
},
{
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'img_path',
label: '图片资料',
fieldType: 'varchar',
fieldLength: '255',
tableName: '实验室检查',
tableCode: 'gas_exam',
tableId: '1597466741234040833',
notFilter: false,
cType: '',
subfield: false,
span: 24,
width: 12
}
]
},
{
label: '风险评估',
prop: '1669864316349_49130',
arrow: true,
collapse: true,
display: true,
labelWidth: 8,
showIndex:true,
column: [
{
type: 'input',
display: true,
importantField: true,
styles: {},
autoRequired: 0,
personalRequired: 0,
prop: 'risk_score',
label: '风险评分',
fieldType: 'varchar',
fieldLength: '255',
tableName: '风险评估',
tableCode: 'gas_risk_assessment',
tableId: '1598151898370768898',
notFilter: false,
cType: '',
subfield: false,
span: 24,
width: 12
},
{
type: 'input',
display: true,
importantField: true,
styles: {},
prop: 'risk_rank',
label: '风险等级',
fieldType: 'varchar',
fieldLength: '20',
tableName: '风险评估',
tableCode: 'gas_risk_assessment',
tableId: '1598151898370768898',
notFilter: false,
cType: '',
subfield: false,
span: 24,
width: 12
},
]
},
{
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
}
]
},
]
},
// formEdit:{
// },
activeTab:'0',
screenList: [
{
time: "2020-12-12 11:11:11",
code: "UK102",
name: "修改第一次随访计划",
},
],
}
},
watch:{
tabActive(val){
this.activeTab = val
}
},
computed:{
//当前随访数据
formEdit:{
get(){
return this.formDataList[this.activeTab]
},
set(){
}
}
},
created() {
},
mounted(){
this.formEdit = this.formDataList[this.activeTab]
},
methods: {},
}
</script>
<style lang="scss" scoped>
::v-deep {
.el-tabs--card > .el-tabs__header {
width: calc(100% - 100px);
border-bottom: none;
}
.el-tabs--card > .el-tabs__header .el-tabs__nav {
border: none;
}
.el-tabs--card > .el-tabs__header .el-tabs__item {
min-width: 116px;
text-align: center;
background: #f0f1fa;
font-size: 14px;
border: none;
}
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
background: #4e68ff;
color: #fff;
}
.el-main {
padding: 0px 20px;
}
.el-aside {
padding-bottom: 20px;
}
}
.follow-tab {
::v-deep {
border-radius: 4px;
border: 1px solid #cccccc;
height: 100%;
.el-tabs__header {
margin-left: 0px;
}
.el-tabs__nav-wrap.is-right::after {
width: 0px;
}
.el-tabs__active-bar.is-right {
width: 3px;
height: 52px !important;
}
.el-tabs--right {
height: auto !important;
}
.tab-title {
padding: 16px;
background: #fafafa;
color: #333333;
border-bottom: 1px solid #cccccc;
}
.el-tabs__item {
padding: 16px;
width: 180px;
background: #fafafa;
height: auto;
line-height: inherit;
border-bottom: 1px solid #cccccc;
transition: all 1s;
}
.el-tabs__item.is-active {
background: transparent;
}
}
}
.follow-list {
border-radius: 4px;
border: 1px solid #cccccc;
height: 100%;
background: #fafafa;
li {
padding: 16px;
border-bottom: 1px solid #ccc;
// cursor: pointer;
.time {
font-size: 14px;
margin-bottom: 8px;
font-family: AlibabaPuHuiTiR;
text-align: left;
&:first-child {
color: #4e68ff;
}
}
}
}
.follow-form {
::v-deep {
.el-collapse-item__header {
// border-width: 0px 0px 0px;
border: none !important;
}
.row24 {
border-top: 1px solid #cccccc;
}
.custom-form-item {
border-width: 1px 0px 0px;
}
.el-collapse-item {
margin-bottom: 20px;
border-radius: 4px;
overflow: hidden;
border: 1px solid #cccccc;
}
.el-collapse-item:not(:last-child) {
}
.el-collapse-item__wrap {
border: none;
}
// .row24.el-col-lg-12:nth-child(2n) {
// border-width: 0px 0px 0px 1px;
// }
.el-form-item {
padding: 0px;
}
}
}
</style>
<template>
<div>
<el-dialog center :visible.sync="dialogVisible" width="40%" show-close @closed="cancelSubmit">
<slot name="content"></slot>
<slot name="footer"></slot>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return { dialogVisible: false, loading: false }
},
watch: {},
mounted() {},
methods: {
cancelSubmit() {
this.dialogVisible = false
this.$emit("onCancel")
},
// onSubmit() {
// this.$emit("onSubmit")
// },
},
}
</script>
<style lang="scss" scoped></style>
<template>
<!-- 随访审核 -->
<div id="audit-detail">
<div class="audit-detail_header p-24">
<div class="left">
<span>当前审核</span>
<span class="f-b">{{ unionName }}】【剩余{{ mcCount }}</span>
</div>
<div class="right">
<el-button class="btn" @click="$router.go(-1)">返回</el-button>
</div>
</div>
<div class="table-content p-24">
<follow-review :formDataList="formEdit" :tabActive="tabActive"></follow-review>
</div>
<div class="choose-handle p-24">
<span v-if="!editStatus">请选择审核结果:</span>
<div class="btn_group">
<el-button
v-for="(item, index) in btnGroup"
:key="index"
type="primary"
class="p-btn"
size="medium"
@click="showDialog(item.value, index)"
>{{ item.text }}</el-button>
<span v-if="editStatus" class="op">驳回修改建议:胃镜图片不合规</span>
</div>
</div>
<public-dialog ref="editDialog" @onCancel="onCancel">
<!-- 修改审核结果 优先触发提示 -->
<template v-if="!confirmStatus" slot="content">
<div class="title">温馨提示</div>
<div class="content">
<div class="showTips">
该病例已经审核【驳回修改】,需要改为{{
btnGroup[curBtn - 1] ? btnGroup[curBtn - 1].text : ""
}}
</div>
</div>
<div class="btn">
<el-button type="primary" :loading="loading" @click="onCancel"></el-button>
<el-button type="primary" :loading="loading" @click="editSubmit"></el-button>
</div>
</template>
</public-dialog>
<public-dialog ref="publicDialog" @onCancel="onCancel">
<!-- 审核结果回显 -->
<template v-if="!confirmStatus && !showNote" slot="content">
<div class="title">{{ btnGroup[curBtn - 1] ? btnGroup[curBtn - 1].text : "" }}</div>
<div class="content" ref="publicContent">
<div v-if="curBtn != 1" class="noPass">
<el-form
ref="form"
label-position="top"
:model="form"
:rules="rules"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item :label="curBtn == 2 ? '不合格原因' : '驳回修改建议'" prop="reason">
<el-input
v-model="form.reason"
type="textarea"
:placeholder="
curBtn == 2 ? '请填写不合格原因' : '请填写驳回修改建议'
"
></el-input>
</el-form-item>
</el-form>
<!-- 标签 -->
<div class="tag-form" v-loading="tagLoading">
<el-tag
:key="index"
v-for="(item, index) in tagList"
size="medium"
:class="item.isSelect ? '' : 'unselect-tag'"
@click="seleckTag(item, index)"
>
<span>{{ item.note }}</span>
</el-tag>
<p class="handle-row" @click="showNote = true">编辑标签</p>
</div>
</div>
</div>
<div class="btn">
<el-button type="primary" :loading="loading" @click="onCancel">确 定</el-button>
</div>
</template>
<!-- 标签操作 -->
<template slot="content" v-if="!confirmStatus && showNote">
<div class="left-back" @click="handleNoteDialog">
<i class="el-icon-back"></i>
</div>
<div class="title">编辑标签</div>
<div class="content note-dialog" v-if=" tagList.length>0" :style="{'min-height':minHeight}">
<el-row :key="index" v-for="(item, index) in tagList" class="mb-16">
<el-col :span="18">
<el-input
size="medium"
v-model="item.note"
class="tag-input"
:class="item.isSelect ? '' : 'unselect-tag'"
placeholder="请输入标签"
></el-input>
</el-col>
<el-col :span="3">
<span class="handle-text" style="color: #E02020;" @click="delTag(item,index)">删除</span>
</el-col>
<el-col :span="2">
<span
class="handle-text"
style="color: #4E68FF;"
v-if="index == tagList.length - 1"
@click="addTag"
>添加</span>
</el-col>
</el-row>
</div>
<div class="content" :style="{'min-height':minHeight}" v-else>
<el-row class="mb-16">
<el-col :span="18">
<el-input size="medium" v-model="newNote" class="tag-input" placeholder="请输入标签"></el-input>
</el-col>
<el-col :span="3">
<span class="handle-text" style="color: #E02020;" @click="delTag(item,index)">删除</span>
</el-col>
<el-col :span="2">
<span class="handle-text" style="color: #4E68FF;" @click="addTag">添加</span>
</el-col>
</el-row>
</div>
<div class="btn">
<el-button type="primary" :loading="auditLoading" @click="saveTag">
<span>保 存</span>
</el-button>
</div>
</template>
<!-- 提交后结果 -->
<template v-if="confirmStatus" slot="content">
<div class="title">{{ btnGroup[curBtn - 1].text }}</div>
<div class="content">
<div v-if="curBtn == 1" class="pass">该病例审核合格成功!</div>
<div v-if="curBtn != 1" class="noPass">
<!-- 不合格和驳回 -->
<div class="label">{{ curBtn == 2 ? "不合格原因" : "驳回修改建议" }}</div>
<div class="reason">{{ form.reason }}</div>
</div>
</div>
<div v-if="curBtn != 1" class="showTips">该病例审核{{ curBtn == 2 ? "不合格原因" : "驳回修改建议" }}提交成功!</div>
<div class="btn">
<el-button type="primary" @click="nextExample" :loading="auditLoading">
<span v-if="tabActive < this.formEdit.length - 1">确认并进入下一列审核</span>
<span v-else>确 定</span>
</el-button>
</div>
</template>
</public-dialog>
</div>
</template>
<script>
import publicDialog from "./components/publicDialog.vue"
import followReview from "./components/followReview.vue"
import { getFollowUnCheckDetail, putFollowCheck } from "@/api/followup"
import { getSysCheckNote,postSysCheckNote } from "@/api/note"
export default {
components: { publicDialog, followReview },
data() {
return {
mcCount: 7,
editStatus: false, //进入的状态是第一次审核还是修改审核,false为第一次,true为修改
tabActive: "0", //当前随访病例
formEdit: [
{
patientId: "1623190906909835266",
id: "1623216842623492098",
formRecordId: "1623216842522828802",
age: "",
name: "",
checkStatus: 1,
patientFrom: 1,
unionName: "合肥高新附院",
unionId: "2",
reportTime: "",
riskRank: "",
formId: "1598197066503389185",
is_accept: "0",
},
{
name: "djksh",
contact_phone: "12345678",
is_accept: "1",
gas_exam: "15",
G_17: "6",
},
], //填报数据
auditLoading: false,
tagLoading:false,
form: {
reason: "",
}, //审核表单
rules: {
reason: [{ required: true, message: "请填写", trigger: "blur" }],
},
btnGroup: [
{
text: "合格",
value: 3,
},
{
text: "不合格",
value: 4,
},
{
text: "驳回修改",
value: 2,
},
],
loading: false,
curBtn: 0, //点击的按钮
curComponent: "followReview",
confirmStatus: false,
tagList: [
// {
// note: "不合格原因",
// isSelect: false,
// },
// {
// note: "不合格原因不合格原因",
// },
// {
// note: "不合格原因",
// },
// {
// note: "不合格原因",
// },
// {
// note: "不合格原因",
// },
],
newNote:'',
minHeight:'170px',
showNote:false
}
},
watch: {
// tagList(){
// this.$nextTick(() => {
// this.minHeight = this.$refs.publicContent.offsetHeight + "px"
// })
// }
},
created() {
this.getDetail()
},
computed: {
unionId() {
return this.$route.query.unionId
},
unionName() {
return this.$route.query.unionName || "--"
},
},
methods: {
showDialog(val, index) {
console.log("显示框", val)
this.curBtn = index + 1
if (!this.editStatus) {
if (this.curBtn == 1) {
// 走接口,保存合格
this.confirmStatus = true
} else if (this.curBtn == 2) {
this.rules.reason[0].message = "请输入不合格原因"
//获取审核标签
this.getSysCheckNote()
} else {
this.rules.reason[0].message = "请输入驳回修改建议"
}
this.$refs.publicDialog.dialogVisible = true
} else {
this.$refs.editDialog.dialogVisible = true
}
},
onCancel() {
this.confirmStatus = false
if (this.curBtn != 1) {
this.form = {}
}
this.$refs.editDialog.dialogVisible = false
this.$refs.publicDialog.dialogVisible = false
// this.$refs.noteDialog.dialogVisible = false
if (this.$refs.form) {
this.$refs.form.clearValidate()
}
},
editSubmit() {
// this.$refs.editDialog.dialogVisible = false
if (this.curBtn == 1) {
// 走接口,保存合格
this.confirmStatus = true
} else if (this.curBtn == 2) {
this.rules.reason[0].message = "请输入不合格原因"
} else {
this.rules.reason[0].message = "请输入驳回修改建议"
}
this.$refs.publicDialog.dialogVisible = true
},
nextExample() {
if (Number(this.tabActive) < this.formEdit.length - 1) {
this.tabActive = String(Number(this.tabActive) + 1)
}
console.log("tab激活", this.tabActive)
this.onCancel()
},
//随访数据
async getDetail() {
this.loading = true
let res = await getFollowUnCheckDetail(this.unionId)
if (res.code == 1) {
// this.formEdit=res.data //调试注释
}
this.loading = false
},
//审核
async handleCheck() {
this.auditLoading = true
let params = {
id: this.formEdit[this.tabActive],
checkStatus: this.btnGroup[this.curBtn].value,
checkNote: this.form.reason,
patientId: this.unionId,
}
console.log("审核值", params)
// let res = await putFollowCheck(params)
// if(res.code==1){
// // this.formEdit=res.data //调试注释
// }
this.auditLoading = false
},
// 获取审核标签
async getSysCheckNote() {
this.tagLoading = true
let res = await getSysCheckNote()
if (res.code == 1) {
this.tagList=res.data
}
this.tagLoading = false
},
//选择标签
seleckTag(item, index) {
this.tagList[index]["isSelect"] = true
this.form.reason = this.form.reason + item.note + ''
this.$forceUpdate()
},
//标签保存
async saveTag(){
let params = this.tagList.map((e) => e.note)
let res = await postSysCheckNote(params)
if (res.code == 1) {
this.$message.success("保存标签成功")
this.getSysCheckNote()
// this.$refs.noteDialog.dialogVisible = false
}
},
//标签添加
addTag(){
this.tagList.push(
{
note:''
},
)
this.$forceUpdate();
},
//标签删除
delTag(item,index){
this.$confirm("确定要删除该标签吗?", "警告", {
type: "warning",
})
.then(() => {
this.tagList = this.tagList.filter((e, i) => i != index)
})
.catch(() => {})
},
//标签对话框关闭
handleNoteDialog(i){
this.showNote = false
this.getSysCheckNote()
},
// //标签保存对话框操作
// noteSave(){
// this.$refs.noteDialog.dialogVisible = false
// this.getSysCheckNote()
// },
// //添加、编辑标签
// async handleTag(item){
// if(!item.note) return
// else{
// let params = {
// note:item.note
// }
// item.id ? params['id']=item.id : ''
// let res = item.id ? await putSysCheckNote(params) : await postSysCheckNote(params)
// }
// }
},
}
</script>
<style lang="scss" scoped>
::v-deep .el-dialog__body {
border-top: none;
text-align: center;
.tips {
font-size: 16px;
}
}
.p-24 {
padding: 0 24px;
}
.f-b {
font-weight: bold;
font-size: 14px;
}
#audit-detail {
// padding: 22px 24px;
.audit-detail_header {
height: 65px;
border-bottom: 1px solid #f3f3f3;
line-height: 65px;
display: flex;
justify-content: space-between;
.right {
.btn {
width: 80px;
height: 32px;
border-radius: 4px;
}
}
}
.choose-handle {
width: 100%;
height: 72px;
line-height: 72px;
font-size: 14px;
font-family: AlibabaPuHuiTiM;
color: #333333;
box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
border-top: 1px solid rgba(0, 0, 0, 0.1);
display: flex;
.btn_group {
margin-left: 24px;
::v-deep .p-btn {
width: 100px;
border-radius: 4px;
}
}
}
}
.title {
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
}
.content {
margin: 28px 23px;
.pass {
font-size: 18px;
font-family: AlibabaPuHuiTiM;
color: #30b9a6;
letter-spacing: 1px;
}
}
.btn {
margin-top: 20px;
.el-button {
// width: 100px;
height: 32px;
}
}
::v-deep .el-form-item__label {
width: 100%;
text-align: left;
}
.reason {
margin-top: 20px;
}
.showTips {
color: #4e68ff;
}
.op {
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: #fa6400;
margin-left: 20px;
}
.table-content {
padding-top: 20px;
padding-bottom: 20px;
}
.tag-form {
text-align: initial;
::v-deep {
.el-tag {
margin: 0px 12px 12px 0px;
cursor: pointer;
border-color: #4e68ff;
span {
display: inline-block;
}
}
.unselect-tag {
color: #353a45;
border-color: #edf0ff;
}
}
.handle-row {
color: #4e68ff;
text-decoration: underline;
text-align: right;
cursor: pointer;
}
}
.note-dialog {
::v-deep {
.tag-input {
.el-input__inner {
background-color: rgba(78, 104, 255, 0.06);
border-radius: 2px;
}
}
.handle-text {
line-height: 36px;
cursor: pointer;
}
}
}
.left-back {
position: absolute;
padding: 7px 5px;
top: 10px;
font-size: 22px;
text-align: left;
cursor: pointer;
}
::v-deep {
.el-dialog__headerbtn {
font-weight: bold;
font-size: 22px;
}
}
</style>
<template>
<!-- 随访调查录入 -->
<div>
<ConfigForms
form-type="2"
formClass="follow-form"
:patient-id="patientId"
:disabled="disabled"
:tabDisabled="tabDisabled"
:operation="operation"
></ConfigForms>
</div>
</template>
<script>
import ConfigForms from "@/views/screening/components/ConfigForms.vue"
export default {
name: "FollowupEntry",
components: {
ConfigForms,
},
data() {
return {
disabled:false,
tabDisabled:true,
operation:'',
patientId:this.$route.query.patientId,
model:''
}
},
watch:{
model(val){
switch(val){
case 'view':
this.disabled = true
this.tabDisabled = false
this.operation = 'edit'
break;
case 'edit':
this.disabled = false
this.tabDisabled = true
this.operation = 'edit'
break;
default:
this.disabled = false
this.tabDisabled = true
this.operation = ''
break;
}
}
},
created() {
this.model = this.$route.query.model
},
methods: {},
}
</script>
<style lang="scss">
</style>
<template>
<!-- 随访查询 -->
<div class="screeningSearch">
<div class="top">
<form-components :forms="formList" :formEdit="formEdit" @handleSearch="onSearch"></form-components>
</div>
<div class="bot">
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
</div>
</template>
<script>
import FormComponents from "@/components/FormComponents"
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import { getCurrentFormByType } from "@/api/coop-group.js"
import { getFollowSearch } from "@/api/followup"
import { getDictDetail } from "@/api/dict.js"
export default {
components: {
FormComponents,
CustomsTable,
},
mixins: [paginationMixin],
data() {
return {
listLoading: false,
keyword: "",
modifiedFlag: false,
columns: [
{
label: "医联体",
minWidth: 120,
value: "unionName",
formatter: (row) => {
return row.unionName ? row.unionName : "--"
},
},
{
label: "姓名",
minWidth: 120,
formatter: (row) => {
return row.name ? row.name : "--"
},
value: "name",
},
{
label: "性别",
minWidth: 80,
value: "sex",
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["d-sex"], row.sex + "")
},
},
{
label: "身份证",
minWidth: 120,
value: "idCard",
formatter: (row) => {
return row.idCard ? row.idCard : "--"
},
},
{
label: "年龄",
minWidth: 120,
value: "age",
formatter: (row) => {
return row.age ? row.age : "--"
},
},
{
label: "筛查时间",
minWidth: 180,
value: "screeningTime",
formatter: (row) => {
return row.createTime ? row.createTime : "--"
},
},
{
label: "风险评估结果",
minWidth: 120,
value: "riskRank",
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["risk_level"],String(row.riskRank))
},
},
{
label: "上次随访时间",
value: "followTime",
minWidth: 120,
formatter: (row) => {
return row.followTime ? row.followTime : "--"
},
},
{
label: "随访进度",
value: "followBatch",
minWidth: 120,
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["follow_type"],String(row.followBatch))
},
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
isIndex:true,
func: this.rowOpration,
formatter(row) {
return {
label: "查询",
type: "text",
}
},
},
{
isIndex:true,
func: this.rowOpration,
formatter(row) {
if (row.checkStatus != 3 && row.checkStatus != 4) {
return {
label: "修改",
type: "text",
}
} else {
return {
label: "",
type: "text",
style: {
display: "none",
},
}
}
},
},
],
},
],
tableData: [],
formList: [
{
type: "date",
label: "筛查时间",
prop: "screeningTime",
placeholder: "请选择时间",
valueFormat: "yyyy-MM-dd",
},
{
type: "select",
label: "随访审核状态",
prop: "checkStatus",
trans:"checkStatus",
placeholder: "请选择随访状态",
rules: [],
opts: [],
},
{
type: "select",
label: "随访进度",
prop: "followBatch",
trans:'follow_type',
placeholder: "请选择随访进度",
rules: [],
opts: [],
},
{
type: "select",
label: "计划随访时间",
prop: "nextFollowTime",
trans:'next_follow_time',
placeholder: "请选择计划随访时间",
rules: [],
opts: [],
},
{
type: "input",
label: "姓名",
prop: "name",
placeholder: "请输入姓名",
rules: [],
},
{
type: "input",
label: "身份证",
prop: "idCard",
placeholder: "请输入身份证",
rules: [],
},
{
type: "input",
label: "医联体",
prop: "unionName",
placeholder: "请输入医联体",
rules: [],
},
{
type: "btn",
list: [
{
btnType: "button",
type: "",
style: {
width: "80px",
height: "32px",
borderRadius: "4px",
fontSize: "14px",
marginLeft: "40px",
},
btnText: "查询",
func: () => {
this.onSearch()
},
},
// {
// btnType: "tobeModified",
// tobeModified: 20,
// },
],
},
],
formEdit:{}
}
},
watch: {
pageSize(val){
sessionStorage.setItem('followQuery-pageSize',val)
},
//当前页
pageIndex(val){
sessionStorage.setItem('followQuery-pageIndex',val)
}
},
created(){
this.initSearchForm()
},
mounted() {
// this.formEdit = sessionStorage.getItem('followQuery-form') ? JSON.parse(sessionStorage.getItem('followQuery-form')) : {}
this.pageSize = Number(sessionStorage.getItem('followQuery-pageSize')) || 10
this.pageIndex = Number(sessionStorage.getItem('followQuery-pageIndex')) || 1
this.getCurrentFormByType(2)
},
methods: {
changeModified() {
this.modifiedFlag = !this.modifiedFlag
},
setSelectedIndex(i) {
console.log(this.selectedIndex)
this.selectedIndex = i
sessionStorage.setItem("homeSelectedIndex", this.selectedIndex)
},
handleSizeChange(v) {
console.log(v)
},
rowOpration(data, i,index) {
let model = 0
switch(index){
case 0:
model = 'view'
break;
case 1:
model = 'edit'
break;
}
this.$router.push({path:"/followupentry",query:{patientId:data.patientId,model:model}})
},
onSearch(form) {
sessionStorage.setItem('followQuery-form',JSON.stringify(form))
this.formEdit = form
this.handleSearch()
},
async handleSearch(){
this.listLoading = true
let params={
pageSize:this.pageSize,
pageNum:this.pageIndex,
formId:this.formId,
patientFrom:sessionStorage.getItem('selectedIndex') //筛查场景
}
if(this.formEdit){
params=Object.assign(this.formEdit,params)
}
let res = await getFollowSearch(params)
if(res.code==1){
//分页内容
const d = res.data
this.total= d.total
this.tableData=d['records']
}
this.listLoading = false
},
//查询表单枚举值字典
initSearchForm(){
this.formList.forEach((item,index) => {
if(item.trans){
if(!item['opts']){
item['opts']=[]
}
else{
item['opts']=this.dictMap[item.trans]
}
}
})
this.$forceUpdate();
},
//获取随访表单类型
getCurrentFormByType(type) {
getCurrentFormByType({
type,
groupId: this.$store.state.user.group.groupId || '',
})
.then((res) => {
if (res.code === 1) {
this.formId = res.data[0].id
this.handleSearch()
}
})
},
},
}
</script>
<style lang="scss" scoped>
.screeningSearch {
.top {
width: 100%;
// height: 72px;
padding: 0 116px 0 44px;
display: flex;
justify-content: space-between;
align-items: center;
}
.bot {
padding: 0 24px;
}
}
</style>
<template>
<!-- 随访调查 -->
<div class="screeningSearch">
<div class="top">
<form-components :forms="formList" :formEdit="formEdit" @handleSearch="onSearch"></form-components>
</div>
<div class="bot">
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
</div>
</template>
<script>
import FormComponents from "@/components/FormComponents"
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import { getCurrentFormByType } from "@/api/coop-group.js"
import { getFollowSurvey } from "@/api/followup"
import { getDictDetail } from "@/api/dict.js"
export default {
components: {
CustomsTable,
FormComponents,
},
mixins: [paginationMixin],
data() {
return {
formId:"", //随访表单类型
listLoading: false,
keyword: "",
modifiedFlag: false,
columns: [
{
label: "医联体",
minWidth: 120,
value: "unionName",
formatter: (row) => {
return row.unionName ? row.unionName : "--"
},
},
{
label: "姓名",
minWidth: 120,
formatter: (row) => {
return row.name ? row.name : "--"
},
value: "name",
},
{
label: "性别",
minWidth: 80,
value: "sex",
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["d-sex"], row.sex + "")
},
},
{
label: "身份证",
minWidth: 120,
value: "idCard",
formatter: (row) => {
return row.idCard ? row.idCard : "--"
},
},
{
label: "年龄",
minWidth: 120,
value: "age",
formatter: (row) => {
return row.age ? row.age : "--"
},
},
{
label: "筛查时间",
minWidth: 180,
value: "screeningTime",
formatter: (row) => {
return row.createTime ? row.createTime : "--"
},
},
{
label: "风险评估结果",
minWidth: 120,
value: "riskRank",
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["risk_level"],String(row.riskRank))
},
},
{
label: "上次随访时间",
value: "followTime",
minWidth: 120,
formatter: (row) => {
return row.followTime ? row.followTime : "--"
},
},
{
label: "随访进度",
value: "followBatch",
minWidth: 120,
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["follow_type"],String(row.followBatch))
},
},
{
label: "计划随访时间",
value: "nextFollowTime",
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["next_follow_time"],String(row.nextFollowTime))
},
minWidth: 120,
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.rowOpration,
formatter(row) {
return {
label: " 录入",
type: "text",
}
},
},
],
},
],
tableData: [
],
formList: [
{
xs: 24,
sm: 12,
md: 12,
lg: 7,
xl: 7,
type: "select",
label: "计划随访时间",
prop: "nextFollowTime",
trans:'next_follow_time',
placeholder: "请选择计划随访时间",
rules: [],
opts: [{ label: "123", value: "1" }],
},
{
xs: 24,
sm: 12,
md: 12,
lg: 7,
xl: 7,
type: "input",
label: "姓名",
prop: "name",
placeholder: "请输入姓名",
rules: [],
},
{
xs: 24,
sm: 12,
md: 12,
lg: 7,
xl: 7,
type: "input",
label: "身份证",
prop: "idCard",
placeholder: "请输入身份证",
rules: [],
},
{
xs: 24,
sm: 12,
md: 12,
lg: 7,
xl: 7,
type: "input",
label: "医联体",
prop: "unionName",
placeholder: "请输入医联体",
rules: [],
},
{
xs: 24,
sm: 12,
md: 12,
lg: 7,
xl: 7,
type: "select",
label: "随访进度",
prop: "followBatch",
trans:'follow_type',
placeholder: "请选择随访进度",
rules: [],
opts: [{ label: "123", value: "1" }],
},
{
xs: 1,
sm: 2,
md: 2,
lg: 2,
xl: 2,
type: "btn",
list: [
{
btnType: "button",
type: "",
style: {
width: "80px",
height: "32px",
borderRadius: "4px",
fontSize: "14px",
marginLeft: "40px",
},
btnText: "查询",
func: this.onSearch
},
// {
// btnType: "tobeModified",
// tobeModified: 20,
// },
],
},
],
formEdit:{}
}
},
watch: {
pageSize(val){
sessionStorage.setItem('followResearch-pageSize',val)
},
//当前页
pageIndex(val){
sessionStorage.setItem('followResearch-pageIndex',val)
}
},
created(){
this.initSearchForm()
},
mounted() {
this.formEdit = JSON.parse(sessionStorage.getItem('followResearch-form')) ? JSON.parse(sessionStorage.getItem('followResearch-form')) : {}
this.pageSize = Number(sessionStorage.getItem('followResearch-pageSize')) || 10
this.pageIndex = Number(sessionStorage.getItem('followResearch-pageIndex')) || 1
this.getCurrentFormByType(2)
},
methods: {
changeModified() {
this.modifiedFlag = !this.modifiedFlag
},
setSelectedIndex(i) {
console.log(this.selectedIndex)
this.selectedIndex = i
sessionStorage.setItem("homeSelectedIndex", this.selectedIndex)
},
rowOpration(data, i,label) {
console.log('跳转',data, i,label)
this.$router.push({path:"/followupentry",query:{patientId:data.patientId,formEdit:JSON.stringify(data)}})
},
onSearch(form) {
sessionStorage.setItem('followResearch-form',JSON.stringify(form))
this.formEdit = form
this.handleSearch()
},
async handleSearch(){
this.listLoading = true
let params={
pageSize:this.pageSize,
pageNum:this.pageIndex,
formId:this.formId,
patientFrom:sessionStorage.getItem('selectedIndex') //筛查场景
}
if(this.formEdit){
params=Object.assign(this.formEdit,params)
}
let res = await getFollowSurvey(params)
if(res.code==1){
//分页内容
const d = res.data
this.total= d.total
this.tableData=d['records']
}
this.listLoading = false
},
//查询表单枚举值字典
initSearchForm(){
this.formList.forEach((item,index) => {
if(item.trans){
if(!item['opts']){
item['opts']=[]
}
else{
item['opts']=this.dictMap[item.trans]
}
}
})
this.$forceUpdate();
},
// async initDict(type,index){
// let params={
// type:type
// }
// const res = await getDictDetail(params)
// let item = this.formList.find(_ => _.trans == type)
// res.data.forEach((itemD,inx) => {
// // if(!this.columns[index]['transList']){
// // this.columns[index]['transList']={}
// // }
// // else{
// // this.columns[index]['transList'][itemD.code]=itemD.name
// // }
// if(item){
// if(!item['opts']){
// item['opts']=[]
// }
// else {
// item['opts']=res.data.map((_) => {
// return {
// label: _.name,
// value: _.code,
// }
// })
// }
// }
// })
// },
//获取随访表单类型
getCurrentFormByType(type) {
getCurrentFormByType({
type,
groupId: this.$store.state.user.group.groupId || '',
})
.then((res) => {
if (res.code === 1) {
this.formId = res.data[0].id
this.handleSearch()
}
})
},
},
}
</script>
<style lang="scss" scoped>
.screeningSearch {
.top {
width: 100%;
// height: 72px;
padding: 0 116px 0 44px;
display: flex;
justify-content: space-between;
align-items: center;
}
.bot {
padding: 0 24px;
}
}
</style>
<template>
<div class="main-box">
<div class="total-box">
<div class="box-title">
<div class="blue-area mr-12"></div>
<span class="bold-font">总体情况</span>
</div>
<el-row :gutter="20" class="data-box">
<el-col :span="6" v-for="(item,index) in totalList" :key="index">
<div class="grid-content mb-12">{{item.label}}</div>
<h1>{{totalData[item.prop]}}</h1>
</el-col>
</el-row>
</div>
<div class="person-area">
<div class="box-title">
<div class="blue-area mr-12"></div>
<span class="bold-font">个人绩效情况</span>
</div>
<div class="type-box">
<span class="mr-10">选择统计周期:</span>
<el-radio-group v-model="periodType">
<el-radio-button label="month">月度</el-radio-button>
<el-radio-button label="season">季度</el-radio-button>
<el-radio-button label="year">年度</el-radio-button>
</el-radio-group>
</div>
<div class="type-box">
<span class="mr-10">选择统计年份:</span>
<el-select v-model="yearBtn" placeholder="请选择">
<el-option v-for="item in yearList" :value="item" :key="item" :label="item"></el-option>
</el-select>
</div>
<el-table :data="tableData" border show-summary class="mt-20">
<el-table-column
v-for="(item,index) in tableColumn"
:key="index"
:prop="item.prop"
:label="item.label"
:width="item.width"
></el-table-column>
</el-table>
</div>
</div>
</template>
<script>
export default {
data() {
return {
totalList:[
{
label:"累计审核病例数",
prop:"account"
},
{
label:"累计审核合格病例数",
prop:"account"
},
{
label:"累计审核驳回修改病例数",
prop:"account"
},
{
label:"累计审核不合格病例数",
prop:"account"
},
],
totalData:{
account:1600
},
periodType:"month",
yearList: [2021],
yearBtn:2022,
tableData:[{
id: '12987122',
name: '王小虎',
season: '234',
amount2: '3.2',
amount3: 10
}, {
id: '12987123',
name: '王小虎',
season: '165',
amount2: '4.43',
amount3: 12
}, {
id: '12987124',
name: '王小虎',
season: '324',
amount2: '1.9',
amount3: 9
}, {
id: '12987125',
name: '王小虎',
season: '621',
amount2: '2.2',
amount3: 17
}, {
id: '12987126',
name: '王小虎',
season: '539',
amount2: '4.1',
amount3: 15
}]
}
},
methods: {
getNow() {
const nowDate = new Date()
this.yearBtn = nowDate.getFullYear();
if(!this.yearList.find((item) => item == this.yearBtn)){
this.yearList.push(this.yearBtn)
this.yearList.sort((a, b) => {
return a - b
})
}
},
},
mounted() {},
created() {
this.getNow();
},
watch: {},
computed:{
tableColumn(){
const listM=[
{
label:"月份",
prop:"month"
},
{
label:"审核病例数(例)",
prop:"count"
},
]
const listS=[
{
label:"季度",
prop:"season"
},
{
label:"审核病例数(例)",
prop:"count"
},
]
if(this.periodType == 'month'){
return listM
}
if(this.periodType == 'season'){
return listS
}
}
}
}
</script>
<style lang="scss" scoped>
::v-deep {
.data-box {
margin: 24px 0px;
border-bottom: 1px solid #f3f3f3;
}
.el-col {
text-align: center;
margin: 12px 0px 28px;
border-right: 1px solid #f3f3f3;
.grid-content {
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: #333333;
}
h1 {
color: #4e68ff;
font-weight: bold;
font-size: 32px;
}
}
.el-col:last-child {
border-right: none;
}
}
.main-box {
margin: 24px;
}
.box-title {
display: flex;
flex-direction: row;
}
.blue-area {
width: 4px;
height: 24px;
background: #4e68ff;
}
.bold-font {
font-size: 18px;
font-family: AlibabaPuHuiTiM;
color: #333333;
font-weight: bold;
}
.type-box {
display: flex;
flex-direction: row;
margin: 32px 0px 0px;
line-height: 32px;
}
</style>
<template>
<div class="container" style="max-height: 89vh">
<div v-show="!isDetail">
<div class="header">草稿箱</div>
<div class="content">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
</div>
<div v-if="isDetail">
<div>
<el-button icon="el-icon-back" @click="isDetail = false"
>返 回</el-button
>
</div>
<div class="form_content">
<ConfigForms
form-type="1"
:patient-id="patientId"
:disabled="disabled"
:operation="'edit'"
></ConfigForms>
</div>
</div>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import ConfigForms from "./components/ConfigForms.vue"
import { mapGetters } from "vuex"
import { getPatientPage, deletePatient } from "@/api/patient.js"
export default {
// 数据概览
name: "",
components: {
CustomsTable,
ConfigForms,
},
mixins: [paginationMixin],
data() {
return {
isDetail: false, //! 控制详情显隐
listLoading: false,
columns: [
{
label: "医联体",
minWidth: 120,
value: "unionId",
},
{
label: "姓名",
minWidth: 120,
value: "name",
},
{
label: "性别",
minWidth: 120,
value: "sex",
},
{
label: "身份证",
minWidth: 120,
value: "idCard",
},
{
label: "年龄",
minWidth: 120,
value: "age",
},
{
label: "筛查时间",
minWidth: 120,
value: "screenTime",
},
{
label: "风险评估结果",
minWidth: 120,
value: "result",
},
{
label: "上次随访时间",
minWidth: 120,
value: "targetFieldCode",
},
{
label: "筛查审核状态",
minWidth: 180,
value: "createTime",
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.handleAdd,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deletePatient,
formatter(row) {
return {
label: "删除",
type: "text",
}
},
style: {
color: "#FA6400",
},
},
],
},
],
tableData: [
{
name: "1",
1: 2,
},
],
}
},
watch: {},
mounted() {},
methods: {
handleAdd({ patientId, name }, index, disabled = false) {
sessionStorage.removeItem("index1Data")
this.disabled = disabled
this.patientId = patientId || null
this.name = name
this.isDetail = true
},
setSelectedIndex(i) {
console.log(this.selectedIndex)
this.selectedIndex = i
sessionStorage.setItem("homeSelectedIndex", this.selectedIndex)
},
// 查询
handleFormSearch(form) {
this.searchForm = form
this.pageIndex = 1
this.handleSearch(form)
},
handleSearch() {
this.listLoading = true
const data = {}
data.current = this.pageIndex
data.size = this.pageSize
data.isDraft = 1
data.patientFrom = this.selectedIndex
getPatientPage(data).then((res) => {
this.listLoading = false
if (res.code === 1) {
const d = res.data
this.tableData = d.records || []
this.total = Number(d.total)
}
})
},
deletePatient(row) {
this.$confirm(`是否删除【${row.name}】?`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
deletePatient(row.patientId).then((res) => {
if (res.code === 1) {
this.$message({
type: "success",
message: "删除成功!",
})
this.handleSearch()
}
})
})
.catch(() => {})
},
},
computed: {
...mapGetters({
selectedIndex: "table/selectedIndex",
}),
},
created() {
this.handleFormSearch()
},
watch: {
selectedIndex(v) {
this.handleFormSearch()
},
},
}
</script>
<style lang="scss" scoped>
.container {
padding: 24px;
height: 100%;
display: flex;
flex-direction: column;
.header {
display: flex;
text-indent: 24px;
margin-bottom: 20px;
height: 50px;
line-height: 32px;
font-size: 14px;
font-family: AlibabaPuHuiTiR;
color: rgba(0, 0, 0, 0.8);
border-bottom: 1px solid #f3f3f3;
}
.content {
padding: 0 24px;
}
.form_content {
height: calc(100% - 50px);
}
}
</style>
<template>
<ConfigForms form-type="1" @addMethods="addMethods"></ConfigForms>
</template>
<script>
import ConfigForms from "./components/ConfigForms.vue"
export default {
name: "ScreeningAdd",
components: {
ConfigForms,
},
provide() {
const showIndex = true
return {
showIndex,
}
},
data() {
return {}
},
created() {},
methods: {
// 处理部分逻辑
addMethods(v) {
console.log(v)
if (v.activeName == "index0") {
let data = {
birthday: v.form.birthday,
}
sessionStorage.setItem("index1Data", JSON.stringify(data))
}
},
},
}
</script>
<style lang="scss" scoped></style>
<template>
<div
id="publicContent"
:class="[
activeName == 'index0' && formClass ? formClass : '',
$route.path === '/screening/draft' ? 'p_padding' : '',
]"
>
<div v-if="formTabs && formTabs.length > 0" style="position: relative">
<el-button
v-if="formType == 1 ? !disabled ? true : false : true"
class="draftButton"
:loading="loading"
:disabled="!infoCompelete"
@click="onSubmit(formType)"
>{{ formType == 1 ? "临时保存" : "返回" }}</el-button>
<el-tabs
v-model="activeName"
v-loading="fromLoading"
type="card"
:style="{ width: formType == 1 ? '100%' : 'calc(100% - 200px)' }"
class="publicTab"
@tab-click="handleTabClick"
>
<el-tab-pane
v-for="(form, index) in formTabs"
:key="form.id"
:label="form.label"
:name="'index' + index"
:disabled="tabDisabled"
>
<!-- disabled -->
<transition mode="out-in" name="fade-transform">
<div v-show="activeName === 'index' + index">
<template v-if="form.formId">
<form-tab
ref="formTabs"
:patient-id="patientId"
:patient-standby-id="patientStandbyId"
:newform-record-id="newformRecordId"
:form="form"
:disabled="disabled"
:operation="operation"
:isDraft="isDraft"
:active-name="activeName"
contrast
:form-initial="formInitial"
:survival-flag="survivalFlag"
@setFormJson="setFormJson"
@handleConfirm="handleConfirm"
@onPrev="onPrev"
@temporaryConfirm="temporaryConfirm"
></form-tab>
</template>
</div>
</transition>
</el-tab-pane>
</el-tabs>
</div>
<el-empty v-else description="暂无数据"></el-empty>
<public-dialog ref="showDialog" :show-close="true">
<!-- 保存草稿 -->
<template v-if="dialogType == 'draft'" slot="content">
<div class="title center">已保存至草稿箱!</div>
<div class="content center">
<div class="img">
<img src="~@/assets/img/DataCenter/draft.png" alt />
</div>
<div class="showTips">您可以在【草稿箱】页面找到该数据</div>
</div>
<div class="btn">
<el-button type="primary" :loading="loading" @click="continueSubmit">继续添加</el-button>
</div>
</template>
<!-- 保存提交 -->
<template v-if="dialogType == 'submit'" slot="content">
<div class="title center">提交成功!</div>
<div class="content center">
<div class="img">
<img src="~@/assets/img/DataCenter/submit.png" alt />
</div>
<div class="showTips">您可以在【筛查查询】页面查询到该数据</div>
</div>
<div class="btn">
<el-button type="primary" :loading="loading" class="textBtn" @click="viewJump">查看</el-button>
<el-button type="primary" :loading="loading" @click="continueSubmit">继续添加</el-button>
</div>
</template>
</public-dialog>
</div>
</template>
<script>
import mixin from "./mixin"
import CustomForm from "@/components/FormComponents/CustomForm/index"
import publicDialog from "../../audit-detail/components/publicDialog.vue"
import { getPatientDetail } from "@/api/patient.js"
export default {
name: "ConfigForms",
components: { publicDialog },
mixins: [mixin],
props: {
disabled: Boolean,
tabDisabled: { type: Boolean, default: true },
formType: String,
patientId: String,
formClass: String,
operation: String,
isDraft: String,
},
data() {
return {
// showIndex:false,
// survivalFlag:false
dialogType: "",
loading: false,
infoCompelete: false,
formInitial: {}, // 第四步的数据
}
},
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
}
},
},
watch: {
activeName(val) {
if (!this.disabled) {
if (!["index0", "index1"].includes(val)) {
this.infoCompelete = true
} else {
this.infoCompelete = false
}
}
if (val == "index1") {
// 第二步问卷调查
this.$nextTick(() => {
let index1Data = sessionStorage.getItem("index1Data")
if (index1Data) {
let { birthday } = JSON.parse(index1Data)
let date = new Date(String(birthday).replace(/-/g, "/"))
let d = new Date()
let age =
d.getFullYear() -
date.getFullYear() -
(d.getMonth() < date.getMonth() ||
(d.getMonth() == date.getMonth() && d.getDate() < date.getDate())
? 1
: 0)
//!
this.formInitial = {
birthday,
age,
}
}
})
} else {
this.formInitial = false
}
if (val == "index3") {
// 第四步风险评估
this.$nextTick(() => {
getPatientDetail({
formId: this.formId, // 每个大表单的id
patientId: this.patientId || this.patientStandbyId,
// formRecordId: this.newformRecordId,
})
.then((res) => {
const data = res.data.data
this.formInitial = data
})
.finally(() => {
this.loading = false
})
this.$nextTick(() => {
console.log("走了")
//!
// this.formInitial = {
// risk_rank: "中危",
// risk_score: "5分",
// screening_advise: "立刻住院",
// }
})
})
}
},
},
created() {
// 字典formType 1 筛查表单
this.getCurrentFormByType(this.formType)
console.log('大表单',this.disabled,this.tabDisabled,this.patientId)
},
methods: {
handleConfirm(data, done, cb) {
this.addPatient(data, done, cb)
this.$emit("addMethods", {
activeName: this.activeName,
form: data.data,
})
},
temporaryConfirm(data, done, cb) {
this.addPatient(data, done, cb, () => {
console.log("临时保存")
this.$refs.showDialog.dialogVisible = true
this.loading = false
})
},
onPrev(done) {
this.prevTab(done)
},
onSubmit(type) {
// this.loading = true
if (type == 1) {
// 临时保存草稿
this.dialogType = "draft"
// 保存逻辑处理
// !获取当前tab的formTab
let formTab = this.$refs.formTabs.filter(
(e) => e.form.formId == this.formId
)[0]
formTab.temporarySave()
// console.log(formTab)
} else if (type == 2) {
//提交
this.dialogType = "submit"
this.$refs.showDialog.dialogVisible = true
this.loading = false
} else {
// 返回
this.$router.back()
}
},
continueSubmit() {
sessionStorage.removeItem("index1Data")
this.activeName = "index0"
// 清空表单
for (let i = 0; i < this.$refs.formTabs.length; i++) {
this.$refs.formTabs[i].resetForm()
this.$refs.formTabs[i].initForm()
}
// 清空红字:不符合筛查条件
this.$refs.showDialog.dialogVisible = false
//判断路径
if (this.$route.path != "/screening/add") {
this.$router.push("/screening/add")
}
},
// 去查看跳转
viewJump() {
console.log(this.patientId)
if (this.$route.path == "/screening/index") {
this.$store.commit("table/setRefreshFlag", 1)
} else {
this.$router.push({
path: "/screening/index",
query: {
patientId: this.patientId || this.patientStandbyId,
},
})
}
this.$refs.showDialog.dialogVisible = false
// alert("跳转")
},
},
provide() {
return {
configForms: this,
}
},
}
</script>
<style lang="scss" scoped>
#publicContent {
position: relative;
padding: 32px 24px 32px;
.draftButton {
position: absolute;
top: 0px;
right: 40px;
z-index: 999;
border-radius: 4px;
border: 1px solid #4e68ff;
color: #4e68ff;
}
.content {
img {
width: 248px;
height: 180px;
}
}
}
#publicContent.p_padding {
padding: 10px 24px 32px;
}
::v-deep .el-dialog__body {
.title {
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
margin-bottom: 20px;
}
.showTips {
font-size: 16px;
font-family: AlibabaPuHuiTiR;
color: rgba(0, 0, 0, 0.8);
margin-bottom: 20px;
}
.btn {
.el-button {
width: 100px;
height: 32px;
}
}
}
.publicTab {
// width: calc(100%);
margin-top: 10px;
}
::v-deep {
.el-button.is-disabled {
color: #c0c4cc !important;
cursor: not-allowed;
background-image: none;
background-color: #fff;
border-color: #ebeef5 !important;
}
.el-tabs__item.is-disabled {
color: #252c49;
}
.el-tabs--card > .el-tabs__header {
width: calc(100% - 100px);
border-bottom: none;
}
.el-tabs--card > .el-tabs__header .el-tabs__nav {
border: none;
}
.el-tabs--card > .el-tabs__header .el-tabs__item {
min-width: 116px;
text-align: center;
background: #f0f1fa;
font-size: 14px;
border: none;
}
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
background: #4e68ff;
color: #fff;
}
}
.my-form {
overflow-x: scroll;
}
.follow-form {
.publicTab {
margin-bottom: 10px;
::v-deep {
.el-collapse-item__header {
border-width: 1px 0px 0px;
}
.row24 {
border-top: 1px solid #cccccc;
}
.custom-form-item {
border-width: 1px 0px 0px;
}
.el-collapse-item {
margin-bottom: 20px;
border-radius: 4px;
overflow: hidden;
border: 1px solid #cccccc;
}
.el-collapse-item__wrap {
border: none;
.el-collapse {
margin: 10px 10px 20px;
}
}
// .row24.el-col-lg-12:nth-child(2n) {
// border-width: 0px 0px 0px 1px;
// }
.el-form-item {
height: 100%;
padding: 0px;
.el-form-item__label {
height: 100%;
text-align: left;
background: #fafafa;
font-size: 14px;
color: #333333;
border-right: 1px solid #cccccc;
// width: 100px !important;
white-space: nowrap;
padding: 18px 10px;
margin-right: 20px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
}
}
}
//只读表单
::v-deep {
.read-input,
.read-time {
.el-input__inner {
border: none;
padding: 0px 30px 0px 15px;
cursor: text;
}
.el-input.is-disabled .el-input__icon,
.el-input__prefix {
display: none;
}
.el-input__icon {
}
}
.read-radio {
cursor: text;
.is-checked {
display: none;
}
.el-radio__input.is-checked + .el-radio__label {
color: #606266;
}
.el-radio__label {
padding-left: 15px;
}
}
}
}
.textBtn {
width: 100px;
height: 32px;
background: #ffffff;
border: 1px solid #4e68ff;
color: #4e68ff;
}
</style>
<template>
<el-container>
<el-main v-loading="pageLoading" class="transition-box">
<!-- <i
v-if="contrast"
:class="asideShow ? 'el-icon-s-unfold' : 'el-icon-s-fold'"
:title="asideShow ? '收起' : '展开'"
class="arrow"
@click="asideShow = !asideShow"
></i>-->
<el-empty v-if="isEmpty" description="暂无数据"></el-empty>
<template v-if="!isEmpty">
<!-- 多次记录 -->
<el-row v-if="form.fillType === 1">
<tags-scroll-bar
v-if="repeatedlyList.length > 0"
ref="tags"
:tags-list="repeatedlyList"
:props="{ label: 'time' }"
:disabled="disabled"
@change="changeRepeate"
@add="handleAdd"
></tags-scroll-bar>
</el-row>
<el-row class="header">
<!-- <template v-if="formData.percent.autoPercent">
<span class="label">自动采集完整度:</span>
<span class="value">{{ formData.percent.autoPercent }}%</span>
</template>
<template v-if="formData.percent.personalPercent">
<span class="label">人工补录完整度:</span>
<span class="value"
>{{ formData.percent.personalPercent }}%</span
></template
>-->
<div class="label">
<!-- 仅显示重要字段 : -->
</div>
<div class="value">
<!-- <el-switch v-model="isShowImprotant" @change="imFieldChange">
</el-switch>-->
</div>
</el-row>
<div
ref="my-form"
class="my-form"
:style="{
height:
$route.path == '/screening/index'
? 'calc(100vh - 310px)'
: 'calc(100vh - 270px)',
}"
:class="externalScroll ? 'no-scroll' : ''"
>
<!-- <read-form
ref="form"
:options="survivalForm"
v-if="survivalFlag"
></read-form>-->
<custom-form
ref="form"
:options="widgetFormPreview"
:form-edit="formData.formEdit"
@scrollTop="scrollTop"
@handleConfirm="handleConfirm"
@onPrev="onPrev"
@temporaryConfirm="temporaryConfirm"
></custom-form>
</div>
</template>
</el-main>
<el-aside
v-if="contrast"
:width="sideWidth"
class="transition-box"
:class="{ hidden: !asideShow }"
>
<div class="side-content"></div>
</el-aside>
</el-container>
</template>
<script>
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",
components: { CustomForm, TagsScrollBar, ReadForm },
props: {
activeName: String,
externalScroll: Boolean, //外部滚动
disabled: Boolean,
contrast: Boolean, //同屏对照
form: Object,
patientId: String,
patientStandbyId: String,
newformRecordId: String,
getAll: Boolean, // 获取页面所有数据
survivalFlag: Boolean, //存活的显示
formEdit: {},
formInitial: {},
operation: String, // !默认新增,传入为edit为编辑需要传formRecordId
isDraft: {
type: String,
default: "",
},
},
provide() {
return {
formId: this.form.formId,
getPatientId: () => {
return this.patientId || this.patientStandbyId
},
}
},
data() {
return {
btnType: "",
isShowImprotant: false,
asideShow: false,
widgetFormPreview: {},
formData: {
formEdit: {},
percent: {},
formRecordId: null,
},
loading: false,
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: [],
},
}
},
// mixins: [resizeMixin],
computed: {
isEmpty() {
return !(Object.keys(this.widgetFormPreview) || this.widgetFormPreview)
.length
},
sideWidth() {
return this.asideShow ? "200px" : "0px"
},
pageLoading() {
return this.loading || this.formloading
},
},
methods: {
resetForm() {
this.$refs.form.resetForm(false)
this.$refs.form.showError(false)
// 清理年龄的回显
this.$refs.form.clearAge()
},
initData() {
console.log('初始化',this.formData)
this.formData.formRecordId = null
this.formCacheList = []
this.getPatientDetail()
if (this.form.fillType === 1) {
this.$nextTick(() => {
this.$refs.form && this.$refs.form.resetForm()
})
this.getRecordList()
}
},
// 临时保存
temporarySave() {
this.$refs.form.temporarySave()
},
// 临时保存确定
temporaryConfirm(data, done) {
let params = {
data,
formId: this.form.formId, // 每个大表单的id
patientId: this.patientId || this.patientStandbyId,
// formRecordId: this.formData.formRecordId || this.newformRecordId, // 是否为编辑的表单id
statusMap: {
patient_from: this.$store.getters["table/selectedIndex"],
is_draft: 1, //是否为草稿
check_status: 1, // 审核状态
},
}
if (this.operation && this.operation == "edit") {
params.formRecordId = this.formData.formRecordId || this.newformRecordId // 是否为编辑的表单id
}
this.$emit("temporaryConfirm", params, done, (res) => {
// 多次填写的表单新增时,获取最新数据
if (this.form.fillType === 1 && !this.formData.formRecordId) {
this.getRecordList(res.data.formRecordId)
}
this.formatData(res, this.form.fillType !== 1)
})
},
handleConfirm(data, done) {
let params = {
data,
formId: this.form.formId, // 每个大表单的id
patientId: this.patientId || this.patientStandbyId,
// formRecordId: this.formData.formRecordId || this.newformRecordId, // 是否为编辑的表单id
statusMap: {
patient_from: this.$store.getters["table/selectedIndex"],
is_draft: this.activeName == "index5" ? 0 : 1, //是否为草稿
check_status: 1, // 审核状态
},
}
if (this.operation && this.operation == "edit") {
params.formRecordId = this.formData.formRecordId || this.newformRecordId // 是否为编辑的表单id
}
if (this.isDraft) {
params.statusMap.is_draft = this.isDraft
}
this.$emit("handleConfirm", params, done, (res) => {
// 多次填写的表单新增时,获取最新数据
if (this.form.fillType === 1 && !this.formData.formRecordId) {
this.getRecordList(res.data.formRecordId)
}
this.formatData(res, this.form.fillType !== 1)
})
},
onPrev(done) {
this.$emit("onPrev", done)
},
scrollTop() {
this.$refs["my-form"].scrollTop = 0
},
handleAdd() {
console.log("触发新增", this.form)
this.$refs.form && this.$refs.form.resetForm()
this.formData = {
formEdit: {},
percent: {},
formRecordId: null,
}
},
// 切换时间
changeRepeate(index) {
const item = this.repeatedlyList[index]
if (item.id === this.formData.formRecordId) return
const data = this.formCacheList.find((_) => _.formRecordId === item.id)
if (data) {
this.$refs.form && this.$refs.form.resetForm()
this.formData = data
return
}
this.formData.formRecordId = item.id
this.getPatientDetail()
},
imFieldChange(val) {
this.$refs.form.imFieldChange(val)
},
initForm() {
this.formloading = true
if (this.form.formJson) {
const obj = eval("(" + this.form.formJson + ")")
if (this.disabled) {
obj.menuBtn = false
obj.disabled = true
obj.detail = true
}
setTimeout(() => {
this.widgetFormPreview = obj
this.formloading = false
}, 100)
return
}
getFormDetail(this.form.formId)
.then((res) => {
if (res.code === 1 && res.data) {
const formJson = res.data.formJson
this.$emit("setFormJson", formJson)
const obj = eval("(" + formJson + ")")
if (this.disabled) {
obj.menuBtn = false
obj.disabled = true
obj.detail = true
} else if (res.data.name == "风险评估") {
obj.detail = true
}
this.widgetFormPreview = obj
}
})
.finally(() => {
this.formloading = false
})
},
getPatientDetail() {
this.$nextTick(() => {
this.$refs.form && this.$refs.form.resetForm()
})
if (!this.patientId || this.form.silent) return
this.loading = true
getPatientDetail({
patientId: this.patientId,
formId: this.form.formId,
formRecordId: this.formData.formRecordId,
})
.then((res) => {
this.formatData(res)
})
.finally(() => {
this.loading = false
})
},
formatData(res, cache) {
const d = res.data || {}
const form = d.data || {}
for (const key in form) {
Object.prototype.toString.call(form[key]) == "[object Number]"
? (form[key] = String(form[key]))
: ""
}
if (form["YZZKJC"] && typeof form["YZZKJC"] === "string") {
form["YZZKJC"] = JSON.parse(form["YZZKJC"])
}
console.log('form形成',form,this.formData)
if (!cache) {
this.formData.formEdit = form
}
this.formData.formRecordId = d.formRecordId
this.formData.percent = d.percent || {}
const index = this.formCacheList.findIndex(
(_) => _.formRecordId === d.formRecordId
)
if (index > -1) {
this.formCacheList.splice(index, 1, this.deepClone(this.formData))
} else {
this.formCacheList.push(this.deepClone(this.formData))
}
},
// 表单数据转化
formatString(form){
for (const key in form) {
Object.prototype.toString.call(form[key]) == "[object Number]"
? (form[key] = String(form[key]))
: ""
}
this.formData.formEdit = form
},
getRecordList(formRecordId) {
console.log('获取表单id',formRecordId)
if (!this.patientId) return
getRecordList({
patientId: this.patientId,
formId: this.form.formId,
}).then((res) => {
this.repeatedlyList = res.data.map((_, index) => {
return {
..._,
time: _.createTime,
}
})
this.$nextTick(() => {
const el = this.$refs.tags
if (el) {
el.tabActive =
formRecordId ||
(this.repeatedlyList[0] && this.repeatedlyList[0].id)
}
})
})
},
},
watch: {
formEdit(val) {
console.log("回显3", val)
this.formatString(val)
},
formInitial: {
handler(v) {
if (v) {
this.$set(this.formData, "formEdit", { ...v })
console.log('form-tab',this.formData.formEdit)
}
},
deep: true,
},
},
created() {
if (this.$route.query.formEdit) {
this.formatString(JSON.parse(this.$route.query.formEdit))
}
this.initForm()
if (this.getAll) {
// 监听patientId 获取页面所有数据
this.$watch(
"patientId",
() => {
this.initData()
},
{ immediate: true }
)
} else {
// 监听form.silent 获取当前tab页数据
this.$watch(
"form.silent",
() => {
this.initData()
},
{ immediate: true }
)
}
},
mounted() {
//! 设置新增判断
if (this.$route.path == "/screening/add") {
// this.handleAdd()
if (!this.formData.formRecordId) {
this.handleAdd()
}
}
},
}
</script>
<style scoped lang="scss">
.el-main {
position: relative;
padding: 0;
.arrow {
position: absolute;
right: 0;
top: 0;
cursor: pointer;
font-size: 22px;
z-index: 9;
}
.header {
height: 5px;
box-shadow: 0 5px 4px rgb(0 21 41 / 8%);
padding-right: 20px;
position: relative;
font-size: 15px;
z-index: 999;
}
}
.el-aside {
padding-left: 10px;
border-left: 1px solid #ccc;
.side-content {
height: calc(100vh - #{"272px"});
// overflow: auto;
}
}
.my-form {
// height: calc(100vh - #{"310px"});
overflow-y: auto;
padding-top: 20px;
// position: relative;
&::-webkit-scrollbar-thumb {
background-color: #fff;
}
&:hover::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.4);
}
&.no-scroll {
height: auto;
}
}
.label {
font-size: 14px;
color: #8492a6;
line-height: 38px;
float: left;
margin-right: 20px;
}
.value {
font-size: 14px;
line-height: 38px;
float: left;
font-weight: 600;
margin-right: 50px;
}
.el-slider {
float: left;
width: 150px;
}
.transition-box {
transition: all 0.2s;
&.hidden {
opacity: 0;
height: 0px;
}
}
</style>
import { addPatient } from "@/api/patient.js"
import FormTab from "./FormTab"
import { mapGetters } from "vuex"
import { getCurrentFormByType } from "@/api/coop-group.js"
export default {
components: { FormTab },
data() {
return {
activeName: "index0",
fromLoading: false,
patientStandbyId: null, // 备用id
newformRecordId: null, //记录Id
formTabs: [],
formId: "",
formTabsList: [],
isUpdated: false,
}
},
computed: {
...mapGetters({
group: ["user/group"],
}),
},
methods: {
nextTab() {
let i = this.activeName.split("index")[1] - 0
i++
if (i == 6) {
this.onSubmit(2)
return
} else {
this.activeName = "index" + i
this.handleTabClick({ index: i, name: "" })
}
},
prevTab(done) {
let i = this.activeName.split("index")[1] - 0
i--
this.activeName = "index" + i
this.handleTabClick({ index: i, name: "" })
done()
},
handleTabClick({ index, name }) {
const { formId, id, silent } = this.formTabs[index]
this.formId = this.formTabsList[index].formId
console.log("表单项", this.formTabs[index])
if (formId && silent) {
this.formTabs[index]["silent"] = false //控制是否获取接口数据
return
}
if (this.formTabs[index].formName == "风险评估") {
}
this.formTabs.splice(index, 1, {
...this.formTabsList.find((_) => _.id === id),
})
},
async addPatient(data, done, cb, ConfigFormsCallback) {
addPatient(data, "")
.then((res) => {
// this.$message.success("操作成功")
if (res.data) {
this.isUpdated = true
this.patientStandbyId = res.data.patientId
this.newformRecordId = res.data.formRecordId
if (
cb &&
Object.prototype.toString.call(cb) === "[object Function]"
) {
cb(res)
}
}
})
.finally((e) => {
done()
console.log("走了", ConfigFormsCallback)
if (
ConfigFormsCallback &&
Object.prototype.toString.call(ConfigFormsCallback) ===
"[object Function]"
) {
ConfigFormsCallback()
} else {
this.nextTab()
}
})
},
// json存储
setFormJson(formJson) {
const idx = this.activeName.replace("index", "")
this.formTabs[idx].formJson = formJson
this.formTabsList[idx].formJson = formJson
},
getCurrentFormByType(type = 1) {
this.fromLoading = true
getCurrentFormByType({
type,
groupId: this.group.groupId,
})
.then((res) => {
if (res.code === 1) {
const formTabs = []
this.formTabsList = res.data.map((item, index) => {
if (index === 0) {
formTabs.push({
silent: false,
...item,
label: item.tabName,
})
} else {
formTabs.push({
id: item.id,
silent: true,
label: item.tabName,
})
}
return {
...item,
silent: false,
label: item.tabName,
}
})
this.formTabs = formTabs
}
})
.finally(() => {
this.fromLoading = false
})
},
},
}
<template>
<div class="container">
<div v-show="!isDetail">
<direct-search
ref="form"
:label-position="'right'"
:forms="searchList"
:style="{ textAlign: 'left' }"
@handleSearch="handleFormSearch"
/>
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
:sortChange="sortChange"
/>
</div>
<div v-if="isDetail">
<div>
<el-button icon="el-icon-back" @click="backInfoce">返 回</el-button>
</div>
<ConfigForms
form-type="1"
:patient-id="patientId"
:disabled="disabled"
:tabDisabled="tabDisabled"
:isDraft="'0'"
:operation="'edit'"
></ConfigForms>
</div>
</div>
</template>
<script>
import paginationMixin from "@/components/TabComponents/mixin"
import { getPatientPage } from "@/api/patient.js"
import ConfigForms from "./components/ConfigForms.vue"
import { mapGetters } from "vuex"
export default {
name: "ScreeningIndex",
mixins: [paginationMixin],
components: { ConfigForms },
data() {
return {
isDetail: false, //! 控制详情显隐
listLoading: false,
disabled: false,
tableData: [],
cacheForm: {},
tabDisabled: true,
searchList: [
{
type: "date",
label: "筛查时间",
prop: "createTime",
placeholder: "请选择时间",
valueFormat: "yyyy-MM-dd",
},
{
label: "筛查审核状态",
type: "select",
prop: "checkStatus",
opts: [
{ label: "待审核", value: "1" },
{ label: "驳回修改", value: "2" },
{ label: "合格", value: "3" },
{ label: "不合格", value: "4" },
],
},
{
label: "风险评估结果",
type: "select",
prop: "riskRank",
opts: [
{ label: "低危", value: "c" },
{ label: "中危", value: "b" },
{ label: "高危", value: "a" },
],
},
{
label: "性别",
type: "select",
prop: "sex",
optsFormatter: () => {
return this.dictMap && this.dictMap["d-sex"]
},
},
{
type: "input",
label: "关键词",
placeholder: "请输入医联体/姓名/身份证",
prop: "keyParam",
},
{
type: "button",
value: "查询",
},
],
columns: [
{
label: "医联体",
minWidth: 120,
value: "unionName",
formatter: (row) => {
return row.unionName ? row.unionName : "--"
},
},
{
label: "姓名",
minWidth: 120,
formatter: (row) => {
return row.name ? row.name : "--"
},
value: "name",
},
{
label: "性别",
minWidth: 80,
value: "sex",
formatter: (row) => {
return row.sex
? this.$handle.formatDicList(this.dictMap["d-sex"], row.sex + "")
: "--"
},
},
{
label: "身份证",
minWidth: 120,
value: "idCard",
formatter: (row) => {
return row.idCard ? row.idCard : "--"
},
},
{
label: "年龄",
minWidth: 120,
value: "age",
formatter: (row) => {
return row.age ? row.age : "--"
},
},
{
label: "筛查时间",
minWidth: 180,
// sortable: "custom",
value: "createTime",
formatter: (row) => {
return row.createTime ? row.createTime : "--"
},
},
{
label: "风险评估结果",
minWidth: 120,
value: "riskRank",
formatter: (row) => {
let riskRank = {
low: "低危",
medium: "中危",
high: "高危",
}
return row.riskRank ? riskRank[row.riskRank] : "--"
},
},
{
label: "是否内镜",
minWidth: 120,
value: "isInnerCheck",
formatter: (row) => {
let arr = [
{ label: "", value: "0" },
{ label: "", value: "1" },
]
let label
if (String(row.isInnerCheck)) {
label = arr.filter((e) => e.value == row.isInnerCheck)[0].label
} else {
label = "--"
}
return label
},
},
{
label: "筛查审核状态",
minWidth: 120,
value: "checkStatus",
formatter: (row) => {
let arr = [
{ label: "待审核", value: "1" },
{ label: "驳回修改", value: "2" },
{ label: "合格", value: "3" },
{ label: "不合格", value: "4" },
]
let label
if (row.checkStatus) {
label = arr.filter((e) => e.value == row.checkStatus)[0].label
} else {
label = "--"
}
return label
},
},
{
label: "操作",
width: 180,
fixed: "right",
operType: "button",
operations: [
{
func: this.handleView,
formatter(row) {
return {
label: "查看",
type: "text",
}
},
},
{
func: this.handleAdd,
formatter(row) {
if (row.checkStatus != 3 && row.checkStatus != 4) {
return {
label: "修改",
type: "text",
}
} else {
return {
label: "",
type: "text",
style: {
display: "none",
},
}
}
},
},
],
},
],
searchForm: {},
}
},
methods: {
backInfoce() {
this.$router.push({ query: {} })
this.isDetail = false
},
handleView(row) {
this.handleAdd(row, null, true, false)
},
handleAdd(
{ patientId, name },
index,
disabled = false,
tabDisabled = true
) {
sessionStorage.removeItem("index1Data")
this.disabled = disabled
this.tabDisabled = tabDisabled
this.patientId = patientId || null
this.name = name
this.isDetail = true
},
sortChange({ prop, order }) {
const asc = order ? (order === "ascending" ? true : false) : ""
const column = order ? prop : ""
this.handleSearch({ "orders[0].asc": asc, "orders[0].column": column })
},
// 查询
handleFormSearch(form) {
this.searchForm = form
this.pageIndex = 1
this.handleSearch(form)
},
handleSearch(form) {
this.listLoading = true
const params = Object.assign(this.cacheForm, form)
const data = {}
for (let key in params) {
if (params[key] !== "" && params[key] !== null) {
// if (key.includes("Time") && params[key]) {
// data["start" + key] = params[key][0]
// data["end" + key] = params[key][1]
// } else {
data[key] = params[key]
// }
}
}
data.current = this.pageIndex
data.size = this.pageSize
data.isDraft = 0
data.patientFrom = this.selectedIndex
getPatientPage(data).then((res) => {
this.listLoading = false
if (res.code === 1) {
const d = res.data
this.tableData = d.records || []
this.total = Number(d.total)
}
})
},
},
computed: {
...mapGetters({
selectedIndex: "table/selectedIndex",
refreshFlag: "table/refreshFlag",
}),
},
created() {
this.handleFormSearch()
// if (this.$route.path == "/screening/index") {
// this.tabDisabled = false
// }
if (this.$route.query.patientId) {
let patientId = this.$route.query.patientId
// this.$nextTick(() => {
this.disabled = true
this.tabDisabled = false
this.patientId = patientId || null
this.isDetail = true
// })
}
},
watch: {
selectedIndex(v) {
this.handleFormSearch(this.searchForm)
},
refreshFlag(v) {
if (v) {
this.$store.commit("table/setRefreshFlag", 0)
this.isDetail = false
this.$nextTick(() => {
this.handleView({
patientId: this.patientId,
name: "",
})
})
}
},
},
}
</script>
<style lang="scss" scoped></style>
<template>
<el-row class="page-container dict">
<el-container class="page-main" :gutter="20">
<el-aside width="250px" class="left-content">
<el-col :span="24" class="left-search">
<el-input
v-model.trim="searchVal"
clearable
:placeholder="placeholder"
>
</el-input>
</el-col>
<el-col class="dict-list" ref="dict">
<el-col
v-for="(item, index) in tableList"
:key="item.id"
class="dict-item"
>
<span
@click="handClick(index, item)"
:class="{ active: index == isActive }"
style="cursor: pointer"
>
<strong>
{{ item.label }}
</strong>
- {{ item.value }}
</span>
</el-col>
</el-col>
</el-aside>
<el-main>
<div style="text-align: right">
<el-input
v-model.trim="keyWord"
clearable
placeholder="关键字"
style="width: 220px; margin-right: 5px"
>
</el-input>
<el-button type="primary" @click="handleSave" :loading="loading"
>保存配置</el-button
>
</div>
<el-table-self
style="margin-top: 10px"
ref="table"
:table-data="fields"
:columns="columns"
:list-loading="listLoading"
/>
</el-main>
</el-container>
</el-row>
</template>
<script>
import { setExportFields, getTableFields, getExportConfigFields } from "@/api/coop-group"
export default {
name: "ExportFieldConfig",
props: {
groupId: String,
},
data() {
return {
isActive: -1,
placeholder: "搜索数据库",
name: "",
searchVal: "",
keyWord: "",
typeId: "",
fieldList: [],
configuredFieldList: [],
tableCode: "",
loading: false,
listLoading: false,
columns: [
{
label: "字段名称",
minWidth: 120,
value: "fieldName",
},
{
label: "字段code",
minWidth: 200,
value: "fieldCode",
},
{
operType: "checkbox",
label: "是否导出",
minWidth: 100,
value: "isExport",
tabType: "selection",
},
{
operType: "checkbox",
label: "是否脱敏",
minWidth: 100,
value: "isDesensitized",
tabType: "selection",
},
{
operType: "input",
type: "number",
label: "排序号",
width: 120,
inputWidth: 108,
value: "sort",
showInput: true,
},
],
}
},
watch: {
groupId(groupId) {
if (groupId) {
this.getTableFields()
this.getFields()
}
},
},
computed: {
// 数据库表过滤
tableList() {
const dictTable = this.dictMap["table"] || []
const list = dictTable.filter(
(_) =>
!this.searchVal ||
_.label.includes(this.searchVal) ||
_.value.includes(this.searchVal)
)
this.isActive = this.getListIdx(list, this.typeId)
return list
},
// 全部字段和已配置字段
fieldValue() {
return this.fieldList.map((field) => {
let configuredField = this.configuredFieldList.find(
(_) => _.fieldCode === field.fieldCode
)
return {
...field,
sort: (configuredField && configuredField.sort) || undefined,
isExport: Boolean(configuredField),
isDesensitized: Boolean(
configuredField && configuredField.isDesensitized
),
}
})
},
fields() {
return this.fieldValue.filter(
(_) =>
!this.keyWord ||
_.fieldName.includes(this.keyWord) ||
_.fieldCode.includes(this.keyWord)
)
},
},
methods: {
// 点击左侧列表
handClick(index, { type, label, id, value }) {
if (!this.groupId) {
this.$message.warning("请先选择协作组")
return
}
this.name = label
this.tableCode = value
this.isActive = index
this.typeId = id
this.fieldList = []
this.getTableFields()
this.getFields()
},
// 全部字段
getTableFields() {
getTableFields({ tableCode: this.tableCode, groupId: this.groupId }).then(
(res) => {
this.fieldList = res.data
}
)
},
// 已配置字段
getFields() {
getExportConfigFields({ tableCode: this.tableCode, groupId: this.groupId })
.then((res) => {
this.configuredFieldList = res.data
})
.catch((e) => {
this.configuredFieldList = []
})
},
handleSave() {
if (!this.groupId) {
this.$message.warning("请先选择协作组")
return
}
if (!this.fieldValue.length) {
this.$message.warning("没有可保存的数据")
return
}
const list = this.fieldValue
.filter((_) => _.isExport)
.map((_) => {
delete _.isExport
return {
..._,
isDesensitized: _.isDesensitized ? 1 : 0,
}
})
const table = {
tableCode: this.tableCode,
tableName: this.name,
groupId: this.groupId,
}
this.loading = true
setExportFields(table, list)
.then((res) => {
this.$message.success("配置成功")
})
.finally(() => {
this.loading = false
})
},
getListIdx(list = [], id) {
let listIdx = -1
for (var i = 0; i < list.length; i++) {
if (list[i].id === id) {
listIdx = i
break
}
}
return listIdx
},
},
}
</script>
<style lang="scss" scoped>
::v-deep .el-main {
padding: 0px 0 0 10px;
}
</style>
...@@ -184,14 +184,6 @@ export default { ...@@ -184,14 +184,6 @@ export default {
prop: "tabName", prop: "tabName",
rules: [{ required: true, message: "请输入表单重命名" }], rules: [{ required: true, message: "请输入表单重命名" }],
}, },
{
type: "select",
label: "机构/科室",
placeholder: "请选择机构/科室",
prop: "deptId",
opts: [],
rules: [{ required: true, message: "请选择机构/科室" }],
},
{ {
type: "select", type: "select",
label: "类型", label: "类型",
...@@ -202,6 +194,7 @@ export default { ...@@ -202,6 +194,7 @@ export default {
}, },
rules: [{ required: true, message: "请选择类型" }], rules: [{ required: true, message: "请选择类型" }],
}, },
{ {
type: "select", type: "select",
label: "填报方式", label: "填报方式",
...@@ -219,6 +212,14 @@ export default { ...@@ -219,6 +212,14 @@ export default {
], ],
rules: [{ required: true, message: "请选择填报方式" }], rules: [{ required: true, message: "请选择填报方式" }],
}, },
{
type: "select",
label: "机构/科室",
placeholder: "请选择机构/科室",
prop: "deptId",
opts: [],
},
{ {
type: "select", type: "select",
label: "对照模板", label: "对照模板",
...@@ -273,7 +274,6 @@ export default { ...@@ -273,7 +274,6 @@ export default {
}) })
}, },
handleCopyAdd(row) { handleCopyAdd(row) {
const data = Object.assign({}, row) const data = Object.assign({}, row)
delete data.id delete data.id
......
...@@ -50,10 +50,13 @@ export default { ...@@ -50,10 +50,13 @@ export default {
// 查询列表 // 查询列表
searchList: [ searchList: [
{ {
label: "参数代码", label: "类型",
type: "input", type: "select",
prop: "code", prop: "type",
placeholder: "请输入参数代码", placeholder: "请输入类型",
optsFormatter: () => {
return this.dictMap && this.dictMap["sys_param_type"]
},
}, },
{ {
label: "参数值", label: "参数值",
...@@ -61,12 +64,7 @@ export default { ...@@ -61,12 +64,7 @@ export default {
prop: "value", prop: "value",
placeholder: "请输入参数值", placeholder: "请输入参数值",
}, },
{
label: "类型",
type: "input",
prop: "type",
placeholder: "请输入类型",
},
{ {
type: "button", type: "button",
value: "查询", value: "查询",
...@@ -81,10 +79,29 @@ export default { ...@@ -81,10 +79,29 @@ export default {
}, },
], ],
columns: [ columns: [
{
label: "类型",
minWidth: 100,
value: "type",
formatter: (row) => {
return this.$handle.formatDicList(
this.dictMap["sys_param_type"],
row.type
)
},
},
{ {
label: "参数代码", label: "参数代码",
minWidth: 120, minWidth: 120,
value: "code", value: "code",
formatter: (row) => {
const item =
this.dictMap["sys_param_type"].find(
(_) => _.value === row.type
) || {}
const list = item.children || []
return this.$handle.formatDicList(list, row.code)
},
}, },
{ {
...@@ -92,21 +109,7 @@ export default { ...@@ -92,21 +109,7 @@ export default {
minWidth: 120, minWidth: 120,
value: "value", value: "value",
}, },
{
label: "类型",
minWidth: 100,
value: "type",
},
{
label: "目标值名称",
minWidth: 100,
value: "targetName",
},
{
label: "目标值",
minWidth: 100,
value: "targetValue",
},
{ {
label: "创建时间", label: "创建时间",
minWidth: 180, minWidth: 180,
...@@ -151,12 +154,24 @@ export default { ...@@ -151,12 +154,24 @@ export default {
cacheForm: {}, cacheForm: {},
formData: [ formData: [
{ {
type: "input", type: "select",
label: "类型",
placeholder: "请选择类型",
prop: "type",
rules: [{ required: true, message: "请选择类型" }],
func: this.typeChange,
optsFormatter: () => {
return this.dictMap && this.dictMap["sys_param_type"]
},
},
{
type: "select",
label: "参数代码", label: "参数代码",
placeholder: "请输入参数代码", placeholder: "请输入参数代码",
prop: "code", prop: "code",
disabled: false, disabled: false,
rules: [{ required: true, message: "参数代码" }], rules: [{ required: true, message: "参数代码" }],
opts: [],
}, },
{ {
type: "input", type: "input",
...@@ -168,22 +183,9 @@ export default { ...@@ -168,22 +183,9 @@ export default {
{ {
type: "input", type: "input",
label: "类型", label: "默认参数值",
placeholder: "请选择类型", placeholder: "请选择默认参数值",
prop: "type", prop: "defaultValue",
rules: [{ required: true, message: "请选择类型" }],
},
{
type: "input",
label: "目标值名称",
placeholder: "请选择目标值名称",
prop: "targetName",
},
{
type: "input",
label: "目标值",
placeholder: "请选择目标值",
prop: "targetValue",
}, },
], ],
formEdit: {}, formEdit: {},
...@@ -200,6 +202,11 @@ export default { ...@@ -200,6 +202,11 @@ export default {
}, },
methods: { methods: {
typeChange(val) {
this.$refs.dialog.initFields({ code: "" })
const opt = this.dictMap["sys_param_type"].find((_) => _.value === val)
this.formData[1].opts = (opt && opt.children) || []
},
handleAdd(row) { handleAdd(row) {
this.formEdit = Object.assign({}, row) this.formEdit = Object.assign({}, row)
if (!this.groupId) { if (!this.groupId) {
...@@ -212,13 +219,17 @@ export default { ...@@ -212,13 +219,17 @@ export default {
const data = Object.assign(form, { const data = Object.assign(form, {
groupId: this.groupId, groupId: this.groupId,
}) })
setParamConfig(data).then((res) => { setParamConfig(data)
.then((res) => {
if (res.code === 1) { if (res.code === 1) {
this.$message.success("添加成功") this.$message.success("添加成功")
this.handleSearch() this.handleSearch()
this.$refs.dialog.close() this.$refs.dialog.close()
} }
}) })
.finally(() => {
this.$refs.dialog.loading = false
})
}, },
handleDel(row) { handleDel(row) {
this.$confirm(`是否删除【${row.code || ""}】?`, "提示", { this.$confirm(`是否删除【${row.code || ""}】?`, "提示", {
......
<template>
<el-row class="page-container dict">
<el-container class="page-main" :gutter="20">
<el-aside width="250px" class="left-content">
<el-col :span="24" class="left-search">
<el-input
v-model.trim="searchVal"
clearable
:placeholder="placeholder"
>
</el-input>
</el-col>
<el-col class="dict-list" ref="dict">
<el-col
v-for="(item, index) in tableList"
:key="item.id"
class="dict-item"
>
<span
@click="handClick(index, item)"
:class="{ active: index == isActive }"
style="cursor: pointer"
>
<strong>
{{ item.label }}
</strong>
- {{ item.value }}
</span>
</el-col>
</el-col>
</el-aside>
<el-main>
<el-button type="primary" @click="handleClone">引用配置</el-button>
<div style="text-align: right">
<el-input
v-model.trim="keyWord"
clearable
placeholder="关键字"
style="width: 220px; margin-right: 5px"
>
</el-input>
<el-button
type="primary"
v-if="tableCode === 'data_lab_detail'"
@click="handleAdd"
>新增(检验细项)</el-button
>
</div>
<el-table-self
style="margin-top: 10px"
ref="table"
:table-data="
tableCode === 'data_lab_detail' ? configuredFields : fields
"
:columns="columns"
:list-loading="listLoading"
/>
</el-main>
<dialog-form
width="650px"
:close-modal="false"
label-width="140px"
ref="dialog"
title="引用其他机构协作组配置"
:form-data="formData"
@handleConfirm="handleConfirm"
></dialog-form>
<el-drawer
title="配置字段"
:visible.sync="widgetVisible"
:size="500"
:wrapperClosable="false"
>
<div class="drawer__container">
<div class="drawer__content">
<div class="widget-config">
<el-form
label-suffix=":"
labelPosition="left"
labelWidth="110px"
ref="form"
:rules="rules"
size="small"
:model="configForm"
>
<el-form-item label="数据模块" prop="firstType">
<el-select
v-model="configForm.firstType"
placeholder="选择数据模块"
style="width: 100%"
@change="firstTypeChange"
clearable
filterable
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in dictMap['data_module']"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="数据子模块">
<el-select
v-model="configForm.subType"
placeholder="选择数据子模块"
style="width: 100%"
clearable
filterable
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in subTypeOpts"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<div style="margin-bottom: 10px; font-size: 18px">父级字段</div>
<el-form-item label="父级数据表">
<el-select
v-model="configForm.parentTableCode"
placeholder="选择父级数据表"
style="width: 100%"
@change="tableChange"
clearable
filterable
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in dictMap['table']"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="父级字段">
<el-select
v-model="configForm.parentFieldCode"
placeholder="选择父级字段"
style="width: 100%"
clearable
filterable
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in parentFieldOpts"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<div style="margin-bottom: 10px; font-size: 18px">
当前配置字段
</div>
<el-form-item label="字段名称">
<el-input
v-model="configForm.fieldName"
:disabled="isDisabled"
></el-input>
</el-form-item>
<el-form-item label="字段编码">
<el-input
v-model="configForm.fieldCode"
:disabled="isDisabled"
></el-input>
</el-form-item>
<div style="margin-bottom: 10px; font-size: 18px">完整性</div>
<el-form-item label="是否必填" labelWidth="130px">
<el-switch
v-model="configForm.isRequired"
:active-value="1"
:inactive-value="0"
></el-switch>
</el-form-item>
<div style="margin-bottom: 10px; font-size: 18px">有效性</div>
<el-form-item label="字典值域范围">
<el-select
v-model="configForm.dictType"
placeholder="选择字典"
style="width: 100%"
@change="dicTypeChange"
clearable
filterable
>
<el-option
:label="item.name"
:value="item.type"
v-for="item in dictList"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<div
class="el-form-item--small el-form--label-top"
style="padding-bottom: 14px"
>
<strong class="el-form-item__label" style="padding: 0"
>字典数据示例:</strong
>
<div class="el-form-item__content">
<draggable
tag="ul"
:list="dicData"
:group="{ name: 'dic' }"
ghost-class="ghost"
handle=".drag-item"
>
<li v-for="(item, index) in dicData" :key="index">
<i
class="drag-item el-icon-s-operation"
style="font-size: 16px; margin: 0 5px; cursor: move"
></i>
<el-input
style="margin-right: 5px"
size="mini"
readonly
clearable
v-model="item.label"
placeholder="label"
></el-input>
<el-input
size="mini"
clearable
readonly
v-model="item.value"
placeholder="value"
></el-input>
</li>
</draggable>
</div>
</div>
<el-form-item label="正则表达式">
<el-input v-model="configForm.regexStr" clearable></el-input>
</el-form-item>
<el-form-item label="Hutool校验">
<el-select
v-model="configForm.htType"
placeholder="选择Hutool校验"
style="width: 100%"
clearable
filterable
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in dictMap['hutool_validator']"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="文本长度">
<div style="display: flex">
<el-input-number
v-model.trim="configForm.minLen"
:min="0"
clearable
controls-position="right"
size="mini"
placeholder="最小长度"
></el-input-number>
<span style="margin: 0 10px"> - </span>
<el-input-number
v-model.trim="configForm.maxLen"
clearable
:min="configForm.minLen + 1"
controls-position="right"
size="mini"
placeholder="最大长度"
></el-input-number>
</div>
</el-form-item>
<el-form-item label="数值范围">
<div style="display: flex">
<el-input-number
v-model.trim="configForm.minValue"
clearable
controls-position="right"
size="mini"
placeholder="最小值"
></el-input-number>
<span style="margin: 0 10px"> - </span>
<el-input-number
v-model.trim="configForm.maxValue"
clearable
:min="configForm.minValue + 1"
controls-position="right"
size="mini"
placeholder="最大值"
></el-input-number>
</div>
</el-form-item>
<div style="margin-bottom: 10px; font-size: 18px">一致性</div>
<el-form-item label="逻辑质控">
<el-input
v-model.trim="configForm.logicStr"
type="textarea"
clearable
placeholder="逻辑质控"
></el-input>
</el-form-item>
<div style="margin-bottom: 10px; font-size: 18px">准确性</div>
<el-form-item label="逻辑质控">
<el-input
v-model.trim="configForm.note"
type="textarea"
clearable
placeholder="逻辑质控"
></el-input>
</el-form-item>
</el-form>
</div>
</div>
<div class="footer">
<el-button @click="widgetVisible = false" size="large"
>取 消</el-button
>
<el-button
size="large"
type="primary"
:loading="loading"
@click="handleConfigConfirm"
>确 定</el-button
>
</div>
</div>
</el-drawer>
</el-container>
</el-row>
</template>
<script>
import {
setQcConfigFields,
getTableFields,
getQcConfigFields,
setQcConfigField,
getQcGroupOption,
setCloneConf,
delConf,
} from "@/api/coop-group"
import Draggable from "vuedraggable"
import { mapGetters } from "vuex"
export default {
name: "QualityControlConfig",
components: { Draggable },
props: {
groupId: String,
groupName: String,
},
data() {
return {
isDisabled: true,
subTypeOpts: [],
parentFieldOpts: [],
widgetVisible: false,
configForm: {
firstType: "",
subType: "",
},
rules: {
firstType: [
{ required: true, message: "请选择数据模块", trigger: "change" },
],
},
isActive: -1,
placeholder: "搜索数据库",
name: "",
searchVal: "",
keyWord: "",
typeId: "",
fieldList: [],
configuredFieldList: [],
tableCode: "",
loading: false,
listLoading: false,
configIndex: 0,
formData: [
{
type: "select",
label: "引用机构/协作组",
placeholder: "请选择机构/协作组",
prop: "id",
opts: [],
rules: [{ required: true, message: "请选择机构/协作组" }],
},
],
columns: [
{
label: "数据模块",
minWidth: 120,
value: "firstType",
hidden: true,
},
{
label: "数据子模块",
minWidth: 120,
value: "subType",
hidden: true,
},
{
label: "字段名称",
minWidth: 120,
value: "fieldName",
},
{
label: "字段code",
minWidth: 120,
value: "fieldCode",
},
{
label: "规则",
minWidth: 200,
value: "logicStr",
},
{
label: "操作",
width: 160,
fixed: "right",
operType: "button",
operations: [
{
func: this.handleConfig,
formatter(row) {
return {
label: "配置",
type: "text",
}
},
},
{
func: this.handleDel,
style: {
color: "#F56C6C",
},
formatter(row) {
return {
label: "删除配置",
type: "text",
}
},
},
],
},
],
dicData: [],
}
},
watch: {
groupId(groupId) {
if (groupId) {
this.getTableFields()
this.getFields()
}
},
tableCode(tableCode) {
this.columns[0].hidden = this.columns[1].hidden =
tableCode === "data_lab_detail" ? false : true
},
},
computed: {
...mapGetters({
dictList: ["dict/dictSet"],
dictMap: ["dict/dictMap"],
}),
// 数据库表过滤
tableList() {
const dictTable =
(this.dictMap["table"] &&
this.dictMap["table"].filter((_) => _.value !== "data_lab_type")) ||
[]
const list = dictTable.filter(
(_) =>
!this.searchVal ||
_.label.includes(this.searchVal) ||
_.value.includes(this.searchVal)
)
this.isActive = this.getListIdx(list, this.typeId)
return list
},
fields() {
return this.fieldList.filter(
(_) =>
!this.keyWord ||
_.fieldName.includes(this.keyWord) ||
_.fieldCode.includes(this.keyWord)
)
},
configuredFields() {
return this.configuredFieldList.filter(
(_) =>
!this.keyWord ||
_.fieldName.includes(this.keyWord) ||
_.fieldCode.includes(this.keyWord)
)
},
},
methods: {
handleDel(row) {
this.$confirm(`是否删除【${row.fieldName || ""}】配置?`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
delConf(row.id).then((res) => {
if (res.code === 1) {
this.$message({
type: "success",
message: "删除成功!",
})
this.getTableFields()
}
})
})
.catch(() => {})
},
handleClone() {
if (!this.groupId) {
this.$message.warning("请先选择协作组")
return
}
this.$refs.dialog.open()
},
handleConfirm({ id }) {
const { diseaseCode, groupId, orgId } = this.formData[0].opts.find(
(item) => item.groupId === id
)
const params = {
sourceDiseaseCode: diseaseCode,
sourceGroupId: groupId,
sourceOrgId: orgId,
targetGroupId: this.groupId,
}
setCloneConf(params).then((res) => {
this.$message.success("配置成功")
this.getFields()
this.$refs.dialog.close()
})
},
handleConfigConfirm() {
this.$refs.form.validate((valid) => {
if (valid) {
const data = Object.assign(
{
tableCode: this.tableCode,
tableName: this.name,
groupId: this.groupId,
groupName: this.groupName,
},
this.configForm
)
this.loading = true
setQcConfigField(data)
.then((res) => {
this.$message.success("配置成功")
this.getFields()
this.widgetVisible = false
})
.finally(() => {
this.loading = false
})
} else {
}
})
},
tableChange(tableCode) {
if (!tableCode) {
this.parentFieldOpts = []
return
}
getTableFields({ tableCode, groupId: this.groupId }).then((res) => {
this.parentFieldOpts = res.data.map((_) => {
return {
..._,
label: _.fieldName,
value: _.fieldCode,
}
})
})
},
firstTypeChange(val, notEmpty = false) {
let list = []
const current = this.dictMap["data_module"].find((_) => _.value === val)
if (current && current.children) {
list = current.children
}
if (!notEmpty) {
this.$set(this.configForm, "subType", "")
}
this.subTypeOpts = list
},
dicTypeChange(type) {
this.dicData = this.deepClone(this.dictMap[type])
},
handleAdd() {
this.handleConfig({}, -1)
},
handleConfig(row, index) {
this.configForm = Object.assign({}, row, {
maxLen: this.formatter(row.maxLen),
minLen: this.formatter(row.minLen),
maxValue: this.formatter(row.maxValue),
minValue: this.formatter(row.minValue),
})
this.dicTypeChange(row.dictType)
this.firstTypeChange(row.firstType, true)
this.isDisabled = index > -1
this.configIndex = index
this.widgetVisible = true
},
formatter(val) {
return val === "" || val === null ? undefined : val
},
getQcGroupOption() {
getQcGroupOption().then((res) => {
this.formData[0].opts = res.data.map((item) => {
return {
...item,
value: item.groupId,
label: `机构:${item.orgName} | 疾病: ${item.diseaseName} | 协作组: ${item.groupName}`,
}
})
})
},
// 点击左侧列表
handClick(index, { type, label, id, value }) {
if (!this.groupId) {
this.$message.warning("请先选择协作组")
return
}
this.name = label
this.tableCode = value
this.isActive = index
this.typeId = id
this.fieldList = []
this.getTableFields()
},
// 全部字段
getTableFields() {
getTableFields({ tableCode: this.tableCode, groupId: this.groupId }).then(
(res) => {
this.fieldList = res.data
this.getFields()
}
)
},
// 已配置字段
getFields() {
if (!this.tableCode) return
getQcConfigFields({ tableCode: this.tableCode, groupId: this.groupId })
.then((res) => {
this.configuredFieldList = res.data
this.fieldList = this.fieldList.map((field) => {
let configuredField = this.configuredFieldList.find(
(_) => _.fieldCode === field.fieldCode
)
return {
...field,
...configuredField,
}
})
})
.catch((e) => {
this.configuredFieldList = []
})
},
// 批量保存
handleSave() {
if (!this.groupId) {
this.$message.warning("请先选择协作组")
return
}
const table = {
tableCode: this.tableCode,
tableName: this.name,
groupId: this.groupId,
groupName: this.groupName,
}
const fieldList =
this.tableCode === "data_lab_detail"
? this.configuredFieldList
: this.fieldList
const list = fieldList
.filter((_) => _.firstType)
.map((_) => {
return {
..._,
...table,
}
})
if (!list.length) {
this.$message.warning("没有可保存的数据")
return
}
this.loading = true
setQcConfigFields(table, list)
.then((res) => {
this.$message.success("配置成功")
this.getFields()
})
.finally(() => {
this.loading = false
})
},
getListIdx(list = [], id) {
let listIdx = -1
for (var i = 0; i < list.length; i++) {
if (list[i].id === id) {
listIdx = i
break
}
}
return listIdx
},
},
created() {
this.getQcGroupOption()
},
}
</script>
<style lang="scss" scoped>
::v-deep .el-main {
padding: 0px 0 0 10px;
}
.drawer__container {
padding: 0 20px;
.drawer__content {
height: calc(100vh - #{"160px"});
overflow-y: auto;
::v-deep .el-input-number {
width: 100%;
}
&::-webkit-scrollbar {
width: 0px;
height: 0px;
}
&::-webkit-scrollbar-thumb {
background-color: #fff;
}
}
.footer {
margin-top: 20px;
display: flex;
button {
flex: 1;
}
}
}
</style>
...@@ -38,15 +38,6 @@ ...@@ -38,15 +38,6 @@
<el-tab-pane label="表单管理" name="second"> <el-tab-pane label="表单管理" name="second">
<GroupForm :group-id="groupId"></GroupForm> <GroupForm :group-id="groupId"></GroupForm>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="导出字段配置" name="third">
<ExportFieldConfig :group-id="groupId"></ExportFieldConfig>
</el-tab-pane>
<el-tab-pane label="质控配置" name="fourth">
<QualityControlConfig
:group-id="groupId"
:group-name="groupName"
></QualityControlConfig>
</el-tab-pane>
<el-tab-pane label="参数配置" name="fifth"> <el-tab-pane label="参数配置" name="fifth">
<ParameterConfig :group-id="groupId"></ParameterConfig> <ParameterConfig :group-id="groupId"></ParameterConfig>
</el-tab-pane> </el-tab-pane>
...@@ -65,18 +56,14 @@ ...@@ -65,18 +56,14 @@
</template> </template>
<script> <script>
import ExportFieldConfig from "./ExportFieldConfig.vue"
import GroupUser from "./GroupUser" import GroupUser from "./GroupUser"
import GroupForm from "./GroupForm" import GroupForm from "./GroupForm"
import QualityControlConfig from "./QualityControlConfig.vue"
import ParameterConfig from "./ParameterConfig.vue" import ParameterConfig from "./ParameterConfig.vue"
import { translateListToTree } from "@/utils/handleRoutes" import { translateListToTree } from "@/utils/handleRoutes"
import { getCoopGroupList, addCoopGroup } from "@/api/coop-group.js" import { getCoopGroupList, addCoopGroup } from "@/api/coop-group.js"
export default { export default {
name: "CollaGroup", name: "CollaGroup",
components: { components: {
ExportFieldConfig,
QualityControlConfig,
GroupUser, GroupUser,
GroupForm, GroupForm,
ParameterConfig, ParameterConfig,
......
<template>
<div class="container">
<direct-search
ref="form"
:label-position="'right'"
:forms="searchList"
:style="{ textAlign: 'left' }"
@handleSearch="handleFormSearch"
/>
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
<dialog-form
width="800px"
:close-modal="false"
ref="dialog"
:title="formEdit.id ? '编辑数据库' : '添加数据库'"
:form-edit="formEdit"
:form-data="formData"
@handleConfirm="handleConfirm"
confirmText="保 存"
>
<template #otherButton="scoped">
<el-button
size="medium"
:loading="loading"
type="primary"
@click="testDb(scoped.form)"
>测试连接</el-button
>
</template>
</dialog-form>
</div>
</template>
<script>
import paginationMixin from "@/components/TabComponents/mixin"
import { getDbPage, addDb, testDb } from "@/api/database.js"
export default {
name: "Database",
data() {
return {
listLoading: false,
// 查询列表
searchList: [
{
label: "数据库名称",
type: "input",
prop: "dbName",
placeholder: "请输入数据库名称",
},
{
type: "button",
value: "查询",
icon: "el-icon-search",
},
{
type: "button",
color: "primary",
icon: "el-icon-plus",
value: "添加",
func: this.handleAdd,
},
],
columns: [
{
label: "数据库名称",
minWidth: 180,
value: "dbName",
},
{
label: "数据源名称",
minWidth: 120,
value: "name",
},
{
label: "数据源驱动",
minWidth: 80,
value: "driverClassName",
formatter: (row) => {
return this.$handle.formatDicList(
this.dictMap["db_driver"],
row.driverClassName
)
},
},
{
label: "数据源类型",
minWidth: 80,
value: "type",
formatter: (row) => {
return this.$handle.formatDicList(this.dictMap["db_type"], row.type)
},
},
{
label: "库表前缀",
minWidth: 80,
value: "prefix",
},
{
label: "内网url",
minWidth: 120,
value: "inteUrl",
},
{
label: "内网host",
minWidth: 120,
value: "inteHost",
},
{
label: "外网url",
minWidth: 120,
value: "outUrl",
},
{
label: "外网host",
minWidth: 120,
value: "outHost",
},
{
label: "端口",
minWidth: 60,
value: "port",
},
{
label: "用户名",
minWidth: 120,
value: "username",
},
{
label: "操作",
width: 120,
fixed: "right",
operType: "button",
operations: [
{
func: this.handleAdd,
formatter(row) {
return {
label: "编辑",
type: "primary",
}
},
},
],
},
],
tableData: [],
cacheForm: {},
title: "",
formData: [
{
type: "input",
label: "数据库名称",
placeholder: "请输入数据库名称",
prop: "dbName",
rules: [{ required: true, message: "请输入数据库名称" }],
spanCount: 12,
},
{
type: "input",
label: "数据源名称",
placeholder: "请输入数据源名称",
prop: "name",
rules: [{ required: true, message: "请输入数据源名称" }],
spanCount: 12,
},
{
type: "select",
label: "数据源驱动",
prop: "driverClassName",
rules: [{ required: true, message: "请输入数据源驱动" }],
optsFormatter: () => {
return this.dictMap && this.dictMap["db_driver"]
},
spanCount: 12,
},
{
type: "input",
label: "库表前缀",
placeholder: "请输入库表前缀",
prop: "prefix",
rules: [{ required: true, message: "请输入库表前缀" }],
spanCount: 12,
},
{
type: "select",
label: "数据源类型",
prop: "type",
rules: [{ required: true, message: "请输入数据源类型" }],
optsFormatter: () => {
return this.dictMap && this.dictMap["db_type"]
},
spanCount: 12,
},
{
type: "input",
label: "端口",
placeholder: "请输入端口",
prop: "port",
spanCount: 12,
rules: [{ required: true, message: "请输入端口" }],
},
{
type: "input",
label: "内网url",
placeholder: "请输入内网url",
prop: "inteUrl",
rules: [{ required: true, message: "请输入内网url" }],
spanCount: 12,
},
{
type: "input",
label: "内网host",
placeholder: "请输入内网host",
prop: "inteHost",
spanCount: 12,
},
{
type: "input",
label: "外网url",
placeholder: "请输入外网url",
prop: "outUrl",
rules: [{ required: true, message: "请输入外网url" }],
spanCount: 12,
},
{
type: "input",
label: "外网host",
placeholder: "请输入外网host",
prop: "outHost",
spanCount: 12,
},
{
type: "input",
label: "用户名",
placeholder: "请输入用户名",
prop: "username",
rules: [{ required: true, message: "请输入用户名" }],
spanCount: 12,
},
{
type: "input",
label: "密码",
placeholder: "请输入密码",
prop: "pwd",
rules: [{ required: true, message: "请输入密码" }],
spanCount: 12,
},
],
formEdit: {},
loading: false,
}
},
mixins: [paginationMixin],
methods: {
handleAdd(row = {}) {
this.formEdit = { ...row }
this.$refs.dialog.open()
},
testDb(form) {
this.loading = true
testDb(form)
.then((res) => {
this.$message.info(res.data)
})
.finally(() => {
this.loading = false
})
},
handleConfirm(form) {
const data = { ...form }
const msg = data.id ? "编辑成功" : "新增成功"
addDb(data)
.then((res) => {
this.$message.success(msg)
this.handleSearch()
this.$refs.dialog.close()
})
.finally(() => {
this.$refs.dialog.loading = false
})
},
// 查询
handleFormSearch(form) {
this.pageIndex = 1
this.handleSearch(form)
},
handleSearch(form) {
Object.assign(this.cacheForm, form)
this.listLoading = true
const params = { ...this.cacheForm }
for (let key in params) {
if (params[key] === "") {
delete params[key]
}
}
params.current = this.pageIndex
params.size = this.pageSize
getDbPage(params).then((res) => {
this.listLoading = false
if (res.code === 1) {
const d = res.data
this.tableData = d.records || []
this.total = Number(d.total)
}
})
},
},
created() {
this.handleFormSearch()
},
}
</script>
<template>
<div class="container">
<direct-search
ref="form"
:label-position="'right'"
:forms="searchList"
:style="{ textAlign: 'left' }"
@handleSearch="handleFormSearch"
/>
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:list-loading="listLoading"
/>
<el-drawer
:title="widgetFormSelect.id ? '编辑' : '新增'"
:visible.sync="widgetVisible"
:size="500"
:wrapperClosable="false"
>
<div class="drawer__container">
<div class="drawer__content">
<widget-config
:data="widgetFormSelect"
:propNotEdit="propNotEdit"
layout-hidden
>
<template v-slot:dbtable>
<el-collapse-item
name="4"
title="数据库属性与命名标准"
v-if="!['group', 'title'].includes(widgetFormSelect.type)"
>
<el-form-item label="数据类型">
<el-select
v-model="widgetFormSelect.fieldType"
placeholder="字段存储类型"
style="width: 100%"
clearable
>
<el-option
:label="item.label"
:value="item.value"
v-for="item in dictMap['data_type']"
:key="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="数据宽度">
<el-input
style="width: 100%"
v-model="widgetFormSelect.fieldLength"
:controls="false"
clearable
placeholder="数据宽度"
></el-input>
</el-form-item>
<el-form-item label="数据元标识">
<el-input
v-model="widgetFormSelect.hisElementIdent"
clearable
placeholder="数据元标识"
></el-input>
</el-form-item>
<el-form-item label="数据元值类型">
<el-input
v-model="widgetFormSelect.hisDataType"
clearable
placeholder="数据元值类型"
></el-input>
</el-form-item>
<el-form-item label="表达格式">
<el-input
v-model="widgetFormSelect.hisRepresentFormat"
clearable
placeholder="表达格式"
></el-input>
</el-form-item>
<el-form-item label="允许值">
<el-input
v-model="widgetFormSelect.hisAllowance"
clearable
placeholder="允许值"
></el-input>
</el-form-item>
</el-collapse-item>
</template>
</widget-config>
</div>
<div class="footer">
<el-button @click="widgetVisible = false" size="large"
>取 消</el-button
>
<el-button
size="large"
type="primary"
:loading="loading"
@click="handleConfirm(widgetFormSelect)"
>确 定</el-button
>
</div>
</div>
</el-drawer>
</div>
</template>
<script>
import WidgetConfig from "packages/WidgetConfig.vue"
import { getFieldListByCode, addField, delField } from "@/api/field.js"
// 新增所需字段
const fields = [
"id",
"fieldType",
"label",
"prop",
"fieldLength",
"hisElementIdent",
"hisDataType",
"hisRepresentFormat",
"hisAllowance",
]
// 字段关系映射
const fieldMap = {
label: "fieldName",
prop: "fieldCode",
}
export default {
name: "FieldList",
props: {
tableCode: {},
tableId: {},
dbId: {},
},
components: {
WidgetConfig,
},
data() {
return {
propNotEdit: false,
loading: false,
widgetVisible: false,
widgetFormSelect: {},
listLoading: false,
// 查询列表
searchList: [
{
label: "字段名",
type: "input",
prop: "fieldName",
placeholder: "请输入字段名",
},
{
label: "属性值",
type: "input",
prop: "fieldCode",
placeholder: "请输入属性值",
},
{
type: "button",
value: "查询",
icon: "el-icon-search",
},
{
type: "button",
color: "primary",
icon: "el-icon-plus",
hasForm: true,
value: "添加",
func: this.handleAdd,
},
],
columns: [
{
label: "字段名",
minWidth: 120,
value: "fieldName",
},
{
label: "属性值",
minWidth: 120,
value: "fieldCode",
},
{
label: "数据库存字段类型",
minWidth: 120,
value: "fieldType",
formatter: (row) => {
return this.$handle.formatDicList(
this.dictMap["data_type"],
row.fieldType
)
},
},
{
label: "数据宽度",
minWidth: 100,
value: "fieldLength",
},
{
label: "操作",
width: 200,
fixed: "right",
operType: "button",
operations: [
{
func: this.handleAdd,
formatter({ isDefault }) {
return {
disabled: isDefault === 1,
label: "编辑",
type: "primary",
}
},
},
{
func: this.handleDel,
formatter({ isDefault }) {
return {
disabled: isDefault === 1,
label: "删除",
type: "warning",
}
},
},
],
},
],
tableData: [],
cacheForm: {},
}
},
watch: {
tableCode(val) {
if (val) {
this.handleFormSearch()
} else {
this.tableData = []
}
},
},
methods: {
handleAdd({ id, jsonStr, tableCode }) {
if (!this.tableCode) {
this.$message.error("未选择数据表")
return
}
const fields = jsonStr ? JSON.parse(jsonStr) : {}
const form = id ? { id, ...fields } : { tableCode, importantField: true }
this.propNotEdit = Boolean(id)
this.widgetFormSelect = Object.assign(
{ type: "input", display: true },
form
)
console.log(this.widgetFormSelect)
this.widgetVisible = true
},
handleConfirm(form) {
if (!/^[a-zA-Z]+([a-zA-Z0-9]*([_-]?[a-zA-Z0-9]+)*)*$/.test(form.prop)) {
this.$message.error(
"只能包含大小字母、数字、下划线。必须以字母开始,下划线不可连续重复,下划线后不可紧跟着数字,不能以数字、下划线结束"
)
return
}
const data = {
jsonStr: JSON.stringify(form),
dbId: this.dbId,
tableId: this.tableId,
}
Object.keys(form).forEach((key) => {
if (fields.includes(key)) {
if (fieldMap[key]) {
data[fieldMap[key]] = form[key]
} else {
data[key] = form[key]
}
}
})
const msg = data.id ? "编辑成功" : "新增成功"
this.loading = true
addField(data)
.then((res) => {
if (res.code === 1) {
this.$message.success(msg)
this.handleSearch()
// this.widgetVisible = false
this.loading = false
}
})
.catch((e) => {
this.loading = false
})
},
handleDel(row) {
this.$confirm(`是否删除【${row.fieldName}】?`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
delField(row.id).then((res) => {
if (res.code === 1) {
this.$message({
type: "success",
message: "删除成功!",
})
this.handleSearch()
}
})
})
.catch(() => {})
},
// 查询
handleFormSearch(form) {
this.pageIndex = 1
this.handleSearch(form)
},
handleSearch(form) {
if (!this.tableCode) return
this.cacheForm = Object.assign(this.cacheForm, form)
this.listLoading = true
const params = Object.assign(
{
tableCode: this.tableCode,
},
this.cacheForm
)
for (let key in params) {
if (params[key] === "") {
delete params[key]
}
}
getFieldListByCode(params).then((res) => {
this.listLoading = false
this.tableData = res.data || []
})
},
},
}
</script>
<style lang="scss" scoped>
.drawer__container {
padding: 0 20px;
.drawer__content {
height: calc(100vh - #{"160px"});
overflow-y: auto;
::v-deep .el-input-number {
width: 100%;
}
&::-webkit-scrollbar {
width: 0px;
height: 0px;
}
&::-webkit-scrollbar-thumb {
background-color: #fff;
}
}
.footer {
margin-top: 20px;
display: flex;
button {
flex: 1;
}
}
}
</style>
<template> <template>
<div class="container"> <el-row class="page-container dict">
<direct-search <el-tabs v-model="activeName" @tab-click="handleTabClick">
ref="form" <el-tab-pane
:label-position="'right'" :label="item.name"
:forms="searchList" :name="'index' + index"
:style="{ textAlign: 'left' }" v-for="(item, index) in dbList"
@handleSearch="handleFormSearch" :key="item.id"
/> >{{
<el-table-self }}</el-tab-pane>
ref="table" </el-tabs>
:table-data="tableData" <el-container class="page-main" :gutter="20">
:columns="columns" <el-aside width="220px" class="left-content">
:list-loading="listLoading" <el-col :span="24" class="left-title">
:current-page="pageIndex" <span>数据库表</span>
:total-count="total" <span class="left-add" @click="handleAdd()" title="新增"
:page-sizes="pageSizes" ><i class="el-icon-circle-plus-outline"></i
:page-size="pageSize" ></span>
@pageSizeChange="handleSizeChange" </el-col>
@currentPageChange="handleCurrentChange" <el-col :span="24" class="left-search">
/> <el-input
v-model.trim="searchVal"
<el-drawer
:title="widgetFormSelect.id ? '编辑' : '新增'"
:visible.sync="widgetVisible"
:size="500"
:wrapperClosable="false"
>
<div class="drawer__container">
<div class="drawer__content">
<widget-config
:data="widgetFormSelect"
:propNotEdit="propNotEdit"
layout-hidden
>
<template v-slot:dbtable>
<el-collapse-item
name="4"
title="数据库属性与命名标准"
v-if="!['group', 'title'].includes(widgetFormSelect.type)"
>
<el-form-item label="数据库表">
<el-select
v-model="widgetFormSelect.tableCode"
placeholder="数据库表"
style="width: 100%"
clearable clearable
:placeholder="placeholder"
> >
<el-option </el-input>
:label="item.label" </el-col>
:value="item.value" <el-col
v-for="item in dictMap['table']" class="dict-list"
:key="item.value" ref="dict"
></el-option> style="height: calc(100vh - 280px)"
</el-select>
</el-form-item>
<el-form-item label="数据类型">
<el-select
v-model="widgetFormSelect.fieldType"
placeholder="字段存储类型"
style="width: 100%"
clearable
> >
<el-option <el-col
:label="item.label" v-for="(item, index) in tableData"
:value="item.value" :key="item.id"
v-for="item in dictMap['data_type']" class="dict-item"
:key="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="数据宽度">
<el-input
style="width: 100%"
v-model="widgetFormSelect.fieldLength"
:controls="false"
clearable
placeholder="数据宽度"
></el-input>
</el-form-item>
<el-form-item label="数据元标识">
<el-input
v-model="widgetFormSelect.hisElementIdent"
clearable
placeholder="数据元标识"
></el-input>
</el-form-item>
<el-form-item label="数据元值类型">
<el-input
v-model="widgetFormSelect.hisDataType"
clearable
placeholder="数据元值类型"
></el-input>
</el-form-item>
<el-form-item label="表达格式">
<el-input
v-model="widgetFormSelect.hisRepresentFormat"
clearable
placeholder="表达格式"
></el-input>
</el-form-item>
<el-form-item label="允许值">
<el-input
v-model="widgetFormSelect.hisAllowance"
clearable
placeholder="允许值"
></el-input>
</el-form-item>
</el-collapse-item>
</template>
</widget-config>
</div>
<div class="footer">
<el-button @click="widgetVisible = false" size="large"
>取 消</el-button
> >
<el-button <span
size="large" @click="handClick(index, item)"
type="primary" :class="{ active: index == isActive }"
:loading="loading" style="cursor: pointer; word-break: break-word"
@click="handleConfirm(widgetFormSelect)"
>确 定</el-button
> >
</div> {{ item.name }} <br />{{ item.code }}
</div> </span>
</el-drawer> <span class="item-del">
</div> <!-- <i class="el-icon-edit-outline" @click="handleAdd(item)"></i> -->
</span>
</el-col>
</el-col>
</el-aside>
<el-main>
<FieldList
:table-code="tableCode"
:tableId="tableId"
:dbId="dbId"
></FieldList>
</el-main>
</el-container>
<dialog-form
ref="dialog"
:width="'450px'"
:title="formEdit.id ? '编辑' : '新增'"
:form-data="formData"
:form-edit="formEdit"
@handleConfirm="handleConfirm"
/>
</el-row>
</template> </template>
<script> <script>
import WidgetConfig from "packages/WidgetConfig.vue" import { getDbList, getTableList, addDbTable } from "@/api/database"
import paginationMixin from "@/components/TabComponents/mixin" import FieldList from "./FieldList.vue"
import { getFieldPage, addField, delField } from "@/api/field.js"
// 新增所需字段
const fields = [
"id",
"fieldType",
"label",
"prop",
"tableCode",
"tableName",
"fieldLength",
"hisElementIdent",
"hisDataType",
"hisRepresentFormat",
"hisAllowance",
]
// 字段关系映射
const fieldMap = {
label: "fieldName",
prop: "fieldCode",
}
export default { export default {
name: "FieldConfig", name: "FieldConfig",
components: { components: { FieldList },
WidgetConfig,
},
mixins: [paginationMixin],
data() { data() {
return { return {
propNotEdit: false, dbId: null,
loading: false, activeName: "index0",
widgetVisible: false, dbList: [],
widgetFormSelect: {}, tableList: [],
tableCode: null,
isActive: -1,
tableId: "",
searchVal: "",
placeholder: "请输入关键字",
listLoading: false, listLoading: false,
// 查询列表 formEdit: {},
searchList: [ formData: [
{ {
label: "字段名",
type: "input", type: "input",
prop: "fieldName", label: "表名称",
placeholder: "请输入字段名", prop: "name",
}, rules: [{ required: true, message: "表名称必填" }],
{
label: "数据库存储表",
type: "select",
prop: "tableCode",
optsFormatter: () => {
return this.dictMap && this.dictMap["table"]
},
}, },
{ {
type: "button", type: "input",
value: "查询", label: "表code",
icon: "el-icon-search", rules: [{ required: true, message: "表code必填" }],
prop: "code",
slot: "prepend",
unit: "",
}, },
{ {
type: "button", type: "input",
color: "primary", label: "说明",
icon: "el-icon-plus", prop: "note",
hasForm: true,
value: "添加",
func: this.handleAdd,
}, },
], ],
columns: [
{
label: "字段名",
minWidth: 120,
value: "fieldName",
},
{
label: "属性值",
minWidth: 120,
value: "fieldCode",
},
{
label: "数据库存储表名称",
minWidth: 120,
value: "tableName",
},
{
label: "数据库存字段类型",
minWidth: 120,
value: "fieldType",
formatter: (row) => {
return this.$handle.formatDicList(
this.dictMap["data_type"],
row.fieldType
)
},
},
{
label: "数据宽度",
minWidth: 100,
value: "fieldLength",
},
{
label: "操作",
width: 200,
fixed: "right",
operType: "button",
operations: [
{
func: this.handleAdd,
formatter(row) {
return {
label: "编辑",
type: "primary",
} }
}, },
computed: {
tableData() {
const list = this.tableList.filter(
(_) => !this.searchVal || _.name.includes(this.searchVal)
)
this.isActive = this.getListIdx(list, this.tableId)
return list
}, },
{ filterTableData() {
func: this.handleDel, return this.tabData.filter(
formatter(row) { (_) => !this.cacheForm.name || _.name.includes(this.cacheForm.name)
return { )
label: "删除",
type: "warning",
}
},
}, },
],
}, },
], methods: {
tableData: [], handleAdd(row = {}) {
cacheForm: {}, if (!this.dbId) {
this.$message.error("未选择数据库")
return
} }
const db = this.dbList.find((_) => _.id === this.dbId)
this.formData[1].unit = db.prefix + "_"
this.formEdit = { ...row }
this.$refs.dialog.open()
}, },
methods: {
handleAdd({ id, jsonStr, tableCode }) {
const fields = jsonStr ? JSON.parse(jsonStr) : {}
const form = id ? { id, ...fields } : { tableCode, importantField: true }
this.propNotEdit = Boolean(id)
this.widgetFormSelect = Object.assign(
{ type: "input", display: true },
form
)
this.widgetVisible = true
},
handleConfirm(form) { handleConfirm(form) {
form.tableName = this.$handle.formatDicList( addDbTable({ ...form, dbId: this.dbId })
this.dictMap["table"],
form.tableCode
)
const data = { jsonStr: JSON.stringify(form) }
Object.keys(form).forEach((key) => {
if (fields.includes(key)) {
if (fieldMap[key]) {
data[fieldMap[key]] = form[key]
} else {
data[key] = form[key]
}
}
})
const msg = data.id ? "编辑成功" : "新增成功"
this.loading = true
addField(data)
.then((res) => { .then((res) => {
if (res.code === 1) { this.$message.success(res.msg)
this.$message.success(msg) this.getTableList()
this.handleSearch() this.$refs.dialog.close()
// this.widgetVisible = false
this.loading = false
}
}) })
.catch((e) => { .finally(() => {
this.loading = false this.$refs.dialog.loading = false
}) })
}, },
handleDel(row) { handleTabClick({ index }) {
this.$confirm(`是否删除【${row.fieldName}】?`, "提示", { this.dbId = this.dbList[index].id
confirmButtonText: "确定", this.tableCode = null
cancelButtonText: "取消", this.tableId = null
type: "warning", this.getTableList()
}) },
.then(() => { getTableList() {
delField(row.id).then((res) => { if (!this.dbId) return
if (res.code === 1) { getTableList(this.dbId).then((res) => {
this.$message({ this.tableList = res.data
type: "success",
message: "删除成功!",
})
this.handleSearch()
}
})
}) })
.catch(() => {})
}, },
// 查询 // 点击左侧列表
handleFormSearch(form) { handClick(index, { code, name, id }) {
this.pageIndex = 1 this.name = name
this.handleSearch(form) this.isActive = index
this.tableCode = code
this.tableId = id
}, },
handleSearch(form) {
this.cacheForm = Object.assign(this.cacheForm, form) getDbList() {
this.listLoading = true getDbList().then((res) => {
const params = Object.assign({}, this.cacheForm) this.dbList = res.data
for (let key in params) { if (this.dbList[0]) {
if (params[key] === "") { this.dbId = this.dbList[0].id
delete params[key] this.getTableList()
} }
})
},
getListIdx(list, id) {
let listIdx = -1
for (var i = 0; i < list.length; i++) {
if (list[i].id === id) {
listIdx = i
break
} }
params.current = this.pageIndex
params.size = this.pageSize
getFieldPage(params).then((res) => {
this.listLoading = false
if (res.code === 1) {
const d = res.data
this.tableData = d.records || []
this.total = Number(d.total)
} }
}) return listIdx
}, },
}, },
created() { mounted() {
this.handleFormSearch() this.getDbList()
}, },
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.drawer__container { .el-main {
padding: 0 20px; padding: 0 20px;
.drawer__content { }
height: calc(100vh - #{"160px"});
overflow-y: auto;
::v-deep .el-input-number { .page-main {
width: 100%; align-items: flex-start;
}
&::-webkit-scrollbar {
width: 0px;
height: 0px;
}
&::-webkit-scrollbar-thumb {
background-color: #fff;
}
}
.footer {
margin-top: 20px;
display: flex;
button {
flex: 1;
}
}
} }
</style> </style>
...@@ -18,10 +18,10 @@ ...@@ -18,10 +18,10 @@
@change="tableCodeChange" @change="tableCodeChange"
> >
<el-option <el-option
v-for="opt in dictMap['table']" v-for="opt in tableList"
:key="opt.value" :key="opt.code"
:label="opt.label" :label="opt.name"
:value="opt.value" :value="opt.code"
> >
</el-option> </el-option>
</el-select> </el-select>
...@@ -50,15 +50,19 @@ import { ...@@ -50,15 +50,19 @@ import {
getFormDetail, getFormDetail,
getHistoryInfo, getHistoryInfo,
} from "@/api/field" } from "@/api/field"
import { getTableList } from "@/api/database"
export default { export default {
name: "FormAdd", name: "FormAdd",
props: { props: {
formEdit: { formEdit: {
type: Object, type: Object,
}, },
dbId: {},
}, },
data() { data() {
return { return {
tableList: [],
disabled: false, disabled: false,
name: "", name: "",
options: {}, options: {},
...@@ -70,11 +74,17 @@ export default { ...@@ -70,11 +74,17 @@ export default {
}, },
methods: { methods: {
getTableList() {
if (!this.dbId) return
getTableList(this.dbId).then((res) => {
this.tableList = res.data
})
},
// 获取数据表字段 // 获取数据表字段
tableCodeChange(tableCode) { tableCodeChange(tableCode) {
if (!tableCode) return if (!tableCode) return
this.$refs.form.customFieldsLoading = this.disabled = true this.$refs.form.customFieldsLoading = this.disabled = true
const tableList = this.dictMap["table"] const tableList = this.tableList
this.tableName = this.tableName =
tableList.find((_) => _.value === tableCode) && tableList.find((_) => _.value === tableCode) &&
tableList.find((_) => _.value === tableCode).label tableList.find((_) => _.value === tableCode).label
...@@ -84,11 +94,14 @@ export default { ...@@ -84,11 +94,14 @@ export default {
const customOldFields = [] const customOldFields = []
const d = res.data const d = res.data
d.forEach((item) => { d.forEach((item) => {
if (!item.jsonStr) return
const field = JSON.parse(item.jsonStr) const field = JSON.parse(item.jsonStr)
if (field.id) delete field.id if (field.id) delete field.id
customOldFields.push({ customOldFields.push({
...field, ...field,
tableName: item.tableName, tableName: item.tableName,
tableCode: item.tableCode,
tableId: item.tableId,
}) })
}) })
...@@ -120,6 +133,7 @@ export default { ...@@ -120,6 +133,7 @@ export default {
id: this.formEdit.id, id: this.formEdit.id,
formJson: "", formJson: "",
name: this.name, name: this.name,
dbId: this.dbId,
} }
let fieldList = [] let fieldList = []
form["formJson"] = await this.$refs.form.getData("string") form["formJson"] = await this.$refs.form.getData("string")
...@@ -202,6 +216,7 @@ export default { ...@@ -202,6 +216,7 @@ export default {
}, },
created() { created() {
this.initForm() this.initForm()
this.getTableList()
}, },
} }
</script> </script>
......
<template> <template>
<div class="container"> <div class="container">
<form-add v-if="isAdd" @back="back" :form-edit="formEdit"></form-add> <form-add
v-if="isAdd"
@back="back"
:form-edit="formEdit"
:dbId="dbId"
></form-add>
<form-history <form-history
v-else-if="isHistory" v-else-if="isHistory"
@back="back" @back="back"
:source-id="sourceId" :source-id="sourceId"
></form-history> ></form-history>
<div v-else> <div v-else>
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane
:label="item.name"
:name="'index' + index"
v-for="(item, index) in dbList"
:key="item.id"
>{{
}}</el-tab-pane>
</el-tabs>
<direct-search <direct-search
ref="form" ref="form"
:forms="searchList" :forms="searchList"
...@@ -40,6 +54,7 @@ import paginationMixin from "@/components/TabComponents/mixin" ...@@ -40,6 +54,7 @@ import paginationMixin from "@/components/TabComponents/mixin"
import FormAdd from "./FormAdd" import FormAdd from "./FormAdd"
import FormHistory from "./FormHistory.vue" import FormHistory from "./FormHistory.vue"
import { getFormPage, delForm, copyForm } from "@/api/field.js" import { getFormPage, delForm, copyForm } from "@/api/field.js"
import { getDbList } from "@/api/database"
export default { export default {
components: { components: {
FormAdd, FormAdd,
...@@ -48,6 +63,9 @@ export default { ...@@ -48,6 +63,9 @@ export default {
name: "FormConfig", name: "FormConfig",
data() { data() {
return { return {
activeName: "index0",
dbList: [],
dbId: null,
listLoading: false, listLoading: false,
isAdd: false, isAdd: false,
isHistory: false, isHistory: false,
...@@ -174,6 +192,11 @@ export default { ...@@ -174,6 +192,11 @@ export default {
mixins: [paginationMixin], mixins: [paginationMixin],
methods: { methods: {
handleTabClick({ index }) {
this.dbId = this.dbList[index].id
this.handleFormSearch()
},
handleHistory({ id, version }) { handleHistory({ id, version }) {
this.sourceId = id || "" this.sourceId = id || ""
this.isHistory = true this.isHistory = true
...@@ -187,6 +210,7 @@ export default { ...@@ -187,6 +210,7 @@ export default {
const data = { const data = {
name, name,
id: this.formId, id: this.formId,
dbId: this.dbId,
} }
copyForm(data).then((res) => { copyForm(data).then((res) => {
this.$message.success("复制成功") this.$message.success("复制成功")
...@@ -233,7 +257,12 @@ export default { ...@@ -233,7 +257,12 @@ export default {
handleSearch(form) { handleSearch(form) {
this.cacheForm = Object.assign(this.cacheForm, form) this.cacheForm = Object.assign(this.cacheForm, form)
this.listLoading = true this.listLoading = true
const params = Object.assign({}, this.cacheForm) const params = Object.assign(
{
dbId: this.dbId,
},
this.cacheForm
)
for (let key in params) { for (let key in params) {
if (params[key] === "") { if (params[key] === "") {
delete params[key] delete params[key]
...@@ -250,9 +279,19 @@ export default { ...@@ -250,9 +279,19 @@ export default {
} }
}) })
}, },
getDbList() {
getDbList().then((res) => {
this.dbList = res.data
if (this.dbList[0]) {
this.dbId = this.dbList[0].id
}
this.handleFormSearch()
})
},
}, },
created() { created() {
this.handleFormSearch() this.getDbList()
}, },
} }
</script> </script>
<template>
<div class="container">
<direct-search
ref="form"
:label-position="'right'"
:forms="searchList"
:style="{ textAlign: 'left' }"
@handleSearch="handleFormSearch"
/>
<el-table-self
ref="table"
:table-data="tableData"
:columns="columns"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
:sortChange="sortChange"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
</template>
<script>
import { getLogPage } from "@/api/user";
import directSearch from "@/components/FormComponents/directSearch";
import elTableSelf from "@/components/TabComponents/index";
import paginationMixin from "@/components/TabComponents/mixin";
export default {
name: "Log",
mixins: [paginationMixin],
components: {
elTableSelf,
directSearch,
},
data() {
return {
formEdit: {},
title: "",
// 查询列表
searchList: [
{
label: "操作名称",
type: "input",
prop: "title",
placeholder: "请输入操作名称",
},
{
label: "请求方式",
type: "input",
prop: "method",
placeholder: "请输入请求方式",
},
{
label: "参数",
type: "input",
prop: "params",
placeholder: "请输入参数",
},
{
type: "button",
icon: "el-icon-search",
value: "查询",
},
],
tableData: [],
listLoading: false,
columns: [
{
label: "操作名称",
value: "title",
minWidth: 220,
},
{
label: "用户IP",
value: "remoteAddr",
minWidth: 180,
},
{
label: "操作人",
value: "createBy",
minWidth: 180,
},
{
label: "代理",
value: "userAgent",
minWidth: 220,
},
{
label: "请求路径",
value: "requestUri",
minWidth: 150,
},
{
label: "请求方式",
value: "method",
minWidth: 100,
},
{
label: "请求参数",
value: "params",
minWidth: 150,
},
{
label: "异常",
value: "exception",
minWidth: 150,
},
{
label: "操作时间",
value: "createTime",
minWidth: 150,
sortable: "custom",
},
],
cacheForm: {},
};
},
methods: {
sortChange({ prop, order }) {
const asc = order ? (order === "ascending" ? true : false) : "";
const column = order ? prop : "";
if (column) {
this.handleSearch({
"orders[0].asc": asc,
"orders[0].column": this.$handle.toUnderline(column),
});
} else {
delete this.cacheForm["orders[0].asc"];
delete this.cacheForm["orders[0].column"];
this.handleSearch();
}
},
// 查询
handleFormSearch(form) {
this.pageIndex = 1;
this.handleSearch(form);
},
// 数据page
handleSearch(form = {}) {
this.cacheForm = Object.assign(this.cacheForm, form);
this.listLoading = true;
const params = Object.assign({}, this.cacheForm);
for (let key in params) {
if (params[key] === "") {
delete params[key];
}
}
params.current = this.pageIndex;
params.size = this.pageSize;
getLogPage(params).then((res) => {
if (res.code === 1) {
const d = res.data;
let total = 0;
let result = [];
if (d && d.total > 0) {
result = d.records;
total = d.total;
}
this.tableData = result;
this.total = total;
this.listLoading = false;
}
});
},
},
mounted() {
this.handleFormSearch();
},
};
</script>
<style lang="scss"></style>
<template>
<div id="medicalunion-management">
<div class="top-btn">
<el-button type="primary" class="btn" @click="addMedical">添加</el-button>
</div>
<div class="bot-table">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:show-index="true"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
<el-dialog :visible.sync="addVisible" width="520px" :show-close="true">
<div class="title">添加医联体</div>
<el-form
ref="form"
:model="form"
:label-position="'right'"
label-width="110px"
label-suffix=":"
>
<el-form-item
v-for="(item, index) in formList"
:key="index"
:label="item.label"
:rules="[{ required: true, message: item.label + '不能为空' }]"
:prop="item.prop"
>
<el-input
v-if="item.type == 'input'"
v-model="form[item.prop]"
autocomplete="off"
:placeholder="'请填写' + item.label"
></el-input>
<el-select
v-if="item.type == 'select'"
v-model="form[item.prop]"
:placeholder="'请选择' + item.label"
@change="changeCity(item.prop)"
>
<el-option
v-for="e in item.selectGroup"
:key="e.value"
:label="e.label"
:value="e.label"
></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="f-btn" type="primary" @click="submit()"
>保存</el-button
>
</span>
</el-dialog>
<!-- 删除提示框 -->
<el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
<span>确定删除吗?</span>
<span slot="footer" class="dialog-footers">
<el-button @click="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDelete">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import {
addMedicalunion,
medicalunionList,
deleteUnion,
} from "@/api/medicalunion-management"
import cityList from "@/data/city"
export default {
components: {
CustomsTable,
},
mixins: [paginationMixin],
data() {
return {
deleteVisible: false,
addVisible: false,
listLoading: false,
columns: [
{
label: "医联体名称",
minWidth: 120,
value: "unionName",
},
{
label: "医联体编号",
minWidth: 120,
value: "unionNo",
},
{
label: "",
minWidth: 120,
value: "province",
},
{
label: "",
minWidth: 120,
value: "city",
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.editMedical,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deleteFunc,
style: {
color: "#FA6400",
},
formatter(row) {
return {
label: "删除",
type: "text",
}
},
},
],
},
],
tableData: [],
formList: [
{
type: "input",
label: "医联体名称",
prop: "unionName",
},
{
type: "input",
label: "医联体编号",
prop: "unionNo",
},
{
type: "select",
label: "",
prop: "province",
selectGroup: cityList,
},
{
type: "select",
label: "",
prop: "city",
selectGroup: [],
},
],
form: {},
deleteId: "",
}
},
watch: {},
mounted() {
this.getMedicalunionList()
console.log(cityList)
},
methods: {
// 获取list
getMedicalunionList() {
this.listLoading = true
medicalunionList({
size: this.pageSize,
current: this.pageIndex,
}).then((res) => {
if (res.code == 1) {
this.total = res.data.total
this.tableData = res.data.records
this.listLoading = false
}
})
},
// 添加医联体
addMedical() {
if (this.$refs["form"]) {
this.clearForm()
}
this.addVisible = true
},
// 编辑医联体
editMedical(data) {
console.log(data)
this.form = { ...data }
this.addVisible = true
let value = this.form["province"]
cityList.forEach((e) => {
if (e.label == value) {
this.formList[3].selectGroup = e.children
if (e.children[0].label == "市辖区") {
this.formList[3].selectGroup[0].label = e.label
}
}
})
},
submit() {
this.$refs["form"].validate((valid) => {
if (valid) {
addMedicalunion(this.form).then((res) => {
if (res.code == 1) {
this.$message.success("添加成功")
this.addVisible = false
this.page = 1
this.getMedicalunionList()
}
})
} else {
// console.log("error submit!!")
return false
}
})
},
// 删除
deleteFunc(data) {
console.log(data)
this.deleteVisible = true
this.deleteId = data.id
},
clearForm() {
this.form = {}
this.$refs["form"].resetFields()
},
confirmDelete() {
this.deleteVisible = false
deleteUnion(this.deleteId)
.then((res) => {
if (res.code == 1) {
this.$message.success("删除成功")
this.getMedicalunionList()
}
})
.catch(() => {})
},
// 省份变化改变城市
changeCity(val) {
console.log(val)
if (val == "province") {
delete this.form["city"]
// console.log(this.form["province"])
let value = this.form["province"]
cityList.forEach((e) => {
if (e.label == value) {
this.formList[3].selectGroup = e.children
if (e.children[0].label == "市辖区") {
this.formList[3].selectGroup[0].label = e.label
}
}
})
}
},
},
}
</script>
<style lang="scss" scoped>
#medicalunion-management {
padding: 20px;
.top-btn {
.btn {
width: 80px;
height: 32px;
background: #4e68ff;
border-radius: 4px;
}
}
.bot-table {
margin-top: 20px;
}
.title {
text-align: center;
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
margin-bottom: 30px;
}
}
::v-deep .el-dialog__body {
padding: 0 40px;
border-top: none;
}
::v-deep .el-dialog__footer {
border-top: none;
text-align: center;
.f-btn {
width: 100px;
height: 32px;
background: #4e68ff;
}
}
</style>
<template>
<div id="medicalunion-management">
<div class="top-btn">
<el-button type="primary" class="btn" @click="addMedical">添加</el-button>
</div>
<div class="bot-table">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
<el-dialog
:visible.sync="addVisible"
width="520px"
:show-close="true"
@closed="resetForm"
>
<div class="title">{{ readOnly ? "查看" : "添加" }}</div>
<el-form
ref="form"
:model="form"
:label-position="'right'"
label-width="110px"
label-suffix=":"
:disabled="readOnly"
>
<el-form-item
v-for="(item, index) in formList"
:key="index"
:label="item.label"
:prop="item.prop"
:rules="[{ required: true, message: item.label + '不能为空' }]"
>
<!-- <template v-if="!readOnly"> -->
<template>
<!-- 输入框 -->
<el-input
v-if="item.type == 'input'"
v-model="form[item.prop]"
autocomplete="off"
:placeholder="'请填写' + item.label"
></el-input>
<!-- 下拉选 -->
<el-select
v-else-if="item.type == 'select'"
v-model="form[item.prop]"
:placeholder="'请选择' + item.label"
style="width: 100%"
>
<el-option
v-for="e in item.selectGroup"
:key="e.value"
:label="e.label"
:value="e.value"
></el-option>
</el-select>
<!-- 上传 -->
<el-upload-self
v-else-if="item.type === 'upload'"
v-model="form[item.prop]"
:btn-type="'text'"
v-bind="item"
:list-type="item.listType"
:accept="item.accept"
:limit="item.limit"
:disabled="readOnly"
></el-upload-self>
<!-- switch -->
<!-- switch切换 启用 -->
<el-switch
v-else-if="item.type === 'switch'"
v-model="form[item.prop]"
:active-value="1"
:inactive-value="0"
>
</el-switch>
</template>
<!-- <template v-else>
<span>{{ form[item.prop] || "--" }}</span>
</template> -->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="f-btn" type="primary" @click="submitForm('3')"
>保存</el-button
>
</span>
</el-dialog>
<!-- 删除提示框 -->
<el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
<span>确定删除吗?</span>
<span slot="footer" class="dialog-footers">
<el-button @click="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDelete">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import ElUploadSelf from "@/components/UploadForOperation"
import mixin from "./mixin"
import { articleList } from "@/api/operation-management"
export default {
components: {
CustomsTable,
ElUploadSelf,
},
mixins: [paginationMixin, mixin],
data() {
return {
addVisible: false,
listLoading: false,
deleteVisible: false,
columns: [
{
label: "标题",
minWidth: 120,
value: "articleTitle",
},
{
label: "文件",
minWidth: 120,
type: "file",
value: "filePath",
},
{
label: "上传时间",
minWidth: 120,
value: "uploadTime",
},
{
label: "最新修改时间",
minWidth: 120,
value: "updateTime",
},
{
label: "上传人姓名",
minWidth: 120,
value: "uploadUserName",
},
{
label: "启用状态",
minWidth: 120,
type: "switch",
value: "status",
func: this.openChage,
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.viewMedical,
formatter(row) {
return {
label: "查看",
type: "text",
}
},
},
{
func: this.editMedical,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deleteFunc,
style: {
color: "#FA6400",
},
formatter(row) {
return {
label: "删除",
type: "text",
}
},
},
],
},
],
tableData: [
// {
// title: "第一个",
// isOpen: true,
// },
],
formList: [
{
type: "input",
label: "标题",
prop: "articleTitle",
},
{
type: "upload",
label: "PDF",
prop: "filePath",
accept: "application/pdf",
},
{
type: "switch",
label: "启用状态",
prop: "status",
},
],
}
},
watch: {},
mounted() {
this.getArticleList()
},
methods: {
// 获取新闻会议
getArticleList() {
this.listLoading = true
let params = {
size: this.pageSize,
current: this.pageIndex,
moduleType: "3",
}
articleList(params)
.then((res) => {
if (res.code == 1) {
this.tableData = [...res.data.records]
this.total = res.data.total
this.listLoading = false
}
})
.catch((e) => {
this.listLoading = false
})
},
},
}
</script>
<style lang="scss" scoped>
#medicalunion-management {
padding: 20px 0;
.top-btn {
.btn {
width: 80px;
height: 32px;
background: #4e68ff;
border-radius: 4px;
}
}
.bot-table {
margin-top: 20px;
}
.title {
text-align: center;
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
margin-bottom: 30px;
}
}
::v-deep .el-dialog__body {
padding: 0 40px;
border-top: none;
}
::v-deep .el-dialog__footer {
border-top: none;
text-align: center;
.f-btn {
width: 100px;
height: 32px;
background: #4e68ff;
}
}
</style>
<template>
<div id="medicalunion-management">
<div class="top-btn">
<el-select v-model="selectType" @change="getArticleList">
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-button type="primary" class="btn" @click="addMedical">添加</el-button>
</div>
<div class="bot-table">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
<el-dialog
:visible.sync="addVisible"
width="520px"
:show-close="true"
@closed="resetForm"
>
<div class="title">{{ readOnly ? "查看" : "添加" }}</div>
<el-form
ref="form"
:model="form"
:label-position="'right'"
label-width="110px"
label-suffix=":"
:disabled="readOnly"
>
<el-form-item
v-for="(item, index) in formList"
:key="index"
:label="item.label"
:prop="item.prop"
:rules="[{ required: true, message: item.label + '不能为空' }]"
>
<!-- <template v-if="!readOnly"> -->
<template>
<!-- 输入框 -->
<el-input
v-if="item.type == 'input'"
v-model="form[item.prop]"
autocomplete="off"
:placeholder="'请填写' + item.label"
></el-input>
<!-- 下拉选 -->
<el-select
v-else-if="item.type == 'select'"
v-model="form[item.prop]"
:placeholder="'请选择' + item.label"
style="width: 100%"
>
<el-option
v-for="e in item.selectGroup"
:key="e.value"
:label="e.label"
:value="e.value"
></el-option>
</el-select>
<!-- 上传 -->
<el-upload-self
v-else-if="item.type === 'upload'"
v-model="form[item.prop]"
:btn-type="'text'"
v-bind="item"
:list-type="item.listType"
:accept="item.accept"
:limit="item.limit"
:disabled="readOnly"
></el-upload-self>
<!-- switch -->
<!-- switch切换 启用 -->
<el-switch
v-else-if="item.type === 'switch'"
v-model="form[item.prop]"
:active-value="1"
:inactive-value="0"
>
</el-switch>
</template>
<!-- <template v-else>
<span>{{ form[item.prop] || "--" }}</span>
</template> -->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="f-btn" type="primary" @click="submitForm('4')"
>保存</el-button
>
</span>
</el-dialog>
<!-- 删除提示框 -->
<el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
<span>确定删除吗?</span>
<span slot="footer" class="dialog-footers">
<el-button @click="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDelete">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import ElUploadSelf from "@/components/UploadForOperation"
import mixin from "./mixin"
import { articleList } from "@/api/operation-management"
export default {
components: {
CustomsTable,
ElUploadSelf,
},
mixins: [paginationMixin, mixin],
data() {
return {
// readOnly: true,
// addVisible: false,
// deleteVisible: false,
selectList: [
{
label: "筛查",
value: "0",
},
{
label: "生活",
value: "1",
},
{
label: "医学知识",
value: "2",
},
{
label: "其他",
value: "3",
},
],
selectType: "0",
listLoading: false,
columns: [
{
label: "标题",
minWidth: 120,
value: "articleTitle",
},
{
label: "图片",
type: "img",
minWidth: 120,
value: "imgPath",
},
{
label: "文件",
minWidth: 120,
type: "file",
value: "filePath",
},
{
label: "上传时间",
minWidth: 120,
value: "uploadTime",
},
{
label: "最新修改时间",
minWidth: 120,
value: "updateTime",
},
{
label: "上传人姓名",
minWidth: 120,
value: "uploadUserName",
},
{
label: "启用状态",
minWidth: 120,
type: "switch",
value: "status",
func: this.openChage,
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.viewMedical,
formatter(row) {
return {
label: "查看",
type: "text",
}
},
},
{
func: this.editMedical,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deleteFunc,
style: {
color: "#FA6400",
},
formatter(row) {
return {
label: "删除",
type: "text",
}
},
},
],
},
],
tableData: [
{
title: "第一个",
isOpen: true,
},
],
formList: [
{
type: "select",
label: "类型",
prop: "articleType",
selectGroup: [
{
label: "筛查",
value: "1",
},
{
label: "生活",
value: "2",
},
{
label: "医学知识",
value: "3",
},
{
label: "其他",
value: "4",
},
],
},
{
type: "input",
label: "标题",
prop: "articleTitle",
},
{
type: "upload",
label: "图片",
prop: "imgPath",
listType: "picture-card",
},
{
type: "upload",
label: "PDF",
prop: "filePath",
accept: "application/pdf",
},
{
type: "switch",
label: "启用状态",
prop: "status",
},
],
// form: {
// status: 1,
// },
}
},
watch: {},
mounted() {
this.getArticleList()
},
methods: {
// 获取健康科普
getArticleList() {
this.listLoading = true
let params = {
size: this.pageSize,
current: this.pageIndex,
moduleType: "4",
articleType: this.selectType - 0 + 1,
}
articleList(params)
.then((res) => {
if (res.code == 1) {
this.tableData = [...res.data.records]
this.total = res.data.total
this.listLoading = false
}
})
.catch((e) => {
this.listLoading = false
})
},
},
}
</script>
<style lang="scss" scoped>
#medicalunion-management {
padding: 20px 0;
.top-btn {
.btn {
width: 80px;
height: 32px;
background: #4e68ff;
border-radius: 4px;
margin-left: 20px;
}
}
.bot-table {
margin-top: 20px;
}
.title {
text-align: center;
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
margin-bottom: 30px;
}
}
::v-deep .el-dialog__body {
padding: 0 40px;
border-top: none;
}
::v-deep .el-dialog__footer {
border-top: none;
text-align: center;
.f-btn {
width: 100px;
height: 32px;
background: #4e68ff;
}
}
</style>
<template>
<div id="medicalunion-management">
<div class="top-btn">
<el-button type="primary" class="btn" @click="addMedical">添加</el-button>
</div>
<div class="bot-table">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
<el-dialog
:visible.sync="addVisible"
width="520px"
:show-close="true"
@closed="resetForm"
>
<div class="title">{{ readOnly ? "查看" : "添加" }}</div>
<el-form
ref="form"
:model="form"
:label-position="'right'"
label-width="110px"
label-suffix=":"
:disabled="readOnly"
>
<el-form-item
v-for="(item, index) in formList"
:key="index"
:label="item.label"
:prop="item.prop"
:rules="[{ required: true, message: item.label + '不能为空' }]"
>
<!-- <template v-if="!readOnly"> -->
<template>
<!-- 输入框 -->
<el-input
v-if="item.type == 'input'"
v-model="form[item.prop]"
autocomplete="off"
:placeholder="'请填写' + item.label"
></el-input>
<!-- 下拉选 -->
<el-select
v-else-if="item.type == 'select'"
v-model="form[item.prop]"
:placeholder="'请选择' + item.label"
style="width: 100%"
>
<el-option
v-for="e in item.selectGroup"
:key="e.value"
:label="e.label"
:value="e.value"
></el-option>
</el-select>
<!-- 上传 -->
<el-upload-self
v-else-if="item.type === 'upload'"
v-model="form[item.prop]"
:btn-type="'text'"
v-bind="item"
:list-type="item.listType"
:accept="item.accept"
:limit="item.limit"
:disabled="readOnly"
></el-upload-self>
<!-- switch -->
<!-- switch切换 启用 -->
<el-switch
v-else-if="item.type === 'switch'"
v-model="form[item.prop]"
:active-value="1"
:inactive-value="0"
>
</el-switch>
</template>
<!-- <template v-else>
<span>{{ form[item.prop] || "--" }}</span>
</template> -->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="f-btn" type="primary" @click="submitForm('1')"
>保存</el-button
>
</span>
</el-dialog>
<!-- 删除提示框 -->
<el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
<span>确定删除吗?</span>
<span slot="footer" class="dialog-footers">
<el-button @click="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDelete">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import ElUploadSelf from "@/components/UploadForOperation"
import mixin from "./mixin"
import { articleList } from "@/api/operation-management"
export default {
components: {
CustomsTable,
ElUploadSelf,
},
mixins: [paginationMixin, mixin],
data() {
return {
addVisible: false,
listLoading: false,
deleteVisible: false,
columns: [
{
label: "标题",
minWidth: 120,
value: "articleTitle",
},
{
label: "文件",
minWidth: 120,
type: "file",
value: "filePath",
},
{
label: "上传时间",
minWidth: 120,
value: "uploadTime",
},
{
label: "最新修改时间",
minWidth: 120,
value: "updateTime",
},
{
label: "上传人姓名",
minWidth: 120,
value: "uploadUserName",
},
{
label: "启用状态",
minWidth: 120,
type: "switch",
value: "status",
func: this.openChage,
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.viewMedical,
formatter(row) {
return {
label: "查看",
type: "text",
}
},
},
{
func: this.editMedical,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deleteFunc,
style: {
color: "#FA6400",
},
formatter(row) {
return {
label: "删除",
type: "text",
}
},
},
],
},
],
tableData: [
// {
// title: "第一个",
// isOpen: true,
// },
],
formList: [
{
type: "input",
label: "标题",
prop: "articleTitle",
},
{
type: "upload",
label: "PDF",
prop: "filePath",
accept: "application/pdf",
},
{
type: "switch",
label: "启用状态",
prop: "status",
},
],
}
},
watch: {},
mounted() {
this.getArticleList()
},
methods: {
// 获取新闻会议
getArticleList() {
this.listLoading = true
let params = {
size: this.pageSize,
current: this.pageIndex,
moduleType: "1",
}
articleList(params)
.then((res) => {
if (res.code == 1) {
this.tableData = [...res.data.records]
this.total = res.data.total
this.listLoading = false
}
})
.catch((e) => {
this.listLoading = false
})
},
},
}
</script>
<style lang="scss" scoped>
#medicalunion-management {
padding: 20px 0;
.top-btn {
.btn {
width: 80px;
height: 32px;
background: #4e68ff;
border-radius: 4px;
}
}
.bot-table {
margin-top: 20px;
}
.title {
text-align: center;
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
margin-bottom: 30px;
}
}
::v-deep .el-dialog__body {
padding: 0 40px;
border-top: none;
}
::v-deep .el-dialog__footer {
border-top: none;
text-align: center;
.f-btn {
width: 100px;
height: 32px;
background: #4e68ff;
}
}
</style>
<template>
<div id="medicalunion-management">
<div class="top-btn">
<el-button type="primary" class="btn" @click="addMedical">添加</el-button>
</div>
<div class="bot-table">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
<el-dialog
:visible.sync="addVisible"
width="520px"
:show-close="true"
@closed="resetForm"
>
<div class="title">{{ readOnly ? "查看" : "添加" }}</div>
<el-form
ref="form"
:model="form"
:label-position="'right'"
label-width="110px"
label-suffix=":"
:disabled="readOnly"
>
<el-form-item
v-for="(item, index) in formList"
:key="index"
:label="item.label"
:prop="item.prop"
:rules="[{ required: true, message: item.label + '不能为空' }]"
>
<!-- <template v-if="!readOnly"> -->
<template>
<!-- 输入框 -->
<el-input
v-if="item.type == 'input'"
v-model="form[item.prop]"
autocomplete="off"
:placeholder="'请填写' + item.label"
></el-input>
<!-- 下拉选 -->
<el-select
v-else-if="item.type == 'select'"
v-model="form[item.prop]"
:placeholder="'请选择' + item.label"
style="width: 100%"
>
<el-option
v-for="e in item.selectGroup"
:key="e.value"
:label="e.label"
:value="e.value"
></el-option>
</el-select>
<!-- 上传 -->
<el-upload-self
v-else-if="item.type === 'upload'"
v-model="form[item.prop]"
:btn-type="'text'"
v-bind="item"
:list-type="item.listType"
:accept="item.accept"
:limit="item.limit"
:disabled="readOnly"
></el-upload-self>
<!-- switch -->
<!-- switch切换 启用 -->
<el-switch
v-else-if="item.type === 'switch'"
v-model="form[item.prop]"
:active-value="1"
:inactive-value="0"
>
</el-switch>
</template>
<!-- <template v-else>
<span>{{ form[item.prop] || "--" }}</span>
</template> -->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="f-btn" type="primary" @click="submitForm('2')"
>保存</el-button
>
</span>
</el-dialog>
<!-- 删除提示框 -->
<el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
<span>确定删除吗?</span>
<span slot="footer" class="dialog-footers">
<el-button @click="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDelete">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import ElUploadSelf from "@/components/UploadForOperation"
import mixin from "./mixin"
import { articleList } from "@/api/operation-management"
export default {
components: {
CustomsTable,
ElUploadSelf,
},
mixins: [paginationMixin, mixin],
data() {
return {
addVisible: false,
listLoading: false,
deleteVisible: false,
columns: [
{
label: "标题",
minWidth: 120,
value: "articleTitle",
},
{
label: "文件",
minWidth: 120,
type: "file",
value: "filePath",
},
{
label: "上传时间",
minWidth: 120,
value: "uploadTime",
},
{
label: "最新修改时间",
minWidth: 120,
value: "updateTime",
},
{
label: "上传人姓名",
minWidth: 120,
value: "uploadUserName",
},
{
label: "启用状态",
minWidth: 120,
type: "switch",
value: "status",
func: this.openChage,
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.viewMedical,
formatter(row) {
return {
label: "查看",
type: "text",
}
},
},
{
func: this.editMedical,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deleteFunc,
style: {
color: "#FA6400",
},
formatter(row) {
return {
label: "删除",
type: "text",
}
},
},
],
},
],
tableData: [
// {
// title: "第一个",
// isOpen: true,
// },
],
formList: [
{
type: "input",
label: "标题",
prop: "articleTitle",
},
{
type: "upload",
label: "PDF",
prop: "filePath",
accept: "application/pdf",
},
{
type: "switch",
label: "启用状态",
prop: "status",
},
],
}
},
watch: {},
mounted() {
this.getArticleList()
},
methods: {
// 获取新闻会议
getArticleList() {
this.listLoading = true
let params = {
size: this.pageSize,
current: this.pageIndex,
moduleType: "2",
}
articleList(params)
.then((res) => {
if (res.code == 1) {
this.tableData = [...res.data.records]
this.total = res.data.total
this.listLoading = false
}
})
.catch((e) => {
this.listLoading = false
})
},
},
}
</script>
<style lang="scss" scoped>
#medicalunion-management {
padding: 20px 0;
.top-btn {
.btn {
width: 80px;
height: 32px;
background: #4e68ff;
border-radius: 4px;
}
}
.bot-table {
margin-top: 20px;
}
.title {
text-align: center;
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
margin-bottom: 30px;
}
}
::v-deep .el-dialog__body {
padding: 0 40px;
border-top: none;
}
::v-deep .el-dialog__footer {
border-top: none;
text-align: center;
.f-btn {
width: 100px;
height: 32px;
background: #4e68ff;
}
}
</style>
import {
articleEnable,
deleteArticle,
addArticle,
} from "@/api/operation-management"
const mixin = {
data() {
return {
readOnly: true,
addVisible: false,
deleteVisible: false,
deleteId: "",
form: {
status: 1,
},
}
},
methods: {
// 添加文章
addMedical() {
this.readOnly = false
this.addVisible = true
},
// 查看
viewMedical(data) {
this.readOnly = true
this.form = { ...data }
this.addVisible = true
},
// 编辑医联体
editMedical(data) {
this.readOnly = false
this.form = JSON.parse(JSON.stringify(data))
this.addVisible = true
},
// 启用状态
openChage(data, index) {
console.log(data, index)
let params = {
id: data.id,
status: data.status ? 1 : 0,
}
articleEnable(params).then((res) => {
if (res.code == 1) {
// this.$message.success("保存成功")
this.getArticleList()
}
})
},
resetForm() {
this.$refs["form"].resetFields()
this.form = {
status: 1,
}
},
submitForm(moduleType) {
this.$refs["form"].validate((valid) => {
if (valid) {
addArticle({
...this.form,
moduleType: moduleType,
}).then((res) => {
if (res.code == 1) {
this.addVisible = false
this.$refs["form"].resetFields()
this.form = {
status: 1,
}
this.getArticleList()
}
})
} else {
console.log("error submit!!")
return false
}
})
},
// 删除
deleteFunc(data) {
console.log(data)
this.deleteVisible = true
this.deleteId = data.id
},
// 确认删除
confirmDelete() {
this.deleteVisible = false
deleteArticle(this.deleteId)
.then((res) => {
if (res.code == 1) {
this.$message.success("删除成功")
this.getArticleList()
}
})
.catch(() => {})
},
},
}
export default mixin
<template>
<div id="medicalunion-management">
<div class="top-btn">
<el-select v-model="selectType">
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-button type="primary" class="btn" @click="addMedical">添加</el-button>
</div>
<div class="bot-table">
<customs-table
ref="table"
:table-data="tableData"
:columns="columns"
:header-class="'newHeader'"
:list-loading="listLoading"
:current-page="pageIndex"
:total-count="total"
:page-sizes="pageSizes"
:page-size="pageSize"
@pageSizeChange="handleSizeChange"
@currentPageChange="handleCurrentChange"
/>
</div>
<el-dialog
:visible.sync="addVisible"
width="520px"
:show-close="true"
@closed="resetForm"
>
<div class="title">{{ readOnly ? "查看" : "添加" }}</div>
<el-form
ref="form"
:model="form"
:label-position="'right'"
label-width="110px"
label-suffix=":"
:disabled="readOnly"
>
<el-form-item
v-for="(item, index) in formList"
:key="index"
:label="item.label"
:prop="item.prop"
:rules="[{ required: true, message: item.label + '不能为空' }]"
>
<!-- <template v-if="!readOnly"> -->
<template>
<!-- 输入框 -->
<el-input
v-if="item.type == 'input'"
v-model="form[item.prop]"
autocomplete="off"
:placeholder="'请填写' + item.label"
></el-input>
<!-- 下拉选 -->
<el-select
v-else-if="item.type == 'select'"
v-model="form[item.prop]"
:placeholder="'请选择' + item.label"
style="width: 100%"
>
<el-option
v-for="e in item.selectGroup"
:key="e.value"
:label="e.label"
:value="e.value"
></el-option>
</el-select>
<!-- 上传 -->
<el-upload-self
v-else-if="item.type === 'upload'"
v-model="form[item.prop]"
:btn-type="'text'"
v-bind="item"
:list-type="item.listType"
:accept="item.accept"
:limit="item.limit"
:disabled="readOnly"
></el-upload-self>
<!-- switch -->
<!-- switch切换 启用 -->
<el-switch
v-else-if="item.type === 'switch'"
v-model="form[item.prop]"
:active-value="1"
:inactive-value="0"
>
</el-switch>
</template>
<!-- <template v-else>
<span>{{ form[item.prop] || "--" }}</span>
</template> -->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="f-btn" type="primary" @click="submitForm('5')"
>保存</el-button
>
</span>
</el-dialog>
<!-- 删除提示框 -->
<el-dialog title="提示" :visible.sync="deleteVisible" width="30%">
<span>确定删除吗?</span>
<span slot="footer" class="dialog-footers">
<el-button @click="deleteVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDelete">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import ElUploadSelf from "@/components/UploadForOperation"
import mixin from "./mixin"
import { articleList } from "@/api/operation-management"
export default {
components: {
CustomsTable,
ElUploadSelf,
},
mixins: [paginationMixin, mixin],
data() {
return {
selectList: [
{
label: "筛查技术方案",
value: "1",
},
{
label: "筛查指南",
value: "2",
},
{
label: "学术成果",
value: "3",
},
{
label: "项目进展与成果",
value: "4",
},
],
selectType: "1",
listLoading: false,
columns: [
{
label: "标题",
minWidth: 120,
value: "articleTitle",
},
{
label: "文件",
minWidth: 120,
type: "file",
value: "filePath",
},
{
label: "上传时间",
minWidth: 120,
value: "uploadTime",
},
{
label: "最新修改时间",
minWidth: 120,
value: "updateTime",
},
{
label: "上传人姓名",
minWidth: 120,
value: "uploadUserName",
},
{
label: "启用状态",
minWidth: 120,
type: "switch",
value: "status",
func: this.openChage,
},
{
label: "操作",
width: 220,
fixed: "right",
operType: "button",
operations: [
{
func: this.viewMedical,
formatter(row) {
return {
label: "查看",
type: "text",
}
},
},
{
func: this.editMedical,
formatter(row) {
return {
label: "编辑",
type: "text",
}
},
},
{
func: this.deleteFunc,
style: {
color: "#FA6400",
},
formatter(row) {
return {
label: "删除",
type: "text",
}
},
},
],
},
],
tableData: [],
formList: [
{
type: "select",
label: "类型",
prop: "articleType",
selectGroup: [
{
label: "筛查技术方案",
value: "1",
},
{
label: "筛查指南",
value: "2",
},
{
label: "学术成果",
value: "3",
},
{
label: "项目进展与成果",
value: "4",
},
],
},
{
type: "input",
label: "标题",
prop: "articleTitle",
},
// {
// type: "upload",
// label: "图片",
// prop: "imgPath",
// listType: "picture-card",
// },
{
type: "upload",
label: "PDF",
prop: "filePath",
accept: "application/pdf",
},
{
type: "switch",
label: "启用状态",
prop: "status",
},
],
rules: {
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
},
form: {},
}
},
watch: {},
mounted() {
this.getArticleList()
},
methods: {
// 获取健康科普
getArticleList() {
this.listLoading = true
let params = {
size: this.pageSize,
current: this.pageIndex,
moduleType: "5",
}
articleList(params)
.then((res) => {
if (res.code == 1) {
this.tableData = [...res.data.records]
this.total = res.data.total
this.listLoading = false
}
})
.catch((e) => {
this.listLoading = false
})
},
},
}
</script>
<style lang="scss" scoped>
#medicalunion-management {
padding: 20px 0;
.top-btn {
.btn {
width: 80px;
height: 32px;
background: #4e68ff;
border-radius: 4px;
margin-left: 20px;
}
}
.bot-table {
margin-top: 20px;
}
.title {
text-align: center;
height: 26px;
font-size: 22px;
font-family: AlibabaPuHuiTiM;
color: rgba(0, 0, 0, 0.8);
line-height: 26px;
margin-bottom: 30px;
}
}
::v-deep .el-dialog__body {
padding: 0 40px;
border-top: none;
}
::v-deep .el-dialog__footer {
border-top: none;
text-align: center;
.f-btn {
width: 100px;
height: 32px;
background: #4e68ff;
}
}
</style>
<template>
<div id="operation-management">
<el-tabs v-model="curOperation" @tab-click="handleClick">
<el-tab-pane
v-for="(item, index) in operationList"
:key="index"
:label="item.name"
:name="item.name"
>
<component :is="item.component"></component>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import NewsMeeting from "@/views/systems/operation-management/components/NewsMeeting.vue"
import NoticeAnnouncement from "@/views/systems/operation-management/components/NoticeAnnouncement.vue"
import AcademicTrend from "@/views/systems/operation-management/components/AcademicTrend.vue"
import HealthPopularization from "@/views/systems/operation-management/components/HealthPopularization.vue"
import scientificResearch from "@/views/systems/operation-management/components/scientificResearch.vue"
export default {
components: {
NewsMeeting,
NoticeAnnouncement,
AcademicTrend,
HealthPopularization,
scientificResearch,
},
data() {
return {
curOperation: "新闻会议",
operationList: [
{
name: "新闻会议",
component: "NewsMeeting",
},
{
name: "通知公告",
component: "NoticeAnnouncement",
},
{
name: "学术动态",
component: "AcademicTrend",
},
{
name: "健康科普",
component: "HealthPopularization",
},
{
name: "科学研究",
component: "scientificResearch",
},
],
}
},
watch: {},
mounted() {},
methods: {
handleClick(tab, event) {
// console.log(tab, event)
},
},
}
</script>
<style lang="scss" scoped>
#operation-management {
padding: 20px;
::v-deep .el-tabs__nav-wrap::after {
background-color: #fff;
}
}
</style>
...@@ -20,21 +20,30 @@ ...@@ -20,21 +20,30 @@
@currentPageChange="handleCurrentChange" @currentPageChange="handleCurrentChange"
/> />
<dialog-form <dialog-form
ref="dialog"
width="750px" width="750px"
:close-modal="false" :close-modal="false"
ref="dialog"
:title="title" :title="title"
:form-edit="formEdit" :form-edit="formEdit"
:form-data="formData" :form-data="formData"
@handleConfirm="handleConfirm" @handleConfirm="handleConfirm"
></dialog-form> ></dialog-form>
<dialog-form <dialog-form
width="450px"
ref="role" ref="role"
width="450px"
title="角色授权" title="角色授权"
:form-data="formDataRole" :form-data="formDataRole"
@handleConfirm="handleRoleConfirm" @handleConfirm="handleRoleConfirm"
></dialog-form> ></dialog-form>
<dialog-form
ref="consortiaRole"
width="450px"
title="医联体授权"
:form-data="consortiaDataRole"
:current="current"
@handleConfirm="handleConsortiaConfirm"
@loadMore="loadMore"
></dialog-form>
</div> </div>
</template> </template>
...@@ -50,10 +59,12 @@ import { ...@@ -50,10 +59,12 @@ import {
resetPassword, resetPassword,
} from "@/api/user" } from "@/api/user"
import { getOrgList, getDepartPage } from "@/api/org" import { getOrgList, getDepartPage } from "@/api/org"
import { medicalunionList, baseUnion } from "@/api/medicalunion-management"
import { mapGetters } from "vuex" import { mapGetters } from "vuex"
export default { export default {
name: "user", name: "User",
mixins: [paginationMixin],
data() { data() {
const isAdmin = this.$store.getters["user/roles"].find( const isAdmin = this.$store.getters["user/roles"].find(
(_) => _.roleCode === "admin" (_) => _.roleCode === "admin"
...@@ -72,7 +83,6 @@ export default { ...@@ -72,7 +83,6 @@ export default {
}) })
} }
}) })
const orgList = [] const orgList = []
getOrgList().then((res) => { getOrgList().then((res) => {
if (res.code === 1) { if (res.code === 1) {
...@@ -95,6 +105,7 @@ export default { ...@@ -95,6 +105,7 @@ export default {
} }
return { return {
listLoading: false, listLoading: false,
current: 1,
isAdd: false, isAdd: false,
id: null, id: null,
// 查询列表 // 查询列表
...@@ -119,6 +130,7 @@ export default { ...@@ -119,6 +130,7 @@ export default {
func: this.handleAdd, func: this.handleAdd,
}, },
], ],
searchQuery: "",
columns: [ columns: [
{ {
label: "用户姓名", label: "用户姓名",
...@@ -131,7 +143,7 @@ export default { ...@@ -131,7 +143,7 @@ export default {
width: 80, width: 80,
formatter: (row) => { formatter: (row) => {
return this.$handle.formatDicList( return this.$handle.formatDicList(
this.dictMap["gender"], this.dictMap["d-sex"],
String(row.sex) String(row.sex)
) )
}, },
...@@ -201,6 +213,14 @@ export default { ...@@ -201,6 +213,14 @@ export default {
color: "#409EFF", color: "#409EFF",
}, },
}, },
{
func: this.handleConsortia,
icon: "el-icon-office-building",
label: "医联体授权",
style: {
color: "#67C23A",
},
},
{ {
func: this.handleReset, func: this.handleReset,
label: "重置密码", label: "重置密码",
...@@ -249,7 +269,7 @@ export default { ...@@ -249,7 +269,7 @@ export default {
spanCount: 12, spanCount: 12,
prop: "sex", prop: "sex",
optsFormatter: () => { optsFormatter: () => {
return this.dictMap && this.dictMap["gender"] return this.dictMap && this.dictMap["d-sex"]
}, },
}, },
{ {
...@@ -273,14 +293,12 @@ export default { ...@@ -273,14 +293,12 @@ export default {
prop: "orgId", prop: "orgId",
opts: orgList, opts: orgList,
func: this.orgChange, func: this.orgChange,
rules: [{ required: true, message: "请选择机构" }],
}, },
{ {
type: "select", type: "select",
label: "科室", label: "科室",
spanCount: 12, spanCount: 12,
prop: "deptId", prop: "deptId",
rules: [{ required: true, message: "请选择科室" }],
opts: [], opts: [],
}, },
{ {
...@@ -352,10 +370,25 @@ export default { ...@@ -352,10 +370,25 @@ export default {
multiple: true, multiple: true,
}, },
], ],
consortiaList: [],
consortiaDataRole: [
{
type: "remote",
label: "医联体",
placeholder: "请输入医联体",
prop: "consortiaList",
opts: [],
multiple: true,
remoteFunc: this.searchConsortia,
rules: [
{ required: true, message: "请选择医联体", trigger: "change" },
],
multiple: true,
},
],
originalList: [], originalList: [],
} }
}, },
mixins: [paginationMixin],
computed: { computed: {
...mapGetters({ ...mapGetters({
roles: "user/roles", roles: "user/roles",
...@@ -365,7 +398,60 @@ export default { ...@@ -365,7 +398,60 @@ export default {
return this.roles.find((_) => _.roleCode === "admin") return this.roles.find((_) => _.roleCode === "admin")
}, },
}, },
created() {
this.handleFormSearch()
this.loadMore()
},
methods: { methods: {
loadMore(current = 1) {
let params = {
current: current,
unionName: this.searchQuery ? this.searchQuery : undefined,
size: 20,
}
medicalunionList(params).then((res) => {
if (res.code === 1) {
const d = res.data.records || []
if (d.length > 0) {
this.current = res.data.current - 0
d.forEach((item) => {
this.consortiaList.push({
label: item.unionName,
value: item.id,
})
})
this.consortiaDataRole[0].opts = [...this.consortiaList]
}
}
})
},
searchConsortia(query) {
if (query !== "") {
// this.loading = true
this.searchQuery = query
console.log(query)
this.consortiaList = []
this.consortiaDataRole[0].opts = []
this.loadMore()
// this.consortiaList = []
} else {
this.options = []
}
},
handleConsortiaConfirm(unionIds) {
console.log(unionIds, this.rowId)
const data = {
userId: this.rowId,
unionIds: unionIds.consortiaList,
}
baseUnion(data).then((res) => {
if (res.code === 1) {
this.$message.success("授权成功")
this.handleSearch()
this.$refs.consortiaRole.close()
}
})
},
orgChange(orgId) { orgChange(orgId) {
const list = [] const list = []
this.$refs.dialog.initFields({ deptId: "" }) this.$refs.dialog.initFields({ deptId: "" })
...@@ -441,6 +527,10 @@ export default { ...@@ -441,6 +527,10 @@ export default {
} }
}) })
}, },
handleConsortia({ id }) {
this.rowId = id
this.$refs.consortiaRole.open()
},
handleRoleConfirm(form) { handleRoleConfirm(form) {
const data = { const data = {
roleList: this.originalList.concat(form.roleList).map((_) => { roleList: this.originalList.concat(form.roleList).map((_) => {
...@@ -478,7 +568,7 @@ export default { ...@@ -478,7 +568,7 @@ export default {
? { ? {
id, id,
name, name,
sex: String(sex), sex: sex ? String(sex) : "",
idCard, idCard,
phone, phone,
email, email,
...@@ -561,8 +651,5 @@ export default { ...@@ -561,8 +651,5 @@ export default {
this.$router.push(`detail?id=${row.id}`) this.$router.push(`detail?id=${row.id}`)
}, },
}, },
created() {
this.handleFormSearch()
},
} }
</script> </script>
...@@ -88,7 +88,8 @@ module.exports = { ...@@ -88,7 +88,8 @@ module.exports = {
}, },
proxy: { proxy: {
"/api": { "/api": {
target: "http://192.168.31.140:11021/", // target: "http://192.168.31.140:11021/",
target: "https://ds.cixincloud.com/geca-api/",
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
"^/api": "", "^/api": "",
......
```js
!实在是累的没办法了,只能在这里记住这些文件的层级关系
? FormItemSelf\ FormContent\
? FormItemText/ CustomForm/index——————views/screening/FormTab——————ConfigForms————index
*/
上一步下一步提交按钮触发:CustomForm/index 最终处理实在ConfigForms以及同级中的mixin
formId:表单id
formRecordId:记录数
数据在ConfigForms处理
```