533 lines
15 KiB
Vue
533 lines
15 KiB
Vue
<template>
|
|
<view class='base-info'>
|
|
<view class="form-user">
|
|
<u--form labelPosition="left" labelWidth="80px" labelAlign="left" :model="dataModel" :rules="rules" ref="form" errorType="border-bottom" class='info-form'>
|
|
<u-form-item label="姓名" prop="name" border-bottom>
|
|
<text>{{userInfo.UserName}}</text>
|
|
</u-form-item>
|
|
<u-form-item label="编码" prop="code" border-bottom>
|
|
<text>{{userInfo.UserCode}}</text>
|
|
</u-form-item>
|
|
<u-form-item label="手机" prop="phone" border-bottom>
|
|
<u--input v-model="userInfo.PHONE" border="none" inputAlign="right"></u--input>
|
|
<!-- <text>{{userInfo.PHONE}}</text> -->
|
|
</u-form-item>
|
|
<u-form-item label="身份证" prop="phone" border-bottom>
|
|
<u--input v-model="userInfo.ID_CARD" border="none" inputAlign="right"></u--input>
|
|
<!-- <text>{{userInfo.ID_CARD}}</text> -->
|
|
</u-form-item>
|
|
<!-- <u-form-item label="组织结构" prop="department" border-bottom>
|
|
<text>{{userInfo.DepartmentName}}</text>
|
|
</u-form-item> -->
|
|
<u-form-item label="组织结构" prop="job" @click="handleChange(userInfo.Nav_Department.NAME)">
|
|
<!-- @click="handleShowSheet({title: '作业名称', name: 'stepName'})" -->
|
|
<u--input disabledColor="#fff" v-model="userInfo.Nav_Department.NAME" disabled placeholder="请选择组织" suffixIcon="arrow-right" suffixIconStyle="font-size:12px" fontSize="14px"
|
|
customStyle="margin:0px;display:flex;padding:3px 9px" border="none" inputAlign="right">
|
|
</u--input>
|
|
|
|
</u-form-item>
|
|
<!-- <u-form-item label="班组" prop="post" border-bottom>
|
|
<text>{{userInfo.TeamName}}</text>
|
|
</u-form-item> -->
|
|
<!-- <u-form-item label="岗位" prop="job">
|
|
<text>{{userInfo.PostName}}</text>
|
|
</u-form-item> -->
|
|
<u-form-item label="岗位" prop="job" @click="handleChangeStep(userInfo.Nav_Person.Nav_Post.NAME)">
|
|
<!-- @click="handleShowSheet({title: '作业名称', name: 'stepName'})" -->
|
|
<u--input disabledColor="#fff" v-model="userInfo.Nav_Person.Nav_Post.NAME" disabled placeholder="请选择岗位" suffixIcon="arrow-right" suffixIconStyle="font-size:12px" fontSize="14px"
|
|
customStyle="margin:0px;display:flex;padding:3px 9px" border="none" inputAlign="right">
|
|
</u--input>
|
|
|
|
</u-form-item>
|
|
<!-- <u-form-item label="角色" prop="role">
|
|
<text>{{userInfo.RoleName}}</text>
|
|
</u-form-item> -->
|
|
</u--form>
|
|
</view>
|
|
<view class="assign">
|
|
<view class='top-label'>签名</view>
|
|
<view class="assign-again" @click="reUpload">
|
|
<u-button type="primary" icon="download" text="上传签名" size="small"></u-button>
|
|
<!-- <view class="top-label-assign">上传签名</view>
|
|
<view>
|
|
<u-icon name="download" size="20px"></u-icon>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
|
|
<view class="signature-img">
|
|
<image style="width: 100%" mode="widthFix" :src="userInfo.SignaturePhoto"></image>
|
|
</view>
|
|
<button @click="formSubmit" type="primary" class='save-btn'>确定</button>
|
|
|
|
<u-popup :show="show" mode="center" :customStyle="{width: '100%', height: '100%'}" @open="() => {}" @close="() => {this.show = false}">
|
|
<view class="sign-border">
|
|
<view class="position-float">
|
|
<view class="container">
|
|
<view style="width: 100%;height: 100%;">
|
|
<view class="btn" @click="handleSignature('clear')">
|
|
清空
|
|
</view>
|
|
<view class="btn" @click="handleSignature('undo')">撤消</view>
|
|
<view class="btn" @click="handleSignature('save')">保存</view>
|
|
<view class="btn" v-if="!userInfo.SignaturePhoto" @click="handleSignature('openSmooth')">
|
|
压感{{openSmooth?'开':'关'}}</view>
|
|
<view class="btn" v-else @click="handleCancel">取消</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="display: flex;flex: 1;">
|
|
<l-signature disableScroll backgroundColor="#fff" ref="signatureRef" :penColor="penColor" :penSize="penSize" :openSmooth="openSmooth" landscape>
|
|
|
|
</l-signature>
|
|
<view class="sign-text">签名区域</view>
|
|
</view>
|
|
|
|
<view class="position-float">
|
|
<view class="container">
|
|
<view class="absolute-align">请在横屏方向使用正楷字体签名</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</u-popup>
|
|
<query-selector :show="showPopup" :total="curTotal" :lists="lists" :defaultValue="currentOperate.NAME" @close="handleClosePopup" @search="handleSearch" @select="handleSelected" />
|
|
<query-selector :show="showPopupStep" :total="curTotalStep" :lists="stepLists" :defaultValue="currentOperateStep.NAME" @close="handleClosePopupStep" @search="handleSearchStep" @select="handleSelectedStep" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getUserListOlds,
|
|
saveUser,
|
|
getUserPostLists,
|
|
getDepartmentLists
|
|
} from '../../../services/safe'
|
|
import {
|
|
guid,
|
|
initFilter,
|
|
extendRule,
|
|
extendInclude,initFilterGroup,extendGroupRule,extendFilterGroup
|
|
} from '../../../utils/common'
|
|
import config from '../../../config/common'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
curTotalStep: 0,
|
|
stepLists: [],
|
|
currentOperateStep: {},
|
|
showPopupStep: false,
|
|
curTotal: 0,
|
|
lists: [],
|
|
currentOperate: {},
|
|
showPopup: false,
|
|
show: false,
|
|
sourceUrl: config.uni_app_web_source_url,
|
|
userInfo: {
|
|
Nav_Person:{
|
|
NAME:'',
|
|
Nav_Post:{
|
|
NAME:''
|
|
}
|
|
},
|
|
},
|
|
// title: '',
|
|
penColor: '#333',
|
|
penSize: 5,
|
|
openSmooth: true,
|
|
dataModel: {},
|
|
rules: {},
|
|
}
|
|
},
|
|
onLoad() {
|
|
const orgId = uni.getStorageSync('orgId')
|
|
const appInfoData = uni.getStorageSync('appInfo')
|
|
const userId = appInfoData?.User?.ID || ''
|
|
let json = initFilter(orgId)
|
|
extendRule(json, 'ID', 1, userId);
|
|
extendInclude(json, 'Nav_ApproveRole');
|
|
extendInclude(json, 'Nav_ProdutionUnit');
|
|
extendInclude(json, 'Nav_BelongRoles.Nav_BelongRole');
|
|
extendInclude(json, 'Nav_Department');
|
|
extendInclude(json, 'Nav_Person.Nav_Post');
|
|
extendInclude(json, 'Nav_Person.Nav_TeamPersons.Nav_Team');
|
|
extendInclude(json, 'Nav_UserPhotoFiles.Nav_ImgFile');
|
|
extendInclude(json, 'Nav_UserSignFiles.Nav_ImgFile');
|
|
getUserListOlds(json).then(res => {
|
|
if (res.IsSuccessful) {
|
|
const result = res.Data[0] || {}
|
|
let roles = result.Nav_BelongRoles
|
|
let roleNames = ''
|
|
let roleCodes = ''
|
|
for (let i = 0; i < roles.length; i++) {
|
|
if (roles[i].Nav_BelongRole) {
|
|
if (roleCodes.indexOf(roles[i].Nav_BelongRole.CODE) == -1) {
|
|
roleCodes += (roleCodes.length > 0 ? "," : "") + roles[i].Nav_BelongRole.CODE;
|
|
roleNames += (roleNames.length > 0 ? "," : "") + roles[i].Nav_BelongRole.NAME;
|
|
}
|
|
}
|
|
}
|
|
this.userInfo = {
|
|
...result,
|
|
UserName: appInfoData?.User?.NAME,
|
|
UserCode: appInfoData?.User?.CODE,
|
|
DepartmentName: result.Nav_Department?.NAME,
|
|
TeamName: result.Nav_Person?.Nav_TeamPersons[0]?.Nav_Team?.NAME,
|
|
PostName: result.Nav_Person?.Nav_Post?.NAME,
|
|
SignaturePhoto: result.Nav_UserSignFiles && this.sourceUrl + result.Nav_UserSignFiles[
|
|
0]?.Nav_ImgFile?.FILE_PATH,
|
|
RoleName: roleNames,
|
|
// // #ifdef H5
|
|
// SignaturePhoto: result.Nav_UserSignFiles && result.Nav_UserSignFiles[0]?.Nav_ImgFile?.FILE_PATH,
|
|
// // #endif
|
|
// // #ifndef H5
|
|
// SignaturePhoto: result.Nav_UserSignFiles && result.Nav_UserSignFiles[0]?.Nav_ImgFile?.FILE_PATH,
|
|
// // #endif
|
|
}
|
|
}
|
|
})
|
|
},
|
|
methods: {
|
|
formSubmit() {
|
|
saveUser(this.userInfo).then(res => {
|
|
uni.$showMsgFunc('操作成功!', () => {
|
|
uni.navigateBack()
|
|
}, 'success', 1000)
|
|
})
|
|
// uni.navigateBack()
|
|
},
|
|
reUpload() {
|
|
this.show = true
|
|
},
|
|
handleCancel() {
|
|
this.show = false
|
|
},
|
|
handleClosePopup() {
|
|
this.showPopup = false
|
|
this.showPopupStep = false
|
|
// this.showPopupCertificate = false
|
|
},
|
|
handleClosePopupStep() {
|
|
this.showPopup = false
|
|
this.showPopupStep = false
|
|
// this.showPopupCertificate = false
|
|
},
|
|
handleChangeStep(step) {
|
|
this.currentOperateStep = {}
|
|
this.showPopupStep = true
|
|
this.handleSearchStep('init')
|
|
},
|
|
handleSearchStep(val, pageIndex) {
|
|
const orgId = uni.getStorageSync('orgId')
|
|
const json = initFilter(orgId, "", "NAME", '', pageIndex)
|
|
// extendInclude(json, "Nav_Department")
|
|
// extendRule(json, 'ENABLE_STATUS', 1, '0')
|
|
if (val !== 'init') {
|
|
const tempGroup = initFilterGroup(false);
|
|
extendGroupRule(tempGroup, 'NAME', 9, val)
|
|
extendFilterGroup(json, tempGroup);
|
|
}
|
|
json.Limit = 20
|
|
if (pageIndex) {
|
|
json.Start = (pageIndex - 1) * 20;
|
|
}
|
|
getUserPostLists(json).then(res => {
|
|
if (res.IsSuccessful) {
|
|
this.stepLists = res.Data.map(i => {
|
|
return {
|
|
...i,
|
|
id: i.ID,
|
|
name: i.NAME,
|
|
}
|
|
})
|
|
this.curTotalStep = res.TotalCount
|
|
}
|
|
})
|
|
},
|
|
handleSelectedStep(val) {
|
|
this.showPopupStep = false
|
|
this.currentOperateStep = val
|
|
this.userInfo.Nav_Person.Nav_Post = val
|
|
this.userInfo.Nav_Person.POST_ID = val.ID
|
|
},
|
|
handleChange(step) {
|
|
this.currentOperate = {}
|
|
this.showPopup = true
|
|
this.handleSearch('init')
|
|
},
|
|
handleSearch(val, pageIndex) {
|
|
const orgId = uni.getStorageSync('orgId')
|
|
const json = initFilter(orgId, "", "NAME", '', pageIndex)
|
|
// extendInclude(json, "Nav_Department")
|
|
// extendRule(json, 'ENABLE_STATUS', 1, '0')
|
|
if (val !== 'init') {
|
|
const tempGroup = initFilterGroup(false);
|
|
extendGroupRule(tempGroup, 'NAME', 9, val)
|
|
extendFilterGroup(json, tempGroup);
|
|
}
|
|
json.Limit = 20
|
|
if (pageIndex) {
|
|
json.Start = (pageIndex - 1) * 20;
|
|
}
|
|
getDepartmentLists(json).then(res => {
|
|
if (res.IsSuccessful) {
|
|
this.lists = res.Data.map(i => {
|
|
return {
|
|
...i,
|
|
id: i.ID,
|
|
name: i.NAME,
|
|
}
|
|
})
|
|
this.curTotal = res.TotalCount
|
|
}
|
|
})
|
|
},
|
|
handleSelected(val) {
|
|
this.showPopup = false
|
|
this.currentOperate = val
|
|
this.userInfo.Nav_Department = val
|
|
this.userInfo.DEPARTMENT_ID = val.ID
|
|
},
|
|
|
|
handleSignature(type) {
|
|
if (type === 'openSmooth') {
|
|
this.openSmooth = !this.openSmooth
|
|
return
|
|
}
|
|
if (type === 'save') {
|
|
this.$refs.signatureRef.canvasToTempFilePath({
|
|
success: async (res) => {
|
|
// 是否为空画板 无签名
|
|
if (!res.isEmpty) {
|
|
// 生成图片的临时路径
|
|
// H5 生成的是base64
|
|
uni.showLoading({
|
|
title: '正在上传图片...'
|
|
})
|
|
const result = await this.uploadFilePromise(res.tempFilePath)
|
|
// #ifdef H5
|
|
this.userInfo.SignaturePhoto = res.tempFilePath
|
|
// #endif
|
|
// #ifndef H5
|
|
this.userInfo.SignaturePhoto = this.sourceUrl + result.imgFilePath;
|
|
|
|
// #endif
|
|
this.show = false
|
|
}
|
|
}
|
|
})
|
|
return
|
|
}
|
|
if (this.$refs.signatureRef) {
|
|
this.$refs.signatureRef[type]()
|
|
}
|
|
},
|
|
uploadFilePromise(url) {
|
|
const appInfoData = uni.getStorageSync('appInfo')
|
|
const userId = appInfoData?.User?.ID || ''
|
|
const orgId = uni.getStorageSync('orgId')
|
|
const tenant = uni.getStorageSync('Tenant') || ''
|
|
const remoteUrl = config.serviceHost('/PF/File/UploadFileEditSign')
|
|
return new Promise((resolve, reject) => {
|
|
uni.uploadFile({
|
|
url: remoteUrl,
|
|
filePath: url,
|
|
fileList: url,
|
|
name: 'file',
|
|
formData: {
|
|
OrgId: orgId,
|
|
userID: userId
|
|
},
|
|
header: {
|
|
Tenant: tenant,
|
|
userid: userId
|
|
},
|
|
success: (res) => {
|
|
if (res.statusCode === 200) {
|
|
uni.hideLoading()
|
|
const uploadResult = JSON.parse(res.data)
|
|
if (uploadResult.IsSuccessful) {
|
|
let temp=[]
|
|
let fileTemp =
|
|
{
|
|
USER_ID:this.userInfo.ID,
|
|
IMG_FILE_ID: uploadResult.Data?.imgFileID,
|
|
IS_DELETED:false,
|
|
ORG_ID:this.userInfo.ORG_ID
|
|
}
|
|
temp.push(fileTemp)
|
|
this.userInfo.Nav_UserSignFiles = temp
|
|
this.userInfo.FILE_PATH = uploadResult.Data?.imgFilePath
|
|
resolve(uploadResult.Data)
|
|
} else {
|
|
reject(uploadResult.ErrorMessage)
|
|
}
|
|
}
|
|
}
|
|
});
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.base-info {
|
|
/* padding: 16px; */
|
|
width: 100%;
|
|
height: 100vh;
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.form-user {
|
|
margin: 16px;
|
|
/* border: #e5e5e5 1px solid; */
|
|
padding: 10px 16px;
|
|
box-shadow: #e5e5e5 0px 0px 10px 1px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.form-user>>>.u-form-item__body__left__content__label {
|
|
font-size: 14px;
|
|
color: #808080;
|
|
}
|
|
|
|
.form-user>>>.u-form-item__body__right__content__slot {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.save-btn {
|
|
margin: 20px 26px 0px 26px;
|
|
}
|
|
|
|
.assign {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
margin: 10px 26px;
|
|
align-items: center;
|
|
}
|
|
|
|
.assign-again {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
}
|
|
|
|
.top-label {
|
|
font-size: 14px;
|
|
/* padding: 10px 0; */
|
|
line-height: 21px;
|
|
/* text-align: center; */
|
|
color: #303133;
|
|
}
|
|
|
|
.top-label-assign {
|
|
font-size: 14px;
|
|
/* padding: 10px 0; */
|
|
line-height: 21px;
|
|
/* color: #fff; */
|
|
/* font-weight: bold; */
|
|
margin-right: 3px;
|
|
/* text-align: center; */
|
|
/* color: #808080; */
|
|
}
|
|
|
|
.signature-img {
|
|
border: 1px solid #e5e5e5;
|
|
margin: 0px 16px;
|
|
}
|
|
|
|
.action {
|
|
display: flex;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.btn {
|
|
width: 100%;
|
|
height: 25%;
|
|
text-align: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
/* padding: 10px 0; */
|
|
font-size: 16px;
|
|
color: #f1a532;
|
|
border-radius: 5px;
|
|
border-right: 1px solid #fff;
|
|
border-bottom: 2px solid #fff;
|
|
writing-mode: vertical-rl;
|
|
text-orientation: sideways;
|
|
}
|
|
|
|
.btn:first-child {
|
|
border-left: 1px solid #e5e5e5;
|
|
}
|
|
|
|
.position-float {
|
|
width: 40px;
|
|
height: 100%;
|
|
}
|
|
|
|
.container {
|
|
/* display: flex; */
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #fdf6ec;
|
|
}
|
|
|
|
.absolute-align {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
writing-mode: vertical-rl;
|
|
text-orientation: sideways;
|
|
font-size: 14px;
|
|
color: #f1a532;
|
|
}
|
|
|
|
.position-float {
|
|
/* width: 40px; */
|
|
flex: 0 0 40px;
|
|
height: 100%;
|
|
}
|
|
|
|
.container {
|
|
/* display: flex; */
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #fdf6ec;
|
|
}
|
|
|
|
.sign-border {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex: auto;
|
|
}
|
|
.sign-border>>>.lime-signature {
|
|
width: 100% !important;
|
|
height: calc(100% - 40px) !important;
|
|
margin: 20px 20px 0px 20px;
|
|
border: #e5e5e5 2px dashed;
|
|
background-color: #f4f4f5 !important;
|
|
}
|
|
.sign-text {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%,-50%);
|
|
writing-mode: vertical-rl;
|
|
text-orientation: sideways;
|
|
color: #909399;
|
|
font-size: 16px;
|
|
}
|
|
</style> |