Browse Source

feat:[模板管理][update]

lkf
luojie 1 month ago
parent
commit
43715f9f89
4 changed files with 159 additions and 51 deletions
  1. +20
    -0
      src/components/Template/BaseInfoFormPackage.vue
  2. +107
    -47
      src/components/Template/HandleFormItem.vue
  3. +8
    -1
      src/views/business/comps/template/comps/sp/SP0019.vue
  4. +24
    -3
      src/views/business/comps/template/formConfig/sp/SP0019.js

+ 20
- 0
src/components/Template/BaseInfoFormPackage.vue View File

@ -232,6 +232,23 @@
</div>
</div>
</template>
<template v-else-if="item.type === 'checkboxList'">
<div class="form-item ">
<div class="form-title fs-16" v-if="item.label">{{ $t( item.label) }}</div>
<div v-for="(sItem, key) in item.config" class="c-Item grid-container">
<div class="p-r-20 item-center">
<div class="form-title mr-20">{{ $t( sItem.label) }}</div>
<div class="flex flex1">
<HandleFormItem :field-item-label="fieldItemLabel" :field-key="prefixKey+'_'+key" type="checkboxList" :item="sItem" :value="formFields[key]"
@copy="onCopy(sItem, key)" @change="(e)=>onAttachmentChange(key, e)"
:error="errors[key]" @update:error="errors[key] = false"
:orange-bg="orangeBgFields[key]" />
</div>
</div>
</div>
</div>
</template>
</div>
</div>
@ -443,4 +460,7 @@ export default {
font-size: 14px;
margin-left: 5px;
}
.mr-20{
margin-right: 20px;
}
</style>

+ 107
- 47
src/components/Template/HandleFormItem.vue View File

