后台能力申请页面开发 前台申购车 重构 新增市局数据资源跳转

This commit is contained in:
a0049873 2022-06-27 14:27:50 +08:00
parent 8737b2e89b
commit 3738985ade
7 changed files with 1100 additions and 777 deletions

View File

@ -2,7 +2,7 @@ import Cookies from 'js-cookie'
import qs from 'qs' import qs from 'qs'
import { deepClone } from '@/utils/form-generator/index' import { deepClone } from '@/utils/form-generator/index'
export default { export default {
data() { data () {
/* eslint-disable */ /* eslint-disable */
return { return {
// 设置属性 // 设置属性
@ -38,19 +38,19 @@ export default {
} }
/* eslint-enable */ /* eslint-enable */
}, },
created() { created () {
if (this.mixinViewModuleOptions.createdIsNeed) { if (this.mixinViewModuleOptions.createdIsNeed) {
this.query() this.query()
} }
}, },
activated() { activated () {
if (this.mixinViewModuleOptions.activatedIsNeed) { if (this.mixinViewModuleOptions.activatedIsNeed) {
this.query() this.query()
} }
}, },
methods: { methods: {
// 获取数据列表 // 获取数据列表
query() { query () {
this.dataListLoading = true this.dataListLoading = true
this.$http.get( this.$http.get(
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({ this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
@ -102,7 +102,7 @@ export default {
return item return item
} }
}) })
this.total = this.mixinViewModuleOptions.getDataListIsPage ? this.dataList.length : 0 this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
}) })
} else { } else {
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0 this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
@ -118,11 +118,11 @@ export default {
}) })
}, },
// 多选 // 多选
dataListSelectionChangeHandle(val) { dataListSelectionChangeHandle (val) {
this.dataListSelections = val this.dataListSelections = val
}, },
// 排序 // 排序
dataListSortChangeHandle(data) { dataListSortChangeHandle (data) {
if (!data.order || !data.prop) { if (!data.order || !data.prop) {
this.order = '' this.order = ''
this.orderField = '' this.orderField = ''
@ -133,13 +133,13 @@ export default {
this.query() this.query()
}, },
// 分页, 每页条数 // 分页, 每页条数
pageSizeChangeHandle(val) { pageSizeChangeHandle (val) {
this.page = 1 this.page = 1
this.limit = val this.limit = val
this.query() this.query()
}, },
// 分页, 当前页 // 分页, 当前页
pageCurrentChangeHandle(val) { pageCurrentChangeHandle (val) {
this.page = val this.page = val
this.query() this.query()
}, },
@ -148,7 +148,7 @@ export default {
this.query() this.query()
}, },
// 新增 // 新增
addOrUpdateHandle(id) { addOrUpdateHandle (id) {
this.addOrUpdateVisible = true this.addOrUpdateVisible = true
this.disabled = false this.disabled = false
this.$nextTick(() => { this.$nextTick(() => {
@ -159,7 +159,7 @@ export default {
}, },
// 组件服务新增 // 组件服务新增
addOrUpdateHandleAI(id) { addOrUpdateHandleAI (id) {
// const infoList = [] // const infoList = []
let showList = [] let showList = []
this.$http.get('category/getCategoryTree').then(({ data: res }) => { this.$http.get('category/getCategoryTree').then(({ data: res }) => {
@ -217,7 +217,7 @@ export default {
}, 100) }, 100)
}, },
// 应用资源新增 // 应用资源新增
addOrUpdateHandleServe(id) { addOrUpdateHandleServe (id) {
// const infoList = [] // const infoList = []
let showList = [] let showList = []
this.$http.get('category/getCategoryTree').then(({ data: res }) => { this.$http.get('category/getCategoryTree').then(({ data: res }) => {
@ -275,7 +275,7 @@ export default {
}, 100) }, 100)
}, },
// 修改 // 修改
UpdateHandle(val) { UpdateHandle (val) {
this.addOrUpdateVisible = true this.addOrUpdateVisible = true
this.disabled = false this.disabled = false
const cloneVal = deepClone(val) const cloneVal = deepClone(val)
@ -300,7 +300,7 @@ export default {
}) })
}, },
// 关闭当前窗口 // 关闭当前窗口
closeCurrentTab(data) { closeCurrentTab (data) {
var tabName = this.$store.state.contentTabsActiveName var tabName = this.$store.state.contentTabsActiveName
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => item.name !== tabName) this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => item.name !== tabName)
if (this.$store.state.contentTabs.length <= 0) { if (this.$store.state.contentTabs.length <= 0) {
@ -312,7 +312,7 @@ export default {
} }
}, },
// 删除 // 删除
deleteHandle(id) { deleteHandle (id) {
if (this.mixinViewModuleOptions.deleteIsBatch && !id && this.dataListSelections.length <= 0) { if (this.mixinViewModuleOptions.deleteIsBatch && !id && this.dataListSelections.length <= 0) {
return this.$message({ return this.$message({
message: this.$t('prompt.deleteBatch'), message: this.$t('prompt.deleteBatch'),
@ -346,7 +346,7 @@ export default {
}).catch(() => { }) }).catch(() => { })
}, },
deleteHandle2(id) { deleteHandle2 (id) {
console.log('删除========================》', id, this.dataListSelections) console.log('删除========================》', id, this.dataListSelections)
const ids = [] const ids = []
if (id) { if (id) {
@ -364,7 +364,7 @@ export default {
}) })
}, },
// 导出 // 导出
exportHandle() { exportHandle () {
var params = qs.stringify({ var params = qs.stringify({
token: Cookies.get('ucsToken'), token: Cookies.get('ucsToken'),
...this.dataForm ...this.dataForm

View File

@ -0,0 +1,169 @@
<!--
* @Author: hisense.liangjunhua
* @Date: 2022-06-27 11:27:22
* @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-27 11:50:45
* @Description: 能力申请
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-activiti__process">
<el-form
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
v-model="dataForm.taskName"
:placeholder="$t('process.name')"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getDataList()">{{
$t("query")
}}</el-button>
</el-form-item>
</el-form>
<el-table
v-loading="dataListLoading"
:data="dataList"
border
@selection-change="dataListSelectionChangeHandle"
@sort-change="dataListSortChangeHandle"
style="width: 100%"
>
<el-table-column
type="selection"
header-align="center"
align="center"
width="50"
></el-table-column>
<el-table-column label="申请人" header-align="center" align="center">
<template slot-scope="scope">
<span>{{
(scope.row.params && scope.row.params.user) ||
(scope.row.params && scope.row.params.applyUserName) ||
(scope.row.params && scope.row.params.userName) ||
(scope.row.params && scope.row.params.undercarriageUserName)||
(scope.row.params && scope.row.params.name)
}}</span>
</template>
</el-table-column>
<el-table-column
:label="$t('process.system')"
header-align="center"
align="center"
>
<template slot-scope="scope">
<span>{{
(scope.row.params && scope.row.params.system) ||
(scope.row.params && scope.row.params.demandSubject) ||
(scope.row.params &&
scope.row.params.resourceDTO &&
scope.row.params.resourceDTO.name) ||
(scope.row.params && scope.row.params.undercarriageReason)||
(scope.row.params && scope.row.params.comment)
}}</span>
</template>
</el-table-column>
<!-- <el-table-column prop="businessKey" :label="$t('process.businessKey')" header-align="center" align="center"></el-table-column>
<el-table-column prop="processInstanceId" :label="$t('running.id')" header-align="center" align="center"></el-table-column> -->
<el-table-column
prop="processDefinitionName"
:label="$t('process.processDefinitionName')"
header-align="center"
align="center"
></el-table-column>
<el-table-column
prop="taskName"
:label="$t('process.taskName')"
header-align="center"
align="center"
></el-table-column>
<!-- <el-table-column prop="startTime" :label="$t('process.startTime')" header-align="center" align="center"></el-table-column> -->
<el-table-column
prop="createTime"
:label="$t('process.createTime')"
header-align="center"
align="center"
></el-table-column>
<el-table-column
:label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="150"
>
<template slot-scope="scope">
<el-button
type="text"
size="small"
:processInstanceId="processInstanceId"
@click="taskHandle(scope.row)"
>{{ $t("manage") }}</el-button
>
<el-button
type="text"
size="small"
@click="taskDetail(scope.row)"
>{{ $t("process.viewFlowImage") }}</el-button
>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle"
>
</el-pagination>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import processModule from '@/mixins/process-module'
export default {
mixins: [mixinViewModule, processModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/act/task/myToDoTaskPage',
getDataListIsPage: true,
activatedIsNeed: true,
deleteIsBatch: true,
deleteIsBatchKey: 'deploymentId'
},
dataForm: {
taskName: '',
taskId: ''
},
processInstanceId: ''
}
},
components: {},
methods: {
//
taskHandle (row) {
console.log('row======================>', row, this.forwardHandleUrl)
if (!row.businessKey) {
return this.$message.error(this.$t('task.businessKeyError'))
}
this.getProcDefRouteSet(row, this.forwardHandleUrl)
},
taskDetail (row) {
if (!row.businessKey) {
return this.$message.error(this.$t('task.detailError'))
}
this.getProcDefRouteSet(row, this.forwardTaskDetail)
}
}
}
</script>

View File

@ -1,13 +1,13 @@
/* /*
* @Author: hisense.wuhongjian * @Author: hisense.wuhongjian
* @Date: 2020-07-07 16:03:23 * @Date: 2020-07-07 16:03:23
* @LastEditors: hisense.wuhongjian * @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-24 18:16:44 * @LastEditTime: 2022-06-27 14:22:56
* @Description: 数据资源参数配置 * @Description: 数据资源参数配置
*/ */
// const newLocation = 'qingdao'
// const newLocation = 'baotou'
const newLocation = 'qingdao' const newLocation = 'qingdao'
// const newLocation = 'baotou'
// const newLocation = 'xihaian'
// //
const whoShow = {} const whoShow = {}

View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-19 10:15:33 * @Date: 2022-06-19 10:15:33
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-24 15:04:52 * @LastEditTime: 2022-06-27 12:52:18
* @Description: 告诉大家这是什么 * @Description: 告诉大家这是什么
--> -->
<template> <template>
@ -156,7 +156,8 @@
}) })
arr.resourceTop5.forEach((val, index) => { arr.resourceTop5.forEach((val, index) => {
assignRankings.value[index].name = val['服务名称'] || '' assignRankings.value[index].name = val['服务名称'] || ''
assignRankings.value[index].operation = val['申请次数'] || '' assignRankings.value[index].operation =
val['申请次数'] >= 0 ? val['申请次数'] : ''
}) })
} }
}) })

