1348 lines
63 KiB
Vue
1348 lines
63 KiB
Vue
|
<template>
|
|||
|
|
<awsui-layout id="methodAttribute" :style="{height: mainHeight}">
|
|||
|
|
<awsui-aside class="attr-aside" width="280px">
|
|||
|
|
<div style="height: 60px;line-height: 60px;text-align: center;">
|
|||
|
|
<awsui-button style="width: 130px;" :disabled="createBtnDisabled" :class="{'button-general-color': !createBtnDisabled}" type="primary" @click="createAttrDefine">新建属性</awsui-button>
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
<div style="border-bottom: 1px solid #F0F0F0;"></div>
|
|||
|
|
</div>
|
|||
|
|
<div :style="{'overflow': 'auto', 'height': treeHeight}">
|
|||
|
|
<el-tree
|
|||
|
|
ref="tree"
|
|||
|
|
v-loading="tree.loading"
|
|||
|
|
:element-loading-text="tree.loadingText"
|
|||
|
|
:data="tree.data"
|
|||
|
|
:props="tree.props"
|
|||
|
|
:highlight-current=true
|
|||
|
|
:expand-on-click-node=false
|
|||
|
|
@node-click="handleNodeClick"
|
|||
|
|
node-key="id"
|
|||
|
|
:default-expanded-keys="tree.defaultExpandedKeys">
|
|||
|
|
<span slot-scope="{node, data}">
|
|||
|
|
<i class="awsui-iconfont tree-content-icon tree-content-icon-padding" :style="{'color': data.iconColor}" v-html="node.data.iconCode"></i>
|
|||
|
|
<span>{{node.label}}</span>
|
|||
|
|
<span v-if="methodDataType != 'all' && data.type == 'attr'"><i class="awsui-iconfont" :style="{'margin-left': '3px','font-size':'13px','color': data.isUse ? '#00CC00' : '#DDDDDD'}"></i></span>
|
|||
|
|
</span>'
|
|||
|
|
</el-tree>
|
|||
|
|
</div>
|
|||
|
|
</awsui-aside>
|
|||
|
|
<awsui-main style="height: 100%;position: relative;">
|
|||
|
|
<div v-if="methodDataType == 'all'" :key="key1">
|
|||
|
|
<el-table
|
|||
|
|
:height="(parseInt(mainHeight) - 20 + 'px')"
|
|||
|
|
:data="tableData"
|
|||
|
|
v-loading="loading"
|
|||
|
|
:element-loading-text="loadingText"
|
|||
|
|
:row-style="{height:'50px'}"
|
|||
|
|
:cell-style="{padding:'0px'}"
|
|||
|
|
@cell-click="updateAttrDefine"
|
|||
|
|
style="width: 100%">
|
|||
|
|
<el-table-column
|
|||
|
|
prop="no"
|
|||
|
|
label="序号"
|
|||
|
|
width="80"
|
|||
|
|
align="center"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="title"
|
|||
|
|
label="属性名称"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="key"
|
|||
|
|
label="属性代码"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="typeName"
|
|||
|
|
label="属性类型"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="refName"
|
|||
|
|
label="关联内容"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="groupPathName"
|
|||
|
|
label="所属目录"
|
|||
|
|
width="160"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="value"
|
|||
|
|
label="默认值"
|
|||
|
|
width="120"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="scopeName"
|
|||
|
|
label="作用范围"
|
|||
|
|
min-width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="readonly"
|
|||
|
|
label="是否只读"
|
|||
|
|
width="80"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-switch
|
|||
|
|
v-model="scope.row.readonly"
|
|||
|
|
active-color="#4E7FF9"
|
|||
|
|
inactive-color="#E2E2E2"
|
|||
|
|
:disabled="scope.row.type == 'relation' || scope.row.type == 'awsorg'"
|
|||
|
|
@change="handleChangeReadonlyAndValid(scope.row.id, scope.row.title, scope.row.readonly,scope.row.isRequired, scope.row.isValid)">
|
|||
|
|
</awsui-switch>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="readonly"
|
|||
|
|
label="是否必填"
|
|||
|
|
width="80"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-switch
|
|||
|
|
v-model="scope.row.isRequired"
|
|||
|
|
active-color="#4E7FF9"
|
|||
|
|
inactive-color="#E2E2E2"
|
|||
|
|
@change="handleChangeReadonlyAndValid(scope.row.id, scope.row.title, scope.row.readonly,scope.row.isRequired, scope.row.isValid)">
|
|||
|
|
</awsui-switch>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="isValid"
|
|||
|
|
label="是否有效"
|
|||
|
|
width="80"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-switch
|
|||
|
|
v-model="scope.row.isValid"
|
|||
|
|
active-color="#4E7FF9"
|
|||
|
|
inactive-color="#E2E2E2"
|
|||
|
|
@change="handleChangeReadonlyAndValid(scope.row.id, scope.row.title, scope.row.readonly,scope.row.isRequired, scope.row.isValid)">
|
|||
|
|
</awsui-switch>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="operation"
|
|||
|
|
label="操作"
|
|||
|
|
width="50">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div class="operate-icon-display">
|
|||
|
|
<i class="el-icon-delete" style="cursor: pointer;" @click.stop="removeAttr(scope.row.id, scope.row.title)"></i>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
<div v-if="methodDataType == 'file'" class="attr" :key="key2">
|
|||
|
|
<el-table
|
|||
|
|
row-key="id"
|
|||
|
|
:height="(parseInt(mainHeight) - 20 + 'px')"
|
|||
|
|
v-loading="loading"
|
|||
|
|
:element-loading-text="loadingText"
|
|||
|
|
:data="tableData"
|
|||
|
|
:row-style="{height:'50px'}"
|
|||
|
|
:cell-style="{padding:'0px'}"
|
|||
|
|
@cell-mouse-enter="handleAttrMouseEnter"
|
|||
|
|
@cell-mouse-leave="handleAttrMouseLeave"
|
|||
|
|
style="width: 100%">
|
|||
|
|
<el-table-column
|
|||
|
|
prop="move"
|
|||
|
|
label=""
|
|||
|
|
align="center"
|
|||
|
|
width="20">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div class="operate-icon-display">
|
|||
|
|
<p class="text-second-color">
|
|||
|
|
<i style="display: inline-block;cursor: pointer;" class="awsui-iconfont"></i>
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="no"
|
|||
|
|
label="排序"
|
|||
|
|
width="80"
|
|||
|
|
align="center"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="key"
|
|||
|
|
label="属性代码"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="title"
|
|||
|
|
label="属性名称(默认)"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="newTitle"
|
|||
|
|
label="属性名称"
|
|||
|
|
width="180">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-input v-if="scope.row.isUpdate" class="input-update-attr-name" v-model="scope.row.newTitle" @input="updateAttrDbInfo(scope.row.id, scope.row.newTitle, scope.row.sort)" placeholder="请输入新的属性名称"></awsui-input>
|
|||
|
|
<span v-else>{{scope.row.newTitle}}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="typeName"
|
|||
|
|
label="属性类型"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="refName"
|
|||
|
|
label="关联内容"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="value"
|
|||
|
|
label="默认值"
|
|||
|
|
width="150"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="readonly"
|
|||
|
|
label="只读"
|
|||
|
|
width="100"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
{{scope.row.readonly ? "是" : "否"}}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="groupPathName"
|
|||
|
|
label="所属目录"
|
|||
|
|
width="160"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="scopeName"
|
|||
|
|
label="作用范围"
|
|||
|
|
min-width="200"/>
|
|||
|
|
<el-table-column v-if="methodId=='process.bpmn2'"
|
|||
|
|
prop="bpmFileShow"
|
|||
|
|
label="审批显示"
|
|||
|
|
width="100"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-switch
|
|||
|
|
v-model="scope.row.bpmFileShow"
|
|||
|
|
active-color="#4E7FF9"
|
|||
|
|
inactive-color="#E2E2E2"
|
|||
|
|
@change="handleChangeBpmShow(scope.row.id, scope.row.title, scope.row.bpmFileShow, 'bpmFileShow')">
|
|||
|
|
</awsui-switch>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
<div v-if="methodDataType == 'shape'" class="attr" :key="key3">
|
|||
|
|
<el-table
|
|||
|
|
row-key="id"
|
|||
|
|
:height="(parseInt(mainHeight) - 20 + 'px')"
|
|||
|
|
v-loading="loading"
|
|||
|
|
:element-loading-text="loadingText"
|
|||
|
|
:data="tableData"
|
|||
|
|
:row-style="{height:'50px'}"
|
|||
|
|
:cell-style="{padding:'0px'}"
|
|||
|
|
@cell-mouse-enter="handleAttrMouseEnter"
|
|||
|
|
@cell-mouse-leave="handleAttrMouseLeave"
|
|||
|
|
style="width: 100%">
|
|||
|
|
<el-table-column
|
|||
|
|
prop="move"
|
|||
|
|
label=""
|
|||
|
|
align="center"
|
|||
|
|
width="20">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div class="operate-icon-display">
|
|||
|
|
<p class="text-second-color">
|
|||
|
|
<i style="display: inline-block;cursor: pointer;" class="awsui-iconfont"></i>
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="no"
|
|||
|
|
label="排序"
|
|||
|
|
width="80"
|
|||
|
|
align="center"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="key"
|
|||
|
|
label="属性代码"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="title"
|
|||
|
|
label="属性名称(默认)"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="newTitle"
|
|||
|
|
label="属性名称"
|
|||
|
|
width="180">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-input v-if="scope.row.isUpdate" class="input-update-attr-name" v-model="scope.row.newTitle" @input="updateAttrDbInfo(scope.row.id, scope.row.newTitle, scope.row.sort)" placeholder="请输入新的属性名称"></awsui-input>
|
|||
|
|
<span v-else>{{scope.row.newTitle}}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="typeName"
|
|||
|
|
label="属性类型"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="refName"
|
|||
|
|
label="关联内容"
|
|||
|
|
width="180"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="value"
|
|||
|
|
label="默认值"
|
|||
|
|
width="120"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="readonly"
|
|||
|
|
label="只读"
|
|||
|
|
width="100"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
{{scope.row.readonly ? "是" : "否"}}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="groupPathName"
|
|||
|
|
label="所属目录"
|
|||
|
|
width="160"/>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="scopeName"
|
|||
|
|
label="作用范围"
|
|||
|
|
min-width="200"/>
|
|||
|
|
<el-table-column v-if="methodId=='process.bpmn2'"
|
|||
|
|
prop="bpmShapeShow"
|
|||
|
|
label="审批显示"
|
|||
|
|
width="100"
|
|||
|
|
align="center">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<awsui-switch
|
|||
|
|
v-model="scope.row.bpmShapeShow"
|
|||
|
|
active-color="#4E7FF9"
|
|||
|
|
inactive-color="#E2E2E2"
|
|||
|
|
@change="handleChangeBpmShow(scope.row.id, scope.row.title, scope.row.bpmShapeShow, 'bpmShapeShow')">
|
|||
|
|
</awsui-switch>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
</awsui-main>
|
|||
|
|
<!-- 属性弹框 -->
|
|||
|
|
<awsui-sidebar
|
|||
|
|
:title=drawer.title
|
|||
|
|
:append-to-body=false
|
|||
|
|
:modal-append-to-body=false
|
|||
|
|
:destroy-on-close=true
|
|||
|
|
:modal=false
|
|||
|
|
:visible.sync="drawer.visible"
|
|||
|
|
:before-close="handleDrawerClose">
|
|||
|
|
<div v-loading="drawer.loading">
|
|||
|
|
<div id="drawerBody" style="overflow-y: auto;margin: 20px 0 20px 20px;padding-left: 10px">
|
|||
|
|
<awsui-form ref="attrForm" :model="attrForm" label-position="top" :rules="rules" style= "margin-right: 20px;">
|
|||
|
|
<awsui-form-item label="属性代码" prop="key">
|
|||
|
|
<awsui-input v-model="attrForm.key" :disabled="!attrForm.isCreate" placeholder="请输入属性代码，由数字、字母、下划线组成"></awsui-input>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="属性名称" prop="title">
|
|||
|
|
<awsui-input v-model="attrForm.title" placeholder="请输入属性名称"></awsui-input>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="所属目录">
|
|||
|
|
<awsui-select v-model="attrForm.groupPath" :options="attrForm.groupOpts"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="类型">
|
|||
|
|
<awsui-select v-model="attrForm.type" :disabled="!attrForm.isCreate" :options="attrForm.typeOpts" @change="changeAttrType"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="属性描述" prop="desc">
|
|||
|
|
<awsui-input v-model="attrForm.desc" placeholder="请输入属性描述"></awsui-input>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<!-- relation限制 -->
|
|||
|
|
<template v-if="attrForm.type=='relation'">
|
|||
|
|
<awsui-form-item label="关联的建模方法">
|
|||
|
|
<awsui-select v-model="attrForm.relationRef.method" :options="attrForm.relationMethodScopeOpts" placeholder="请选择建模分类或建模方法"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="关联范围">
|
|||
|
|
<awsui-select v-model="attrForm.relationRef.type" :options="attrForm.relationTypeOpts" placeholder="请选择关联范围"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="是否多选">
|
|||
|
|
<awsui-select v-model="attrForm.relationRef.multiple" :options="attrForm.multipleOpts" placeholder="请选择关联范围"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
</template>
|
|||
|
|
<!-- awsorg限制 -->
|
|||
|
|
<template v-if="attrForm.type=='awsorg'">
|
|||
|
|
<awsui-form-item label="BPM组织架构范围选择">
|
|||
|
|
<awsui-select v-model="attrForm.awsorgRef.scope" multiple :options="attrForm.awsorgScopeOpts" multiple placeholder="请选择组织架构范围"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="是否多选">
|
|||
|
|
<awsui-select v-model="attrForm.awsorgRef.multiple" :options="attrForm.multipleOpts" placeholder="请选择关联范围"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
</template>
|
|||
|
|
<!-- select限制 -->
|
|||
|
|
<template v-if="attrForm.type=='select'">
|
|||
|
|
<awsui-form-item label="选择范围">
|
|||
|
|
<awsui-input v-model="attrForm.ref" placeholder="请输入选择范围，例如选项1,选项2,选项3"></awsui-input>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
</template>
|
|||
|
|
<!-- select_m限制 -->
|
|||
|
|
<template v-if="attrForm.type=='select_m'">
|
|||
|
|
<awsui-form-item label="选择范围">
|
|||
|
|
<awsui-input v-model="attrForm.ref" placeholder="请输入选择范围，例如选项1,选项2,选项3"></awsui-input>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="attrForm.type=='string' || attrForm.type=='textarea'">
|
|||
|
|
<awsui-form-item label="默认值" prop="value">
|
|||
|
|
<awsui-input v-model="attrForm.value" placeholder="请输入属性默认值"></awsui-input>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
</template>
|
|||
|
|
<awsui-form-item label="">
|
|||
|
|
<div
|
|||
|
|
class="div-button-small"
|
|||
|
|
:style="{'border-right': '0px','cursor':readOnlyCursor ? 'not-allowed':'', 'background-color': attrForm.readonly ? '#eef5fe' : '', 'color': attrForm.readonly ? '#4E7FF9' : ''}"
|
|||
|
|
@click="(!readOnlyCursor) && changeReadOnly()"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
<span>只读</span>
|
|||
|
|
</div>
|
|||
|
|
<div
|
|||
|
|
class="div-button-small"
|
|||
|
|
:style="{'border-right': '0px','background-color': attrForm.isRequired ? '#eef5fe' : '', 'color': attrForm.isRequired ? '#4E7FF9' : ''}"
|
|||
|
|
@click="attrForm.isRequired = attrForm.isRequired ? false : true">
|
|||
|
|
<span>必填</span>
|
|||
|
|
</div>
|
|||
|
|
<div
|
|||
|
|
class="div-button-small"
|
|||
|
|
:style="{'background-color': attrForm.isValid ? '#eef5fe' : '', 'color': attrForm.isValid ? '#4E7FF9' : ''}"
|
|||
|
|
@click="attrForm.isValid = attrForm.isValid ? false : true">
|
|||
|
|
<span>有效</span>
|
|||
|
|
</div>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item label="作用范围">
|
|||
|
|
<div
|
|||
|
|
class="div-button"
|
|||
|
|
:style="{'border-right': '0px', 'background-color': attrForm.fileScope ? '#eef5fe' : '', 'color': attrForm.fileScope ? '#4E7FF9' : ''}"
|
|||
|
|
@click="attrForm.fileScope = attrForm.fileScope ? false : true">
|
|||
|
|
<span>文件属性</span>
|
|||
|
|
</div>
|
|||
|
|
<div
|
|||
|
|
class="div-button"
|
|||
|
|
:style="{'background-color': attrForm.shapeScope ? '#eef5fe' : '', 'color': attrForm.shapeScope ? '#4E7FF9' : ''}"
|
|||
|
|
@click="attrForm.shapeScope = attrForm.shapeScope ? false : true">
|
|||
|
|
<span>形状属性</span>
|
|||
|
|
</div>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
<awsui-form-item v-if="attrForm.shapeScope" label="形状选择">
|
|||
|
|
<awsui-select v-model="attrForm.shapeScopeValue" placeholder="空值则等同于全选" clearable multiple :options="attrForm.shapeOpts"></awsui-select>
|
|||
|
|
</awsui-form-item>
|
|||
|
|
</awsui-form>
|
|||
|
|
</div>
|
|||
|
|
<div class="drawer-footer" :style="{'background-color': '#F2F2F2', height: drawer.footerHeight}">
|
|||
|
|
<div id="drawerFooter" style="float: right;position: relative;top: 9px;">
|
|||
|
|
<awsui-button size="large" style="width: 80px;" class="button-general-color" type="primary" :disabled="drawer.buttonDisabled" @click="saveDrawerData">保存</awsui-button>
|
|||
|
|
<awsui-button size="large" style="width: 80px;" @click="closeDrawer">取消</awsui-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</awsui-sidebar>
|
|||
|
|
</awsui-layout>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import awsuiAxios from "../../awsuiAxios";
|
|||
|
|
import Sortable from 'sortablejs';
|
|||
|
|
export default {
|
|||
|
|
name: "MethodAttribute",
|
|||
|
|
components: {Sortable},
|
|||
|
|
props: {
|
|||
|
|
parentHeaderHeight: {
|
|||
|
|
type: String,
|
|||
|
|
default: '0px'
|
|||
|
|
},
|
|||
|
|
methodId: {
|
|||
|
|
type: String,
|
|||
|
|
default: ''
|
|||
|
|
},
|
|||
|
|
methodName: {
|
|||
|
|
type: String,
|
|||
|
|
default: ''
|
|||
|
|
},
|
|||
|
|
searchInput: {
|
|||
|
|
type: String,
|
|||
|
|
default: ''
|
|||
|
|
},
|
|||
|
|
methodDataType: {// 数据查询类型，全部，文件属性，形状属性
|
|||
|
|
type: String,
|
|||
|
|
default: 'all'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
readOnlyCursor: false,
|
|||
|
|
key1: Math.random(),
|
|||
|
|
key2: Math.random(),
|
|||
|
|
key3: Math.random(),
|
|||
|
|
createBtnDisabled: false,
|
|||
|
|
mainHeight: (parseInt(this.$store.getters.getTopMainHeightFn) - parseInt(this.parentHeaderHeight)) + 'px',
|
|||
|
|
treeHeight: (parseInt(this.$store.getters.getTopMainHeightFn) - parseInt(this.parentHeaderHeight) - 61) + 'px',
|
|||
|
|
loading: false,
|
|||
|
|
loadingText: '加载中',
|
|||
|
|
tree: {
|
|||
|
|
data: [],
|
|||
|
|
defaultExpandedKeys: [],
|
|||
|
|
props: {
|
|||
|
|
children: 'children',
|
|||
|
|
label: 'label'
|
|||
|
|
},
|
|||
|
|
loading: false,
|
|||
|
|
loadingText: '加载中'
|
|||
|
|
},
|
|||
|
|
tableData: [],
|
|||
|
|
tableDataTemp: [],
|
|||
|
|
nodeData: null,
|
|||
|
|
drawer: {
|
|||
|
|
title: '新增属性',
|
|||
|
|
visible: false,
|
|||
|
|
loading: false,
|
|||
|
|
footerHeight: '50px',
|
|||
|
|
buttonDisabled: false
|
|||
|
|
},
|
|||
|
|
attrForm: {
|
|||
|
|
isCreate: true,// 是否新建
|
|||
|
|
id: '',
|
|||
|
|
key: '',
|
|||
|
|
title: '',
|
|||
|
|
newTitle: '',
|
|||
|
|
type: '',
|
|||
|
|
desc: '',
|
|||
|
|
ref: '',
|
|||
|
|
relationRef: {// 关联pal组织架构
|
|||
|
|
method: '',
|
|||
|
|
type: '',
|
|||
|
|
multiple: 'false',
|
|||
|
|
},
|
|||
|
|
awsorgRef: {// 关联bpm组织架构
|
|||
|
|
scope: [],
|
|||
|
|
multiple: 'false'
|
|||
|
|
},
|
|||
|
|
value: '',
|
|||
|
|
readonly: false,
|
|||
|
|
isRequired: false,
|
|||
|
|
isValid: true,
|
|||
|
|
groupPathName: '',
|
|||
|
|
groupPath: '',
|
|||
|
|
fileScope: false,
|
|||
|
|
shapeScope: false,
|
|||
|
|
shapeScopeValue: [],
|
|||
|
|
scopeName: '',
|
|||
|
|
sort: '',
|
|||
|
|
bpmFileShow: false,
|
|||
|
|
bpmShapeShow: false,
|
|||
|
|
|
|||
|
|
typeOpts: [],
|
|||
|
|
relationMethodScopeOpts: [],
|
|||
|
|
relationTypeOpts: [],
|
|||
|
|
awsorgScopeOpts: [],
|
|||
|
|
multipleOpts: [
|
|||
|
|
{
|
|||
|
|
"label" : '多选',
|
|||
|
|
"value" : "true"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"label" : '单选',
|
|||
|
|
"value" : "false"// value为false select不识别，改为字符串false
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
groupOpts: [],
|
|||
|
|
shapeOpts: []
|
|||
|
|
},
|
|||
|
|
rules: {
|
|||
|
|
key: [
|
|||
|
|
{ required: true, message: '请输入属性代码', trigger: 'blur' },
|
|||
|
|
{ min: 1, max: 255, message: '长度在 255 个字符以内', trigger: 'blur' }
|
|||
|
|
],
|
|||
|
|
title: [
|
|||
|
|
{ required: true, message: '请输入属性名称', trigger: 'blur' },
|
|||
|
|
{ min: 1, max: 255, message: '长度在 255 个字符以内', trigger: 'blur' }
|
|||
|
|
],
|
|||
|
|
value: [
|
|||
|
|
{ required: false, message: '请输入属性名称', trigger: 'blur' },
|
|||
|
|
{ min: 1, max: 255, message: '长度在 255 个字符以内', trigger: 'blur' }
|
|||
|
|
],
|
|||
|
|
desc: [
|
|||
|
|
{ required: true, message: '请输入属性描述', trigger: 'blur' },
|
|||
|
|
{ min: 1, max: 20, message: '长度在 20 个字符以内', trigger: 'blur' }
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
// 火狐浏览器拖拽问题
|
|||
|
|
document.body.ondrop = function (event) {
|
|||
|
|
event.preventDefault();
|
|||
|
|
event.stopPropagation();
|
|||
|
|
}
|
|||
|
|
this.initTreeData();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
initTreeData() {// 初始化树
|
|||
|
|
const that = this;
|
|||
|
|
that.tree.loadingText = '加载中';
|
|||
|
|
that.tree.loading = true;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_tree_data_query',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
wsId: that.$store.getters.getWsIdFn
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
|
|||
|
|
that.tree.loading = false;
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
if (ro.data.length > 0) {
|
|||
|
|
that.tree.defaultExpandedKeys.push(ro.data[0].id);
|
|||
|
|
}
|
|||
|
|
for (let i = 0; i < ro.data.length; i++) {
|
|||
|
|
if (ro.data.children) {
|
|||
|
|
for (let j = 0; j < ro.data.children.length; j++) {
|
|||
|
|
ro.data[i].children[j].isUse = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
that.tree.data = ro.data;
|
|||
|
|
that.initTableData();
|
|||
|
|
} else {
|
|||
|
|
alert('请求响应错误');
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
that.loading = false;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
initTableData() {// 初始化表格
|
|||
|
|
const that = this;
|
|||
|
|
that.tableData = [];
|
|||
|
|
this.tableDataTemp = [];
|
|||
|
|
that.loadingText = '加载中';
|
|||
|
|
that.loading = true;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_table_data_query',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
wsId: that.$store.getters.getWsIdFn,
|
|||
|
|
type: that.methodDataType
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
|
|||
|
|
that.loading = false;
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
const lightTreeIds = [];
|
|||
|
|
for (let i = 0; i < ro.data.length; i++) {
|
|||
|
|
ro.data[i].randomNum = Math.random();
|
|||
|
|
if (that.methodDataType != 'all') {
|
|||
|
|
ro.data[i].isUpdate = false;
|
|||
|
|
if (ro.data[i].isUse) {
|
|||
|
|
lightTreeIds.push(ro.data[i].id);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 处理树右侧点亮图标
|
|||
|
|
for (let i = 0; i < that.tree.data.length; i++) {
|
|||
|
|
if (that.tree.data[i].children) {
|
|||
|
|
for (let j = 0; j < that.tree.data[i].children.length; j++) {
|
|||
|
|
if (lightTreeIds.indexOf(that.tree.data[i].children[j].id) > -1) {
|
|||
|
|
that.tree.data[i].children[j].isUse = true;
|
|||
|
|
} else {
|
|||
|
|
that.tree.data[i].children[j].isUse = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
that.tableDataTemp = ro.data;
|
|||
|
|
that.search();
|
|||
|
|
if (that.methodDataType != 'all') {
|
|||
|
|
that.$nextTick(function(){
|
|||
|
|
that.rowDrop();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
alert('请求响应错误');
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
that.loading = false;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
search() {// 查询
|
|||
|
|
if (this.nodeData == null) {
|
|||
|
|
const data = JSON.parse(JSON.stringify(this.tableDataTemp));
|
|||
|
|
for (let i = 0; i < data.length; i++) {
|
|||
|
|
data[i].no = i + 1;
|
|||
|
|
}
|
|||
|
|
this.tableData = data;
|
|||
|
|
} else {
|
|||
|
|
const data = [];
|
|||
|
|
let index = 1;
|
|||
|
|
if (this.nodeData.type == 'group') {
|
|||
|
|
for (let i = 0; i < this.tableDataTemp.length; i++) {
|
|||
|
|
if (this.tableDataTemp[i].groupPath == this.nodeData.id) {
|
|||
|
|
const item = JSON.parse(JSON.stringify(this.tableDataTemp[i]));
|
|||
|
|
item.no = index++;
|
|||
|
|
data.push(item);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
for (let i = 0; i < this.tableDataTemp.length; i++) {
|
|||
|
|
if (this.tableDataTemp[i].key == this.nodeData.id) {
|
|||
|
|
const item = JSON.parse(JSON.stringify(this.tableDataTemp[i]));
|
|||
|
|
item.no = index++;
|
|||
|
|
data.push(item);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
this.tableData = data;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//行拖拽
|
|||
|
|
rowDrop() {
|
|||
|
|
const tbody = document.querySelector('.el-table__body-wrapper tbody')
|
|||
|
|
const that = this;
|
|||
|
|
Sortable.create(tbody, {
|
|||
|
|
onEnd({ newIndex, oldIndex }) {
|
|||
|
|
if (newIndex != oldIndex) {
|
|||
|
|
const oldId = that.tableData[oldIndex].id;// 被拖拽的属性
|
|||
|
|
let referenceId = '';
|
|||
|
|
let position = '';
|
|||
|
|
// 重点在整体混合排序之后点击树大类进行某个大类之下的属性单独排序的处理
|
|||
|
|
if (newIndex - oldIndex == 1) {// 下移一位
|
|||
|
|
referenceId = that.tableData[newIndex].id;
|
|||
|
|
position = 'bottom';
|
|||
|
|
} else if (oldIndex - newIndex == 1) {// 上移一位
|
|||
|
|
referenceId = that.tableData[newIndex].id;
|
|||
|
|
position = 'top';
|
|||
|
|
} else if (newIndex == 0) {// 拖拽到开头位置
|
|||
|
|
// 放置在原0位置属性的上方
|
|||
|
|
referenceId = that.tableData[0].id;
|
|||
|
|
position = 'top';// oldId在referenceId的上方
|
|||
|
|
} else if (newIndex == that.tableData.length - 1) {// 放到了结尾位置
|
|||
|
|
// 放置在原结尾位置属性的下方
|
|||
|
|
referenceId = that.tableData[that.tableData.length - 1].id;
|
|||
|
|
position = 'bottom';// oldId在referenceId的下方
|
|||
|
|
} else {// 放到了中间位置
|
|||
|
|
// 放置在原位置属性的上方
|
|||
|
|
referenceId = that.tableData[newIndex].id;
|
|||
|
|
position = 'top';// oldId在referenceId的上方
|
|||
|
|
}
|
|||
|
|
// 修改dataTableTemp
|
|||
|
|
let currRow = null;// 被拖拽的行
|
|||
|
|
for (let i = 0; i < that.tableDataTemp.length; i++) {
|
|||
|
|
if (that.tableDataTemp[i].id == oldId) {
|
|||
|
|
currRow = that.tableDataTemp.splice(i, 1)[0];// 删除此行
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 移动位置
|
|||
|
|
for (let i = 0; i < that.tableDataTemp.length; i++) {
|
|||
|
|
if (that.tableDataTemp[i].id == referenceId) {
|
|||
|
|
if (position == 'top') {
|
|||
|
|
that.tableDataTemp.splice(i, 0, currRow);
|
|||
|
|
break;
|
|||
|
|
} else if (position == 'bottom') {
|
|||
|
|
that.tableDataTemp.splice(i+1, 0, currRow);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 保存
|
|||
|
|
const attrs = [];
|
|||
|
|
for (let i = 0; i < that.tableDataTemp.length; i++) {
|
|||
|
|
attrs.push({
|
|||
|
|
id: that.tableDataTemp[i].id,
|
|||
|
|
newTitle: that.tableDataTemp[i].newTitle
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_file_and_shape_sort_update',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
wsId: that.$store.getters.getWsIdFn,
|
|||
|
|
type: that.methodDataType,
|
|||
|
|
attrs: JSON.stringify(attrs),
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
// 查询数据
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {
|
|||
|
|
if(ro.result == 'ok') {
|
|||
|
|
that.$message({message: '移动成功',type: 'success'});
|
|||
|
|
that.search();
|
|||
|
|
} else {
|
|||
|
|
that.$message.error(ro.msg);
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 清空form数据
|
|||
|
|
clearDrawerForm() {
|
|||
|
|
this.attrForm = {
|
|||
|
|
isCreate: true,// 是否新建
|
|||
|
|
id: '',
|
|||
|
|
key: '',
|
|||
|
|
title: '',
|
|||
|
|
newTitle: '',
|
|||
|
|
type: '',
|
|||
|
|
desc: '',
|
|||
|
|
ref: '',
|
|||
|
|
relationRef: {// 关联pal组织架构
|
|||
|
|
method: '',
|
|||
|
|
type: '',
|
|||
|
|
multiple: 'false',
|
|||
|
|
},
|
|||
|
|
awsorgRef: {// 关联bpm组织架构
|
|||
|
|
scope: [],
|
|||
|
|
multiple: 'false'
|
|||
|
|
},
|
|||
|
|
value: '',
|
|||
|
|
readonly: false,
|
|||
|
|
isRequired: false,
|
|||
|
|
isValid: true,
|
|||
|
|
groupPathName: '',
|
|||
|
|
groupPath: '',
|
|||
|
|
fileScope: false,
|
|||
|
|
shapeScope: false,
|
|||
|
|
shapeScopeValue: [],
|
|||
|
|
scopeName: '',
|
|||
|
|
sort: '',
|
|||
|
|
bpmFileShow: false,
|
|||
|
|
bpmShapeShow: false,
|
|||
|
|
|
|||
|
|
typeOpts: [],
|
|||
|
|
relationMethodScopeOpts: [],
|
|||
|
|
relationTypeOpts: [],
|
|||
|
|
awsorgScopeOpts: [],
|
|||
|
|
multipleOpts: [
|
|||
|
|
{
|
|||
|
|
"label" : '多选',
|
|||
|
|
"value" : "true"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"label" : '单选',
|
|||
|
|
"value" : "false"// value为false select不识别，改为字符串false
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
groupOpts: [],
|
|||
|
|
shapeOpts: []
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
closeDrawer() {// 关闭drawer
|
|||
|
|
this.drawer.visible = false;
|
|||
|
|
},
|
|||
|
|
handleDrawerClose(done) {
|
|||
|
|
done();
|
|||
|
|
},
|
|||
|
|
initDrawer(title) {
|
|||
|
|
const that = this;
|
|||
|
|
that.drawer.buttonDisabled = false;
|
|||
|
|
that.drawer.title = title;
|
|||
|
|
that.drawer.visible = true;
|
|||
|
|
that.$nextTick(function(){
|
|||
|
|
that.initDrawerBodyHeight();
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
createAttrDefine() {// 全部-新建属性配置xml数据
|
|||
|
|
this.clearDrawerForm();
|
|||
|
|
const form = this.attrForm;
|
|||
|
|
form.isCreate = true;
|
|||
|
|
// 获取所有形状
|
|||
|
|
this.initDrawer('新增属性');
|
|||
|
|
this.getAttrOptsParam('');
|
|||
|
|
},
|
|||
|
|
// 全部-修改属性配置的xml定义文件
|
|||
|
|
updateAttrDefine(row, column, cell, event) {
|
|||
|
|
if (column.property == 'readonly' || column.property == 'isValid') {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
this.clearDrawerForm();
|
|||
|
|
const form = this.attrForm;
|
|||
|
|
form.isCreate = false;
|
|||
|
|
form.id = row.id;
|
|||
|
|
form.key = row.key;
|
|||
|
|
form.title = row.title;
|
|||
|
|
form.newTitle = row.newTitle;
|
|||
|
|
form.type = row.type;
|
|||
|
|
form.ref = row.ref;
|
|||
|
|
if (form.type == 'relation') {
|
|||
|
|
form.relationRef.method = row.relationRef.method;
|
|||
|
|
form.relationRef.type = row.relationRef.type;
|
|||
|
|
form.relationRef.multiple = row.relationRef.multiple ? "true" : "false";
|
|||
|
|
}
|
|||
|
|
if (form.type == 'awsorg') {
|
|||
|
|
form.awsorgRef.scope = row.awsorgRef.scope;
|
|||
|
|
form.awsorgRef.multiple = row.awsorgRef.multiple ? "true" : "false";
|
|||
|
|
}
|
|||
|
|
// 类型为pal bpm 时 只读行为不可选
|
|||
|
|
let arr = ['relation','awsorg'];
|
|||
|
|
let type = form.type;
|
|||
|
|
if(arr.includes(type)){
|
|||
|
|
this.readOnlyCursor = true;
|
|||
|
|
form.readonly = false;
|
|||
|
|
}else{
|
|||
|
|
this.readOnlyCursor = false;
|
|||
|
|
form.readonly = row.readonly;
|
|||
|
|
}
|
|||
|
|
form.value = row.value;
|
|||
|
|
form.desc = row.desc
|
|||
|
|
form.isValid = row.isValid;
|
|||
|
|
form.isRequired = row.isRequired
|
|||
|
|
form.groupPath = row.groupPath;
|
|||
|
|
form.groupPathName = row.groupPathName;
|
|||
|
|
form.bpmFileShow = row.bpmFileShow;
|
|||
|
|
form.bpmShapeShow = row.bpmFileShow;
|
|||
|
|
this.initDrawer('修改属性');
|
|||
|
|
this.getAttrOptsParam(row.scope);
|
|||
|
|
console.log(this.attrForm)
|
|||
|
|
},
|
|||
|
|
// 获取一些选择框参数
|
|||
|
|
getAttrOptsParam(scope) {
|
|||
|
|
const form = this.attrForm;
|
|||
|
|
const that = this;
|
|||
|
|
that.drawer.loading = true;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_shape_option_query',
|
|||
|
|
methodId: that.methodId
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
|
|||
|
|
that.drawer.loading = false;
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
form.typeOpts = ro.data.typeOpts;
|
|||
|
|
form.relationMethodScopeOpts = ro.data.relationMethodScopeOpts;
|
|||
|
|
form.relationTypeOpts = ro.data.relationTypeOpts;
|
|||
|
|
form.awsorgScopeOpts = ro.data.awsorgScopeOpts;
|
|||
|
|
form.groupOpts = ro.data.groupOpts;
|
|||
|
|
form.shapeOpts = ro.data.shapeOpts;
|
|||
|
|
form.shapeScopeValue = [];
|
|||
|
|
if (scope.indexOf('%') > -1) {
|
|||
|
|
form.fileScope = true;
|
|||
|
|
}
|
|||
|
|
if (scope.indexOf("*") > -1 || (scope.indexOf('%') > -1 && scope.indexOf(',') > -1) || (scope.indexOf('%') == -1 && scope.length > 0)) {
|
|||
|
|
form.shapeScope = true;
|
|||
|
|
const shapeIds = scope.split(',');
|
|||
|
|
for (let i = 0; i < form.shapeOpts.length; i++) {
|
|||
|
|
if (shapeIds.indexOf(form.shapeOpts[i].value) > -1) {
|
|||
|
|
form.shapeScopeValue.push(form.shapeOpts[i].value);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (form.isCreate) {
|
|||
|
|
form.type = form.typeOpts[0].value;
|
|||
|
|
const currNode = that.$refs.tree.getCurrentNode();
|
|||
|
|
if (currNode == null) {
|
|||
|
|
form.groupPath = form.groupOpts[0].value;
|
|||
|
|
} else if (currNode.type == 'group') {
|
|||
|
|
form.groupPath = currNode.id;
|
|||
|
|
} else {
|
|||
|
|
form.groupPath = that.$refs.tree.getNode(currNode.pid).data.id;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
alert('请求响应错误');
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
that.drawer.loading = false;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 新增、修改保存
|
|||
|
|
saveDrawerData() {
|
|||
|
|
const form = this.attrForm;
|
|||
|
|
const that = this;
|
|||
|
|
let scope = [];
|
|||
|
|
if (form.fileScope) {
|
|||
|
|
scope.push('%')
|
|||
|
|
}
|
|||
|
|
if (form.shapeScope) {
|
|||
|
|
if (form.shapeScopeValue.length == 0) {
|
|||
|
|
// 一个也没选，默认为全选
|
|||
|
|
scope.push("*")
|
|||
|
|
} else if (form.shapeScopeValue.length == form.shapeOpts.length){
|
|||
|
|
scope.push("*")
|
|||
|
|
} else {
|
|||
|
|
scope = scope.concat(form.shapeScopeValue);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!(/^\w+$/.test(form.key))) {
|
|||
|
|
that.$message({message: '[属性代码]请输入数字、字母、下划线的组合',type: 'warning'});
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
if (scope.length == 0) {
|
|||
|
|
that.$message({message: '[作用范围]不允许为空',type: 'warning'});
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
if (form.type == 'string' || form.type == 'textarea' || form.type == 'number') {
|
|||
|
|
form.ref = '';
|
|||
|
|
}
|
|||
|
|
if (form.type == 'boolean') {
|
|||
|
|
form.ref = '是,否';
|
|||
|
|
}
|
|||
|
|
if (form.type == 'select' || form.type == 'select_m') {
|
|||
|
|
if (form.ref == '') {
|
|||
|
|
that.$message({message: '[选择范围]不允许为空',type: 'warning'});
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (form.type == 'awsorg') {
|
|||
|
|
if (form.awsorgRef.scope == '') {
|
|||
|
|
that.$message({message: '[BPM组织架构范围选择]不允许为空',type: 'warning'});
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
form.ref = form.awsorgRef;
|
|||
|
|
form.ref.multiple = form.ref.multiple == 'true' ? true : false;// 转换为boolean
|
|||
|
|
form.ref = JSON.stringify(form.ref);
|
|||
|
|
}
|
|||
|
|
if (form.type == 'relation') {
|
|||
|
|
if (form.relationRef.method == '') {
|
|||
|
|
that.$message({message: '[关联的建模方法]不允许为空',type: 'warning'});
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
if (form.relationRef.type == '') {
|
|||
|
|
that.$message({message: '[关联范围]不允许为空',type: 'warning'});
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
form.ref = form.relationRef;
|
|||
|
|
form.ref.multiple = form.ref.multiple == 'true' ? true : false;// 转换为boolean
|
|||
|
|
form.ref = JSON.stringify(form.ref);
|
|||
|
|
}
|
|||
|
|
const data = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd : 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_add_or_update_save',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
isCreate: form.isCreate,
|
|||
|
|
key: form.key,
|
|||
|
|
title: form.title,
|
|||
|
|
type: form.type,
|
|||
|
|
desc: form.desc,
|
|||
|
|
ref: form.ref,
|
|||
|
|
value: form.value,
|
|||
|
|
readonly: form.readonly,
|
|||
|
|
isRequired: form.isRequired,
|
|||
|
|
groupPath: form.groupPath,
|
|||
|
|
isValid: form.isValid,
|
|||
|
|
bpmFileShow: form.bpmFileShow,
|
|||
|
|
bpmShapeShow: form.bpmShapeShow
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
data.data.scope = scope;
|
|||
|
|
this.$refs['attrForm'].validate((valid) => {
|
|||
|
|
if (valid) {
|
|||
|
|
that.drawer.buttonDisabled = true;
|
|||
|
|
awsuiAxios.post(data).then(function (ro) {
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
// 成功，刷新当前页面
|
|||
|
|
let msg = '修改';
|
|||
|
|
if (form.isCreate) {
|
|||
|
|
msg = '新增';
|
|||
|
|
}
|
|||
|
|
that.$message({message: msg + '成功',type: 'success'});
|
|||
|
|
that.closeDrawer();
|
|||
|
|
that.clearDrawerForm();
|
|||
|
|
that.initTreeData();
|
|||
|
|
} else {
|
|||
|
|
that.$message({message: ro.msg, type: 'warning'});
|
|||
|
|
that.drawer.buttonDisabled = false;
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
handleNodeClick(data) {
|
|||
|
|
this.nodeData = data;
|
|||
|
|
this.search();
|
|||
|
|
},
|
|||
|
|
// 变更是否只读,必填,有效
|
|||
|
|
handleChangeReadonlyAndValid(id, name, readonly,isRequired, isValid,) {
|
|||
|
|
const that = this;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_readonly_and_valid_update',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
key: id,
|
|||
|
|
readonly: readonly,
|
|||
|
|
isRequired,
|
|||
|
|
isValid: isValid
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
that.$message({message: '修改成功',type: 'success'});
|
|||
|
|
for (let i = 0; i < that.tableDataTemp.length; i++) {
|
|||
|
|
if (id == that.tableDataTemp[i].id) {
|
|||
|
|
that.tableDataTemp[i].readonly = readonly;
|
|||
|
|
that.tableDataTemp[i].isRequired = isRequired;
|
|||
|
|
that.tableDataTemp[i].isValid = isValid;
|
|||
|
|
that.tableDataTemp[i].randomNum = Math.random();
|
|||
|
|
that.search();
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// that.initTableData();
|
|||
|
|
} else {
|
|||
|
|
that.$message({message: ro.msg,type: 'warning'});
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
that.drawer.loading = false;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
handleChangeBpmShow(id, name, bpmShow, type) {// 变更是否在bpm运行时显示的通配
|
|||
|
|
const that = this;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_bpm_show_update',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
key: id,
|
|||
|
|
bpmShow: bpmShow,
|
|||
|
|
type: type
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
that.$message({message: '修改成功',type: 'success'});
|
|||
|
|
for (let i = 0; i < that.tableDataTemp.length; i++) {
|
|||
|
|
if (id == that.tableDataTemp[i].id) {
|
|||
|
|
if (type == 'bpmFileShow') {
|
|||
|
|
that.tableDataTemp[i].bpmFileShow = bpmShow;
|
|||
|
|
} else if (type == 'bpmShapeShow') {
|
|||
|
|
that.tableDataTemp[i].bpmShapeShow = bpmShow;
|
|||
|
|
}
|
|||
|
|
that.tableDataTemp[i].randomNum = Math.random();
|
|||
|
|
that.search();
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// that.initTableData();
|
|||
|
|
} else {
|
|||
|
|
that.$message({message: ro.msg,type: 'warning'});
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
that.drawer.loading = false;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
handleAttrMouseEnter(row, column, cell, event) {// 文件属性行移入显示属性修改输入框
|
|||
|
|
for (let i = 0; i < this.tableData.length; i++) {
|
|||
|
|
if (row.id == this.tableData[i].id) {
|
|||
|
|
this.tableData[i].isUpdate = true;
|
|||
|
|
} else {
|
|||
|
|
this.tableData[i].isUpdate = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
handleAttrMouseLeave(row, column, cell, event) {// 文件属性行移出隐藏属性修改输入框
|
|||
|
|
for (let i = 0; i < this.tableData.length; i++) {
|
|||
|
|
if (row.id == this.tableData[i].id) {
|
|||
|
|
this.tableData[i].isUpdate = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
updateAttrDbInfo(attrId, newTitle, orderIndex) {// 更新属性名称信息
|
|||
|
|
const that = this;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_file_and_shape_update',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
wsId: that.$store.getters.getWsIdFn,
|
|||
|
|
type: that.methodDataType,
|
|||
|
|
attrId: attrId,
|
|||
|
|
newTitle: newTitle,
|
|||
|
|
orderIndex: orderIndex
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
|
|||
|
|
if (ro.result == 'ok') {
|
|||
|
|
that.$message({message: '修改成功',type: 'success'});
|
|||
|
|
// 把临时的数据进行更新
|
|||
|
|
for (let i = 0; i < that.tableDataTemp.length; i++) {
|
|||
|
|
if (attrId == that.tableDataTemp[i].id) {
|
|||
|
|
that.tableDataTemp[i].newTitle = newTitle;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
alert('请求响应错误');
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
that.drawer.loading = false;
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
removeAttr(attrId, title) {
|
|||
|
|
let confirmText = [
|
|||
|
|
"确定要删除吗？",
|
|||
|
|
'注意：将一并删除该属性在所有资产库的文件属性和形状属性中的配置信息(不包含业务内容数据)'
|
|||
|
|
];
|
|||
|
|
const newDatas = [];
|
|||
|
|
const h = this.$createElement;
|
|||
|
|
for (const i in confirmText) {
|
|||
|
|
newDatas.push(h("p", null, confirmText[i]))
|
|||
|
|
}
|
|||
|
|
this.$confirm('提示', {
|
|||
|
|
message: h("div", null, newDatas),
|
|||
|
|
confirmButtonText: '确定',
|
|||
|
|
confirmButtonClass: 'button-general-color',
|
|||
|
|
cancelButtonText: '取消',
|
|||
|
|
type: 'warning'
|
|||
|
|
}).then(() => {
|
|||
|
|
const that = this;
|
|||
|
|
const params = {
|
|||
|
|
url:'jd',
|
|||
|
|
data:{
|
|||
|
|
cmd: 'com.actionsoft.apps.coe.pal_pl_manage_method_attr_remove',
|
|||
|
|
methodId: that.methodId,
|
|||
|
|
attrId: attrId
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
// 查询数据
|
|||
|
|
awsuiAxios.post(params).then(function (ro) {
|
|||
|
|
if(ro.result == 'ok') {
|
|||
|
|
that.$message({
|
|||
|
|
message: '删除成功',
|
|||
|
|
type: 'success'
|
|||
|
|
});
|
|||
|
|
that.initTreeData();
|
|||
|
|
} else {
|
|||
|
|
that.$message(ro.msg);
|
|||
|
|
}
|
|||
|
|
}).catch(error=>{
|
|||
|
|
console.log(error);
|
|||
|
|
})
|
|||
|
|
}).catch(() => {
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
changeReadOnly(){
|
|||
|
|
if(this.attrForm.readonly){
|
|||
|
|
this.attrForm.readonly = false;
|
|||
|
|
}else{
|
|||
|
|
this.attrForm.readonly = true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
changeAttrType(obj) {
|
|||
|
|
|
|||
|
|
// 类型为pal bpm 时 只读行为不可选
|
|||
|
|
let arr = ['relation','awsorg'];
|
|||
|
|
if(arr.includes(obj)){
|
|||
|
|
this.readOnlyCursor = true;
|
|||
|
|
this.attrForm.readonly = false;
|
|||
|
|
}else{
|
|||
|
|
this.readOnlyCursor = false;
|
|||
|
|
}
|
|||
|
|
this.attrForm.ref = '';
|
|||
|
|
this.attrForm.relationRef.value = '';
|
|||
|
|
this.attrForm.relationRef.multiple = 'false';
|
|||
|
|
this.attrForm.relationRef.type = '';
|
|||
|
|
this.attrForm.awsorgRef.scope = [];
|
|||
|
|
this.attrForm.awsorgRef.multiple = 'false';
|
|||
|
|
this.attrForm.value = '';
|
|||
|
|
},
|
|||
|
|
initDrawerBodyHeight() {
|
|||
|
|
if (document.getElementById("drawerBody") != null) {
|
|||
|
|
document.getElementById("drawerBody").style.height =
|
|||
|
|
parseInt(this.mainHeight) -40 + parseInt(this.parentHeaderHeight) - 58 - parseInt(this.drawer.footerHeight) + 'px';// 68是drawer标题高度
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
listenTopMainHeight() {
|
|||
|
|
return this.$store.getters.getTopMainHeightFn;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
listenTopMainHeight: function (newd, old) {
|
|||
|
|
this.mainHeight = (parseInt(newd)) - parseInt(this.parentHeaderHeight) + 'px';
|
|||
|
|
this.treeHeight = (parseInt(newd) - parseInt(this.parentHeaderHeight) - 61) + 'px';
|
|||
|
|
this.initDrawerBodyHeight();
|
|||
|
|
},
|
|||
|
|
methodDataType: function(newV, oldV) {
|
|||
|
|
this.nodeData = null;
|
|||
|
|
if (this.$refs.tree) {
|
|||
|
|
this.$refs.tree.setCurrentKey(null);
|
|||
|
|
}
|
|||
|
|
if (newV != 'all') {
|
|||
|
|
this.createBtnDisabled = true;
|
|||
|
|
} else {
|
|||
|
|
this.createBtnDisabled = false;
|
|||
|
|
}
|
|||
|
|
this.initTableData();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
#methodAttribute >>> .el-tree-node__content {
|
|||
|
|
background-color: #f8f8f8;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .el-tree-node__content:hover {
|
|||
|
|
/*background-color: #F5F7FA;*/
|
|||
|
|
background-color: #d4d4d4;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
|||
|
|
background-color: #F5F7FA;
|
|||
|
|
color: #4E7FF9;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content .awsui-iconfont {
|
|||
|
|
color: #4E7FF9 !important;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .awsui-main {
|
|||
|
|
padding: 10px;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .awsui-sidebar__header {
|
|||
|
|
margin-bottom: 0px;
|
|||
|
|
padding: 15px 20px 15px 20px;
|
|||
|
|
border-bottom: 1px solid #f2f2f2;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
.attr-aside {
|
|||
|
|
background-color: #f8f8f8;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .input-update-attr-name input {
|
|||
|
|
border-style: dashed !important;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .el-table__row .operate-icon-display{
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
#methodAttribute >>> .el-table__row:hover .operate-icon-display{
|
|||
|
|
display: inline-block;
|
|||
|
|
}
|
|||
|
|
.attr {
|
|||
|
|
cursor: move;
|
|||
|
|
}
|
|||
|
|
.div-button-small {
|
|||
|
|
display:inline-block;
|
|||
|
|
width: 32.8%;
|
|||
|
|
height: 35px;
|
|||
|
|
border: 1px solid #e9e9e9;
|
|||
|
|
line-height: 37px;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
text-align: center;
|
|||
|
|
cursor: pointer;
|
|||
|
|
}
|
|||
|
|
.div-button {
|
|||
|
|
display:inline-block;
|
|||
|
|
width: 49%;
|
|||
|
|
height: 35px;
|
|||
|
|
border: 1px solid #e9e9e9;
|
|||
|
|
line-height: 37px;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
text-align: center;
|
|||
|
|
cursor: pointer;
|
|||
|
|
}
|
|||
|
|
#methodAttribute /deep/ .el-table__body-wrapper:hover {
|
|||
|
|
cursor: pointer;
|
|||
|
|
}
|
|||
|
|
</style>
|