@ -24,6 +24,16 @@
:class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')" v-model="inputValue"
:disabled="getDisabled()" :placeholder="getPlaceholder()" @change="onItemCheckboxChange">
</el-checkbox>
<div v-else-if="type === 'checkboxList'" class="flex1 checkbox-list-container"
:class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')">
<el-checkbox-group v-model="inputValue" @change="onInputChange">
<div v-for="option in item.options" :key="option.value" class="checkbox-item">
<el-checkbox :label="option.value" :disabled="getDisabled()">
{{ option.label }}
</el-checkbox>
</div>
</el-checkbox-group>
</div>
<el-date-picker v-else-if="type === 'dateTime'" type="datetime" class="flex1"
:class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')" v-model="inputValue"
:disabled="getDisabled()" format="yyyy/MM/dd HH:mm:ss" :placeholder="getPlaceholder()"
@ -53,15 +63,12 @@
</div>
<template v-else-if="type === 'attachment'">
<el-upload ref="uploadRef" class="upload-demo" :action="uploadFileUrl" :on-preview="handlePreview"
:headers="headers"
:before-remove="beforeRemove"
:on-remove="handleRemove" multiple :limit="10"
:on-success="handleSuccess"
:on-change="handleChange"
:on-exceed="handleExceed" :file-list="fileList"
:auto-upload="false">
<el-button :disabled="getDisabled()" :class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')" size="small" type="primary">点击上传</el-button>
<span v-if="error" class = "atta-tips">请上传附件</span>
:headers="headers" :before-remove="beforeRemove" :on-remove="handleRemove" multiple :limit="10"
:on-success="handleSuccess" :on-change="handleChange" :on-exceed="handleExceed"
:file-list="fileList" :auto-upload="false">
<el-button :disabled="getDisabled()" :class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')"
size="small" type="primary">点击上传</el-button>
<span v-if="error" class="atta-tips">请上传附件</span>
<div slot="tip" class="el-upload__tip">支持扩展名.rar .zip .doc .docx .pdf .jpg文件大小不超过2MB</div>
</el-upload>
</template>
@ -194,8 +201,8 @@ export default {
},
data() {
return {
inputValue: this.value,
oldValue: this.value, //
inputValue: this.type === 'checkboxList' && !Array.isArray(this.value) ? [] : this.value,
oldValue: this.type === 'checkboxList' && !Array.isArray(this.value) ? [] : this.value, //
showModal: false, //
modificationRecords: [], //
modalTimer: null, //
@ -206,11 +213,11 @@ export default {
visible: false,//
checkboxValue: this.getChecked(),//
uuid: getuuid(), // EventBus
regentType: ['sj', 'gsp', 'mix', 'xj', 'xb', 'gyzj', 'mjy', 'yq','jcb'], ////
regentType: ['sj', 'gsp', 'mix', 'xj', 'xb', 'gyzj', 'mjy', 'yq', 'jcb'], ////
selectRegentInfo: {},////
fileList: [],//
uploadFileUrl: process.env.VUE_APP_BASE_API + "/file/upload",
headers: {
headers: {
Authorization: "Bearer " + getToken(),
},
pendingUploadFile: null, //
@ -219,7 +226,7 @@ export default {
},
watch: {
value(newVal) {
this.inputValue = newVal;
this.inputValue = this.type === 'checkboxList' && !Array.isArray(newVal) ? [] : newVal;
}
},
filters: {
@ -227,10 +234,10 @@ export default {
},
mounted() {
if(this.item.type === 'attachment'){
try{
if (this.item.type === 'attachment') {
try {
this.fileList = JSON.parse(this.value);
}catch(e){
} catch (e) {
this.fileList = [];
}
}
@ -253,21 +260,21 @@ export default {
EventBus.$off("onMixReagentSubmit", this.onMixReagentSubmit)
},
methods: {
onInstrumentSubmit(data){
if(data.uuid !== this.uuid) return;
onInstrumentSubmit(data) {
if (data.uuid !== this.uuid) return;
this.selectRegentInfo = data;
console.log(data,"yq")
console.log(data, "yq")
},
//
handleChange(file, fileList) {
// statusready
if (file.status === 'ready') {
const isAllowedType = ['image/jpeg', 'image/png', 'image/gif', 'application/pdf',
'application/x-rar-compressed', 'application/zip',
const isAllowedType = ['image/jpeg', 'image/png', 'image/gif', 'application/pdf',
'application/x-rar-compressed', 'application/zip',
'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'].includes(file.raw.type)
const isLt2M = file.size / 1024 / 1024 < 2
if (!isAllowedType) {
this.$message.error(`文件 ${file.name} 格式不支持!只能上传 JPG/PNG/GIF/PDF/RAR/ZIP/DOC/DOCX 格式的文件`)
// fileList
@ -288,25 +295,25 @@ export default {
this.fileList = [...fileList];
return
}
//
const existingFiles = fileList.filter(f => f !== file && f.status === 'success');
if (existingFiles.length > 0) {
//
this.pendingUploadFile = file;
// fileList
const index = fileList.indexOf(file);
if (index > -1) {
fileList.splice(index, 1);
}
this.fileList = [...fileList];
//
EventBus.$emit('showEditSignDialog', { uuid: this.uuid });
return;
}
//
this.$nextTick(() => {
// upload
@ -316,16 +323,16 @@ export default {
}
});
}
// fileList
this.fileList = fileList;
},
handleSuccess(res, file, fileList) {
if(res.code == 200){
if (res.code == 200) {
this.fileList = fileList;
// inputValue便
this.inputValue = JSON.stringify(this.getFileList(fileList));
this.$emit("change",this.inputValue)
this.$emit("change", this.inputValue)
this.onCommonHandleSaveRecord();
this.$message.success('文件上传成功');
} else {
@ -341,10 +348,10 @@ export default {
getFileList(fileList) {
const list = [];
fileList.forEach(item => {
const o = {name:item.name};
if(item.url){//
const o = { name: item.name };
if (item.url) {//
o.url = item.url
}else{//
} else {//
o.url = item.response.data.url
}
list.push(o)
@ -410,7 +417,7 @@ export default {
//
onMixReagentSubmit(data) {
if (data.uuid !== this.uuid) return;
//
const validationController = {
isPrevented: false,
@ -420,11 +427,11 @@ export default {
if (msg) this.errorMsg = msg;
}
};
//
// validationController.prevent(msg)
this.$emit('beforeReagentSubmit', data, validationController);
//
if (validationController.isPrevented) {
//
@ -433,11 +440,11 @@ export default {
}
return;
}
//
this.executeReagentSubmit(data);
},
//
executeReagentSubmit(data) {
this.inputValue = data.selectedId;
@ -458,7 +465,7 @@ export default {
let eventName = "showSelectMixReagentDialog";
if (type === "yq") {
eventName = "showSelectInstrumentDialog";
}else {
} else {
const sjType = {
sj: "1",//
gsp: "7",//
@ -473,7 +480,7 @@ export default {
...params,
type: sjType[type]
};
if(type === "mix"){
if (type === "mix") {
params.mixType = true;
}
}
@ -721,14 +728,14 @@ export default {
}
},
async onCommonHandleSaveRecord(val) {
const isEmpty = this.isValueEmpty(this.inputValue);
if (this.error && !isEmpty) {
this.$emit('update:error', false);
} else if (!this.error && isEmpty) {
this.$emit('update:error', true);
}
//
const validationController = {
isPrevented: false,
@ -738,14 +745,14 @@ export default {
if (msg) this.errorMsg = msg;
}
};
// beforeSaveRecord
this.$emit('beforeSaveRecord', {
value: this.inputValue,
oldValue: this.oldValue,
fieldKey: this.fieldKey
}, validationController);
//
if (validationController.isPrevented) {
//
@ -757,7 +764,7 @@ export default {
this.$emit('input', this.inputValue);
return;
}
if (!this.isFieldsRecord) {//
this.$emit("blur", this.inputValue);
this.$emit('input', this.inputValue);
@ -821,7 +828,7 @@ export default {
if (this.templateFillType === "actFill") {//
this.updateZdxgjl(record);
}
this.$nextTick(()=>{
this.$nextTick(() => {
EventBus.$emit('onModifyRecord', params,)
if (this.regentType.includes(this.item.type)) {
this.$emit("onRegentSubmit", this.selectRegentInfo);
@ -1213,6 +1220,7 @@ export default {
}
}
.error-border {
.el-input-group__prepend,
@ -1356,9 +1364,61 @@ export default {
display: flex;
justify-content: flex-end;
}
.atta-tips {
color: #ff5d5d;
font-size: 12px;
margin-left: 5px;
}
.checkbox-list-container {
padding: 12px;
border: 1px solid #dcdfe6;
border-radius: 4px;
transition: all 0.3s;
&.error-border {
border-color: #ff5d5d !important;
box-shadow: 0 0 6px #ffc3c3 !important;
}
.checkbox-item {
margin-right: 16px;
&:not(:last-child) {
margin-bottom: 10px;
}
// display: inline-block;
}
.el-checkbox {
&.is-checked {
.el-checkbox__label {
color: #606266;
}
.el-checkbox__inner {
background-color: #f9c588;
border-color: #f9c588;
}
}
}
}
.orange-border {
.checkbox-list-container {
border-color: #f9c588;
&:hover {
border-color: #f79b31;
}
}
}
.orange-bg {
.checkbox-list-container {
background-color: #FFF1F1 !important;
border-color: #f9c588;
}
}
</style>

+ 8
- 1
src/views/business/comps/template/comps/sp/SP0019.vue View File

@ -34,6 +34,8 @@
<TableOpertaionDelete :row="row" :rowIndex="rowIndex" :columns="columns" @deleteRow="()=>deleteRow(rowIndex,'ryTableRef')" ></TableOpertaionDelete>
</template>
</CustomTable>
<BaseInfoFormPackage class="mt-20" fieldItemLabel="仪器平衡" label="仪器平衡" ref="storageConditionRef"
:formConfig="yqphFormConfig" :formData="formData" />
<BaseInfoFormPackage fieldItemLabel="template.common.remark" label="template.common.remark"
ref="remarkRef" :formConfig="remarkConig" :formData="formData" />
</div>
@ -52,7 +54,7 @@ import templateMixin from "../../mixins/templateMixin";
import CustomTable from '@/components/Template/CustomTable.vue';
import TableOpertaionDelete from "@/components/Template/operation/TableOpertaionDelete.vue"
import { getBaseInfoFormConfig, storageFormConfig, getYqColumns,getRyColumns } from "../../formConfig/sp/SP0019"
import { getBaseInfoFormConfig, storageFormConfig, getYqColumns,getRyColumns,getYqphFormConfig } from "../../formConfig/sp/SP0019"
export default {
name: "SP0019",
@ -65,6 +67,11 @@ export default {
},
},
computed: {
//
yqphFormConfig(){
return getYqphFormConfig(this);
},
//
ryColumns(){
return getRyColumns(this);
},

+ 24
- 3
src/views/business/comps/template/formConfig/sp/SP0019.js View File

@ -96,10 +96,10 @@ export const getRyColumns = () => {
label: '溶液类型',
prop: "rylx",
bodyType: "select",
bodyOptions:[
bodyOptions: [
{
label:'溶液',
value:'溶液'
label: '溶液',
value: '溶液'
},
],
bodyFillType: 'preFill',
@ -126,3 +126,24 @@ export const getRyColumns = () => {
},
]
}
//仪器平衡
export const getYqphFormConfig = () => {
return [
{
type: 'checkboxList',
config: {
yqph: {
label: '仪器平衡',
type: 'checkboxList',
fillType: 'actFill',
options: [
{ label: '流动相平衡', value: 1 },
{ label: '样品平衡', value: 2 },
{ label: '样品', value: 3 },
{ label: '未平衡', value: 4 }
]
},
}
}
]
}

Loading…
Cancel
Save