File diff suppressed because it is too large Load Diff

View File

@ -1,23 +1,80 @@
<template> <template>
<div class="title">申购车</div> <div class="bottom">
<div class="sousuokuang"> <div class="left">
<a-input-search <a-checkbox v-model:checked="checkAll" @change="onCheckAllChange">
v-model:value="name" 全选
placeholder="请输入关键词" </a-checkbox>
enter-button="搜索" <a-checkbox
size="large" v-model:checked="reverseSelectionFalg"
@change="onSearch" @change="reverseSelection"
@search="getList" >
/> 反选
<a-button </a-checkbox>
type="primary" <p>
style="width: 0.8rem; height: 0.36rem; margin-left: 0.1rem" 已选
@click="clean" <span class="num">{{ checkedList.length }}</span>
> </p>
重置 </div>
</a-button> <div class="right">
<div class="sousuokuang">
<a-input-search
v-model:value="name"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@change="onSearch"
@search="getList"
/>
</div>
<a-popconfirm
title="是否进行批量删除?"
ok-text="是"
cancel-text="否"
@confirm="delList"
@cancel="cancel"
>
<a-button
type="primary"
style="
width: 1rem;
height: 0.36rem;
margin-right: 0.12rem;
border-radius: 2px;
background: #fff;
color: #0558e1;
"
>
批量删除
</a-button>
</a-popconfirm>
<a-button
type="primary"
style="
width: 1rem;
height: 0.36rem;
border-radius: 2px;
background: #fff;
color: #0558e1;
"
@click="collection"
>
批量收藏
</a-button>
<a-button
type="primary"
style="
width: 1rem;
height: 0.36rem;
margin-left: 0.12rem;
border-radius: 2px;
"
@click="apply"
>
一键申请
</a-button>
</div>
</div> </div>
<div class="tab"> <!-- <div class="tab">
<span>筛选</span> <span>筛选</span>
<div <div
:class="tabIndex == index ? 'tabclass' : ' '" :class="tabIndex == index ? 'tabclass' : ' '"
@ -27,7 +84,7 @@
> >
{{ item }} {{ item }}
</div> </div>
</div> </div> -->
<a-list <a-list
class="demo-loadmore-list" class="demo-loadmore-list"
:loading="initLoading" :loading="initLoading"
@ -50,7 +107,8 @@
> >
{{ item.name }} {{ item.name }}
</span> </span>
<span class="time">加购时间{{ item.updateDate }}</span> <!-- <span class="time">加购时间{{ item.updateDate }}</span> -->
<span class="type">{{ item.type }}</span>
<svg <svg
t="1652233950228" t="1652233950228"
class="icon" class="icon"
@ -116,48 +174,6 @@
<span>{{ props.value }}/</span> <span>{{ props.value }}/</span>
</template> </template>
</a-pagination> </a-pagination>
<div class="bottom">
<div class="left">
<a-checkbox v-model:checked="checkAll" @change="onCheckAllChange">
全选
</a-checkbox>
<a-popconfirm
title="是否进行批量删除?"
ok-text="是"
cancel-text="否"
@confirm="delList"
@cancel="cancel"
>
<a-button
type="primary"
style="width: 0.7rem; height: 0.32rem; margin-left: 0.1rem"
>
删除
</a-button>
</a-popconfirm>
<a-button
type="primary"
style="width: 0.7rem; height: 0.32rem; margin-left: 0.1rem"
@click="collection"
>
收藏
</a-button>
</div>
<div class="right">
<p>
合计
<span class="num">{{ checkedList.length }}</span>
<span></span>
</p>
<a-button
type="primary"
style="width: 1rem; height: 0.32rem; margin-left: 0.3rem"
@click="apply"
>
一键申请
</a-button>
</div>
</div>
</template> </template>
<script setup> <script setup>
import { onMounted, ref } from 'vue' import { onMounted, ref } from 'vue'
@ -235,7 +251,7 @@
} }
// //
const onCheckAllChange = () => { const onCheckAllChange = () => {
console.log(checkedList) // console.log(checkedList)
if (checkAll.value) { if (checkAll.value) {
// checkedList.value = [] // checkedList.value = []
list.value.forEach((val) => { list.value.forEach((val) => {
@ -248,7 +264,7 @@
dataResourceId.value.push(val.resourceId) dataResourceId.value.push(val.resourceId)
arr.value.push(val.name) arr.value.push(val.name)
}) })
console.log(checkAll.value) // console.log(checkAll.value)
} else { } else {
list.value.forEach((val) => { list.value.forEach((val) => {
val.checked = false val.checked = false
@ -262,6 +278,41 @@
console.log(checkAll.value) console.log(checkAll.value)
} }
} }
//
const reverseSelectionFalg = ref(false)
const reverseSelection = () => {
console.log(
'点击反选==============>',
checkedList.value,
checkAll.value,
list.value
)
reverseSelectionFalg.value = !reverseSelectionFalg.value
if (checkAll.value) {
checkAll.value = false
list.value.map((val) => {
if (checkedList.value.indexOf(val.id) > -1) {
val.checked = false
checkedList.value.splice(checkedList.value.indexOf(val.id), 1)
}
})
} else {
const arr = []
list.value.map((val) => {
if (val.checked) {
checkedList.value.splice(checkedList.value.indexOf(val.id), 1)
} else {
checkedList.value.push(val.id)
arr.push(val.id)
}
val.checked = !val.checked
if (arr.length == list.value.length) {
checkAll.value = true
}
})
}
reverseSelectionFalg.value = !reverseSelectionFalg.value
}
// //
const clean = () => { const clean = () => {
name.value = '' name.value = ''
@ -321,10 +372,10 @@
getList() getList()
} }
// //
const onSearch = (name) => { // const onSearch = (name) => {
name.value = name // name.value = name
console.log(name.value) // console.log(name.value)
} // }
//id //id
const dataResourceId = ref([]) const dataResourceId = ref([])
@ -358,18 +409,18 @@
showKey.value++ showKey.value++
} }
// //
const tabIndex = ref(-1) // const tabIndex = ref(-1)
const changeTab = (index) => { // const changeTab = (index) => {
console.log('tabIndex', tabIndex.value, index, tabList) // console.log('tabIndex', tabIndex.value, index, tabList)
if (tabIndex.value == index) { // if (tabIndex.value == index) {
tabIndex.value = -1 // tabIndex.value = -1
type.value = '' // type.value = ''
} else { // } else {
tabIndex.value = index // tabIndex.value = index
type.value = tabList.value[index] // type.value = tabList.value[index]
} // }
getList() // getList()
} // }
// //
const delList = () => { const delList = () => {
if (checkedList.value.length == 0) { if (checkedList.value.length == 0) {
@ -433,23 +484,38 @@
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.ant-list { .ant-list {
height: 5.4rem; height: 7.23rem;
overflow-y: scroll; overflow-y: scroll;
.ant-list-item-meta { .ant-list-item {
align-items: center; width: 10.5rem;
:deep(.ant-list-item-meta-avatar) { padding: 0.24rem 0;
padding-left: 0.2rem; .ant-list-item-meta {
margin-right: 0.3rem; align-items: center;
} :deep(.ant-list-item-meta-avatar) {
.time { padding-left: 0.2rem;
margin-left: 0.3rem; margin-right: 0.3rem;
font-size: 0.12rem; }
color: #ccc; .time {
} margin-left: 0.3rem;
:deep(.ant-list-item-meta-description) { font-size: 0.12rem;
max-height: 0.44rem; color: #ccc;
overflow: hidden; }
margin-right: 0.1rem; .type {
margin-left: 0.1rem;
padding: 0.03rem 0.1rem;
background: #00a7e3;
color: #fff;
}
:deep(.ant-list-item-meta-description) {
margin-top: 0.1rem;
max-height: 0.44rem;
margin-right: 0.1rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
} }
} }
} }
@ -461,21 +527,57 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.left span { border-bottom: 1px solid #f0f0f0;
margin-left: 0.1rem; .left {
display: flex;
align-items: center;
p {
height: 0.18rem;
line-height: 0.14rem;
padding-left: 0.1rem;
margin-bottom: 0;
border-left: 1px solid #212121;
}
span {
margin-left: 0.1rem;
}
.num {
margin-left: 0;
color: #0087ff;
font-size: 0.2rem;
}
} }
.right { .right {
display: flex; display: flex;
align-items: center; align-items: center;
span { justify-content: space-around;
color: #0087ff;
}
.num {
font-size: 0.2rem;
}
button { button {
margin-bottom: 0.1rem; margin-bottom: 0.1rem;
} }
.sousuokuang {
width: 3.2rem;
margin: 0.1rem 0rem 0.21rem 0.2rem;
.ant-input-search {
max-width: 3rem;
}
:deep(.ant-input) {
width: 2.4rem;
height: 0.36rem;
font-size: 0.14rem;
color: #000;
background: #fff;
}
:deep(.ant-input-group-addon) {
display: inline-block;
margin-left: 0.1rem;
.ant-input-search-button {
width: 0.6rem;
height: 0.36rem;
border-radius: 2px;
font-size: 0.14rem;
}
}
}
} }
} }
.title { .title {
@ -486,29 +588,6 @@
margin-top: 0.2rem; margin-top: 0.2rem;
margin-left: 0.2rem; margin-left: 0.2rem;
} }
.sousuokuang {
margin: 0.1rem 0rem 0.21rem 0.2rem;
.ant-input-search {
max-width: 4.9rem;
}
:deep(.ant-input) {
width: 4rem;
height: 0.36rem;
font-size: 0.14rem;
color: #b2b2b2;
background: #f5f5f5;
}
:deep(.ant-input-group-addon) {
display: inline-block;
margin-left: 0.1rem;
.ant-input-search-button {
width: 0.8rem;
height: 0.36rem;
border-radius: 0.04rem;
font-size: 0.14rem;
}
}
}
.tab { .tab {
margin-top: 0.1rem; margin-top: 0.1rem;
margin-left: 0.2rem; margin-left: 0.2rem;

View File

@ -84,7 +84,7 @@
article { article {
width: 1090px; width: 1090px;
height: 99%; height: 99%;
overflow-y: auto; // overflow-y: auto;
background-color: #fff; background-color: #fff;
margin: 1% 0 1% 14px; margin: 1% 0 1% 14px;
} }