后台能力下架审批
This commit is contained in:
851673013@qq.com
parent
d3174f8cb0
commit
3f24f6feed
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
|
|
@ -0,0 +1,529 @@
|
||||||
|
<!-- 能力下架审批 -->
|
||||||
|
<template>
|
||||||
|
<div class="Ability-to-take-off-the-shelf-approval">
|
||||||
|
<div class="Ability-to-take-off-the-shelf-approval-title">能力下架审批</div>
|
||||||
|
<div class="basic-information">
|
||||||
|
<div class="basic-information-title">
|
||||||
|
<span></span><span>基本信息</span>
|
||||||
|
</div>
|
||||||
|
<div class="basic-information-content">
|
||||||
|
<p>
|
||||||
|
<span class="text">
|
||||||
|
能力申请标题：<span> {{ dataForm.name || '--' }}</span></span
|
||||||
|
>
|
||||||
|
<span class="text"
|
||||||
|
>下架单号：<span>{{ dataForm.applyNumber || '--' }}</span></span
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<span class="text"
|
||||||
|
>申请人：<span>
|
||||||
|
{{ dataForm.undercarriageUserName || '--' }}</span
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="text"
|
||||||
|
>电话：<span>{{ dataForm.deptPhone || '--' }}</span></span
|
||||||
|
>
|
||||||
|
<span class="text"
|
||||||
|
>单位：<span>{{ dataForm.deptName || deptName }}</span></span
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<p v-if="dataForm.enclosure" class="accessory">
|
||||||
|
<span>
|
||||||
|
申请附件：<span>
|
||||||
|
{{ dataForm.enclosure || '--'
|
||||||
|
}}<button @click="downloadFile2(dataForm.enclosure)">
|
||||||
|
预览
|
||||||
|
</button></span
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="Ability-to-apply-for">
|
||||||
|
<div class="Ability-to-apply-for-title">
|
||||||
|
<span></span><span>申请能力</span>
|
||||||
|
</div>
|
||||||
|
<div class="Ability-to-apply-for-content">
|
||||||
|
<div class="data-list">
|
||||||
|
<div class="data-list-left"></div>
|
||||||
|
<div class="data-list-right">
|
||||||
|
<div class="data-list-right-titleAndDescription">
|
||||||
|
<div class="data-list-right-title">
|
||||||
|
<div class="title-left">
|
||||||
|
<span>{{ dataForm.name }}</span>
|
||||||
|
<span>{{ dataForm.type }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="title-right">
|
||||||
|
<span>能力使用状态：</span>
|
||||||
|
<span v-if="dataList.total > 0">正在被使用</span>
|
||||||
|
<span v-else>未使用</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="data-list-right-description">
|
||||||
|
{{ dataForm.name }}：{{ dataForm.description }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="data-list-right-table">
|
||||||
|
<div class="data-list-right-table-title">
|
||||||
|
正在使用应用数：{{ dataList.total }}
|
||||||
|
</div>
|
||||||
|
<div class="data-list-right-table-list">
|
||||||
|
<div class="data-list-right-table-list-tab">
|
||||||
|
<span
|
||||||
|
v-for="(item, index) in datalistrighttablelist"
|
||||||
|
:key="`data-list-right-table-list-tab-${index}`"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="data-list-right-table-list-content"
|
||||||
|
v-if="dataList.total > 0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in dataList.list"
|
||||||
|
:key="`data-list-right-table-list-content-${index}`"
|
||||||
|
>
|
||||||
|
<span>{{ item.applicationSystem }}</span>
|
||||||
|
<span>{{ item.unit }}</span>
|
||||||
|
<span>{{ item.user }}</span>
|
||||||
|
<span>{{ item.phone }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else class="zanwu">暂无数据</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="agreeOr">
|
||||||
|
<div>
|
||||||
|
<!-- <el-radio-group v-model="agreeOrList" style="width:230px;">
|
||||||
|
<el-radio-button label="同意" class="blueAll" @click="showDialog('同意')">同意</el-radio-button>
|
||||||
|
<el-radio-button label="退回" class="redAll" @click="showDialog('退回')">退回</el-radio-button>
|
||||||
|
</el-radio-group> -->
|
||||||
|
<el-button type="primary" @click="showDialog('同意')">同意</el-button>
|
||||||
|
<el-button type="danger" plain @click="showDialog('拒绝')"
|
||||||
|
>拒绝</el-button
|
||||||
|
>
|
||||||
|
<!-- <el-input v-if="agreeOrList ==='同意' " v-model="inputAgree" placeholder="请输入同意意见"></el-input>
|
||||||
|
<el-input v-if="agreeOrList ==='退回'" v-model="inputNo" placeholder="请输入退回意见"></el-input>
|
||||||
|
<el-button class="inputBule" @click="agreeOrNot">提交</el-button> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 流程详情 -->
|
||||||
|
<ren-process-detail></ren-process-detail>
|
||||||
|
<el-dialog
|
||||||
|
title="审批意见"
|
||||||
|
:visible.sync="dialogVisible"
|
||||||
|
width="30%"
|
||||||
|
:before-close="handleClose"
|
||||||
|
>
|
||||||
|
<el-input v-model="input" placeholder="请输入审批意见"></el-input>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="handleClose2">取 消</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
@click.native="agreeOrNot($store.state.contentTabsActiveName)"
|
||||||
|
>确 定</el-button
|
||||||
|
>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// 引入工作流公共方法
|
||||||
|
import processModule from '@/mixins/process-module'
|
||||||
|
import RenProcessDetail from '@/components/ren-process-detail/src/ren-process-detail'
|
||||||
|
import debounce from 'lodash/debounce'
|
||||||
|
import qs from 'qs'
|
||||||
|
export default {
|
||||||
|
components: { RenProcessDetail },
|
||||||
|
props: {},
|
||||||
|
mixins: [processModule],
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
dialogVisible: false,
|
||||||
|
dialogType: '',
|
||||||
|
input: '',
|
||||||
|
visible: true,
|
||||||
|
showKey: 0,
|
||||||
|
dataForm: [],
|
||||||
|
deptName: '',
|
||||||
|
dataList: {},
|
||||||
|
datalistrighttablelist: [
|
||||||
|
'赋能应用名称',
|
||||||
|
'应用归属部门',
|
||||||
|
'部门联系人',
|
||||||
|
'联系人电话'
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {},
|
||||||
|
computed: {},
|
||||||
|
methods: {
|
||||||
|
init () {
|
||||||
|
this.getInfo(this.$router.currentRoute.params.businessKey)
|
||||||
|
},
|
||||||
|
getInfo (id) {
|
||||||
|
this.$http.get('/resource/' + id).then(({ data: res }) => {
|
||||||
|
if (res.code !== 0) {
|
||||||
|
return this.$message.error(res.msg)
|
||||||
|
}
|
||||||
|
console.log('this.dataForm', res.data)
|
||||||
|
this.dataForm = res.data
|
||||||
|
this.deptIdQuery()
|
||||||
|
this.AbilityToPullDownPages()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
deptIdQuery () {
|
||||||
|
this.$http
|
||||||
|
.get(`/sys/dept/${this.dataForm.deptId}`)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
this.deptName = res.data.name
|
||||||
|
console.log('dataFrom', this.deptName)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
AbilityToPullDownPages () {
|
||||||
|
this.$http
|
||||||
|
.get(
|
||||||
|
'/processForm/tabilityapplication/in_use_page?resourceId=' +
|
||||||
|
this.dataForm.id
|
||||||
|
)
|
||||||
|
.then((res) => {
|
||||||
|
this.dataList = res.data.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
showDialog (title) {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.dialogType = title
|
||||||
|
},
|
||||||
|
downloadFile2 (url) {
|
||||||
|
console.log(window.SITE_CONFIG.previewUrl)
|
||||||
|
window.open(
|
||||||
|
window.SITE_CONFIG.previewUrl +
|
||||||
|
'hisense_office/onlinePreview?url=' +
|
||||||
|
btoa(encodeURI(url))
|
||||||
|
)
|
||||||
|
},
|
||||||
|
handleClose (done) {
|
||||||
|
this.$confirm('确认关闭？')
|
||||||
|
.then((_) => {
|
||||||
|
this.input = ''
|
||||||
|
done()
|
||||||
|
})
|
||||||
|
.catch((_) => {})
|
||||||
|
},
|
||||||
|
handleClose2 () {
|
||||||
|
this.dialogVisible = false
|
||||||
|
this.input = ''
|
||||||
|
},
|
||||||
|
// 同意与退回
|
||||||
|
agreeOrNot: debounce(
|
||||||
|
function (data) {
|
||||||
|
this.dataForm.taskId = this.$route.params.taskId
|
||||||
|
if (this.dialogType === '同意') {
|
||||||
|
console.log('this.dataForm', this.dataForm)
|
||||||
|
const params = qs.stringify({
|
||||||
|
taskId: this.dataForm.taskId,
|
||||||
|
comment: this.input
|
||||||
|
})
|
||||||
|
console.log(params)
|
||||||
|
this.$http
|
||||||
|
.post('/act/task/complete?' + params)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
if (res.code !== 0) {
|
||||||
|
this.$message.error(res.msg)
|
||||||
|
if (this.callbacks.taskHandleErrorCallback) {
|
||||||
|
this.callbacks.taskHandleErrorCallback(res)
|
||||||
|
}
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$message({
|
||||||
|
message: this.$t('prompt.success'),
|
||||||
|
type: 'success',
|
||||||
|
duration: 500,
|
||||||
|
onClose: () => {
|
||||||
|
this.visible = false
|
||||||
|
this.dialogVisible = false
|
||||||
|
if (this.callbacks.taskHandleSuccessCallback) {
|
||||||
|
this.callbacks.taskHandleSuccessCallback(res)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch(() => {})
|
||||||
|
} else if (this.dialogType === '拒绝') {
|
||||||
|
const params = qs.stringify({
|
||||||
|
taskId: this.dataForm.taskId,
|
||||||
|
comment: this.input
|
||||||
|
})
|
||||||
|
this.$http
|
||||||
|
.post('/act/task/backToFirst?', params)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
if (res.code !== 0) {
|
||||||
|
this.$message.error(res.msg)
|
||||||
|
if (this.callbacks.taskHandleErrorCallback) {
|
||||||
|
this.callbacks.taskHandleErrorCallback(res)
|
||||||
|
}
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$message({
|
||||||
|
message: this.$t('prompt.success'),
|
||||||
|
type: 'success',
|
||||||
|
duration: 500,
|
||||||
|
onClose: () => {
|
||||||
|
this.visible = false
|
||||||
|
if (this.callbacks.taskHandleSuccessCallback) {
|
||||||
|
this.callbacks.taskHandleSuccessCallback(res)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.tabRemoveHandle(data)
|
||||||
|
// this.getDataList(data)
|
||||||
|
},
|
||||||
|
1000,
|
||||||
|
{ leading: true, trailing: false }
|
||||||
|
),
|
||||||
|
tabRemoveHandle (tabName) {
|
||||||
|
console.log(tabName, 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa')
|
||||||
|
if (tabName === 'home') {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(
|
||||||
|
(item) => item.name !== tabName
|
||||||
|
)
|
||||||
|
if (this.$store.state.contentTabs.length <= 0) {
|
||||||
|
this.$store.state.sidebarMenuActiveName =
|
||||||
|
this.$store.state.contentTabsActiveName = 'home'
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
// 当前选中tab被删除
|
||||||
|
if (tabName === this.$store.state.contentTabsActiveName) {
|
||||||
|
const tab =
|
||||||
|
this.$store.state.contentTabs[
|
||||||
|
this.$store.state.contentTabs.length - 1
|
||||||
|
]
|
||||||
|
this.$router.push({
|
||||||
|
name: /^iframe_.+/.test(tab.name) ? 'iframe' : tab.name,
|
||||||
|
params: { ...tab.params },
|
||||||
|
query: { ...tab.query }
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 启动流程出错回调
|
||||||
|
startProcessErrorCallback (data) {
|
||||||
|
console.log(data)
|
||||||
|
},
|
||||||
|
// 任务处理出错回调
|
||||||
|
taskHandleErrorCallback (data) {}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
this.init()
|
||||||
|
},
|
||||||
|
mounted () {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.Ability-to-take-off-the-shelf-approval {
|
||||||
|
background: #fff;
|
||||||
|
padding: 20px;
|
||||||
|
.Ability-to-take-off-the-shelf-approval-title {
|
||||||
|
font-weight: 600;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.basic-information {
|
||||||
|
margin-left: 40px;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
.basic-information-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
span:first-child {
|
||||||
|
display: inline-block;
|
||||||
|
height: 20px;
|
||||||
|
width: 5px;
|
||||||
|
background: #0087ff;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.basic-information-content {
|
||||||
|
background: rgba(244, 245, 248, 0.8);
|
||||||
|
padding: 24px;
|
||||||
|
margin-left: 10px;
|
||||||
|
p {
|
||||||
|
width: 100%;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 33%);
|
||||||
|
color: #212121;
|
||||||
|
font-size: 14px;
|
||||||
|
span {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 8px;
|
||||||
|
line-height: 32px;
|
||||||
|
span {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.text {
|
||||||
|
width: 500px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.accessory {
|
||||||
|
margin-top: 16px;
|
||||||
|
width: 100%;
|
||||||
|
span {
|
||||||
|
display: flex;
|
||||||
|
span {
|
||||||
|
padding: 0 12px;
|
||||||
|
height: 32px;
|
||||||
|
background: rgba(232, 234, 239, 1);
|
||||||
|
border-radius: 2px;
|
||||||
|
button {
|
||||||
|
background: unset;
|
||||||
|
border: 0;
|
||||||
|
color: #0558e1;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.Ability-to-apply-for {
|
||||||
|
margin-left: 40px;
|
||||||
|
.Ability-to-apply-for-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border-bottom: 1px #dddee1 solid;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
span:first-child {
|
||||||
|
display: inline-block;
|
||||||
|
height: 20px;
|
||||||
|
width: 5px;
|
||||||
|
background: #0087ff;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.Ability-to-apply-for-content {
|
||||||
|
.data-list {
|
||||||
|
display: flex;
|
||||||
|
border-bottom: 1px solid #dddee1;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
.data-list-left {
|
||||||
|
width: 80px;
|
||||||
|
height: 110px;
|
||||||
|
background: url('~@/assets/img/Capabilitydiagram.png') no-repeat;
|
||||||
|
background-size: 80px 80px;
|
||||||
|
background-position: center;
|
||||||
|
margin-left: 10px;
|
||||||
|
padding-bottom: 30px;
|
||||||
|
}
|
||||||
|
.data-list-right {
|
||||||
|
width: calc(100% - 83px);
|
||||||
|
margin-left: 10px;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
border-left: 1px solid #dddee1;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000000;
|
||||||
|
.data-list-right-titleAndDescription {
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 20px;
|
||||||
|
border-bottom: 1px solid #dddee1;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
.data-list-right-title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 0.2rem;
|
||||||
|
.title-left {
|
||||||
|
span:first-child {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
span:last-child {
|
||||||
|
font-size: 14px;
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 8px;
|
||||||
|
padding: 0 5px;
|
||||||
|
border-radius: 30px;
|
||||||
|
background: #00b8e6;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.data-list-right-description {
|
||||||
|
margin: 10px 0;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.data-list-right-table {
|
||||||
|
.data-list-right-table-title {
|
||||||
|
margin-left: 10px;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 8px;
|
||||||
|
padding: 0 5px;
|
||||||
|
border-radius: 30px;
|
||||||
|
background: #00b8e6;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.data-list-right-table-list {
|
||||||
|
padding: 0 5px;
|
||||||
|
.data-list-right-table-list-tab {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 25%);
|
||||||
|
background: rgba(191, 191, 191, 0.1);
|
||||||
|
span {
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.data-list-right-table-list-content {
|
||||||
|
& > div {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 25%);
|
||||||
|
span {
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
div:nth-child(even) {
|
||||||
|
background: rgba(191, 191, 191, 0.1);
|
||||||
|
}
|
||||||
|
div:nth-child(odd) {
|
||||||
|
span {
|
||||||
|
padding: 20px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.zanwu {
|
||||||
|
margin-top: 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.agreeOr {
|
||||||
|
& > div {
|
||||||
|
text-align: right;
|
||||||
|
padding-right: 40px;
|
||||||
|
margin: 20px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue