jy-safe-app/pages/apply/subPages/SCPR/processFormxkShow.vue

397 lines
9.2 KiB
Vue
Raw Permalink Normal View History

2025-10-14 15:17:30 +08:00
<template>
<view class="page">
<view class="page-wrap">
<view class="card">
<uni-card margin="0" :is-shadow="true">
<view>
<view class="table-record">
<view class="table-left">表单名称</view>
<view>{{dataModel.NAME}}</view>
</view>
<view class="table-record">
<view class="table-left">组织结构</view>
<view>{{dataModel.Nav_Department.NAME}}</view>
</view>
<view class="table-record">
<view class="table-left">岗位</view>
<view v-html="dataModel.Nav_Post.NAME"></view>
</view>
<view class="table-record">
<view class="table-left">生产工艺</view>
<view v-html="dataModel.Nav_OperationStep.NAME"></view>
</view>
<view class="table-record-noborder">
<view class="table-left">班次</view>
<view v-html="dataModel.CLASS"></view>
</view>
</view>
</uni-card>
</view>
<u-sticky offset-top="0">
<view class="tabs-title" id="tabs-title" :style="{margin:isTop==true?'0px':'16px'}">
<view style="margin-right: 10px;margin-left: 10px;">
<u-tabs ref="tabs" :activeStyle="{
fontWeight: 'bold',
transform: 'scale(1)',
fontSize:'14px',
color:'#005BEA'
}" :inactiveStyle="{
transform: 'scale(1)',
fontSize:'14px',
}" :list="list" lineColor="#005BEA" :is-scroll="true" :current="currentIndex" @change="change">
<view class="icon-tabs" slot="right" @tap="changeIndex">
<u-icon size="14" name="arrow-right" bold></u-icon>
</view>
</u-tabs>
</view>
</view>
</u-sticky>
<view v-if="currentIndex===0" class="uni-card-bottom">
<u--form labelPosition="left" labelWidth="auto" labelAlign="center" errorType="border-bottom"
ref="sForm">
<u-collapse :border="false" accordion>
<uni-card style="margin: 0px 16px 16px 16px;padding: 10px 0px;" margin="0" spacing="0" :is-shadow="false" padding="0"
v-for="(item, index) in dataModel.Nav_Details">
<u-collapse-item title-border="none" :show-arrow="false" class="collapse-influ">
<view slot="title" class="collapse-title">
<!-- <view class="down">
<uni-icons type="bottom"></uni-icons>
</view> -->
<view class="text-num">{{item.NUM+ '. '}}</view>
</view>
<u-form-item label="事项" prop="NAME" borderBottom>
<u--input disabled disabledColor="#fff"
v-model="item.NAME"
border="none"
inputAlign="right"></u--input>
</u-form-item>
<u-form-item label="参数" prop="PARAM" borderBottom>
<u--input disabled disabledColor="#fff"
v-model="item.PARAM"
border="none"
inputAlign="right"></u--input>
</u-form-item>
<u-form-item label="单位" prop="UNIT" borderBottom>
<u--input disabled disabledColor="#fff"
v-model="item.UNIT"
border="none"
inputAlign="right"></u--input>
</u-form-item>
<u-form-item label="数值" prop="VALUE" borderBottom>
<u--input disabled disabledColor="#fff"
v-model="item.VALUE"
border="none"
inputAlign="right"></u--input>
</u-form-item>
<u-form-item label="记录时间" prop="RECORD_TIME" borderBottom>
<u--input disabled disabledColor="#fff"
v-model="item.RECORD_TIME"
border="none"
inputAlign="right"></u--input>
</u-form-item>
</u-collapse-item>
</uni-card>
</u-collapse>
</u--form>
</view>
<check-action v-if="isLoadOK && tableKey === '1'&&isAudit==='true' " :okApi="okApi" :refuseApi="refuseApi"
:dataSource="$store.state.auditModel"></check-action>
</view>
</view>
</template>
<script>
import {
mapState,
mapMutations
} from 'vuex'
import {
extendFilterGroup,
extendGroupRule,
extendInclude,
extendOrder,
extendRule,
guid,
initFilter,
initFilterGroup,
extendIgnoreDataRule
} from '../../../../utils/common'
import {
getRequest,
} from '../../../../services/apply/FOServices/FOServices.js'
import config from '../../../../config/common'
export default {
data() {
return {
ID: '',
TaskID: '',
tableKey: 0,
isLoadOK: false,
okApi: '',
refuseApi: '',
ApproveID: '',
isAudit: false,
dataModel: {
Nav_OperationStep: {NAME:''},
Nav_Department: {NAME:''},
Nav_Post: {NAME:''}
},
subDataModel: {},
options: [{
text: '删除',
style: {
backgroundColor: '#f56c6c'
}
}],
comPickerInfo: {
showSheet: false,
columns: [],
title: '',
dataIndex: undefined,
formIndex: undefined,
name: ''
},
list: [{
name: '生产运行记录明细'
}],
currentIndex: 0,
isTop: false
}
},
onLoad(opt) {
this.handleGetProcessFormxkData(opt)
},
onPageScroll(e) {
let query = uni.createSelectorQuery().in(this);
query.select('#tabs-title').boundingClientRect(data => {
if (data.top == 0) {
this.isTop = true
} else {
this.isTop = false
}
// 这个
}).exec();
},
methods: {
change(index) {
this.currentIndex = index.index;
},
changeIndex() {
this.show = true
if (this.currentIndex + 1 < this.list.length) {
this.currentIndex = this.currentIndex + 1
}
},
handleGetProcessFormxkData(opt) {
this.TaskID = opt.taskID ? opt.taskID : '';
this.ID = opt.ID ? opt.ID : '';
this.tableKey = opt.tableKey ? opt.tableKey : '0'
this.okApi = opt.okApi
this.refuseApi = opt.refuseApi
this.ApproveID = opt.ApproveID
this.isAudit = opt.isAudit
this.auditModel = {
...this.$store.state.auditModel,
TaskID: opt.taskID ? opt.taskID : ''
}
const orgId = uni.getStorageSync('orgId')
const json = initFilter(orgId, "", "")
extendRule(json, 'ID', 1, opt.ID)
extendInclude(json, 'Nav_Department');
extendInclude(json, 'Nav_Post');
extendInclude(json, 'Nav_OperationStep');
// extendInclude(json, 'Nav_JobEventPerson');
// extendInclude(json, 'Nav_JobEventPerson.Nav_User.Nav_Department');
extendInclude(json, 'Nav_Details');
// TODO: id 未获取
getRequest(json,"/PR/ProcessFormXk/Get").then(res => {
this.dataModel = res
if(!res.OPERATION_STEP_ID)
{
res.Nav_OperationStep =[]
}
if(!res.POST_ID)
{
res.Nav_Post =[]
}
if(!res.DEPARTMENT_ID)
{
res.Nav_Department =[]
}
this.isLoadOK = true
})
},
}
}
</script>
<style scoped>
.page {
// background-image: url('../../../../utils/waves.svg');
// background-repeat: no-repeat;
// background-size: 100%;
}
.page-wrap {
padding-bottom: 66px;
}
.uni-card {
// margin-bottom: 10px;
margin: 16px;
}
.uni-card-bottom {
margin-bottom: 116px;
}
.uni-card-content {
margin: 5px 10px;
}
.tabs-title {
//padding-top: 10px;
// margin-bottom: 10px;
// margin: 16px;
display: flex;
flex-direction: row;
align-items: center;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 1px 0px 0px #eaedf4;
.icon-tabs {
padding-left: 5px;
display: flex;
align-items: center;
}
}
.card {
// margin-bottom: 18px;
margin: 16px;
}
.table-record {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
/* font-size: 12px; */
border-bottom: 1px #c8c7cc solid;
line-height: 40px;
color: #303133;
}
.table-record-noborder {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
/* font-size: 12px; */
line-height: 40px;
color: #303133;
}
.table-bottom {
border-bottom: 1px #c8c7cc solid;
}
.table-record-column {
display: flex;
flex-direction: row;
justify-content: space-between;
font-size: 12px;
color: #303133;
}
.table-left {
line-height: 40px;
display: flex;
align-items: center;
width: 70px;
}
.table-right {
display: flex;
color: #808080;
align-items: center;
justify-content: flex-end;
flex: 1;
line-height: 18px;
padding: 5px 0px 5px 0px;
}
.link-content {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
width: 100%;
align-items: center;
}
.link-content-border {
display: flex;
margin-left: 10px;
align-items: center;
}
.sub-form {
margin-bottom: 16px;
}
.bottom-button {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
padding: 10px 16px;
box-sizing: border-box;
background: #fff;
z-index: 999;
}
.upload-title {
color: #303133;
font-size: 15px;
line-height: 22px;
padding: 8px 0;
}
.page-wrap>>>.u-upload__button {
margin-bottom: 0;
}
/* .collapse-influ>>>.u-cell__body__content {
width: calc(100% - 20px);
display: block;
} */
.collapse-title {
display: flex;
flex-direction: row;
/* justify-content: space-between; */
/* align-items: center; */
width: 100%;
}
.text-num {
display: flex;
align-items: flex-start;
margin-right: 3px;
}
.collapse-title .down {
width: 20px;
flex: 0 0 auto;
}
/* .collapse-title .text {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
flex: 1;
width: calc(100% - 100px);
} */
</style>