plm前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

751 lines
25 KiB

<template>
<div class="mod-config">
<el-dialog
width="600px"
:title="!dataForm.id ? '添加' :'编辑'"
:close-on-click-modal="false"
:visible.sync="visible">
<el-form :inline="true" label-position="top" label-width="100px" :rules="projectRole">
<el-form-item :label="'项目层级'" prop="projectLevel" :rules="projectRole.projectLevel">
<el-select v-model="dataForm.projectLevel" style="width: 130px">
<el-option label="一级" value=1></el-option>
<el-option label="二级" value=2></el-option>
<el-option label="三级" value=3></el-option>
</el-select>
</el-form-item>
<el-form-item :label="'项目号'">
<el-input v-model="dataForm.projectId" style="width: 130px" disabled></el-input>
</el-form-item>
<el-form-item prop="projectType" :rules="projectRole.projectType">
<span slot="label" style="" @click="getBaseList(1010,1)"><a herf="#">项目类型</a></span>
<el-input v-model="dataForm.projectType" style="width: 130px" readonly @focus="getBaseList(1010,1)"></el-input>
</el-form-item>
<el-form-item prop="customerName" :rules="projectRole.customerName">
<span slot="label" style="" @click="getBaseList(102,1)"><a herf="#">所属客户</a></span>
<el-input v-model="dataForm.customerName" style="width: 130px" readonly @focus="getBaseList(102,1)"></el-input>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" :rules="projectRole">
<el-form-item :label="'项目名称'" prop="projectName" :rules="projectRole.projectName">
<el-input v-model="dataForm.projectName" style="width: 562px" ></el-input>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" >
<el-form-item :label="'项目描述'" >
<el-input v-model="dataForm.projectDesc" style="width: 562px" ></el-input>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" :rules="projectRole">
<el-form-item prop="projectSourceDesc" :rules="projectRole.buDesc">
<span slot="label" style="" @click="getBaseList(106,1)"><a herf="#">BU</a></span>
<el-input v-model="dataForm.buDesc" style="width: 130px" readonly @focus="getBaseList(106,1)"></el-input>
</el-form-item>
<el-form-item prop="projectSourceDesc" :rules="projectRole.projectSourceDesc">
<span slot="label" style="" @click="getBaseList(1011,1)"><a herf="#">项目来源</a></span>
<el-input v-model="dataForm.projectSourceDesc" style="width: 130px" readonly @focus="getBaseList(1011,1)"></el-input>
</el-form-item>
<el-form-item prop="priorityDesc" :rules="projectRole.priorityDesc">
<span slot="label" style="" @click="getBaseList(1012,1)"><a herf="#">优先级</a></span>
<el-input v-model="dataForm.priorityDesc" style="width: 130px" readonly @focus="getBaseList(1012,1)"></el-input>
</el-form-item>
<el-form-item :label="'要求日期:'" prop="needDate" :rules="projectRole.needDate">
<el-date-picker
style="width: 130px"
v-model="dataForm.needDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" :rules="projectRole">
<el-form-item prop="projectManagerName" :rules="projectRole.projectManagerName">
<span slot="label" style="" @click="managerChooseModal()"><a herf="#">项目经理</a></span>
<el-input v-model="dataForm.projectManagerName" readonly style="width: 274px" @focus="managerChooseModal()"></el-input>
</el-form-item>
<el-form-item prop="projectOwnerName" :rules="projectRole.projectOwnerName">
<span slot="label" style="" @click="ownerChooseModal()"><a herf="#">项目负责人</a></span>
<el-input v-model="dataForm.projectOwnerName" readonly style="width: 274px" @focus="ownerChooseModal()"></el-input>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" >
<el-form-item :label="'客户应用/要求'">
<el-input v-model="dataForm.customerRemark" style="width: 562px" ></el-input>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" >
<el-form-item :label="'其他要求'">
<el-input v-model="dataForm.remark" style="width: 562px" ></el-input>
</el-form-item>
</el-form>
<el-form :inline="true" label-position="top" label-width="100px" :rules="projectRole">
<el-form-item prop="userRoleName" :rules="projectRole.userRoleName">
<span slot="label" style="" @click="userRollModal()"><a herf="#">项目权限</a></span>
<el-input v-model="dataForm.userRoleName" style="width: 562px" @focus="userRollModal()"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dataFormSubmit()">{{'确定'}}</el-button>
<el-button type="primary" @click="visible = false">{{'关闭'}}</el-button>
</span>
</el-dialog>
<el-dialog
width="530px"
title="项目经理"
:close-on-click-modal="false"
:visible.sync="managerFlag">
<el-transfer class="rq" filterable v-model="projectManagerList" :props="{
key: 'operatorId',
label: 'operatorName'
}" :data="operatorList" :titles="['未选择', '已选择']"></el-transfer>
<span slot="footer" class="dialog-footer">
<div style="margin-top: 5px">
<el-button type="primary" @click="saveManagerList()">确定</el-button>
<el-button @click="managerFlag = false" type="primary">取消</el-button>
</div>
</span>
</el-dialog>
<el-dialog
width="530px"
title="项目负责人"
:close-on-click-modal="false"
:visible.sync="ownerFlag">
<el-transfer class="rq" filterable v-model="projectOwnerList" :props="{
key: 'operatorId',
label: 'operatorName'
}" :data="operatorList" :titles="['未选择', '已选择']"></el-transfer>
<span slot="footer" class="dialog-footer">
<div style="margin-top: 5px">
<el-button type="primary" @click="saveOwnerList()">确定</el-button>
<el-button @click="ownerFlag = false" type="primary">取消</el-button>
</div>
</span>
</el-dialog>
<el-dialog
width="530px"
title="权限"
:close-on-click-modal="false"
:visible.sync="userRoleFlag">
<el-table
:data="userRoleList"
border
:height="300"
v-loading="false"
style="width: 100%;">
<el-table-column
prop="username"
header-align="center"
align="center"
min-width="35"
label="账号">
</el-table-column>
<el-table-column
prop="userDisplay"
header-align="center"
align="center"
min-width="35"
label="姓名">
</el-table-column>
<el-table-column
prop=""
header-align="center"
align="center"
min-width="30"
label="">
<template slot-scope="scope">
<!-- 如果数据为Y,显示勾选框,否则不勾选 -->
<el-checkbox v-model="scope.row.checkAll" @change="changeAll(scope.row)"></el-checkbox>
</template>
</el-table-column>
<el-table-column
prop=""
header-align="center"
align="center"
min-width="30"
label="查询">
<template slot-scope="scope">
<!-- 如果数据为Y,显示勾选框,否则不勾选 -->
<el-checkbox v-model="scope.row.searchCheck" @change="changeCheck(scope.row,1)"></el-checkbox>
</template>
</el-table-column>
<el-table-column
prop=""
header-align="center"
align="center"
min-width="30"
label="修改">
<template slot-scope="scope">
<!-- 如果数据为Y,显示勾选框,否则不勾选 -->
<el-checkbox v-model="scope.row.updateCheck" @change="changeCheck(scope.row,2)"></el-checkbox>
</template>
</el-table-column>
<el-table-column
prop=""
header-align="center"
align="center"
min-width="30"
label="下载">
<template slot-scope="scope">
<!-- 如果数据为Y,显示勾选框,否则不勾选 -->
<el-checkbox v-model="scope.row.downCheck" @change="changeCheck(scope.row,3)"></el-checkbox>
</template>
</el-table-column>
<el-table-column
prop=""
header-align="center"
align="center"
min-width="30"
label="删除">
<template slot-scope="scope">
<!-- 如果数据为Y,显示勾选框,否则不勾选 -->
<el-checkbox v-model="scope.row.deleteCheck" @change="changeCheck(scope.row,4)"></el-checkbox>
</template>
</el-table-column>
</el-table>
<span slot="footer" class="dialog-footer">
<div style="margin-top: 5px">
<el-button type="primary" @click="saveUserList()">确定</el-button>
<el-button @click="userRoleFlag = false" type="primary">取消</el-button>
</div>
</span>
</el-dialog>
<Chooselist ref="baseList" @getBaseData="getBaseData"></Chooselist>
</div>
</template>
<script>
import {projectInfoSearch,
searchOperatorWithSite,
searchProjectTeamStr,
searchUserRoll,
saveProjectInfo,
} from "@/api/project/project.js"
import Chooselist from '@/views/modules/common/Chooselist'
export default {
components: {
Chooselist
},
data () {
return {
tagNo:'',
tagNo1:'',
visible: false,
treeVisible: false,
managerFlag:false,
userRoleFlag:false,
ownerFlag:false,
operatorList:[],
dataForm: {
id: 0,
site:this.$store.state.user.site,
projectLevel:1,
projectId:'',
projectTypeDb:'',
projectType:'',
customerName:'',
customerId:'',
projectName:'',
projectDesc:'',
needDate:'',
priority:'',
projectSource:'',
priorityDesc:'',
projectSourceDesc:'',
projectManagerName:'',
projectOwnerName:'',
customerRemark:'',
remark:'',
userRoleName:'',
projectManagerList:[],
projectOwnerList:[],
userRoleList:[],
buNo:[],
buDesc:[],
},
projectManagerList:[],
projectOwnerList:[],
userRoleList:[],
projectRole: {
projectLevel: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
projectType: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
customerName: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
projectName: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
buDesc: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
projectSourceDesc: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
priorityDesc: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
needDate: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
projectManagerName: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
projectOwnerName: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
userRoleName: [
{
required: true,
message: ' ',
trigger: 'change'
}
],
}
}
},
created () {
},
methods: {
// 获取基础数据列表S
getBaseList (val, type) {
this.tagNo = val
this.tagNo1 = type
this.$nextTick(() => {
let strVal = ''
if (val === 1010) {
if(type==1) {
strVal = this.dataForm.projectTypeDb
}
}
if (val === 106) {
if(type==1) {
strVal = this.dataForm.buNo
}
}
if (val === 102) {
if(type==1) {
strVal = this.dataForm.customerId
}
}
if (val === 1011) {
if(type==1) {
strVal = this.dataForm.projectSource
}
}
if (val === 1012) {
if(type==1) {
strVal = this.dataForm.priority
}
}
this.$refs.baseList.init(val, strVal)
})
},
/* 列表方法的回调 */
getBaseData (val) {
if (this.tagNo === 1010) {
if(this.tagNo1==1) {
this.dataForm.projectTypeDb = val.Base_id
this.dataForm.projectType = val.Base_desc
}
}
if (this.tagNo === 102) {
if(this.tagNo1==1) {
this.dataForm.customerId = val.Customer_no
this.dataForm.customerName = val.Customer_desc
}
}
if (this.tagNo === 1011) {
if(this.tagNo1==1) {
this.dataForm.projectSource = val.Base_id
this.dataForm.projectSourceDesc = val.Base_desc
}
}
if (this.tagNo === 1012) {
if(this.tagNo1==1) {
this.dataForm.priority = val.Base_id
this.dataForm.priorityDesc = val.Base_desc
}
}
if (this.tagNo === 106) {
if(this.tagNo1==1) {
this.dataForm.buNo = val.Bu_no
this.dataForm.buDesc = val.Bu_desc
}
}
},
init (id) {
this.dataForm.id = id || 0
if(this.dataForm.id!=0){
let inData={
page: 1,
limit: 10,
id:id
}
projectInfoSearch(inData).then(({data}) => {
if(data.page.list.length>0){
this.dataForm= data.page.list[0];
let inData={
site:this.dataForm.site,
projectId:this.dataForm.projectId,
type:'manager',
}
searchProjectTeamStr(inData).then(({data}) => {
this.dataForm.projectManagerList=data.rows
})
let inData2={
site:this.dataForm.site,
projectId:this.dataForm.projectId,
type:'owner',
}
searchProjectTeamStr(inData2).then(({data}) => {
this.dataForm.projectOwnerList=data.rows
})
let inData3={
site:this.dataForm.site,
projectId:this.dataForm.projectId,
}
searchUserRoll(inData3).then(({data}) => {
this.dataForm.userRoleList=data.rows
})
}
})
}else {
this.dataForm={
id: 0,
site:this.$store.state.user.site,
projectLevel:1,
projectId:'',
projectTypeDb:'',
projectType:'',
customerName:'',
customerId:'',
projectName:'',
projectDesc:'',
needDate:'',
priority:'',
projectSource:'',
priorityDesc:'',
projectSourceDesc:'',
projectManagerName:'',
projectOwnerName:'',
customerRemark:'',
remark:'',
userRoleName:'',
projectManagerList:[],
projectOwnerList:[],
buNo:'',
buDesc:'',
}
let inData={
site:this.dataForm.site,
projectId:this.dataForm.projectId,
}
searchUserRoll(inData).then(({data}) => {
this.dataForm.userRoleList=data.rows
})
}
this.visible = true
},
managerChooseModal(){
let inData={
site:this.dataForm.site,
projectId:this.dataForm.projectId,
}
searchOperatorWithSite(inData).then(({data}) => {
this.operatorList=data.rows
})
this.projectManagerList = JSON.parse(JSON.stringify(this.dataForm.projectManagerList));
this.managerFlag=true
},
saveManagerList(){
let projectManagerName='';
for (let i = 0; i < this.projectManagerList.length; i++) {
let select= this.operatorList.filter(item => item.operatorId === this.projectManagerList[i])
if(select.length>0){
projectManagerName+=select[0].operatorName+';'
}
}
this.dataForm.projectManagerName=projectManagerName
this.dataForm.projectManagerList=JSON.parse(JSON.stringify(this.projectManagerList));
this.managerFlag=false
},
ownerChooseModal(){
let inData={
site:this.dataForm.site,
projectId:this.dataForm.projectId,
}
searchOperatorWithSite(inData).then(({data}) => {
this.operatorList=data.rows
})
this.projectOwnerList = JSON.parse(JSON.stringify(this.dataForm.projectOwnerList));
this.ownerFlag=true
},
saveOwnerList(){
let projectOwnerName='';
for (let i = 0; i < this.projectOwnerList.length; i++) {
let select= this.operatorList.filter(item => item.operatorId === this.projectOwnerList[i])
if(select.length>0){
projectOwnerName+=select[0].operatorName+';'
}
}
this.dataForm.projectOwnerName=projectOwnerName
this.dataForm.projectOwnerList=JSON.parse(JSON.stringify(this.projectOwnerList));
this.ownerFlag=false
},
userRollModal(){
this.userRoleList=JSON.parse(JSON.stringify(this.dataForm.userRoleList));
for (let i = 0; i <this.userRoleList.length ; i++) {
if(this.userRoleList[i].username==this.$store.state.user.name){
this.userRoleList[i].searchCheck=true;
this.userRoleList[i].updateCheck=true;
this.userRoleList[i].downCheck=true;
this.userRoleList[i].deleteCheck=true;
this.userRoleList[i].searchFlag='Y'
this.userRoleList[i].updateFlag='Y'
this.userRoleList[i].downFlag='Y'
this.userRoleList[i].deleteFlag='Y'
}
}
this.userRoleFlag=true
},
saveUserList(){
for (let i = 0; i <this.userRoleList.length ; i++) {
if(this.userRoleList[i].username==this.$store.state.user.name){
this.userRoleList[i].searchCheck=true;
this.userRoleList[i].updateCheck=true;
this.userRoleList[i].downCheck=true;
this.userRoleList[i].deleteCheck=true;
this.userRoleList[i].searchFlag='Y'
this.userRoleList[i].updateFlag='Y'
this.userRoleList[i].downFlag='Y'
this.userRoleList[i].deleteFlag='Y'
}
}
let name= '';
for (let i = 0; i < this.userRoleList.length; i++) {
if(this.userRoleList[i].searchCheck||this.userRoleList[i].updateCheck||this.userRoleList[i].downCheck||this.userRoleList[i].deleteCheck){
name+=this.userRoleList[i].userDisplay+';'
}
}
this.dataForm.userRoleName=name
this.dataForm.userRoleList=JSON.parse(JSON.stringify(this.userRoleList));
this.userRoleFlag=false
},
changeAll(row){
if(row.checkAll){
row.searchCheck=true;
row.updateCheck=true;
row.downCheck=true;
row.deleteCheck=true;
row.searchFlag='Y'
row.updateFlag='Y'
row.downFlag='Y'
row.deleteFlag='Y'
}else {
row.searchCheck=false;
row.updateCheck=false;
row.downCheck=false;
row.deleteCheck=false;
row.searchFlag='N'
row.updateFlag='N'
row.downFlag='N'
row.deleteFlag='N'
}
},
changeCheck(row,type){
if(type==1){
if(row.searchCheck){
row.searchFlag='Y'
}else {
row.searchFlag='N'
}
}
if(type==2){
if(row.updateCheck){
row.updateFlag='Y'
}else {
row.updateFlag='N'
}
}
if(type==3){
if(row.downCheck){
row.downFlag='Y'
}else {
row.downFlag='N'
}
}
if(type==4){
if(row.deleteCheck){
row.deleteFlag='Y'
}else {
row.deleteFlag='N'
}
}
if(row.searchCheck&&row.updateCheck&&row.downCheck&&row.deleteCheck){
row.checkAll=true
}else{
row.checkAll=false
}
this.$forceUpdate();
},
// 表单提交
dataFormSubmit () {
if(this.dataForm.projectTypeDb==''||this.dataForm.projectTypeDb==null){
this.$alert('请选择项目类型', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.customerId==''||this.dataForm.customerId==null){
this.$alert('请选择所属客户', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.projectName==''||this.dataForm.projectName==null){
this.$alert('请输入项目名称', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.projectSource==''||this.dataForm.projectSource==null){
this.$alert('请选择项目来源', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.buDesc==''||this.dataForm.buDesc==null){
this.$alert('请选择BU', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.priority==''||this.dataForm.priority==null){
this.$alert('请选择优先级', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.needDate==''||this.dataForm.needDate==null){
this.$alert('请选择要求日期', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.projectManagerName==''||this.dataForm.projectManagerName==null){
this.$alert('请选择项目经理', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.projectOwnerName==''||this.dataForm.projectOwnerName==null){
this.$alert('请选择项目负责人', '错误', {
confirmButtonText: '确定'
})
return false;
}
if(this.dataForm.userRoleName==''||this.dataForm.userRoleName==null){
this.$alert('请选择权限', '错误', {
confirmButtonText: '确定'
})
return false;
}
saveProjectInfo(this.dataForm).then(({data}) => {
if (data && data.code === 0) {
this.$message.success( '操作成功')
this.visible = false
this.$emit('refreshDataList')
} else {
this.$message.error(data.msg)
}
})
},
},
}
</script>
<style >
.el-transfer-panel {
border: 2px solid #17b3a3;
border-radius: 4px;
overflow: hidden;
background: #fff;
display: inline-block;
vertical-align: middle;
width: 200px;
max-height: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.el-transfer-panel .el-transfer-panel__header {
height: 40px;
line-height: 40px;
background: #17b3a3;
margin: 0;
padding-left: 15px;
border-bottom: 1px solid #17b3a3;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #000;
}
.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label {
font-size: 14px;
color: #303133;
font-weight: 400;
}
</style>