|
|
|
@ -9,6 +9,7 @@ export interface fieldTree{ |
|
|
|
type:string; |
|
|
|
checked?:number; |
|
|
|
data?:[]; |
|
|
|
options?:[];//select, checkbox... options |
|
|
|
child?:fieldTree[] |
|
|
|
} |
|
|
|
|
|
|
|
@ -38,16 +39,19 @@ const props = withDefaults(defineProps<{ |
|
|
|
const qrdata=ref("") |
|
|
|
const userName=useUserStore().nickname; |
|
|
|
|
|
|
|
function parseDataPicker(val:string){ |
|
|
|
function parseDataPicker(val:string,vtype:string){ |
|
|
|
let str:string; |
|
|
|
if(typeof(val)=="number"){ |
|
|
|
str=new Date(val).toISOString() |
|
|
|
}else{ |
|
|
|
if(val==""|| val.match(/[a-z]/) ) return val; |
|
|
|
str=new Date(parseInt(val)).toISOString() |
|
|
|
str=new Date(val).toLocaleString() |
|
|
|
}else{//"";2025-12-17;sheng1chan3ri4qi1;三种值直接返回 |
|
|
|
if(val==""|| val.match(/[a-z-:.]/) ) return val; |
|
|
|
str=new Date(parseInt(val)).toLocaleString() |
|
|
|
} |
|
|
|
|
|
|
|
return str.slice(0,10)+" "+str.slice(11,16) |
|
|
|
if(vtype.startsWith("time")){ |
|
|
|
return str.slice(11,16) |
|
|
|
} |
|
|
|
return str.slice(0,10) |
|
|
|
} |
|
|
|
|
|
|
|
const generateQrCode= ()=>{ |
|
|
|
@ -99,7 +103,7 @@ const getStateText=(val:number)=>{ |
|
|
|
{{item.name}} |
|
|
|
</span> |
|
|
|
<span v-if="item.type !=='datePicker'" class="content">{{item.field}}</span> |
|
|
|
<span v-else class="content">{{parseDataPicker(item.field)}}</span> |
|
|
|
<span v-else class="content">{{parseDataPicker(item.field,item.type)}}</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
@ -121,7 +125,14 @@ const getStateText=(val:number)=>{ |
|
|
|
<tbody> |
|
|
|
<tr v-for="(dd, index) in group.data" :key="dd"> |
|
|
|
<template v-for="child in group.child"> |
|
|
|
<td v-if="child.checked!=2" >{{ dd[child.field]}}</td> |
|
|
|
<td v-if="child.checked!=2"> |
|
|
|
<template v-if="child.type.includes('Picker')"> |
|
|
|
{{parseDataPicker(dd[child.field],child.type)}} |
|
|
|
</template> |
|
|
|
<template v-else> |
|
|
|
{{dd[child.field]}} |
|
|
|
</template> |
|
|
|
</td> |
|
|
|
</template> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
@ -131,15 +142,15 @@ const getStateText=(val:number)=>{ |
|
|
|
<h5>{{ group.name }}</h5> |
|
|
|
<div v-for="tabs in group.child" class="tabs_item"> |
|
|
|
<div v-if="Array.isArray(tabs)" class="auto_table"> |
|
|
|
<template v-for="item in tabs" > |
|
|
|
<div v-if="item.checked!=2" class="tabs_cell_box" style="width: auto;"> |
|
|
|
<span class="box_name"> |
|
|
|
{{item.name}} |
|
|
|
</span> |
|
|
|
<span v-if="item.type !=='datePicker'" class="content">{{item.field}}</span> |
|
|
|
<span v-else class="content">{{parseDataPicker(item.field)}}</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<template v-for="item in tabs" > |
|
|
|
<div v-if="item.checked!=2" class="tabs_cell_box" style="width: auto;"> |
|
|
|
<span class="box_name"> |
|
|
|
{{item.name}} |
|
|
|
</span> |
|
|
|
<span v-if="item.type !=='datePicker'" class="content">{{item.field}}</span> |
|
|
|
<span v-else class="content">{{parseDataPicker(item.field,item.type)}}</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
<div v-else-if="tabs.type=='divider'" class="title" v-if="tabs.checked!=2" |
|
|
|
style="font-size: 12px; margin-top: 20px;">{{ tabs.name }}</div> |
|
|
|
@ -160,26 +171,32 @@ const getStateText=(val:number)=>{ |
|
|
|
<tbody> |
|
|
|
<tr v-for="(dd, index) in tabs.data" :key="dd"> |
|
|
|
<template v-for="child in tabs.child"> |
|
|
|
<td v-if="child.checked!=2" >{{ dd[child.field]}}</td> |
|
|
|
<td v-if="child.checked!=2" > |
|
|
|
<template v-if="child.type.includes('Picker')"> |
|
|
|
{{parseDataPicker(dd[child.field],child.type)}} |
|
|
|
</template> |
|
|
|
<template v-else> |
|
|
|
{{dd[child.field]}} |
|
|
|
</template> |
|
|
|
</td> |
|
|
|
</template> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
</div> |
|
|
|
<div v-else class="tabs_cell_box" v-if="tabs.checked!=2"> |
|
|
|
<div v-else class="section tabs_wide_box" v-if="tabs.checked!=2"> |
|
|
|
<span class="box_name"> |
|
|
|
{{tabs.name}} |
|
|
|
</span> |
|
|
|
<span v-if="tabs.type !=='datePicker'" class="content">{{tabs.field}}</span> |
|
|
|
<span v-else class="content">{{parseDataPicker(tabs.field??'')}}</span> |
|
|
|
<span v-else class="content">{{parseDataPicker(tabs.field??'',tabs.type)}}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-else v-if="group.checked!=2">{{ group }}</div> |
|
|
|
<div v-else v-if="group.checked!=2 && group.type">{{ group }}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div v-if="props.flowList && props.flowList.length>0" class="section_table"> |
|
|
|
<table class="bder_table"> |
|
|
|
<caption >审批流程</caption> |
|
|
|
@ -265,7 +282,7 @@ div:empty { |
|
|
|
.auto_table{ |
|
|
|
display: grid; |
|
|
|
grid-template-columns: 1fr 1fr; |
|
|
|
border: 1px solid rgb(226, 226, 226); |
|
|
|
border: 1px solid rgb(200, 200, 200); |
|
|
|
} |
|
|
|
.operate_log{ |
|
|
|
display: block; |
|
|
|
@ -357,7 +374,7 @@ h5{ |
|
|
|
} |
|
|
|
|
|
|
|
/* 原有样式(稍作优化) */ |
|
|
|
.cell_box, .tabs_cell_box { |
|
|
|
.cell_box, .tabs_cell_box, .tabs_wide_box{ |
|
|
|
border: 1px solid rgb(182, 181, 181); |
|
|
|
margin-right: -1px; /* 水平排列时用右负margin */ |
|
|
|
margin-bottom: -1px; /* 垂直排列时用下负margin */ |
|
|
|
@ -383,8 +400,9 @@ h5{ |
|
|
|
border-left: 1px solid rgb(182, 181, 181); |
|
|
|
} |
|
|
|
} |
|
|
|
.tabs_cell_box{ |
|
|
|
.tabs_cell_box, .tabs_wide_box{ |
|
|
|
width: 100%; |
|
|
|
flex-direction: row; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|