Compare commits
21 Commits
| Author | SHA1 | Date |
|---|---|---|
 wuhongjian
|
3679743b39 | |
|
wuhongjian
|
43d8b96d5e | |
gaoyuanwei
|
bbc8941fbd | |
|
wuhongjian
|
626abf682b | |
|
wuhongjian
|
f7999e0474 | |
|
wuhongjian
|
4f62053fdb | |
|
851673013@qq.com
|
edc2b43109 | |
|
wuhongjian
|
54360fee74 | |
|
wuhongjian
|
808e6136b3 | |
|
gaoyuanwei
|
8611d61efa | |
|
gaoyuanwei
|
160f660cd5 | |
|
wuhongjian
|
832d5b2ec4 | |
|
851673013@qq.com
|
ba20f28bac | |
|
851673013@qq.com
|
52eb566ca6 | |
|
851673013@qq.com
|
0f46b15fab | |
|
851673013@qq.com
|
090816c33d | |
|
gaoyuanwei
|
6c2db1ee8a | |
|
851673013@qq.com
|
144e80ef5e | |
|
gaoyuanwei
|
a118461845 | |
|
gaoyuanwei
|
db6bd47bd9 | |
|
wuhongjian
|
29689b2319 |
|
|
@ -1,12 +1,5 @@
|
|||
back/*.zip
|
||||
back/public/index.html
|
||||
back/dist-西海岸-后台管理-带配置文件.zip
|
||||
back/dist-西海岸-后台管理.zip
|
||||
back/dist-市局-后台管理-带配置文件.zip
|
||||
back/dist-包头-后台管理.zip
|
||||
back/dist-市局-后台管理.zip
|
||||
back/dist-市局-后台管理-v0.8.2.1.zip
|
||||
back/dist-西海岸-后台管理-带配置文件.zip
|
||||
back/dist.zip
|
||||
front/public/index.html
|
||||
back/dist-西海岸-后台管理-v0.8.2.1.zip
|
||||
back/dist-市局-后台管理-v0.8.2.3.zip
|
||||
back/dist-西海岸-后台管理-v0.8.2.4.d.zip
|
||||
*.zip
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -22,7 +22,6 @@
|
|||
"carddragger": "^0.3.6",
|
||||
"clipboard": "^2.0.6",
|
||||
"core-js": "^3.6.5",
|
||||
"crypto-js": "^4.1.1",
|
||||
"echarts": "^4.7.0",
|
||||
"element-ui": "^2.13.2",
|
||||
"file-saver": "^2.0.5",
|
||||
|
|
@ -34,7 +33,6 @@
|
|||
"lodash": "^4.17.19",
|
||||
"monaco-editor": "^0.20.0",
|
||||
"monaco-editor-webpack-plugin": "^1.9.0",
|
||||
"pinyin-pro": "^3.11.0",
|
||||
"qs": "^6.9.4",
|
||||
"quill": "^1.3.7",
|
||||
"sass": "^1.51.0",
|
||||
|
|
@ -58,7 +56,6 @@
|
|||
"@vue/cli-service": "^4.4.6",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"crypto-js": "^4.1.1",
|
||||
"element-theme-chalk": "^2.13.2",
|
||||
"eslint": "^7.5.0",
|
||||
"eslint-plugin-import": "^2.22.0",
|
||||
|
|
|
|||
|
|
@ -1,48 +0,0 @@
|
|||
/*
|
||||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-08-25 14:37:49
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-29 09:57:52
|
||||
* @Description: 告诉大家这是什么
|
||||
*/
|
||||
var _global = {}
|
||||
var CONFIGITEM = {
|
||||
// version: 'qingdao', // 青岛
|
||||
// version: 'xihaian', // 西海岸
|
||||
version: 'test', // 测试
|
||||
// version: 'frp', // 内网穿透
|
||||
// version: 'dev', // 开发
|
||||
vNum: 'v0.8.7.2',
|
||||
configData: {
|
||||
// 青岛市大数据局
|
||||
qingdao: {
|
||||
previewUrl: 'http://15.72.183.90:7008/',
|
||||
apiURL: 'http://15.72.183.90:8000/renren-admin',
|
||||
websocketURL: 'ws://15.72.183.90:8000/renren-admin/websocket'
|
||||
},
|
||||
// 西海岸大数据局
|
||||
xihaian: {
|
||||
previewUrl: 'http://10.134.135.9:9796/',
|
||||
apiURL: 'http://10.134.135.9:8888/renren-admin',
|
||||
websocketURL: 'ws://10.134.135.9:8888/renren-admin/websocket'
|
||||
},
|
||||
// 测试
|
||||
test: {
|
||||
previewUrl: 'http://192.168.124.243:9796/',
|
||||
apiURL: 'http://192.168.124.243:8888/renren-admin',
|
||||
websocketURL: 'ws://192.168.124.243:8888/renren-admin/websocket'
|
||||
},
|
||||
// 内网穿透
|
||||
frp: {
|
||||
previewUrl: 'http://124.222.94.39:9796/',
|
||||
apiURL: 'http://124.222.94.39:8888/renren-admin',
|
||||
websocketURL: 'ws://124.222.94.39:8888/renren-admin/websocket'
|
||||
},
|
||||
dev: {
|
||||
previewUrl: 'http://localhost:8080/',
|
||||
apiURL: 'http://192.168.124.236:8888/renren-admin',
|
||||
websocketURL: 'ws://192.168.124.236:8888/renren-admin/websocket'
|
||||
}
|
||||
}
|
||||
}
|
||||
_global.config = CONFIGITEM.configData[CONFIGITEM.version]
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-04-11 10:11:40
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-29 09:54:59
|
||||
* @LastEditTime: 2022-06-16 15:52:33
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
|
|
@ -11,11 +11,10 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<link rel="shortcut icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<script type="text/javascript" src="./config/basicConfig.js"></script>
|
||||
<!-- 站点配置 -->
|
||||
<script>
|
||||
window.SITE_CONFIG = {};
|
||||
window.SITE_CONFIG['version'] = CONFIGITEM.vNum;
|
||||
window.SITE_CONFIG['version'] = 'v2.9.0';
|
||||
window.SITE_CONFIG['nodeEnv'] = '<%= process.env.VUE_APP_NODE_ENV %>';
|
||||
window.SITE_CONFIG['apiURL'] = ''; // api请求地址
|
||||
window.SITE_CONFIG['storeState'] = {}; // vuex本地储存初始化状态（用于不刷新页面的情况下，也能重置初始化项目中所有状态）
|
||||
|
|
@ -28,19 +27,54 @@
|
|||
'isTab': true, // 是否通过tab展示内容?
|
||||
'iframeURL': '' // 是否通过iframe嵌套展示内容? (以http[s]://开头, 自动匹配)
|
||||
};
|
||||
// window.SITE_CONFIG['frontUrl'] = 'http://15.2.21.238:9796/#/vueTemplateDemo';
|
||||
window.SITE_CONFIG['frontUrl'] = 'http://124.222.94.39:9796/#/vueTemplateDemo';
|
||||
// window.SITE_CONFIG['frontUrl'] = 'http://15.72.183.90:7008/#/vueTemplateDemo';
|
||||
window.SITE_CONFIG['menuList'] = []; // 左侧菜单列表（后台返回，未做处理）
|
||||
window.SITE_CONFIG['permissions'] = []; // 页面按钮操作权限（后台返回，未做处理）
|
||||
window.SITE_CONFIG['dynamicRoutes'] = []; // 动态路由列表
|
||||
window.SITE_CONFIG['dynamicMenuRoutes'] = []; // 动态(菜单)路由列表
|
||||
window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] = false; // 动态(菜单)路由是否已经添加的状态标示（用于判断是否需要重新拉取数据并进行动态添加操作）
|
||||
</script>
|
||||
|
||||
<!-- 开发环境 -->
|
||||
<% if (process.env.VUE_APP_NODE_ENV === 'dev') { %>
|
||||
<script>
|
||||
window.SITE_CONFIG['frontUrl'] = _global.config.previewUrl + '#/vueTemplateDemo';
|
||||
window.SITE_CONFIG['previewUrl'] = _global.config.previewUrl;
|
||||
window.SITE_CONFIG['apiURL'] = _global.config.apiURL;
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.166:8888/renren-admin';
|
||||
window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.23.141:8000/renren-admin';
|
||||
// WebSocket地址
|
||||
window.SITE_CONFIG['socketURL'] =_global.config.socketURL;
|
||||
window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
|
||||
</script>
|
||||
<% } %>
|
||||
<!-- 集成测试环境 -->
|
||||
<% if (process.env.VUE_APP_NODE_ENV === 'prod:sit') { %>
|
||||
<script>
|
||||
window.SITE_CONFIG['apiURL'] = 'http://localhost:8080/renren-admin';
|
||||
// WebSocket地址
|
||||
window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
|
||||
</script>
|
||||
<% } %>
|
||||
<!-- 验收测试环境 -->
|
||||
<% if (process.env.VUE_APP_NODE_ENV === 'prod:uat') { %>
|
||||
<script>
|
||||
window.SITE_CONFIG['apiURL'] = 'http://localhost:8080/renren-admin';
|
||||
// WebSocket地址
|
||||
window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
|
||||
</script>
|
||||
<% } %>
|
||||
<!-- 生产环境 -->
|
||||
<% if (process.env.VUE_APP_NODE_ENV === 'prod') { %>
|
||||
<script>
|
||||
|
||||
window.SITE_CONFIG['apiURL'] = 'http://124.222.94.39:8888/renren-admin';
|
||||
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.72.183.90:8000/renren-admin';
|
||||
// WebSocket地址
|
||||
window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
|
||||
</script>
|
||||
<% } %>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1013 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1015 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1016 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1020 B |
Binary file not shown.
|
Before Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 102 B |
Binary file not shown.
|
Before Width: | Height: | Size: 9.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
|
|
@ -1,97 +0,0 @@
|
|||
<!--
|
||||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-04-11 16:30:04
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-06-06 13:14:02
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<template>
|
||||
<div shadow="never" class="aui-card--fill">
|
||||
<!-- 流转详情 -->
|
||||
<h3 class="titleH3">{{ $t('process.circulation') }}</h3>
|
||||
<div class="mod-sys__dict">
|
||||
<el-table
|
||||
v-loading="dataListLoading"
|
||||
:data="dataList"
|
||||
border
|
||||
@selection-change="dataListSelectionChangeHandle"
|
||||
@sort-change="dataListSortChangeHandle"
|
||||
style="width: 100%;">
|
||||
<!-- 任务名称 -->
|
||||
<el-table-column prop="activityName" :label="$t('process.taskName')" header-align="center" align="center"></el-table-column>
|
||||
<!-- 处理人 -->
|
||||
<el-table-column prop="assigneeName" :label="$t('process.assignee')" header-align="center" align="center"></el-table-column>
|
||||
<!-- 流程开始时间 -->
|
||||
<el-table-column prop="startTime" :label="$t('task.startTime')" header-align="center" align="center"></el-table-column>
|
||||
<!-- 流程结束时间 -->
|
||||
<el-table-column prop="endTime" :label="$t('task.endTime')" header-align="center" align="center"></el-table-column>
|
||||
<!-- 审核意见 -->
|
||||
<el-table-column prop="comment" :label="$t('process.comment')" header-align="center" align="center"></el-table-column>
|
||||
<!-- 任务时长（秒） -->
|
||||
<el-table-column prop="durationInSeconds" :label="$t('task.durationInSeconds')" header-align="center" align="center" width="180"></el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
v-if="dataForm.pid === '0'"
|
||||
: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>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.image {
|
||||
width: 60%;
|
||||
display: block;
|
||||
margin: 0 auto 30px auto;
|
||||
}
|
||||
.titleH3{
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
padding:20px 0;
|
||||
margin-bottom:0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import Cookies from 'js-cookie'
|
||||
import qs from 'qs'
|
||||
import mixinViewModule from '@/mixins/view-module'
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
name: 'RenProcessDetail',
|
||||
data () {
|
||||
return {
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: '/act/his/getTaskHandleDetailInfo',
|
||||
getDataListIsPage: false,
|
||||
createdIsNeed: false,
|
||||
deleteIsBatch: true,
|
||||
deleteIsBatchKey: 'deploymentId'
|
||||
},
|
||||
dataForm: {
|
||||
processInstanceId: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.dataForm.processInstanceId = this.$route.params.processInstanceId
|
||||
this.getResourceURL()
|
||||
this.getDataList()
|
||||
},
|
||||
methods: {
|
||||
// 获取流程(xml/image)url地址
|
||||
getResourceURL () {
|
||||
const params = qs.stringify({
|
||||
token: Cookies.get('ucsToken'),
|
||||
processInstanceId: this.dataForm.processInstanceId
|
||||
})
|
||||
return `${window.SITE_CONFIG.apiURL}/act/his/getInstImage?${params}`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,15 +1,15 @@
|
|||
<!--
|
||||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-04-11 16:30:04
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-07-16 15:07:44
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-06-06 13:14:02
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<!-- 流程图 -->
|
||||
<!-- <h4>{{ $t('process.flowImage') }}</h4>
|
||||
<img :src="getResourceURL()" class="image"> -->
|
||||
<h4>{{ $t('process.flowImage') }}</h4>
|
||||
<img :src="getResourceURL()" class="image">
|
||||
<!-- 流转详情 -->
|
||||
<h4>{{ $t('process.circulation') }}</h4>
|
||||
<div class="mod-sys__dict">
|
||||
|
|
|
|||
|
|
@ -486,7 +486,7 @@ $--cascader-tag-background: #f0f2f5;
|
|||
|
||||
/* Group
|
||||
-------------------------- */
|
||||
$--group-option-flex: 0 0 20% !default;
|
||||
$--group-option-flex: 0 0 (1/5) * 100% !default;
|
||||
$--group-option-offset-bottom: 12px !default;
|
||||
$--group-option-fill-hover: rgba($--color-black, 0.06) !default;
|
||||
$--group-title-color: $--color-black !default;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -25,7 +25,6 @@ t.choose = 'Please Choose'
|
|||
t.fileName = 'File Name'
|
||||
t.design = 'Online Design'
|
||||
t.preview = 'Preview'
|
||||
t.reset='Reset'
|
||||
|
||||
t.prompt = {}
|
||||
t.prompt.title = 'Prompt'
|
||||
|
|
|
|||
|
|
@ -25,7 +25,6 @@ t.choose = '请选择'
|
|||
t.fileName = '文件名'
|
||||
t.design = '在线设计'
|
||||
t.preview = '预览'
|
||||
t.reset = '重置'
|
||||
|
||||
t.prompt = {}
|
||||
t.prompt.title = '提示'
|
||||
|
|
@ -36,7 +35,6 @@ t.prompt.deleteBatch = '请选择删除项'
|
|||
|
||||
t.validate = {}
|
||||
t.validate.required = '必填项不能为空'
|
||||
t.validate.pwdStrength = '密码需包含字母、数字、标点符号,并超过8位'
|
||||
t.validate.format = '{attr}格式错误'
|
||||
|
||||
t.upload = {}
|
||||
|
|
@ -547,33 +545,4 @@ t.notice.new = '有新通知'
|
|||
t.notice.disconnect = '连接断开'
|
||||
t.notice.disconnectMessage = 'WebSocket连接已断开，请检查网络'
|
||||
|
||||
t.projectList = {}
|
||||
t.projectList.projectName = '项目名称'
|
||||
t.projectList.projectUnit = '申请单位'
|
||||
t.projectList.department = '责任处室'
|
||||
t.projectList.applydate = '申请日期'
|
||||
t.projectList.district = '所属区市'
|
||||
t.projectList.contacts = '业务联系人'
|
||||
t.projectList.contactstel = '业务联系人电话'
|
||||
t.projectList.technology = '技术联系人电话'
|
||||
t.projectList.technologytel = '技术联系人电话'
|
||||
|
||||
t.dataresources = {}
|
||||
t.dataresources.componentType = '组件类型'
|
||||
t.dataresources.componentName = '组件名称'
|
||||
t.dataresources.putOnDate = '上架时间'
|
||||
t.dataresources.resourcesName = '数据资源名称'
|
||||
t.dataresources.resourcesCode = '数据资源代码'
|
||||
t.dataresources.resourcesProvide = '数据资源提供方'
|
||||
t.dataresources.resourcesAbstract = '数据资源摘要'
|
||||
t.dataresources.associatedApplication = '关联应用'
|
||||
|
||||
t.infrastructure = {}
|
||||
t.infrastructure.resourceCategory = '资源类别'
|
||||
t.infrastructure.resourceName = '摄像头名称'
|
||||
t.infrastructure.district = '所在区市'
|
||||
t.infrastructure.street = '所在街道'
|
||||
t.infrastructure.department = '所属部门'
|
||||
t.infrastructure.associatedApplication = '关联应用'
|
||||
|
||||
export default t
|
||||
|
|
|
|||
|
|
@ -25,7 +25,6 @@ t.choose = '請選擇'
|
|||
t.fileName = '文件名'
|
||||
t.design = '在線設計'
|
||||
t.preview = '預覽'
|
||||
t.reset='重置'
|
||||
|
||||
t.prompt = {}
|
||||
t.prompt.title = '提示'
|
||||
|
|
|
|||
|
|
@ -17,8 +17,8 @@ export default {
|
|||
exportURL: '', // 导出接口，API地址
|
||||
requestCallback: null // 获取列表以后执行的回调
|
||||
},
|
||||
flag: false,
|
||||
time: null,
|
||||
flag:false,
|
||||
time:null,
|
||||
// 默认属性
|
||||
dataForm: {
|
||||
}, // 查询条件
|
||||
|
|
@ -102,22 +102,13 @@ export default {
|
|||
return item
|
||||
}
|
||||
})
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? this.dataList.length : 0
|
||||
})
|
||||
} else {
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||
}
|
||||
|
||||
console.log('数据列表', this.dataList, this.mixinViewModuleOptions.getDataListURL)
|
||||
if (this.dataList[0].type === '组件服务') {
|
||||
this.dataList.map(val => {
|
||||
val.infoList2 = val.infoList.filter(item => item.attrType === '应用领域' || item.attrType === '组件类型')
|
||||
})
|
||||
} else if (this.dataList[0].type === '应用资源') {
|
||||
this.dataList.map(val => {
|
||||
val.infoList2 = val.infoList.filter(item => item.attrType === '应用领域')
|
||||
})
|
||||
}
|
||||
if (this.mixinViewModuleOptions.requestCallback) {
|
||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,12 +5,6 @@ import { isURL } from '@/utils/validate'
|
|||
import store from '@/store'
|
||||
import Cookies from 'js-cookie'
|
||||
|
||||
// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题
|
||||
const originalPush = Router.prototype.push
|
||||
Router.prototype.push = function push (location) {
|
||||
return originalPush.call(this, location).catch(err => err)
|
||||
}
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
// 页面路由(独立页面)
|
||||
|
|
@ -41,8 +35,7 @@ export const moduleRoutes = {
|
|||
meta: { title: '主入口布局' },
|
||||
children: [
|
||||
// todos 临时调整，后期去掉
|
||||
// { path: '/home', redirect: '/bscatalogue-bscatalogue', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } },
|
||||
{ path: '/home', redirect: '/workBench-workBench', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } },
|
||||
{ path: '/home', redirect: '/bscatalogue-bscatalogue', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } },
|
||||
{ path: '/iframe', component: null, name: 'iframe', meta: { title: 'iframe', isTab: true } }
|
||||
]
|
||||
}
|
||||
|
|
@ -162,7 +155,7 @@ function fnAddDynamicMenuRoutes (menuList = [], routes = []) {
|
|||
route.meta.iframeURL = URL
|
||||
} else {
|
||||
const urlArr = URL.split('?')
|
||||
// debugger
|
||||
debugger
|
||||
URL = urlArr[0].replace(/^\//, '').replace(/_/g, '-')
|
||||
route.path = route.name = URL.replace(/\//g, '-')
|
||||
route.component = () => import(`@/views/modules/${URL}`)
|
||||
|
|
|
|||
|
|
@ -1,10 +1,3 @@
|
|||
/*
|
||||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-07-05 12:53:03
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-23 16:37:05
|
||||
* @Description: 告诉大家这是什么
|
||||
*/
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import cloneDeep from 'lodash/cloneDeep'
|
||||
|
|
@ -19,7 +12,7 @@ export default new Vuex.Store({
|
|||
// 导航条, 布局风格, default(白色) / colorful(鲜艳)
|
||||
navbarLayoutType: 'colorful',
|
||||
// 侧边栏, 布局皮肤, default(白色) / dark(黑色)
|
||||
sidebarLayoutSkin: 'default',
|
||||
sidebarLayoutSkin: 'dark',
|
||||
// 侧边栏, 折叠状态
|
||||
sidebarFold: false,
|
||||
// 侧边栏, 菜单
|
||||
|
|
@ -69,12 +62,12 @@ export default new Vuex.Store({
|
|||
// dispatch('getDepartmentSelects')
|
||||
},
|
||||
getCatalogueTree ({ commit }) {
|
||||
// http.get('bscatalogue/bscatalogue/page').then(res => {
|
||||
// if (res.data.code === 0) {
|
||||
// console.log(22222, res.data)
|
||||
// commit('setCatalogueTree', res.data.data)
|
||||
// }
|
||||
// })
|
||||
http.get('bscatalogue/bscatalogue/page').then(res => {
|
||||
if (res.data.code === 0) {
|
||||
console.log(22222, res.data)
|
||||
commit('setCatalogueTree', res.data.data)
|
||||
}
|
||||
})
|
||||
},
|
||||
getDepartmentSelects ({ commit }) {
|
||||
http.get('applyRecord/bsAbilityApplyRecord/page').then(({ data: res }) => {
|
||||
|
|
|
|||
|
|
@ -1,58 +0,0 @@
|
|||
/*
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-24 16:00:58
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-24 16:44:28
|
||||
* @Description: 告诉大家这是什么
|
||||
*/
|
||||
import CryptoJS from 'crypto-js/crypto-js'
|
||||
|
||||
// 默认的 KEY 与 iv 与后端保持一致 ，不采用后端传值密钥 上上下下左右左右BABA 一往无前虎山行拨开云雾见光明梦里花开牡丹亭幻想成真歌舞升平
|
||||
const KEY = CryptoJS.enc.Utf8.parse('YwwqhsxBkywjgm01') // 密钥
|
||||
const IV = CryptoJS.enc.Utf8.parse('SSXXZYZYBABA30TM') // 偏移量
|
||||
/**
|
||||
* AES加密 ：字符串 key iv 返回base64
|
||||
*/
|
||||
export function Encrypt(word, keyStr, ivStr) {
|
||||
let key = KEY
|
||||
let iv = IV
|
||||
|
||||
if (keyStr) {
|
||||
key = CryptoJS.enc.Utf8.parse(keyStr)
|
||||
iv = CryptoJS.enc.Utf8.parse(ivStr)
|
||||
}
|
||||
|
||||
const srcs = CryptoJS.enc.Utf8.parse(word)
|
||||
var encrypted = CryptoJS.AES.encrypt(srcs, key, {
|
||||
iv: iv,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.ZeroPadding,
|
||||
})
|
||||
|
||||
return CryptoJS.enc.Base64.stringify(encrypted.ciphertext)
|
||||
}
|
||||
/**
|
||||
* AES 解密 ：字符串 key iv 返回base64
|
||||
*
|
||||
*/
|
||||
export function Decrypt(word, keyStr, ivStr) {
|
||||
let key = KEY
|
||||
let iv = IV
|
||||
|
||||
if (keyStr) {
|
||||
key = CryptoJS.enc.Utf8.parse(keyStr)
|
||||
iv = CryptoJS.enc.Utf8.parse(ivStr)
|
||||
}
|
||||
|
||||
const base64 = CryptoJS.enc.Base64.parse(word)
|
||||
const src = CryptoJS.enc.Base64.stringify(base64)
|
||||
|
||||
var decrypt = CryptoJS.AES.decrypt(src, key, {
|
||||
iv: iv,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.ZeroPadding,
|
||||
})
|
||||
|
||||
var decryptedStr = decrypt.toString(CryptoJS.enc.Utf8)
|
||||
return decryptedStr.toString()
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
/*
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-08-23 10:30:11
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-25 21:05:18
|
||||
* @Description: 告诉大家这是什么
|
||||
*/
|
||||
const returnLocationStr = () => {
|
||||
return 'qingdao1'
|
||||
}
|
||||
|
||||
export default returnLocationStr
|
||||
|
|
@ -5,52 +5,25 @@
|
|||
<el-dropdown class="aui-content--tabs-tools">
|
||||
<i class="el-icon-arrow-down"></i>
|
||||
<el-dropdown-menu slot="dropdown" :show-timeout="0">
|
||||
<el-dropdown-item
|
||||
@click.native="tabRemoveHandle($store.state.contentTabsActiveName)"
|
||||
>{{ $t("contentTabs.closeCurrent") }}</el-dropdown-item
|
||||
>
|
||||
<el-dropdown-item @click.native="tabsCloseOtherHandle()">{{
|
||||
$t("contentTabs.closeOther")
|
||||
}}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="tabsCloseAllHandle()">{{
|
||||
$t("contentTabs.closeAll")
|
||||
}}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="tabRemoveHandle($store.state.contentTabsActiveName)">{{ $t('contentTabs.closeCurrent') }}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="tabsCloseOtherHandle()">{{ $t('contentTabs.closeOther') }}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="tabsCloseAllHandle()">{{ $t('contentTabs.closeAll') }}</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<el-tabs
|
||||
v-model="$store.state.contentTabsActiveName"
|
||||
@tab-click="tabSelectedHandle"
|
||||
@tab-remove="tabRemoveHandle"
|
||||
>
|
||||
<el-tabs v-model="$store.state.contentTabsActiveName" @tab-click="tabSelectedHandle" @tab-remove="tabRemoveHandle">
|
||||
<el-tab-pane
|
||||
v-for="item in $store.state.contentTabs"
|
||||
:key="item.name"
|
||||
:name="item.name"
|
||||
:label="item.title"
|
||||
:closable="item.name !== 'home'"
|
||||
:class="{ 'is-iframe': tabIsIframe(item.iframeURL) }"
|
||||
>
|
||||
:class="{ 'is-iframe': tabIsIframe(item.iframeURL) }">
|
||||
<template v-if="item.name === 'home'">
|
||||
<svg
|
||||
slot="label"
|
||||
class="icon-svg aui-content--tabs-icon-nav"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<use xlink:href="#icon-home"></use>
|
||||
</svg>
|
||||
<svg slot="label" class="icon-svg aui-content--tabs-icon-nav" aria-hidden="true"><use xlink:href="#icon-home"></use></svg>
|
||||
</template>
|
||||
<iframe
|
||||
v-if="tabIsIframe(item.iframeURL)"
|
||||
:src="item.iframeURL"
|
||||
width="100%"
|
||||
height="100%"
|
||||
frameborder="0"
|
||||
scrolling="yes"
|
||||
></iframe>
|
||||
<iframe v-if="tabIsIframe(item.iframeURL)" :src="item.iframeURL" width="100%" height="100%" frameborder="0" scrolling="yes"></iframe>
|
||||
<keep-alive v-else>
|
||||
<router-view
|
||||
v-if="item.name === $store.state.contentTabsActiveName"
|
||||
/>
|
||||
<router-view v-if="item.name === $store.state.contentTabsActiveName" />
|
||||
</keep-alive>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
|
@ -65,91 +38,59 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { isURL } from "@/utils/validate";
|
||||
import { isURL } from '@/utils/validate'
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// tabs, 是否通过iframe展示
|
||||
tabIsIframe(url) {
|
||||
return isURL(url);
|
||||
tabIsIframe (url) {
|
||||
return isURL(url)
|
||||
},
|
||||
// tabs, 选中tab
|
||||
tabSelectedHandle(tab) {
|
||||
tab = this.$store.state.contentTabs.filter(
|
||||
(item) => item.name === tab.name
|
||||
)[0];
|
||||
tabSelectedHandle (tab) {
|
||||
tab = this.$store.state.contentTabs.filter(item => item.name === tab.name)[0]
|
||||
if (tab) {
|
||||
this.$router.push({
|
||||
name: /^iframe_.+/.test(tab.name) ? "iframe" : tab.name,
|
||||
params: { ...tab.params },
|
||||
query: { ...tab.query },
|
||||
});
|
||||
'name': /^iframe_.+/.test(tab.name) ? 'iframe' : tab.name,
|
||||
'params': { ...tab.params },
|
||||
'query': { ...tab.query }
|
||||
})
|
||||
}
|
||||
},
|
||||
// tabs, 删除tab
|
||||
tabRemoveHandle(tabName) {
|
||||
if (tabName === "home") {
|
||||
return false;
|
||||
tabRemoveHandle (tabName) {
|
||||
if (tabName === 'home') {
|
||||
return false
|
||||
}
|
||||
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) {
|
||||
this.$store.state.sidebarMenuActiveName =
|
||||
this.$store.state.contentTabsActiveName = "home";
|
||||
return false;
|
||||
this.$store.state.sidebarMenuActiveName = this.$store.state.contentTabsActiveName = 'home'
|
||||
return false
|
||||
}
|
||||
// 当前选中tab被删除
|
||||
if (tabName === this.$store.state.contentTabsActiveName) {
|
||||
let tab =
|
||||
this.$store.state.contentTabs[
|
||||
this.$store.state.contentTabs.length - 1
|
||||
];
|
||||
let tab = this.$store.state.contentTabs[this.$store.state.contentTabs.length - 1]
|
||||
this.$router.push({
|
||||
name: /^iframe_.+/.test(tab.name) ? "iframe" : tab.name,
|
||||
name: /^iframe_.+/.test(tab.name) ? 'iframe' : tab.name,
|
||||
params: { ...tab.params },
|
||||
query: { ...tab.query },
|
||||
});
|
||||
query: { ...tab.query }
|
||||
})
|
||||
}
|
||||
},
|
||||
// tabs, 关闭其它
|
||||
tabsCloseOtherHandle() {
|
||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(
|
||||
(item) => {
|
||||
return (
|
||||
item.name === "home" ||
|
||||
item.name === this.$store.state.contentTabsActiveName
|
||||
);
|
||||
}
|
||||
);
|
||||
tabsCloseOtherHandle () {
|
||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => {
|
||||
return item.name === 'home' || item.name === this.$store.state.contentTabsActiveName
|
||||
})
|
||||
},
|
||||
// tabs, 关闭全部
|
||||
tabsCloseAllHandle() {
|
||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(
|
||||
(item) => item.name === "home"
|
||||
);
|
||||
this.$router.push({ name: "home" });
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.aui-content {
|
||||
.el-tabs {
|
||||
::v-deep .el-tabs__header {
|
||||
left: 266px;
|
||||
.el-tabs__nav-wrap {
|
||||
.el-tabs__nav-scroll {
|
||||
.el-tabs__nav {
|
||||
.el-tabs__item ::after {
|
||||
background-color: #0058e1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
tabsCloseAllHandle () {
|
||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => item.name === 'home')
|
||||
this.$router.push({ name: 'home' })
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,3 @@
|
|||
<!--
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-23 16:41:46
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-24 17:51:42
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<template>
|
||||
<el-dialog
|
||||
:visible.sync="visible"
|
||||
|
|
@ -20,7 +13,7 @@
|
|||
<el-input v-model="dataForm.password" type="password" :placeholder="$t('updatePassword.password')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="newPassword" :label="$t('updatePassword.newPassword')">
|
||||
<el-input v-model="dataForm.newPassword" type="password" :placeholder="$t('updatePassword.newPassword')" @input="changeInput"></el-input>
|
||||
<el-input v-model="dataForm.newPassword" type="password" :placeholder="$t('updatePassword.newPassword')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="confirmPassword" :label="$t('updatePassword.confirmPassword')">
|
||||
<el-input v-model="dataForm.confirmPassword" type="password" :placeholder="$t('updatePassword.confirmPassword')"></el-input>
|
||||
|
|
@ -35,7 +28,6 @@
|
|||
|
||||
<script>
|
||||
import debounce from 'lodash/debounce'
|
||||
import { Encrypt } from '@/utils/crypto'
|
||||
import { clearLoginInfo } from '@/utils'
|
||||
export default {
|
||||
data () {
|
||||
|
|
@ -50,28 +42,6 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
dataRule () {
|
||||
var validatePassword = (rule, value, callback) => {
|
||||
if (!value) {
|
||||
this.showLevel = false
|
||||
return callback(new Error(this.$t('validate.pwdStrength')))
|
||||
}
|
||||
if (value.length < 8) {
|
||||
this.showLevel = false
|
||||
return callback(new Error(this.$t('validate.pwdStrength')))
|
||||
}
|
||||
const num = /^.*[0-9]+.*/
|
||||
const low = /^.*[a-z]+.*/
|
||||
const up = /^.*[A-Z]+.*/
|
||||
const spe = /^.*[^a-zA-Z0-9]+.*/
|
||||
console.log('包含数字', num.test(value), '包含字母', low.test(value), up.test(value), '包含特殊符号', spe.test(value))
|
||||
if (!(num.test(value) && (low.test(value) || up.test(value)) && spe.test(value))) {
|
||||
return callback(new Error(this.$t('validate.pwdStrength')))
|
||||
}
|
||||
// if (!this.dataForm.id && !/\S/.test(value)) {
|
||||
// return callback(new Error(this.$t('validate.required')))
|
||||
// }
|
||||
callback()
|
||||
}
|
||||
var validateConfirmPassword = (rule, value, callback) => {
|
||||
if (this.dataForm.newPassword !== value) {
|
||||
return callback(new Error(this.$t('updatePassword.validate.confirmPassword')))
|
||||
|
|
@ -83,8 +53,7 @@ export default {
|
|||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||
],
|
||||
newPassword: [
|
||||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' },
|
||||
{ validator: validatePassword, trigger: 'blur' }
|
||||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||
],
|
||||
confirmPassword: [
|
||||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' },
|
||||
|
|
@ -94,33 +63,19 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
changeInput (value) {
|
||||
if (value !== value.replace(/ /g, '')) {
|
||||
this.$message({
|
||||
message: '密码中不允许存在空格！',
|
||||
type: 'warning'
|
||||
})
|
||||
this.dataForm.newPassword = value.replace(/ /g, '')
|
||||
// console.log('密码发生变化=============>', value)
|
||||
}
|
||||
},
|
||||
init () {
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.dataForm.resetFields()
|
||||
this.$refs['dataForm'].resetFields()
|
||||
})
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmitHandle: debounce(function () {
|
||||
this.$refs.dataForm.validate((valid) => {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (!valid) {
|
||||
return false
|
||||
}
|
||||
this.$http.put('/sys/user/password', {
|
||||
confirmPassword: Encrypt(this.dataForm.confirmPassword),
|
||||
newPassword: Encrypt(this.dataForm.newPassword),
|
||||
password: Encrypt(this.dataForm.password)
|
||||
}).then(({ data: res }) => {
|
||||
this.$http.put('/sys/user/password', this.dataForm).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
|
|
@ -136,7 +91,7 @@ export default {
|
|||
})
|
||||
}).catch(() => {})
|
||||
})
|
||||
}, 1000, { leading: true, trailing: false })
|
||||
}, 1000, { 'leading': true, 'trailing': false })
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,102 +1,59 @@
|
|||
<template>
|
||||
<nav
|
||||
class="aui-navbar"
|
||||
:class="`aui-navbar--${$store.state.navbarLayoutType}`"
|
||||
>
|
||||
<nav class="aui-navbar" :class="`aui-navbar--${$store.state.navbarLayoutType}`">
|
||||
<div class="aui-navbar__header">
|
||||
<h1 class="aui-navbar__brand" @click="$router.push({ name: 'home' })">
|
||||
<a class="aui-navbar__brand-mini" href="javascript:;">{{
|
||||
$t("brand.mini")
|
||||
}}</a>
|
||||
<a class="aui-navbar__brand-lg" href="javascript:;">{{
|
||||
$t("brand.lg")
|
||||
}}</a>
|
||||
<span>——</span>
|
||||
<span class="back-title-text">后台管理系统</span>
|
||||
<a class="aui-navbar__brand-lg" href="javascript:;">{{ $t('brand.lg') }}</a>
|
||||
<a class="aui-navbar__brand-mini" href="javascript:;">{{ $t('brand.mini') }}</a>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="aui-navbar__body">
|
||||
<el-menu class="aui-navbar__menu mr-auto" mode="horizontal">
|
||||
<!-- <el-menu-item
|
||||
index="1"
|
||||
@click="$store.state.sidebarFold = !$store.state.sidebarFold"
|
||||
>
|
||||
<svg
|
||||
class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<use xlink:href="#icon-outdent"></use>
|
||||
</svg>
|
||||
<el-menu-item index="1" @click="$store.state.sidebarFold = !$store.state.sidebarFold">
|
||||
<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch" aria-hidden="true"><use xlink:href="#icon-outdent"></use></svg>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2" @click="refresh()">
|
||||
<svg
|
||||
class="
|
||||
icon-svg
|
||||
aui-navbar__icon-menu aui-navbar__icon-menu--refresh
|
||||
"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<use xlink:href="#icon-sync"></use>
|
||||
</svg>
|
||||
</el-menu-item> -->
|
||||
<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--refresh" aria-hidden="true"><use xlink:href="#icon-sync"></use></svg>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
<el-menu class="aui-navbar__menu" mode="horizontal">
|
||||
<el-menu-item index="1">
|
||||
<el-dropdown placement="bottom" :show-timeout="0">
|
||||
<el-button size="mini">{{ $t("_lang") }}</el-button>
|
||||
<el-button size="mini">{{ $t('_lang') }}</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
v-for="(val, key) in i18nMessages"
|
||||
:key="key"
|
||||
@click.native="$i18n.locale = key"
|
||||
>{{ val._lang }}</el-dropdown-item
|
||||
>
|
||||
<el-dropdown-item v-for="(val, key) in i18nMessages" :key="key" @click.native="$i18n.locale = key">{{ val._lang }}</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2">
|
||||
<a href="//115.28.200.119:9091" target="_blank">
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
|
||||
<use xlink:href="#icon-earth"></use>
|
||||
</svg>
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-earth"></use></svg>
|
||||
</a>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3" v-if="$hasPermission('sys:notice:all')">
|
||||
<el-badge :is-dot="messageTip">
|
||||
<a href="#" @click="myNoticeRouter()"
|
||||
><i class="el-icon-bell"></i
|
||||
></a>
|
||||
<a href="#" @click="myNoticeRouter()"><i class="el-icon-bell"></i></a>
|
||||
</el-badge>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="4" @click="fullscreenHandle()">
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
|
||||
<use xlink:href="#icon-fullscreen"></use>
|
||||
</svg>
|
||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-fullscreen"></use></svg>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="5" class="aui-navbar__avatar">
|
||||
<el-dropdown placement="bottom" :show-timeout="0">
|
||||
<span class="el-dropdown-link">
|
||||
<img src="~@/assets/img/avatar.png" />
|
||||
<img src="~@/assets/img/avatar.png">
|
||||
<span>{{ $store.state.user.name }}</span>
|
||||
<i class="el-icon-arrow-down"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="updatePasswordHandle()">{{
|
||||
$t("updatePassword.title")
|
||||
}}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="logoutHandle()">{{
|
||||
$t("logout")
|
||||
}}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="updatePasswordHandle()">{{ $t('updatePassword.title') }}</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="logoutHandle()">{{ $t('logout') }}</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
<!-- 弹窗, 修改密码 -->
|
||||
<update-password
|
||||
v-if="updatePasswordVisible"
|
||||
ref="updatePassword"
|
||||
></update-password>
|
||||
<update-password v-if="updatePasswordVisible" ref="updatePassword"></update-password>
|
||||
</nav>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -151,17 +108,14 @@ export default {
|
|||
this.$router.replace('notice-notice-user')
|
||||
},
|
||||
getUnReadCount () {
|
||||
this.$http
|
||||
.get('/sys/notice/mynotice/unread')
|
||||
.then(({ data: res }) => {
|
||||
this.$http.get('/sys/notice/mynotice/unread').then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
if (res.data > 0) {
|
||||
this.messageTip = true
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}).catch(() => {})
|
||||
},
|
||||
// 全屏
|
||||
fullscreenHandle () {
|
||||
|
|
@ -183,57 +137,20 @@ export default {
|
|||
},
|
||||
// 退出
|
||||
logoutHandle () {
|
||||
this.$confirm(
|
||||
this.$t('prompt.info', { handle: this.$t('logout') }),
|
||||
this.$t('prompt.title'),
|
||||
{
|
||||
this.$confirm(this.$t('prompt.info', { handle: this.$t('logout') }), this.$t('prompt.title'), {
|
||||
confirmButtonText: this.$t('confirm'),
|
||||
cancelButtonText: this.$t('cancel'),
|
||||
type: 'warning'
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
this.$http
|
||||
.post('/logout')
|
||||
.then(({ data: res }) => {
|
||||
}).then(() => {
|
||||
this.$http.post('/logout').then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
clearLoginInfo()
|
||||
this.$router.push({ name: 'login' })
|
||||
})
|
||||
.catch(() => {})
|
||||
})
|
||||
.catch(() => {})
|
||||
}).catch(() => {})
|
||||
}).catch(() => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
@font-face {
|
||||
font-family: "header-typeface";
|
||||
src: url("~@/assets/font/header-typeface.ttf");
|
||||
}
|
||||
.aui-navbar {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
background-image: url("~@/assets/img/activitiMyWorkDynamics/header-bak.png");
|
||||
.aui-navbar__header {
|
||||
width: 25%;
|
||||
.aui-navbar__brand {
|
||||
margin-left: 20px;
|
||||
a {
|
||||
font-size: 22px;
|
||||
color: #ffffff;
|
||||
}
|
||||
.aui-navbar__brand-mini {
|
||||
display: block;
|
||||
}
|
||||
.back-title-text {
|
||||
margin-top: 5px;
|
||||
font-family: header-typeface;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,135 +1,89 @@
|
|||
<template>
|
||||
<el-submenu
|
||||
v-if="menu.children && menu.children.length >= 1"
|
||||
:index="menu.id"
|
||||
:popper-append-to-body="false"
|
||||
>
|
||||
<el-submenu v-if="menu.children && menu.children.length >= 1" :index="menu.id" :popper-append-to-body="false">
|
||||
<template slot="title">
|
||||
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true">
|
||||
<use :xlink:href="`#${menu.icon}`"></use>
|
||||
</svg>
|
||||
<span class="first-level-text">{{ menu.name }}</span>
|
||||
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true"><use :xlink:href="`#${menu.icon}`"></use></svg>
|
||||
<span>{{ menu.name }}</span>
|
||||
</template>
|
||||
<sub-menu
|
||||
v-for="item in menu.children"
|
||||
:key="item.id"
|
||||
:menu="item"
|
||||
></sub-menu>
|
||||
<sub-menu v-for="item in menu.children" :key="item.id" :menu="item"></sub-menu>
|
||||
</el-submenu>
|
||||
<el-menu-item v-else :index="menu.id" ref="li">
|
||||
<a
|
||||
:href="
|
||||
isBrowserTabOpen(menu.id)
|
||||
? getBrowserTabOpenURL(menu.id)
|
||||
: 'javascript:;'
|
||||
"
|
||||
:href="isBrowserTabOpen(menu.id) ? getBrowserTabOpenURL(menu.id) : 'javascript:;'"
|
||||
:target="isBrowserTabOpen(menu.id) ? '_blank' : '_self'"
|
||||
@click="
|
||||
isBrowserTabOpen(menu.id) ? 'return false;' : gotoRouteHandle(menu.id)
|
||||
"
|
||||
>
|
||||
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true">
|
||||
<use :xlink:href="`#${menu.icon}`"></use>
|
||||
</svg>
|
||||
@click="isBrowserTabOpen(menu.id) ? 'return false;' : gotoRouteHandle(menu.id)">
|
||||
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true"><use :xlink:href="`#${menu.icon}`"></use></svg>
|
||||
<span>{{ menu.name }}</span>
|
||||
</a>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SubMenu from "./main-sidebar-sub-menu";
|
||||
import SubMenu from './main-sidebar-sub-menu'
|
||||
export default {
|
||||
name: "sub-menu",
|
||||
data() {
|
||||
name: 'sub-menu',
|
||||
data () {
|
||||
return {
|
||||
browserTabOpenList: ["1156748733921165314"],
|
||||
};
|
||||
browserTabOpenList: [
|
||||
'1156748733921165314',
|
||||
]
|
||||
}
|
||||
},
|
||||
props: {
|
||||
menu: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
SubMenu,
|
||||
SubMenu
|
||||
},
|
||||
created() {
|
||||
created () {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.li) {
|
||||
let $li = this.$refs.li.$el;
|
||||
let $a = $li.firstElementChild;
|
||||
let $li = this.$refs.li.$el
|
||||
let $a = $li.firstElementChild
|
||||
if ($a) {
|
||||
let pl = "0",
|
||||
pr = "0";
|
||||
let pl = '0', pr = '0'
|
||||
if ($li.currentStyle) {
|
||||
pl = $li.currentStyle["paddingLeft"];
|
||||
pr = $li.currentStyle["paddingRight"];
|
||||
pl = $li.currentStyle['paddingLeft']
|
||||
pr = $li.currentStyle['paddingRight']
|
||||
} else {
|
||||
pl = window.document.defaultView.getComputedStyle($li, null)[
|
||||
"paddingLeft"
|
||||
];
|
||||
pr = window.document.defaultView.getComputedStyle($li, null)[
|
||||
"paddingRight"
|
||||
];
|
||||
pl = window.document.defaultView.getComputedStyle($li, null)['paddingLeft']
|
||||
pr = window.document.defaultView.getComputedStyle($li, null)['paddingRight']
|
||||
}
|
||||
$li.setAttribute("style", `padding-left: 0; padding-right: 0;`);
|
||||
$a.setAttribute(
|
||||
"style",
|
||||
`padding-left: ${pl}; padding-right: ${pr};`
|
||||
);
|
||||
$li.setAttribute('style', `padding-left: 0; padding-right: 0;`)
|
||||
$a.setAttribute('style', `padding-left: ${pl}; padding-right: ${pr};`)
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 是否通过浏览器Tab打开菜单
|
||||
isBrowserTabOpen(menuId) {
|
||||
return (
|
||||
this.browserTabOpenList.filter((item) => item === menuId).length >= 1
|
||||
);
|
||||
isBrowserTabOpen (menuId) {
|
||||
return this.browserTabOpenList.filter(item => item === menuId).length >= 1;
|
||||
},
|
||||
// 获取浏览器Tab打开菜单URL
|
||||
getBrowserTabOpenURL(menuId) {
|
||||
var route = window.SITE_CONFIG["dynamicMenuRoutes"].filter(
|
||||
(item) => item.meta.menuId === menuId
|
||||
)[0];
|
||||
return route ? route.meta.iframeURL : "";
|
||||
getBrowserTabOpenURL (menuId) {
|
||||
var route = window.SITE_CONFIG['dynamicMenuRoutes'].filter(item => item.meta.menuId === menuId)[0]
|
||||
return route ? route.meta.iframeURL : '';
|
||||
},
|
||||
// 通过menuId与动态(菜单)路由进行匹配跳转至指定路由
|
||||
gotoRouteHandle(menuId) {
|
||||
var route = window.SITE_CONFIG["dynamicMenuRoutes"].filter(
|
||||
(item) => item.meta.menuId === menuId
|
||||
)[0];
|
||||
gotoRouteHandle (menuId) {
|
||||
var route = window.SITE_CONFIG['dynamicMenuRoutes'].filter(item => item.meta.menuId === menuId)[0]
|
||||
if (route) {
|
||||
this.$router.push({ name: route.name });
|
||||
this.$router.push({ name: route.name })
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.aui-sidebar__menu {
|
||||
.first-level-text {
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
font-weight: bold;
|
||||
}
|
||||
.el-menu-item {
|
||||
&.is-active {
|
||||
color: #ffffff;
|
||||
background-color: #0058e1;
|
||||
border: none;
|
||||
}
|
||||
a {
|
||||
.el-menu-item > a {
|
||||
display: block;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
span {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,68 +1,30 @@
|
|||
<!--
|
||||
* @Author: kongjun qdkongjun@gmail.com
|
||||
* @Date: 2022-06-20 09:29:59
|
||||
* @LastEditors: kongjun qdkongjun@gmail.com
|
||||
* @LastEditTime: 2022-06-22 10:04:56
|
||||
* @FilePath: \back\src\views\main-sidebar.vue
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
-->
|
||||
<template>
|
||||
<aside
|
||||
:class="['aui-sidebar', `aui-sidebar--${$store.state.sidebarLayoutSkin}`]"
|
||||
>
|
||||
<aside :class="['aui-sidebar', `aui-sidebar--${$store.state.sidebarLayoutSkin}`]">
|
||||
<div class="aui-sidebar__inner">
|
||||
<el-menu
|
||||
:default-active="$store.state.sidebarMenuActiveName"
|
||||
:collapse="$store.state.sidebarFold"
|
||||
:unique-opened="true"
|
||||
:collapseTransition="false"
|
||||
class="aui-sidebar__menu"
|
||||
>
|
||||
<sub-menu
|
||||
v-for="menu in $store.state.sidebarMenuList"
|
||||
:key="menu.id"
|
||||
:menu="menu"
|
||||
/>
|
||||
class="aui-sidebar__menu">
|
||||
<sub-menu v-for="menu in $store.state.sidebarMenuList" :key="menu.id" :menu="menu" />
|
||||
</el-menu>
|
||||
</div>
|
||||
</aside>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SubMenu from "./main-sidebar-sub-menu";
|
||||
import SubMenu from './main-sidebar-sub-menu'
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
components: {
|
||||
SubMenu,
|
||||
SubMenu
|
||||
},
|
||||
created() {
|
||||
this.$store.state.sidebarMenuList = window.SITE_CONFIG["menuList"];
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.aui-sidebar {
|
||||
width: 266px;
|
||||
.aui-sidebar__inner {
|
||||
width: 260px;
|
||||
//overflow-y: hidden;
|
||||
/*滚动条样式*/
|
||||
&::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
border-radius: 5;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
border-radius: 0;
|
||||
background: #f2f2f2;
|
||||
}
|
||||
.aui-sidebar__menu {
|
||||
width: 266px;
|
||||
}
|
||||
created () {
|
||||
this.$store.state.sidebarMenuList = window.SITE_CONFIG['menuList']
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,42 +1,21 @@
|
|||
<!--
|
||||
* @Author: kongjun qdkongjun@gmail.com
|
||||
* @Date: 2022-06-20 09:29:59
|
||||
* @LastEditors: kongjun qdkongjun@gmail.com
|
||||
* @LastEditTime: 2022-06-21 11:36:51
|
||||
* @FilePath: \back\src\views\main-theme-tools.vue
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
-->
|
||||
<template>
|
||||
<div class="aui-theme-tools" :class="{ 'aui-theme-tools--open': isOpen }">
|
||||
<div class="aui-theme-tools__toggle" @click="isOpen = !isOpen">
|
||||
<svg class="icon-svg" aria-hidden="true">
|
||||
<use xlink:href="#icon-setting"></use>
|
||||
</svg>
|
||||
<svg class="icon-svg" aria-hidden="true"><use xlink:href="#icon-setting"></use></svg>
|
||||
</div>
|
||||
<div class="aui-theme-tools__content">
|
||||
<div class="aui-theme-tools__item">
|
||||
<h3>Navbar</h3>
|
||||
<el-checkbox
|
||||
v-model="$store.state.navbarLayoutType"
|
||||
true-label="colorful"
|
||||
>colorful 鲜艳</el-checkbox
|
||||
>
|
||||
<el-checkbox v-model="$store.state.navbarLayoutType" true-label="colorful">colorful 鲜艳</el-checkbox>
|
||||
</div>
|
||||
<div class="aui-theme-tools__item">
|
||||
<h3>Sidebar</h3>
|
||||
<el-checkbox v-model="$store.state.sidebarLayoutSkin" true-label="dark"
|
||||
>dark 黑色</el-checkbox
|
||||
>
|
||||
<el-checkbox v-model="$store.state.sidebarLayoutSkin" true-label="dark">dark 黑色</el-checkbox>
|
||||
</div>
|
||||
<div class="aui-theme-tools__item">
|
||||
<h3>Theme</h3>
|
||||
<el-radio-group v-model="themeColor" @change="themeColorChangeHandle">
|
||||
<el-radio
|
||||
v-for="item in themeList"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
>{{ `${item.name} ${item.desc}` }}</el-radio
|
||||
>
|
||||
<el-radio v-for="item in themeList" :key="item.name" :label="item.name">{{ `${item.name} ${item.desc}` }}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -45,50 +24,38 @@
|
|||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
isOpen: false,
|
||||
themeList: require("@/element-ui/config.js"),
|
||||
themeColor: "blue",
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.themeColorChangeHandle("blue");
|
||||
themeList: require('@/element-ui/config.js'),
|
||||
themeColor: 'turquoise'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
themeColorChangeHandle(val) {
|
||||
themeColorChangeHandle (val) {
|
||||
var styleList = [
|
||||
{
|
||||
id: "J_elementTheme",
|
||||
url: `${
|
||||
process.env.BASE_URL
|
||||
}element-theme/${val}/index.css?t=${new Date().getTime()}`,
|
||||
id: 'J_elementTheme',
|
||||
url: `${process.env.BASE_URL}element-theme/${val}/index.css?t=${new Date().getTime()}`
|
||||
},
|
||||
{
|
||||
id: "J_auiTheme",
|
||||
url: `${
|
||||
process.env.BASE_URL
|
||||
}element-theme/${val}/aui.css?t=${new Date().getTime()}`,
|
||||
},
|
||||
];
|
||||
id: 'J_auiTheme',
|
||||
url: `${process.env.BASE_URL}element-theme/${val}/aui.css?t=${new Date().getTime()}`
|
||||
}
|
||||
]
|
||||
for (var i = 0; i < styleList.length; i++) {
|
||||
var el = document.querySelector(`#${styleList[i].id}`);
|
||||
var el = document.querySelector(`#${styleList[i].id}`)
|
||||
if (el) {
|
||||
el.href = styleList[i].url;
|
||||
continue;
|
||||
el.href = styleList[i].url
|
||||
continue
|
||||
}
|
||||
el = document.createElement('link')
|
||||
el.id = styleList[i].id
|
||||
el.href = styleList[i].url
|
||||
el.rel = 'stylesheet'
|
||||
document.querySelector('head').appendChild(el)
|
||||
}
|
||||
}
|
||||
el = document.createElement("link");
|
||||
el.id = styleList[i].id;
|
||||
el.href = styleList[i].url;
|
||||
el.rel = "stylesheet";
|
||||
document.querySelector("head").appendChild(el);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.aui-theme-tools__toggle {
|
||||
background-color: #0058e1;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,5 @@
|
|||
<template>
|
||||
<div
|
||||
v-loading.fullscreen.lock="loading"
|
||||
:element-loading-text="$t('loading')"
|
||||
:class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]"
|
||||
>
|
||||
<div v-loading.fullscreen.lock="loading" :element-loading-text="$t('loading')" :class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]">
|
||||
<template v-if="!loading">
|
||||
<main-navbar />
|
||||
<main-sidebar />
|
||||
|
|
@ -51,22 +47,20 @@ export default {
|
|||
created () {
|
||||
this.windowResizeHandle()
|
||||
this.routeHandle(this.$route)
|
||||
Promise.all([this.getUserInfo(), this.getPermissions()]).then(() => {
|
||||
Promise.all([
|
||||
this.getUserInfo(),
|
||||
this.getPermissions()
|
||||
]).then(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 窗口改变大小
|
||||
windowResizeHandle () {
|
||||
this.$store.state.sidebarFold =
|
||||
document.documentElement.clientWidth <= 992 || false
|
||||
window.addEventListener(
|
||||
'resize',
|
||||
debounce(() => {
|
||||
this.$store.state.sidebarFold =
|
||||
document.documentElement.clientWidth <= 992 || false
|
||||
}, 150)
|
||||
)
|
||||
this.$store.state.sidebarFold = document.documentElement['clientWidth'] <= 992 || false
|
||||
window.addEventListener('resize', debounce(() => {
|
||||
this.$store.state.sidebarFold = document.documentElement['clientWidth'] <= 992 || false
|
||||
}, 150))
|
||||
},
|
||||
// 路由, 监听
|
||||
routeHandle (route) {
|
||||
|
|
@ -75,66 +69,52 @@ export default {
|
|||
}
|
||||
let tab = {}
|
||||
let routeName = route.name
|
||||
const routeMeta = route.meta
|
||||
let routeMeta = route.meta
|
||||
if (route.name === 'iframe') {
|
||||
const url = route.query.url || ''
|
||||
let url = route.query.url || ''
|
||||
if (!isURL(url)) {
|
||||
return false
|
||||
}
|
||||
const key = route.query.key || new Date().getTime()
|
||||
let key = route.query.key || new Date().getTime()
|
||||
routeName = `${routeName}_${key}`
|
||||
routeMeta.title = key.toString()
|
||||
routeMeta.menuId = route.query.menuId || ''
|
||||
routeMeta.iframeURL = url
|
||||
}
|
||||
tab = this.$store.state.contentTabs.filter(
|
||||
(item) => item.name === routeName
|
||||
)[0]
|
||||
tab = this.$store.state.contentTabs.filter(item => item.name === routeName)[0]
|
||||
if (!tab) {
|
||||
tab = {
|
||||
...window.SITE_CONFIG.contentTabDefault,
|
||||
...window.SITE_CONFIG['contentTabDefault'],
|
||||
...routeMeta,
|
||||
name: routeName,
|
||||
params: { ...route.params },
|
||||
query: { ...route.query }
|
||||
'name': routeName,
|
||||
'params': { ...route.params },
|
||||
'query': { ...route.query }
|
||||
}
|
||||
this.$store.state.contentTabs =
|
||||
this.$store.state.contentTabs.concat(tab)
|
||||
this.$store.state.contentTabs = this.$store.state.contentTabs.concat(tab)
|
||||
}
|
||||
this.$store.state.sidebarMenuActiveName = tab.menuId
|
||||
this.$store.state.contentTabsActiveName = tab.name
|
||||
},
|
||||
// 获取当前管理员信息
|
||||
getUserInfo () {
|
||||
return this.$http
|
||||
.get('/sys/user/info')
|
||||
.then(({ data: res }) => {
|
||||
return this.$http.get('/sys/user/info').then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.$store.state.user.id = res.data.id
|
||||
this.$store.state.user.name = res.data.realName
|
||||
this.$store.state.user.name = res.data.username
|
||||
this.$store.state.user.superAdmin = res.data.superAdmin
|
||||
})
|
||||
.catch(() => {})
|
||||
}).catch(() => {})
|
||||
},
|
||||
// 获取权限
|
||||
getPermissions () {
|
||||
return this.$http
|
||||
.get('/sys/menu/permissions')
|
||||
.then(({ data: res }) => {
|
||||
return this.$http.get('/sys/menu/permissions').then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
window.SITE_CONFIG.permissions = res.data
|
||||
})
|
||||
.catch(() => {})
|
||||
window.SITE_CONFIG['permissions'] = res.data
|
||||
}).catch(() => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.aui-content__wrapper {
|
||||
margin-left: 266px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,463 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-dialog :visible.sync="addOrUpdateVisibleCopy" :title="modalTypeText[modalType]" @close="closeModal"
|
||||
:close-on-click-modal="false" :close-on-press-escape="false">
|
||||
<div class="first-title">
|
||||
填写字段
|
||||
</div>
|
||||
<el-checkbox-group v-model="checkList" @change="changeBtn" style="margin-bottom: 20px">
|
||||
<el-checkbox-button v-for="(item) in btnList" :label="item" :key="item">{{ item }}
|
||||
</el-checkbox-button>
|
||||
</el-checkbox-group>
|
||||
|
||||
<!-- 挂载和修改-->
|
||||
<div key="1">
|
||||
<el-form :model="dataForm" :rules="rules" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()"
|
||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'">
|
||||
<!-- 基本信息 -->
|
||||
<div style="margin-bottom:20px" v-show="checkList.includes('基本信息')">
|
||||
<div style="
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
">
|
||||
基本信息
|
||||
</div>
|
||||
<el-form-item label="融合服务名称" prop="name">
|
||||
<el-input class="input-box" v-model="dataForm.name" placeholder="请输入融合服务名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="融合服务描述" prop="description">
|
||||
<el-input type="textarea" :rows="3" class="input-box" v-model="dataForm.description"
|
||||
placeholder="请输入融合服务描述"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="应用领域" prop="applicationArea">
|
||||
<el-select v-model="dataForm.applicationArea" placeholder="请选择应用领域" filterable>
|
||||
<el-option v-for="item in areaList" :key="item.value" :label="item.label" :value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="图片">
|
||||
<el-upload ref="editUpload" class="upload-demo" :action="fileUploadUrl"
|
||||
:on-success="eidtHandleAvatarSuccess" :before-upload="editBeforeAvatarUpload" :limit="1" :file-list="[]"
|
||||
:on-remove="editUploadRemoveFile" :on-exceed="handleExceed" list-type="picture">
|
||||
<el-button size="small" type="primary" class="button-new">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传图片文件</div>
|
||||
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
<!-- 组合能力 -->
|
||||
<div class="" style="marigin-bottom:40px" v-show="checkList.includes('组合能力')">
|
||||
<div class="title">
|
||||
组合能力
|
||||
</div>
|
||||
<InfrastructureModal v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施"
|
||||
:modalType="modalType" ref="jcssDom"></InfrastructureModal>
|
||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
||||
:getDataParams="getListParams['数据资源']"></combine-ability>
|
||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
||||
:getDataParams="getListParams['组件服务']"></combine-ability>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<template slot="footer">
|
||||
<el-button @click="closeModal">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">{{
|
||||
$t("confirm")
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import debounce from "lodash/debounce";
|
||||
import qs from "qs";
|
||||
import CommonQuestion from './components/common-question.vue';
|
||||
import IntegratedCombineAbility from './components/integrated-combine-ability.vue';
|
||||
import CombineAbility from './components/combine-ability.vue';
|
||||
import Cookies from 'js-cookie'
|
||||
import { tableColumns } from './IntegratedServices.vue';
|
||||
import { getFuseResourceList, getListParams, modalTypeText } from "./assignedScene/add-update-scene.vue";
|
||||
import InfrastructureModal from './assignedScene/components/infrastructure-modal.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
CommonQuestion,
|
||||
IntegratedCombineAbility,
|
||||
CombineAbility,
|
||||
InfrastructureModal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload',
|
||||
dataForm: {
|
||||
"name": "",
|
||||
"applicationArea": "",
|
||||
"description": "",
|
||||
"fuseAttrList": [
|
||||
{
|
||||
"attrType": "服务图片",
|
||||
"attrValue": "",
|
||||
},
|
||||
],
|
||||
// 选择的能力
|
||||
"fuseResourceList": [
|
||||
{
|
||||
"resourceId": 0,
|
||||
"sequence": ""
|
||||
}
|
||||
],
|
||||
type: '打包模式'
|
||||
},
|
||||
rules: {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入融合服务名称",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
description: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入融合服务描述",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
},
|
||||
btnList: ['基本信息', '组合能力'],
|
||||
checkList: ['基本信息', '组合能力'],
|
||||
areaList: [],
|
||||
addOrUpdateVisibleCopy: this.addOrUpdateVisible,
|
||||
displayInfo: tableColumns,
|
||||
getListParams: getListParams,
|
||||
refsParseArray: {
|
||||
'zjfwDom': '组件服务',
|
||||
'sjzyDom': '数据资源',
|
||||
'jcssDom': '基础设施',
|
||||
},
|
||||
modalTypeText: modalTypeText,
|
||||
abilityListObj: {},
|
||||
// 限定图片
|
||||
handleExceed() {
|
||||
this.$message({ type: 'error', message: '最多支持一张图片上传' })
|
||||
},
|
||||
imageUrl: ''
|
||||
};
|
||||
},
|
||||
props: {
|
||||
modalType: {
|
||||
type: String,
|
||||
default: 'add'
|
||||
},
|
||||
addOrUpdateVisible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataForm: {
|
||||
handler(newVal) {
|
||||
this.dataForm = newVal
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
addOrUpdateVisible: {
|
||||
handler(newVal) {
|
||||
this.addOrUpdateVisibleCopy = newVal;
|
||||
if (this.modalType == 'add' && newVal) {
|
||||
this.getDetail(this.dataForm)
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 获取应用领域
|
||||
this.getAreaInfo()
|
||||
},
|
||||
methods: {
|
||||
clearForm() {
|
||||
this.$refs.dataForm && this.$refs.dataForm.resetFields();
|
||||
},
|
||||
closeModal() {
|
||||
this.$emit('closeModal')
|
||||
},
|
||||
// 获取应用领域
|
||||
getAreaInfo() {
|
||||
const params = {
|
||||
page: 1,
|
||||
limit: 99,
|
||||
dictTypeId: "1513712507692818433",
|
||||
};
|
||||
this.$http
|
||||
.get("/sys/dict/data/page" + "?" + qs.stringify(params))
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
res.data.list.map((item) => {
|
||||
this.areaList.push({
|
||||
label: item.dictLabel,
|
||||
value: item.dictLabel
|
||||
});
|
||||
});
|
||||
}).catch(err => {
|
||||
this.$message.error(err);
|
||||
})
|
||||
},
|
||||
// 更新表单
|
||||
updateDataForm(data) {
|
||||
if (Object.keys(this.getListParams).includes(data.title)) {
|
||||
this.abilityListObj[data.title] = data.list;
|
||||
}
|
||||
},
|
||||
getFuseResourceList() {
|
||||
return getFuseResourceList(this.abilityListObj)
|
||||
},
|
||||
// 改变按钮状态
|
||||
changeBtn(data) {
|
||||
this.checkList = data;
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmitHandle: debounce(
|
||||
function () {
|
||||
this.$refs.dataForm.validate((valid) => {
|
||||
if (!valid) {
|
||||
this.$message.error("请检查表单是否填写完整");
|
||||
return false;
|
||||
}
|
||||
let methodsObj = {
|
||||
'add': 'post',
|
||||
'update': 'put'
|
||||
}
|
||||
this.dataForm.fuseResourceList = this.getFuseResourceList()
|
||||
if (this.imageUrl == '') {
|
||||
this.$message.error("请上传图片！");
|
||||
return;
|
||||
}
|
||||
this.dataForm.fuseAttrList.find(v => v.attrType == '服务图片').attrValue = this.imageUrl || '';
|
||||
this.$http
|
||||
[methodsObj[this.modalType]]("/fuse", this.dataForm)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.$message({
|
||||
message: this.$t("prompt.success"),
|
||||
type: "success",
|
||||
duration: 500,
|
||||
onClose: () => {
|
||||
this.$refs.dataForm && this.$refs.dataForm.resetFields();
|
||||
this.$emit("refreshDataList");
|
||||
this.$emit("closeModal");
|
||||
},
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
this.$message.error(err)
|
||||
});
|
||||
});
|
||||
},
|
||||
1000,
|
||||
{ leading: true, trailing: false }
|
||||
),
|
||||
// 详情
|
||||
getDetail(data) {
|
||||
this.dataForm = data;
|
||||
this.$nextTick(() => {
|
||||
for (const key in this.refsParseArray) {
|
||||
this.$refs[key] && this.$refs[key].getDataInfo && this.$refs[key].getDataInfo(data)
|
||||
}
|
||||
let _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {};
|
||||
this.imageUrl = _imgObj.attrValue;
|
||||
|
||||
// 组合能力
|
||||
Object.keys(this.getListParams).map(k => {
|
||||
let arr = data.fuseResourceList.filter(v => v.type == k);
|
||||
let arr2 = [];
|
||||
arr.map(v => {
|
||||
arr2.push(v.resourceId)
|
||||
})
|
||||
this.abilityListObj[k] = arr2
|
||||
})
|
||||
|
||||
console.log('this.dataForm----详情-------->', this.dataForm);
|
||||
})
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
return isImage
|
||||
},
|
||||
addUploadRemoveFile(file, fileList) {
|
||||
this.$refs.addUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
editBeforeAvatarUpload(file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
return isImage
|
||||
},
|
||||
editUploadRemoveFile(file, fileList) {
|
||||
this.$refs.editUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
eidtHandleAvatarSuccess(res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.clearForm()
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
height: 580px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.detial-form ::v-deep {
|
||||
.el-form-item {
|
||||
margin-bottom: 0px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.el-form-item__content {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox-button__inner {
|
||||
width: 130px;
|
||||
margin: 0 10px 5px;
|
||||
border-left: unset !important;
|
||||
border-radius: unset !important;
|
||||
border: 1px solid #dcdfe6 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.mod-sys__menu {
|
||||
|
||||
.menu-list,
|
||||
.icon-list {
|
||||
|
||||
.el-input__inner,
|
||||
.el-input__suffix {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
&-icon-popover {
|
||||
width: 458px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&-icon-inner {
|
||||
width: 478px;
|
||||
max-height: 258px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
&-icon-list {
|
||||
width: 458px;
|
||||
padding: 0;
|
||||
margin: -8px 0 0 -8px;
|
||||
|
||||
>.el-button {
|
||||
padding: 8px;
|
||||
margin: 8px 0 0 8px;
|
||||
|
||||
>span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.previewImg {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.name {
|
||||
text-align: right;
|
||||
vertical-align: middle;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 12px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
line-height: 32px;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 132px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
|
||||
.first-title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,179 +0,0 @@
|
|||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-ability__bsabilityai">
|
||||
<el-form :inline="true" :model="dataForm">
|
||||
<el-form-item>
|
||||
<el-input v-model="dataForm.name" placeholder="名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="searchData">{{
|
||||
$t("query")
|
||||
}}</el-button>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button v-if="$hasPermission('ability:bsabilityai:save')" type="primary" @click="addServe()">挂接</el-button>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle"
|
||||
style="width: 100%" :height="qp ? '810px' : '650px'">
|
||||
<el-table-column v-for="(item) in Object.keys(tableColumns)" :key="item" :prop="item"
|
||||
:label="tableColumns[item]" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="240" right="0">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-if="$hasPermission('ability:bsabilityai:update')" type="text" size="small"
|
||||
@click="handleUpdate(scope.row)">{{ $t("update") }}</el-button>
|
||||
<el-button v-if="$hasPermission('ability:bsabilityai:delete')" type="text" size="small"
|
||||
@click="deleteRow(scope.row.id)">{{ $t("delete") }}</el-button>
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)">详情</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="Number(total)"
|
||||
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
|
||||
@current-change="pageCurrentChangeHandle">
|
||||
</el-pagination>
|
||||
|
||||
<!-- 弹窗, 新增 / 修改 -->
|
||||
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="query" @closeModal="closeModal"
|
||||
:addOrUpdateVisible="addOrUpdateVisible" :modalType="modalType">
|
||||
</add-or-update>
|
||||
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mixinViewModule from "@/mixins/view-module";
|
||||
import AddOrUpdate from "./IntegratedServices-add";
|
||||
import qs from "qs";
|
||||
import { type } from "os";
|
||||
|
||||
export const tableColumns = {
|
||||
'name': '名称',
|
||||
'description': '描述',
|
||||
'applicationArea': '应用领域',
|
||||
}
|
||||
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
data() {
|
||||
return {
|
||||
// 表格--列
|
||||
tableColumns: tableColumns,
|
||||
tableData: [],
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: "/fuse/page",
|
||||
exportURL: "/ability/bsabilityai/export",
|
||||
deleteURL: "/fuse",
|
||||
getDataListIsPage: true,
|
||||
deleteIsBatch: false,
|
||||
},
|
||||
dataForm: {
|
||||
name: "",
|
||||
order: 'desc',
|
||||
orderField: 'create_date',
|
||||
type: '打包模式'
|
||||
},
|
||||
qp: false,
|
||||
modalType: 'add',
|
||||
};
|
||||
},
|
||||
components: {
|
||||
AddOrUpdate,
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener("resize", this.a);
|
||||
this.fullScreen();
|
||||
},
|
||||
methods: {
|
||||
deleteRow(id) {
|
||||
this.$http.delete('/fuse/delete', {
|
||||
data: [id]
|
||||
}).then(res => {
|
||||
console.log('删除成功', res)
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: "success",
|
||||
duration: 500,
|
||||
onClose: () => {
|
||||
this.query()
|
||||
},
|
||||
});
|
||||
}).catch(err => {
|
||||
this.$message.error(err);
|
||||
})
|
||||
},
|
||||
// 查询
|
||||
searchData() {
|
||||
this.query()
|
||||
},
|
||||
// 重置
|
||||
reset() {
|
||||
this.dataForm.name = "";
|
||||
this.query()
|
||||
},
|
||||
// 修改
|
||||
handleUpdate(val) {
|
||||
this.addOrUpdateVisible = true;
|
||||
this.modalType = 'update';
|
||||
const cloneVal = JSON.parse(JSON.stringify(val))
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.getDetail(cloneVal)
|
||||
})
|
||||
},
|
||||
// 挂接
|
||||
addServe() {
|
||||
this.addOrUpdateVisible = true
|
||||
this.modalType = 'add';
|
||||
},
|
||||
closeModal() {
|
||||
this.addOrUpdateVisible = false;
|
||||
},
|
||||
// 详情
|
||||
showDetail(val) {
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/packagingDetails?id=' + val.id)
|
||||
},
|
||||
// showDocument(val) {
|
||||
// console.log(val);
|
||||
// window.open(
|
||||
// window.SITE_CONFIG.frontUrl + "?id=" + val.id + "&&type=" + val.type,
|
||||
// "_blank"
|
||||
// );
|
||||
// },
|
||||
fullScreen() {
|
||||
if (window.outerHeight === screen.availHeight) {
|
||||
if (window.outerWidth === screen.availWidth) {
|
||||
console.log(
|
||||
"全屏1",
|
||||
);
|
||||
this.qp = false;
|
||||
} else {
|
||||
console.log(
|
||||
"不是全屏2",
|
||||
);
|
||||
this.qp = true;
|
||||
}
|
||||
} else {
|
||||
console.log(
|
||||
"不是全屏3",
|
||||
);
|
||||
this.qp = true;
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-tooltip__popper {
|
||||
max-width: 50%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,567 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-dialog :visible.sync="addOrUpdateVisibleCopy" :title="modalTypeText[modalType]" @close="closeModal"
|
||||
:close-on-click-modal="false" :close-on-press-escape="false">
|
||||
<div class="first-title">
|
||||
填写字段
|
||||
</div>
|
||||
<el-checkbox-group v-model="checkList" @change="changeBtn" style="margin-bottom: 20px">
|
||||
<el-checkbox-button v-for="(item) in btnList" :label="item" :key="item">{{ item }}
|
||||
</el-checkbox-button>
|
||||
</el-checkbox-group>
|
||||
|
||||
<!-- 挂载和修改 -->
|
||||
<div key="1">
|
||||
<el-form :model="dataForm" :rules="rules" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()"
|
||||
:label-width="$i18n.locale === 'en-US' ? '120px' : '100px'">
|
||||
<!-- 基本信息 -->
|
||||
<div style="margin-bottom:40px" v-show="checkList.includes('基本信息')">
|
||||
<div style="
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
">
|
||||
基本信息
|
||||
</div>
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="dataForm.name" placeholder="请输入名称" style="width:90%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述" prop="description">
|
||||
<el-input type="textarea" :rows="3" v-model="dataForm.description" placeholder="请输入描述" style="width:90%">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="图片">
|
||||
<el-upload ref="editUpload" class="upload-demo" :action="fileUploadUrl"
|
||||
:on-success="eidtHandleAvatarSuccess" :before-upload="editBeforeAvatarUpload" :limit="1" :file-list="[]"
|
||||
:on-remove="editUploadRemoveFile" :on-exceed="handleExceed" list-type="picture">
|
||||
<el-button size="small" type="primary" class="button-new">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传图片文件</div>
|
||||
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 场景痛点 -->
|
||||
<div class="" style="padding-bottom:40px" v-show="checkList.includes('场景痛点')">
|
||||
<scene-one-input :dataForm="dataForm" @update="updateDataForm" ref="scenePainDom" title="场景痛点"
|
||||
:keyTextObj="painKeyTextObj"></scene-one-input>
|
||||
</div>
|
||||
|
||||
<!-- 解决方案 -->
|
||||
<div class="" style="padding-bottom:40px" v-show="checkList.includes('解决方案')">
|
||||
<scene-one-input :dataForm="dataForm" @update="updateDataForm" ref="solutionDom" title="解决方案"
|
||||
:keyTextObj="solutionKeyTextObj"></scene-one-input>
|
||||
</div>
|
||||
|
||||
<!-- 组合能力 -->
|
||||
<div class="" style="padding-bottom:40px" v-show="checkList.includes('组合能力')">
|
||||
<div class="title">
|
||||
组合能力
|
||||
</div>
|
||||
<InfrastructureModal v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施"
|
||||
:modalType="modalType" ref="jcssDom"></InfrastructureModal>
|
||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
||||
:getDataParams="getListParams['数据资源']"></combine-ability>
|
||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
||||
:getDataParams="getListParams['组件服务']"></combine-ability>
|
||||
</div>
|
||||
|
||||
<!-- 更多能力 -->
|
||||
<div class="" style="marigin-bottom:40px" v-show="checkList.includes('更多能力')">
|
||||
<common-question :dataForm="dataForm" @update="updateDataForm" ref="moreAbilityDom" title="更多能力"
|
||||
:keyTextObj="moreKeyTextObj">
|
||||
</common-question>
|
||||
</div>
|
||||
|
||||
<!-- 使用步骤 -->
|
||||
<div style="marigin-bottom:20px" v-show="checkList.includes('使用步骤')">
|
||||
<scene-use-step :dataForm="dataForm" @update="updateDataForm" ref="sceneUseUpDom">
|
||||
</scene-use-step>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
<template slot="footer">
|
||||
<el-button @click="closeModal">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">{{
|
||||
$t("confirm")
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import debounce from 'lodash/debounce'
|
||||
import qs from 'qs'
|
||||
import SceneUseStep from './components/scene-use-step.vue'
|
||||
import SceneOneInput from './components/scene-one-input.vue'
|
||||
import CombineAbility from '../components/combine-ability.vue'
|
||||
import CommonQuestion from '../components/common-question.vue'
|
||||
import InfrastructureModal from './components/infrastructure-modal.vue'
|
||||
import Cookies from 'js-cookie'
|
||||
import upload from '@/views/modules/components/upload'
|
||||
|
||||
const btnArray = ['基本信息', '场景痛点', '解决方案', '组合能力', '更多能力', '使用步骤']
|
||||
// 数据资源\组件服务
|
||||
export const getJson = (type) => {
|
||||
if (type === '组件服务') {
|
||||
return {
|
||||
methods: 'get',
|
||||
url: '/census/center/selectResourceListByType',
|
||||
postData: {
|
||||
type
|
||||
}
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
methods: 'post',
|
||||
url: '/resource/getDataResource',
|
||||
postData: {
|
||||
serviceName: '', // 资源名称
|
||||
orderField: 'fbrq', // 排序字段
|
||||
orderType: 'desc',
|
||||
pageNum: 1, // 页码
|
||||
pageSize: 15 // 分页大小
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
export const getDescJson = (text) => {
|
||||
return {
|
||||
descObj: {
|
||||
text: `${text}描述`,
|
||||
key: 'description'
|
||||
}
|
||||
}
|
||||
}
|
||||
// 弹框的方法
|
||||
export const getListParams = {
|
||||
数据资源: getJson('数据资源'),
|
||||
组件服务: getJson('组件服务'),
|
||||
基础设施: ''
|
||||
}
|
||||
// 模态框标题
|
||||
export const modalTypeText = {
|
||||
add: '挂接',
|
||||
update: '修改'
|
||||
}
|
||||
|
||||
export const getFuseResourceList = (abilityListObj) => {
|
||||
const arr = []
|
||||
let length = 0
|
||||
for (const key in abilityListObj) {
|
||||
if (Object.hasOwnProperty.call(abilityListObj, key)) {
|
||||
const itemArray = abilityListObj[key]
|
||||
itemArray.map((v, i) => {
|
||||
const index = (i + 1) + length
|
||||
arr.push({
|
||||
resourceId: v,
|
||||
type: key,
|
||||
sequence: index
|
||||
})
|
||||
})
|
||||
length = itemArray.length
|
||||
}
|
||||
}
|
||||
return arr
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SceneUseStep,
|
||||
CombineAbility,
|
||||
SceneOneInput,
|
||||
upload,
|
||||
CommonQuestion,
|
||||
InfrastructureModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload',
|
||||
moreKeyTextObj: {
|
||||
nameObj: {
|
||||
text: '能力名称',
|
||||
key: 'name'
|
||||
},
|
||||
...getDescJson('能力')
|
||||
},
|
||||
painKeyTextObj: getDescJson('痛点'),
|
||||
solutionKeyTextObj: getDescJson('方案'),
|
||||
dataForm: {
|
||||
name: '',
|
||||
applicationArea: '',
|
||||
description: '',
|
||||
fuseAttrList: [
|
||||
{
|
||||
attrType: '使用步骤',
|
||||
attrValue: [{ question: '', answer: '' }]
|
||||
},
|
||||
{
|
||||
attrType: '更多能力',
|
||||
attrValue: [{ name: '', description: '' }]
|
||||
},
|
||||
{
|
||||
attrType: '场景痛点',
|
||||
attrValue: [{ description: '' }]
|
||||
},
|
||||
{
|
||||
attrType: '解决方案',
|
||||
attrValue: [{ description: '' }]
|
||||
},
|
||||
{
|
||||
attrType: '服务图片',
|
||||
attrValue: ''
|
||||
}
|
||||
],
|
||||
fuseResourceList: []
|
||||
},
|
||||
rules: {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入名称',
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
description: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入描述',
|
||||
trigger: 'change'
|
||||
}
|
||||
]
|
||||
},
|
||||
checkList: JSON.parse(JSON.stringify(btnArray)),
|
||||
btnList: JSON.parse(JSON.stringify(btnArray)),
|
||||
addOrUpdateVisibleCopy: this.addOrUpdateVisible,
|
||||
displayInfo: {
|
||||
name: '名称',
|
||||
description: '描述'
|
||||
},
|
||||
modalTypeText: modalTypeText,
|
||||
refsParseArray: {
|
||||
sceneUseUpDom: '使用步骤',
|
||||
moreAbilityDom: '更多能力',
|
||||
scenePainDom: '场景痛点',
|
||||
solutionDom: '解决方案',
|
||||
zjfwDom: '组件服务',
|
||||
sjzyDom: '数据资源',
|
||||
jcssDom: '基础设施'
|
||||
},
|
||||
getListParams: getListParams,
|
||||
abilityListObj: {},
|
||||
imgData: [],
|
||||
// 限定图片
|
||||
handleExceed () {
|
||||
this.$message({ type: 'error', message: '最多支持一张图片上传' })
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
props: {
|
||||
modalType: {
|
||||
type: String,
|
||||
default: 'add'
|
||||
},
|
||||
addOrUpdateVisible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataForm: {
|
||||
handler (newVal) {
|
||||
this.dataForm = newVal
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
},
|
||||
addOrUpdateVisible: {
|
||||
handler (newVal) {
|
||||
this.addOrUpdateVisibleCopy = newVal
|
||||
if (this.modalType == 'add' && newVal) {
|
||||
localStorage.setItem('InfrastructureSearchData', JSON.stringify({}))
|
||||
this.getDetail(this.dataForm)
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clearForm () {
|
||||
this.$refs.dataForm && this.$refs.dataForm.resetFields()
|
||||
},
|
||||
closeModal () {
|
||||
this.$emit('closeModal')
|
||||
},
|
||||
// 更新表单
|
||||
updateDataForm (data) {
|
||||
if (Object.keys(this.getListParams).includes(data.title)) {
|
||||
this.abilityListObj[data.title] = data.list
|
||||
} else {
|
||||
// 更多能力、使用步骤
|
||||
this.operateFuseAttrList(data.title, data)
|
||||
}
|
||||
},
|
||||
getFuseResourceList () {
|
||||
return getFuseResourceList(this.abilityListObj)
|
||||
},
|
||||
operateFuseAttrList (title, data) {
|
||||
if (this.dataForm.fuseAttrList.every(v => v.attrType !== title)) {
|
||||
this.dataForm.fuseAttrList.push({
|
||||
attrType: title,
|
||||
attrValue: JSON.stringify(data.list)
|
||||
})
|
||||
} else {
|
||||
this.dataForm.fuseAttrList.map(v => {
|
||||
if (v.attrType === title) {
|
||||
v.attrValue = JSON.stringify(data.list)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 改变按钮状态
|
||||
changeBtn (data) {
|
||||
this.checkList = data
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmitHandle: debounce(
|
||||
function () {
|
||||
this.$refs.dataForm.validate((valid) => {
|
||||
if (!valid) {
|
||||
this.$message.error('请检查表单是否填写完整')
|
||||
return false
|
||||
}
|
||||
const methodsObj = {
|
||||
add: 'post',
|
||||
update: 'put'
|
||||
}
|
||||
this.dataForm.fuseResourceList = this.getFuseResourceList()
|
||||
if (this.imageUrl == '') {
|
||||
this.$message.error('请上传图片！')
|
||||
return
|
||||
}
|
||||
this.dataForm.fuseAttrList.find(v => v.attrType == '服务图片').attrValue = this.imageUrl || ''
|
||||
const _obj = Object.assign({}, this.dataForm, {
|
||||
type: '赋能场景'
|
||||
})
|
||||
console.log('this.dataForm------表单提交------>', this.dataForm)
|
||||
this.$http
|
||||
[methodsObj[this.modalType]]('/fuse', _obj)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.$message({
|
||||
message: this.$t('prompt.success'),
|
||||
type: 'success',
|
||||
duration: 500,
|
||||
onClose: () => {
|
||||
this.$refs.dataForm && this.$refs.dataForm.resetFields()
|
||||
this.$emit('refreshDataList')
|
||||
this.$emit('closeModal')
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch((err) => {
|
||||
this.$message.error(err)
|
||||
})
|
||||
})
|
||||
},
|
||||
1000,
|
||||
{ leading: true, trailing: false }
|
||||
),
|
||||
// 详情
|
||||
getDetail (data) {
|
||||
console.log('data---详情--------->', data)
|
||||
this.dataForm = data
|
||||
this.$nextTick(() => {
|
||||
for (const key in this.refsParseArray) {
|
||||
this.$refs[key] && this.$refs[key].getDataInfo && this.$refs[key].getDataInfo(data)
|
||||
}
|
||||
const _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {}
|
||||
this.imageUrl = _imgObj.attrValue
|
||||
|
||||
// 组合能力--特殊处理
|
||||
Object.keys(this.getListParams).map(k => {
|
||||
const arr = data.fuseResourceList.filter(v => v.type == k)
|
||||
const arr2 = []
|
||||
arr.map(v => {
|
||||
arr2.push(v.resourceId)
|
||||
})
|
||||
this.abilityListObj[k] = arr2
|
||||
})
|
||||
})
|
||||
},
|
||||
handleAvatarSuccess (res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
},
|
||||
beforeAvatarUpload (file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
return isImage
|
||||
},
|
||||
addUploadRemoveFile (file, fileList) {
|
||||
this.$refs.addUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
editBeforeAvatarUpload (file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
return isImage
|
||||
},
|
||||
editUploadRemoveFile (file, fileList) {
|
||||
this.$refs.editUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
eidtHandleAvatarSuccess (res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
}
|
||||
},
|
||||
beforeDestroy () {
|
||||
this.clearForm()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
height: 580px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.detial-form ::v-deep {
|
||||
.el-form-item {
|
||||
margin-bottom: 0px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.el-form-item__content {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox-button__inner {
|
||||
width: 130px;
|
||||
margin: 0 10px 5px;
|
||||
border-left: unset !important;
|
||||
border-radius: unset !important;
|
||||
border: 1px solid #dcdfe6 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mod-sys__menu {
|
||||
.menu-list,
|
||||
.icon-list {
|
||||
.el-input__inner,
|
||||
.el-input__suffix {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
&-icon-popover {
|
||||
width: 458px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&-icon-inner {
|
||||
width: 478px;
|
||||
max-height: 258px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
&-icon-list {
|
||||
width: 458px;
|
||||
padding: 0;
|
||||
margin: -8px 0 0 -8px;
|
||||
|
||||
> .el-button {
|
||||
padding: 8px;
|
||||
margin: 8px 0 0 8px;
|
||||
|
||||
> span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.previewImg {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.name {
|
||||
text-align: right;
|
||||
vertical-align: middle;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 12px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
line-height: 32px;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 132px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.first-title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
<template>
|
||||
<div class="show-box" v-if="displayList.length > 0">
|
||||
<div class="list-box">
|
||||
<div v-for="(item, i) in displayList" :key="i">
|
||||
<div class="list-item">
|
||||
{{ item[showKey] || '--' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
displayList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
showKey: {
|
||||
type: String,
|
||||
default: 'name'
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
displayList: {
|
||||
handler(newVal) {
|
||||
this.displayList = newVal;
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.show-box {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.type {
|
||||
padding-right: 12px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 100px;
|
||||
box-sizing: border-box;
|
||||
text-align: right;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.list-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
margin-left: 100px;
|
||||
}
|
||||
|
||||
.list-item {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 380px;
|
||||
text-align: left;
|
||||
margin-right: 10px;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,535 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="top flex-row-start">
|
||||
<div class="type">{{ type }}</div>
|
||||
<el-button type="primary" size="small" @click="showModal = true">{{ modalType == 'add' ? '添加' : '编辑' }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-dialog class="modal-box" :visible.sync="showModal" title="请选择" @close="close" :close-on-click-modal="false"
|
||||
:close-on-press-escape="false" :key="showKey" append-to-body>
|
||||
<div class="infrastructure-box">
|
||||
<div class="search-box">
|
||||
<div class="flex-row-start" style="margin-bottom:10px">
|
||||
<div class="left-text">设施类型</div>
|
||||
<div class="flex-row-start btn-list">
|
||||
<div class="btn-text" v-for="(item) in btnList" :key="item"
|
||||
:class="{ 'active-btn': item === activeBtn }" @click="changeBtn(item)">
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-row-start" style="margin-bottom:10px;align-items: flex-start;">
|
||||
<div class="left-text" style="margin-top: 8px;">{{ showText[activeBtn] }}</div>
|
||||
<div style="flex:1;">
|
||||
<el-button v-if="activeBtn == '视频资源'" type="primary"
|
||||
style="margin-left:10px;margin-bottom:10px" size="small" @click="clearVideo">清空
|
||||
</el-button>
|
||||
<div class="flex-row-start btn-list video-btn-list">
|
||||
<div class="btn-text" v-for="(item) in currentList" :key="item.labelCode"
|
||||
:class="{ 'active-btn': checkList.includes(item.labelCode) }"
|
||||
@click="changeVideoBtn(item)">
|
||||
{{ item.labelName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-row-start" style="margin-bottom:10px;align-items: flex-start;">
|
||||
<div class="left-text" style="margin-top: 10px;">关键词</div>
|
||||
<el-input style="margin-left:10px;width: 200px;" v-model="searchData.cameraName"
|
||||
placeholder="名称" clearable>
|
||||
</el-input>
|
||||
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small" @click="getData">
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small" @click="clear">
|
||||
重置
|
||||
</el-button>
|
||||
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small"
|
||||
@click="clearSelectArray">
|
||||
清空已选择
|
||||
</el-button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tree-table-box">
|
||||
<InfrastructureTree @changeParentId="changeParentId"></InfrastructureTree>
|
||||
<div class="table-box">
|
||||
<el-table v-loading="dataListLoading" :data="dataList" border ref="dataTable"
|
||||
@selection-change="dataListSelectionChangeHandle"
|
||||
style="width: 95%;margin: 0 auto 10px auto" size="mini">
|
||||
<el-table-column type="selection" header-align="center" align="center" width="50">
|
||||
</el-table-column>
|
||||
<el-table-column prop="channelName" label="名称" header-align="center" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="nodeName" label="归属" header-align="center" align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination style="justify-content: center;display: flex;" :current-page="searchData.pageNum"
|
||||
:page-sizes="[10, 20, 50, 100]" :page-size="searchData.pageSize" :total="pageData.total"
|
||||
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
|
||||
@current-change="pageCurrentChangeHandle">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template slot="footer">
|
||||
<el-button @click="showModal = false">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="confirmSubmitHandle()">{{
|
||||
$t("confirm")
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<DisplayList :displayList="displayList" showKey="channelName"></DisplayList>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import InfrastructureTree from './infrastructure-tree.vue'
|
||||
import DisplayList from './display-list.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
InfrastructureTree,
|
||||
DisplayList
|
||||
},
|
||||
props: {
|
||||
// 最多选择的数据个数
|
||||
maxNum: {
|
||||
type: Number,
|
||||
default: 10
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: "基础设施"
|
||||
},
|
||||
modalType: {
|
||||
type: String,
|
||||
default: 'add'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const getYunList = () => {
|
||||
let yunList = ['云主机', '算力主机', '对象存储', '堡垒机', '防火墙', '网闸', '负载均衡', '公网IP'];
|
||||
let arr = []
|
||||
yunList.map(v => arr.push({ labelCode: v, labelName: v }))
|
||||
return arr
|
||||
}
|
||||
return {
|
||||
showKey: 0,
|
||||
showModal: false,
|
||||
selectedArray: [], // 已选择的数据id
|
||||
selectedArrayCopy: [],
|
||||
displayList: [], // 用于展示的list
|
||||
btnList: ['视频资源', '云资源', '感知资源'],
|
||||
showText: {
|
||||
'视频资源': '视频标签',
|
||||
'云资源': '云资源分类',
|
||||
'感知资源': '感知资源分类',
|
||||
},
|
||||
tabData: [
|
||||
{
|
||||
tabName: '视频资源',
|
||||
list: []
|
||||
},
|
||||
{
|
||||
tabName: '云资源',
|
||||
list: getYunList()
|
||||
},
|
||||
{
|
||||
tabName: '感知资源',
|
||||
list: []
|
||||
},
|
||||
],
|
||||
currentList: [],
|
||||
dataListLoading: false,
|
||||
dataList: [],
|
||||
pageData: {
|
||||
total: 0,
|
||||
},
|
||||
cameraName: '',
|
||||
postData: {},
|
||||
activeBtn: '视频资源',
|
||||
checkList: [],
|
||||
searchData: {
|
||||
cameraName: '',
|
||||
pageSize: 10,
|
||||
pageNum: 1,
|
||||
parentId: ''
|
||||
},
|
||||
dataFormCopy: {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
async showModal(newVal) {
|
||||
if (newVal) {
|
||||
// 默认选中复选框
|
||||
this.$nextTick(() => {
|
||||
this.selectCheckbox()
|
||||
})
|
||||
if (this.modalType == 'add') {
|
||||
this.clear()
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 获取视频资源
|
||||
this.getVideoBtn()
|
||||
},
|
||||
methods: {
|
||||
selectCheckbox() {
|
||||
if (this.selectedArray.length > 0) {
|
||||
let list = []
|
||||
this.dataList.forEach((item) => {
|
||||
this.selectedArray.forEach(val => {
|
||||
if (val === item.idtCameraChannel) {
|
||||
list.push(item)
|
||||
}
|
||||
})
|
||||
})
|
||||
if (list.length) {
|
||||
list.forEach((row) => {
|
||||
this.$refs.dataTable && this.$refs.dataTable.toggleRowSelection(row, true)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
showAction() {
|
||||
this.showModal = true;
|
||||
},
|
||||
// 详情
|
||||
async getDataInfo(dataForm) {
|
||||
this.modalType == 'edit'
|
||||
this.dataFormCopy = dataForm;
|
||||
await this.getVideoBtn();
|
||||
let arr = [];
|
||||
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(val => {
|
||||
let _obj = Object.assign({}, val, val.resource)
|
||||
arr.push(_obj);
|
||||
});
|
||||
}
|
||||
// 展示
|
||||
this.displayList = JSON.parse(JSON.stringify(arr));
|
||||
// 已选中
|
||||
this.selectedArray = arr.map(v => v.idtCameraChannel);
|
||||
this.selectedArrayCopy = JSON.parse(JSON.stringify(arr));
|
||||
|
||||
this.dataList = JSON.parse(JSON.stringify(arr));
|
||||
this.pageData.total = arr.length;
|
||||
// 默认选中复选框
|
||||
this.$nextTick(() => {
|
||||
this.selectCheckbox()
|
||||
})
|
||||
},
|
||||
// 点击复选框
|
||||
dataListSelectionChangeHandle(data) {
|
||||
this.selectedArray = data;
|
||||
},
|
||||
pageCurrentChangeHandle(pageNum) {
|
||||
this.searchData.pageNum = pageNum;
|
||||
this.getData()
|
||||
},
|
||||
pageSizeChangeHandle(pageSize) {
|
||||
this.searchData.pageSize = pageSize;
|
||||
this.getData()
|
||||
},
|
||||
changeBtn(btn) {
|
||||
this.activeBtn = btn;
|
||||
this.currentList = this.tabData.find(v => v.tabName == btn).list || [];
|
||||
this.checkList = [];
|
||||
this.searchData.cameraName = '';
|
||||
this.getData()
|
||||
},
|
||||
// 获取视频标签列表
|
||||
getVideoBtn() {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$http.get('/api/project/selectAllLabel', {}).then(res => {
|
||||
resolve(res)
|
||||
if (res.data.code !== 1) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.tabData[0].list = res.data.data || [];
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.currentList = this.tabData.find(v => v.tabName == this.activeBtn).list || [];
|
||||
if (this.modalType == 'add') {
|
||||
this.clear()
|
||||
}
|
||||
})
|
||||
}).catch(err => {
|
||||
reject(err)
|
||||
this.$message.error(err);
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
// 视频-清空标签
|
||||
clearVideo() {
|
||||
this.checkList = []
|
||||
this.getData()
|
||||
},
|
||||
// 切换视频
|
||||
changeVideoBtn(item) {
|
||||
let _index = this.checkList.findIndex(v => item.labelCode == v)
|
||||
if (_index > -1) {
|
||||
this.checkList.splice(_index, 1)
|
||||
} else {
|
||||
this.checkList.push(item.labelCode)
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.getData()
|
||||
})
|
||||
},
|
||||
// 获取列表
|
||||
getData() {
|
||||
let postData = Object.assign({}, {
|
||||
checkStatus: 1,
|
||||
gpsX: '',
|
||||
gpsY: '',
|
||||
radius: '',
|
||||
labelCodes: this.checkList.join(),
|
||||
}, this.searchData);
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$http.get('/api/project/selectByParentIdNew', { params: postData }).then(res => {
|
||||
resolve(res)
|
||||
if (res.data.code !== 1) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.dataList = res.data.data || []
|
||||
this.pageData.total = res.data.count || 0;
|
||||
}).catch(err => {
|
||||
reject(err)
|
||||
this.$message.error(err);
|
||||
})
|
||||
})
|
||||
},
|
||||
changeParentId(parentId) {
|
||||
this.searchData.parentId = parentId;
|
||||
this.getData(parentId)
|
||||
},
|
||||
clearSelectArray() {
|
||||
this.selectedArrayCopy = []
|
||||
this.selectedArray = []
|
||||
this.getData()
|
||||
},
|
||||
confirmSubmitHandle() {
|
||||
// 新选择的
|
||||
let idtCameraChannelArray = this.selectedArray.map(v => v.idtCameraChannel)
|
||||
// 选过的
|
||||
let newIdArray = this.selectedArrayCopy.map(v => v.idtCameraChannel)
|
||||
let idArray = [...new Set(newIdArray.concat(idtCameraChannelArray))]
|
||||
if (idArray.length > this.maxNum) {
|
||||
return this.$message.error('最多选择十条数据！');
|
||||
}
|
||||
|
||||
let listArray = [].concat(this.selectedArrayCopy, this.dataList);
|
||||
this.displayList = [];
|
||||
idArray.map(v => {
|
||||
let obj = listArray.find(k => k.idtCameraChannel === v)
|
||||
if (obj) {
|
||||
this.displayList.push({
|
||||
channelName: obj.channelName
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
this.$emit('update', {
|
||||
title: this.type,
|
||||
list: idArray,
|
||||
})
|
||||
this.showModal = false;
|
||||
},
|
||||
close() {
|
||||
this.showModal = false;
|
||||
this.searchData.cameraName = ''
|
||||
// this.selectedArray = [];
|
||||
this.$emit('closeModal');
|
||||
},
|
||||
clear() {
|
||||
this.changeBtn('视频资源')
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.ability-box {
|
||||
margin-bottom: 10px;
|
||||
|
||||
.show-box {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.type {
|
||||
padding-right: 12px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 100px;
|
||||
box-sizing: border-box;
|
||||
text-align: right;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.list-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
margin-left: 100px;
|
||||
}
|
||||
|
||||
.list-item {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 380px;
|
||||
text-align: left;
|
||||
margin-right: 10px;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-row-start {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.modal-box {
|
||||
.btn-list {
|
||||
margin-left: 10px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.left-text {
|
||||
width: 90px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btn-text {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
// width: 80px;
|
||||
padding: 0 10px;
|
||||
text-align: center;
|
||||
border-radius: 15px;
|
||||
border: 1px solid #ccc;
|
||||
margin-right: 15px;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 10px;
|
||||
font-size: 12px;
|
||||
|
||||
&:hover {
|
||||
color: #0058e1;
|
||||
}
|
||||
}
|
||||
|
||||
.active-btn {
|
||||
background: #0058e1;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border: 1px solid #0058e1;
|
||||
|
||||
&:hover {
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
|
||||
.video-btn-list {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.top {
|
||||
margin-bottom: 10px;
|
||||
|
||||
.type {
|
||||
padding-right: 12px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 100px;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
text-align: right;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.tree-table-box {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.table-box {
|
||||
width: calc(100% - 400px);
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-input {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__body {
|
||||
height: 580px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox-button__inner {
|
||||
width: 130px;
|
||||
margin: 0 10px 5px;
|
||||
border-left: unset !important;
|
||||
border-radius: unset !important;
|
||||
border: 1px solid #dcdfe6 !important;
|
||||
}
|
||||
|
||||
.relate-application-content {
|
||||
height: 100%;
|
||||
|
||||
::v-deep .el-transfer {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel {
|
||||
width: 39.5%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel__body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel__list.is-filterable {
|
||||
height: calc(100% - 102px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,314 +0,0 @@
|
|||
<template>
|
||||
<div class="wrapper">
|
||||
<div class="wrapper-title-left-tree" :key="showKey">
|
||||
<div v-for="item in treeData" :key="item.id" class="primaryNode">
|
||||
<div class="top" @click="showBottom(item)" :class="item.show ? 'topSelect' : ''">
|
||||
{{ item.name }}
|
||||
({{ item.channelCount }})
|
||||
<i class="el-icon-arrow-down" v-show="!item.show"></i>
|
||||
<i class="el-icon-arrow-top" v-show="item.show"></i>
|
||||
</div>
|
||||
<div class="bottom" v-show="item.show">
|
||||
<div v-for="val in item.children" :key="val.id" class="item">
|
||||
<div class="up" :class="selectId == val.id ? 'select' : ''"
|
||||
@click="showDown(item, val), onSelect(item, val)">
|
||||
<div>
|
||||
<svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2156" width="25px" height="25px"
|
||||
v-show="selectId == val.id">
|
||||
<path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157"
|
||||
fill="#0058e1"></path>
|
||||
</svg>
|
||||
<span class="name">{{ val.name }}({{ val.channelCount }})</span>
|
||||
</div>
|
||||
<span v-if="item.children.length < 0">{{ val.total }}</span>
|
||||
<span v-else>
|
||||
<i class="el-icon-arrow-down" v-show="!val.show"></i>
|
||||
<i class="el-icon-arrow-top" v-show="val.show"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="down" v-show="val.show">
|
||||
<div v-for="child in val.children" :key="child.id" class="child"
|
||||
:class="selectId == child.id ? 'select2' : ''" @click="onSelect(item, child, child)">
|
||||
<div>
|
||||
<svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2156" width="25px" height="25px"
|
||||
v-show="selectId == child.id">
|
||||
<path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157"
|
||||
fill="#0058e1"></path>
|
||||
</svg>
|
||||
<span class="name">
|
||||
{{ child.name }}
|
||||
</span>
|
||||
</div>
|
||||
<span>{{ child.channelCount }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectedKeys: [],
|
||||
checkedKeys: [],
|
||||
showKey: 0,
|
||||
treeData: [],
|
||||
selectId: '',
|
||||
value: '',
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
checkedKeys(val) {
|
||||
if (val.checked.length > 1) {
|
||||
val.checked.halfChecked = val.checked.shift()
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
getCameraAllOrgan(params) {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$http.get('/api/project/selectSubOrganNew', { params }).then(res => {
|
||||
resolve(res)
|
||||
}).catch(err => {
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
},
|
||||
init() {
|
||||
this.treeData = []
|
||||
this.getCameraAllOrgan({ parentId: 'S4NbecfYB1DBH8HNULGS34' }).then(
|
||||
(res) => {
|
||||
if (res.data.code !== 1) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.treeData = res.data.data
|
||||
}).catch(err => {
|
||||
this.$message.error(err);
|
||||
})
|
||||
},
|
||||
onSelect(item, val, child) {
|
||||
this.$emit('changeParentId', val.id)
|
||||
this.getCameraAllOrgan({ parentId: val.id }).then((res) => {
|
||||
if (res.data.code !== 1) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.treeData.map((treeDataItem, index) => {
|
||||
if (item.id == treeDataItem.id) {
|
||||
this.treeData[index].children.map((childItem, childIndex) => {
|
||||
if (childItem.id == val.id) {
|
||||
this.treeData[index].children[childIndex].children =
|
||||
res.data.data;
|
||||
this.$nextTick(() => {
|
||||
this.treeData = this.treeData.splice(0)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}).catch(err => {
|
||||
this.$message.error(err);
|
||||
})
|
||||
if (child) {
|
||||
this.selectId = child.id
|
||||
}
|
||||
},
|
||||
showBottom(item) {
|
||||
item.show = !item.show;
|
||||
this.getCameraAllOrgan({ parentId: item.id }).then((res) => {
|
||||
if (res.data.code !== 1) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.treeData.map((treeDataItem, index) => {
|
||||
if (item.id == treeDataItem.id) {
|
||||
this.treeData[index].children = res.data.data || []
|
||||
this.$nextTick(() => {
|
||||
this.treeData = this.treeData.splice(0)
|
||||
console.log('this.treeData.[index]', this.treeData[index])
|
||||
})
|
||||
}
|
||||
})
|
||||
}).catch(err => {
|
||||
this.$message.error(err);
|
||||
})
|
||||
},
|
||||
showDown(item, val) {
|
||||
console.log('showDown', val)
|
||||
if (item.children) {
|
||||
val.show = !val.show
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.wrapper {
|
||||
height: 500px;
|
||||
overflow-y: scroll;
|
||||
margin-right: 20px;
|
||||
width: 300px;
|
||||
|
||||
|
||||
.primaryNode {
|
||||
.top {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background: rgba(0, 135, 225, 0.1);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.top:hover {
|
||||
cursor: pointer;
|
||||
// 0058e1 透明度 0.5
|
||||
background: rgba(0, 88, 225, 0.8);
|
||||
color: white;
|
||||
|
||||
:deep(.anticon) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.topSelect {
|
||||
background: #0058e1;
|
||||
color: white;
|
||||
|
||||
:deep(.anticon) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
background: rgba(244, 245, 248, 0.8);
|
||||
padding: 0 10px;
|
||||
|
||||
.up {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-top: 1px solid #ccc;
|
||||
padding: 0 10px;
|
||||
|
||||
&>div {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.up:hover {
|
||||
.name {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.select {
|
||||
padding: 0 0.1rem 0 0;
|
||||
|
||||
.name {
|
||||
width: 190px;
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.item:nth-of-type(1) .up {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.down {
|
||||
width: 100%;
|
||||
|
||||
.child {
|
||||
cursor: pointer;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
|
||||
&>div {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.child:hover {
|
||||
.name {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.select2 {
|
||||
.name {
|
||||
width: 190px;
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
padding: 0 10px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,120 +0,0 @@
|
|||
<template>
|
||||
<div class="question-box">
|
||||
<div class="title">
|
||||
{{ title }}
|
||||
</div>
|
||||
<div v-for="(item, index) in dataInfo" :key="index">
|
||||
<el-form-item :label="keyTextObj.descObj.text">
|
||||
<el-input type="textarea" :rows="2" v-model="item[keyTextObj.descObj.key]"
|
||||
:placeholder="`请输入${keyTextObj.descObj.text}`" style="width:90%">
|
||||
</el-input>
|
||||
<el-button style="margin-left:10px" @click="deleteItem(index)" type="danger" size="small"
|
||||
v-if="dataInfo.length > 1">删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-button class="add-btn" size="small" v-if="index == dataInfo.length - 1" @click="addItem"
|
||||
type="primary">添加
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
dataForm: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
keyTextObj: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
descObj: {
|
||||
text: '描述',
|
||||
key: 'description'
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataInfo: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataInfo: {
|
||||
handler(newVal) {
|
||||
this.dataInfo = newVal;
|
||||
this.$emit('update', {
|
||||
title: this.title,
|
||||
list: newVal
|
||||
})
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getDataInfo(dataForm) {
|
||||
let arr = []
|
||||
if (dataForm && (dataForm.id || dataForm.id === 0)) {
|
||||
let fuseAttrList = dataForm.fuseAttrList || [];
|
||||
let obj = fuseAttrList.find(v => v.attrType === this.title) || {}
|
||||
let attrValue = JSON.parse(obj.attrValue || "[]")
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(v => {
|
||||
arr.push({
|
||||
[this.keyTextObj.descObj.key]: v[this.keyTextObj.descObj.key],
|
||||
})
|
||||
})
|
||||
} else {
|
||||
arr = []
|
||||
arr.push({
|
||||
[this.keyTextObj.descObj.key]: '',
|
||||
})
|
||||
}
|
||||
} else {
|
||||
arr = []
|
||||
arr.push({
|
||||
[this.keyTextObj.descObj.key]: '',
|
||||
})
|
||||
}
|
||||
this.dataInfo = arr;
|
||||
},
|
||||
// 新增
|
||||
addItem() {
|
||||
let index = this.dataInfo.length - 1;
|
||||
if (this.dataInfo[index][this.keyTextObj.descObj.key] === '') {
|
||||
return this.$message.warning('请填写完整信息！')
|
||||
}
|
||||
this.dataInfo.push({
|
||||
[this.keyTextObj.descObj.key]: '',
|
||||
})
|
||||
},
|
||||
// 删除
|
||||
deleteItem(list, index) {
|
||||
this.dataInfo.splice(index, 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.question-box {
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.add-btn {
|
||||
margin-top: -12px;
|
||||
margin-left: 100px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,130 +0,0 @@
|
|||
<template>
|
||||
<div class="question-box">
|
||||
<div class="title">
|
||||
能力使用步骤
|
||||
</div>
|
||||
<div v-for="(item, index) in dataInfo" :key="index">
|
||||
<el-form-item label="标题" prop="question">
|
||||
<el-input v-model="item.question" placeholder="请输入标题" style="width:90%" :disabled="disabledType">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="解释说明" prop="question">
|
||||
<el-input type="textarea" :rows="3" v-model="item.answer" placeholder="请输入解释说明" style="width:90%"
|
||||
:disabled="disabledType">
|
||||
</el-input>
|
||||
<el-button style="margin-left:10px" @click="deleteItem(index)" type="danger" size="small"
|
||||
v-if="!disabledType && dataInfo.length > 1">删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-button class="add-btn" size="small"
|
||||
v-if="!disabledType && index == dataInfo.length - 1" @click="addItem" type="primary">添加
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="step-box">
|
||||
<el-steps :active="2">
|
||||
<el-step status="finish" :title="item.question || `标题${index + 1}`" v-for="(item, index) in dataInfo"
|
||||
:key="index">
|
||||
</el-step>
|
||||
</el-steps>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
dataForm: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
},
|
||||
// 是否可编辑
|
||||
disabledType: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataInfo: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataInfo: {
|
||||
handler(newVal) {
|
||||
this.dataInfo = newVal;
|
||||
this.$emit('update', {
|
||||
title: '使用步骤',
|
||||
list: newVal
|
||||
})
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getDataInfo(dataForm) {
|
||||
let arr = []
|
||||
let fuseAttrList = dataForm.fuseAttrList || [];
|
||||
let obj = fuseAttrList.find(v => v.attrType === '使用步骤') || {}
|
||||
let attrValue = JSON.parse(obj.attrValue || "[]")
|
||||
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(v => {
|
||||
arr.push({
|
||||
question: v.question,
|
||||
answer: v.answer,
|
||||
})
|
||||
})
|
||||
} else {
|
||||
arr = []
|
||||
arr.push({
|
||||
question: "",
|
||||
answer: "",
|
||||
})
|
||||
}
|
||||
this.dataInfo = arr;
|
||||
},
|
||||
// 新增
|
||||
addItem() {
|
||||
let index = this.dataInfo.length - 1;
|
||||
if (this.dataInfo[index].question === '' || this.dataInfo[index].answer === '') {
|
||||
return this.$message.warning('请填写完整信息！')
|
||||
}
|
||||
if (this.dataInfo.length >= 6) {
|
||||
return this.$message.warning('最多添加6个使用步骤！')
|
||||
}
|
||||
this.dataInfo.push({
|
||||
question: "",
|
||||
answer: "",
|
||||
})
|
||||
},
|
||||
// 删除
|
||||
deleteItem(list, index) {
|
||||
this.dataInfo.splice(index, 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.question-box {
|
||||
margin-bottom: 20px;
|
||||
margin-top: 40px;
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.step-box {
|
||||
padding: 20px 10px 10px 10px;
|
||||
}
|
||||
|
||||
.add-btn {
|
||||
margin-top: -12px;
|
||||
margin-left: 100px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,162 +0,0 @@
|
|||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-ability__bsabilityai">
|
||||
<el-form :inline="true" :model="dataForm">
|
||||
<el-form-item>
|
||||
<el-input v-model="dataForm.name" placeholder="名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="searchData">{{
|
||||
$t("query")
|
||||
}}</el-button>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button v-if="$hasPermission('ability:bsabilityai:save')" type="primary" @click="addServe()">挂接</el-button>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button @click="reset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle"
|
||||
style="width: 100%" :height="qp ? '810px' : '650px'">
|
||||
<el-table-column prop="name" label="名称" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="description" label="描述" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="240" right="0">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-if="$hasPermission('ability:bsabilityai:update')" type="text" size="small"
|
||||
@click="handleUpdate(scope.row)">{{ $t("update") }}</el-button>
|
||||
<el-button v-if="$hasPermission('ability:bsabilityai:delete')" type="text" size="small"
|
||||
@click="deleteRow(scope.row.id)">{{ $t("delete") }}</el-button>
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)">详情</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="Number(total)"
|
||||
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
|
||||
@current-change="pageCurrentChangeHandle">
|
||||
</el-pagination>
|
||||
|
||||
<!-- 弹窗, 新增 / 修改 -->
|
||||
<add-update-scene v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="query" @closeModal="closeModal"
|
||||
:addOrUpdateVisible="addOrUpdateVisible" :modalType="modalType">
|
||||
</add-update-scene>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mixinViewModule from "@/mixins/view-module";
|
||||
import AddUpdateScene from "./add-update-scene";
|
||||
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
childName: '',
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: "/fuse/page",
|
||||
exportURL: "/ability/bsabilityai/export",
|
||||
deleteURL: "/fuse",
|
||||
getDataListIsPage: true,
|
||||
deleteIsBatch: false,
|
||||
},
|
||||
disabled: false,
|
||||
dataForm: {
|
||||
name: "",
|
||||
order: 'desc',
|
||||
orderField: 'create_date',
|
||||
type: '赋能场景'
|
||||
},
|
||||
qp: false,
|
||||
modalType: 'add',
|
||||
};
|
||||
},
|
||||
components: {
|
||||
AddUpdateScene,
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener("resize", this.a);
|
||||
this.fullScreen();
|
||||
},
|
||||
methods: {
|
||||
deleteRow(id) {
|
||||
this.$http.delete('/fuse/delete', {
|
||||
data: [id]
|
||||
}).then(res => {
|
||||
console.log('删除成功', res)
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: "success",
|
||||
duration: 500,
|
||||
onClose: () => {
|
||||
this.query()
|
||||
},
|
||||
});
|
||||
}).catch(err => {
|
||||
this.$message.error(err);
|
||||
})
|
||||
},
|
||||
// 查询
|
||||
searchData() {
|
||||
this.query()
|
||||
},
|
||||
// 重置
|
||||
reset() {
|
||||
this.dataForm.name = "";
|
||||
this.query()
|
||||
},
|
||||
// 修改
|
||||
handleUpdate(val) {
|
||||
this.addOrUpdateVisible = true;
|
||||
this.modalType = 'update';
|
||||
const cloneVal = JSON.parse(JSON.stringify(val))
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.getDetail(cloneVal)
|
||||
})
|
||||
},
|
||||
// 挂接
|
||||
addServe() {
|
||||
this.addOrUpdateVisible = true
|
||||
this.modalType = 'add';
|
||||
},
|
||||
closeModal() {
|
||||
this.addOrUpdateVisible = false;
|
||||
},
|
||||
// 详情
|
||||
showDetail(val) {
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/integrationServicesDetails?id=' + val.id)
|
||||
},
|
||||
fullScreen() {
|
||||
if (window.outerHeight === screen.availHeight) {
|
||||
if (window.outerWidth === screen.availWidth) {
|
||||
console.log(
|
||||
"全屏1",
|
||||
);
|
||||
this.qp = false;
|
||||
} else {
|
||||
console.log(
|
||||
"不是全屏2",
|
||||
);
|
||||
this.qp = true;
|
||||
}
|
||||
} else {
|
||||
console.log(
|
||||
"不是全屏3",
|
||||
);
|
||||
this.qp = true;
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-tooltip__popper {
|
||||
max-width: 50%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,134 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:visible.sync="visible"
|
||||
title="关联应用"
|
||||
@close="close"
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
:key="showKey"
|
||||
>
|
||||
<div class="relate-application-content">
|
||||
<el-transfer
|
||||
v-model="transferValue"
|
||||
filterable
|
||||
:filter-method="filterMethod"
|
||||
filter-placeholder="请输入应用名称"
|
||||
:titles="nameArray"
|
||||
:props="{
|
||||
key: 'id',
|
||||
label: 'name',
|
||||
}"
|
||||
:data="transferData"
|
||||
></el-transfer>
|
||||
</div>
|
||||
<template slot="footer">
|
||||
<el-button @click="visible = false">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="confirmSubmitHandle()">{{
|
||||
$t("confirm")
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import debounce from "lodash/debounce";
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
showKey: 0,
|
||||
visible: true,
|
||||
transferData: [], //穿梭框所有数据
|
||||
transferValue: [], //已关联的数据id
|
||||
};
|
||||
},
|
||||
props: {
|
||||
relateInfo: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
nameArray: {
|
||||
type: Array,
|
||||
default: ["未关联应用名称", "已关联应用名称"],
|
||||
},
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
close() {
|
||||
this.$emit("isShowRelatePopup", false);
|
||||
},
|
||||
// 表单提交
|
||||
confirmSubmitHandle: debounce(
|
||||
function () {
|
||||
this.$http
|
||||
.post("/dataResourceRel/saveDataResourceRel", {
|
||||
linkType: this.relateInfo.linkType || 2,
|
||||
id: this.relateInfo.id,
|
||||
referenceIds: this.transferValue,
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success("关联成功！");
|
||||
} else {
|
||||
this.$message.error("关联失败，请联系管理员！");
|
||||
}
|
||||
this.$emit("isShowRelatePopup", false);
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
1000,
|
||||
{ leading: true, trailing: false }
|
||||
),
|
||||
filterMethod(query, item) {
|
||||
return item.name && item.name.indexOf(query) > -1;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (this.relateInfo && this.relateInfo.responseData) {
|
||||
const alreadLinkedArr = this.relateInfo.responseData.alreadLinked || [];
|
||||
this.transferData = alreadLinkedArr.concat(
|
||||
this.relateInfo.responseData.notLinked || []
|
||||
);
|
||||
alreadLinkedArr.length &&
|
||||
alreadLinkedArr.forEach((item) => {
|
||||
this.transferValue.push(item.id);
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
::v-deep .el-dialog__body {
|
||||
height: 580px;
|
||||
overflow: auto;
|
||||
}
|
||||
::v-deep .el-checkbox-button__inner {
|
||||
width: 130px;
|
||||
margin: 0 10px 5px;
|
||||
border-left: unset !important;
|
||||
border-radius: unset !important;
|
||||
border: 1px solid #dcdfe6 !important;
|
||||
}
|
||||
.relate-application-content {
|
||||
height: 100%;
|
||||
::v-deep .el-transfer {
|
||||
height: 100%;
|
||||
}
|
||||
::v-deep .el-transfer-panel {
|
||||
width: 39.5%;
|
||||
height: 100%;
|
||||
}
|
||||
::v-deep .el-transfer-panel__body {
|
||||
height: 100%;
|
||||
}
|
||||
::v-deep .el-transfer-panel__list.is-filterable {
|
||||
height: calc(100% - 102px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,7 +1,10 @@
|
|||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-ability__bsabilityai">
|
||||
<el-form :inline="true" :model="dataForm">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="dataForm"
|
||||
>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="dataForm.name"
|
||||
|
|
@ -10,34 +13,29 @@
|
|||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getDataList2(dataForm.name)">{{
|
||||
$t('query')
|
||||
<el-button @click="getDataList2(dataForm.name)">{{
|
||||
$t("query")
|
||||
}}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="info" @click="exportHandle()">{{
|
||||
$t('export')
|
||||
$t("export")
|
||||
}}</el-button>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:save')"
|
||||
type="primary"
|
||||
@click="addOrUpdateHandleAI()"
|
||||
>挂接</el-button
|
||||
>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="showPutOnTheShelf()"
|
||||
>上架</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:delete')"
|
||||
type="danger"
|
||||
@click="deleteHandle2()"
|
||||
>{{ $t('deleteBatch') }}</el-button
|
||||
>{{ $t("deleteBatch") }}</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
|
|
@ -46,11 +44,12 @@
|
|||
</el-form>
|
||||
<el-table
|
||||
v-loading="dataListLoading"
|
||||
v-if="dataList[0].infoList"
|
||||
:data="dataList"
|
||||
:height="qp ? '650px' : '650px'"
|
||||
border
|
||||
@selection-change="dataListSelectionChangeHandle"
|
||||
style="width: 100%"
|
||||
height="650px"
|
||||
style="width: 100%;"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
|
|
@ -59,68 +58,24 @@
|
|||
width="50"
|
||||
></el-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="name"
|
||||
label="组件名称"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="description"
|
||||
label="组件描述"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="deptName"
|
||||
label="归属部门"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="deptContacts"
|
||||
label="部门联系人"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="deptPhone"
|
||||
label="部门联系人电话"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="shareCondition"
|
||||
label="共享条件"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<template v-if="dataList[0] && dataList[0].infoList2">
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
v-for="(item, index) in dataList[0].infoList2"
|
||||
v-for="(item, index) in dataList[0].infoList"
|
||||
:key="index"
|
||||
:label="item.attrType"
|
||||
header-align="center"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ findValue(scope.row.infoList2, item.attrType) }}
|
||||
{{
|
||||
findValue(scope.row.infoList, item.attrType)
|
||||
}}
|
||||
</template>
|
||||
</af-table-column>
|
||||
</template>
|
||||
<el-table-column
|
||||
:label="$t('handle')"
|
||||
fixed="right"
|
||||
|
|
@ -129,38 +84,25 @@
|
|||
width="150"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="scope.row.infoList.filter(val=>val.attrType=='组件类型')[0].attrValue == '智能算法'"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="toppingCapacity(scope.row)"
|
||||
>置顶</el-button
|
||||
>
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="UpdateData(scope.row)"
|
||||
>{{ $t('update') }}</el-button
|
||||
@click="UpdateHandle(scope.row)"
|
||||
>{{ $t("update") }}</el-button
|
||||
>
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:delete')"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="deleteHandle2(scope.row.id)"
|
||||
>{{ $t('delete') }}</el-button
|
||||
>{{ $t("delete") }}</el-button
|
||||
>
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>展示</el-button
|
||||
>
|
||||
<el-button type="text" size="small" @click="showDocument(scope.row)"
|
||||
>技术文档</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="showRelateApplication(scope.row)"
|
||||
>关联应用</el-button
|
||||
>开发文档</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -182,57 +124,7 @@
|
|||
ref="addOrUpdate"
|
||||
@refreshDataList="getDataList"
|
||||
></add-or-update>
|
||||
<relate-application
|
||||
v-if="relateApplicationVisible"
|
||||
ref="relateApplication"
|
||||
:nameArray="['未关联应用名称', '已关联应用名称']"
|
||||
:relateInfo="relateInfo"
|
||||
@isShowRelatePopup="handleIsShowRelatePopup"
|
||||
></relate-application>
|
||||
</div>
|
||||
<el-dialog
|
||||
title="选择组件类型"
|
||||
:visible.sync="showPutOnTheShelfFlag"
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
:before-close="clear"
|
||||
width="30%"
|
||||
>
|
||||
<el-radio v-model="radio" label="智能算法">智能算法</el-radio>
|
||||
<el-radio v-model="radio" label="图层服务">图层服务</el-radio>
|
||||
<el-radio v-model="radio" label="开发组件">开发组件</el-radio>
|
||||
<el-radio v-model="radio" label="业务组件">业务组件</el-radio>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="clear">取 消</el-button>
|
||||
<el-button type="primary" @click="showPutOnTheShelfVue"
|
||||
>确 定</el-button
|
||||
>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
:title="submitFrom.id ? '修改' + radio : '上架' + radio"
|
||||
:visible.sync="showPutOnTheShelfFlag2"
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
:destroy-on-close="true"
|
||||
:before-close="clear"
|
||||
width="50%"
|
||||
>
|
||||
<putOnTheShelf
|
||||
ref="putOnTheShelf"
|
||||
:putOnTheShelfList="putOnTheShelfList"
|
||||
@changeInfoList="changeInfoList"
|
||||
:type="radio"
|
||||
:typeInput="typeInput"
|
||||
:required="required"
|
||||
:notFilled="notFilled"
|
||||
@submitData="submitData"
|
||||
></putOnTheShelf>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="clear">取 消</el-button>
|
||||
<el-button type="primary" @click="submitData">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
|
|
@ -241,32 +133,10 @@ import mixinViewModule from '@/mixins/view-module'
|
|||
import AddOrUpdate from './bsabilityai-add-or-update'
|
||||
import dictionaries from '@/utils/dictionaries'
|
||||
import qs from 'qs'
|
||||
import { pinyin } from 'pinyin-pro'
|
||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
||||
import putOnTheShelf from '@/views/modules/putOnTheShelf'
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
data () {
|
||||
return {
|
||||
required: ['归属部门', '部门联系人', '部门联系人电话', '应用领域', '共享条件', '算法名称', '算法描述', '图层名称', '图层描述', '组件名称', '组件描述', '组件地址', '服务地址', '服务接口', '接口请求方式', '算法类别'],
|
||||
notFilled: [],
|
||||
insertList: [],
|
||||
putOnTheShelfList: [],
|
||||
radio: '',
|
||||
showPutOnTheShelfFlag: false,
|
||||
showPutOnTheShelfFlag2: false,
|
||||
submitFrom: {
|
||||
type: '组件服务',
|
||||
deptId: '',
|
||||
delFlag: 0,
|
||||
infoList: [
|
||||
{
|
||||
attrType: '组件类型',
|
||||
attrValue: '',
|
||||
delFlag: 0
|
||||
}
|
||||
]
|
||||
},
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: '/resource/page',
|
||||
getDataListIsPage: true,
|
||||
|
|
@ -285,58 +155,25 @@ export default {
|
|||
selectType: 0,
|
||||
type: '组件服务'
|
||||
},
|
||||
// qp: false,
|
||||
// 关联应用弹窗
|
||||
relateApplicationVisible: false,
|
||||
relateInfo: {
|
||||
id: '',
|
||||
responseData: {},
|
||||
linkType: ''
|
||||
},
|
||||
typeInput: '组件服务',
|
||||
uuidOne: '',
|
||||
uuidTwo: '',
|
||||
uuidSnum: ''
|
||||
qp: false
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
components: {
|
||||
AddOrUpdate,
|
||||
RelateApplication,
|
||||
putOnTheShelf
|
||||
AddOrUpdate
|
||||
},
|
||||
created () {
|
||||
this.dataForm.name = ''
|
||||
this.dataForm.type = '组件服务'
|
||||
},
|
||||
mounted () {
|
||||
// window.addEventListener('resize', this.a)
|
||||
// this.fullScreen()
|
||||
window.addEventListener('resize', this.a)
|
||||
this.fullScreen()
|
||||
},
|
||||
methods: {
|
||||
// 置顶
|
||||
toppingCapacity (item) {
|
||||
this.$http.put('/resource/pin_top/' + item.id).then(res => {
|
||||
console.log('置顶', res.data.code)
|
||||
if (res.data.code == 0) {
|
||||
this.$message({
|
||||
message: '置顶成功',
|
||||
type: 'success'
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
message: '置顶失败',
|
||||
type: 'warning'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
reset () {
|
||||
this.$http
|
||||
.get(
|
||||
this.mixinViewModuleOptions.getDataListURL +
|
||||
'?' +
|
||||
qs.stringify({
|
||||
this.$http.get(
|
||||
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||
// order: this.order,
|
||||
// orderField: this.orderField,
|
||||
// type: '组件服务',
|
||||
|
|
@ -359,19 +196,6 @@ export default {
|
|||
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
|
||||
? res.data.list
|
||||
: res.data
|
||||
this.dataList.map((item, index) => {
|
||||
const dataListSinforList = []
|
||||
item.infoList.map((itemson, indexson) => {
|
||||
if (
|
||||
itemson.attrType === '应用领域' ||
|
||||
itemson.attrType === '组件类型'
|
||||
) {
|
||||
dataListSinforList.push(itemson)
|
||||
}
|
||||
})
|
||||
this.dataList[index].infoList2 = dataListSinforList
|
||||
})
|
||||
console.log('this.dataList', this.dataList)
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage
|
||||
? res.data.total
|
||||
: 0
|
||||
|
|
@ -385,7 +209,7 @@ export default {
|
|||
})
|
||||
},
|
||||
findValue (list, type) {
|
||||
const found = list.find((item) => item.attrType === type)
|
||||
const found = list.find(item => item.attrType === type)
|
||||
if (found) {
|
||||
return found.attrValue
|
||||
} else {
|
||||
|
|
@ -393,109 +217,25 @@ export default {
|
|||
}
|
||||
},
|
||||
showDetail (val) {
|
||||
console.log(val)
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
||||
// this.addOrUpdateHandle(id)
|
||||
// this.addOrUpdateVisible = true
|
||||
// this.disabled = false
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.addOrUpdate.UpdateState = false
|
||||
// this.$refs.addOrUpdate.dataFormShowDetails = val
|
||||
// this.$refs.addOrUpdate.init()
|
||||
// })
|
||||
// this.disabled = true
|
||||
},
|
||||
// 创建uuid
|
||||
uuid (len, radix) {
|
||||
var chars =
|
||||
'0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'
|
||||
var uuid = []
|
||||
var i
|
||||
radix = radix || chars.length
|
||||
|
||||
if (len) {
|
||||
// Compact form
|
||||
for (i = 0; i < len; i++) uuid[i] = chars[0 | (Math.random() * radix)]
|
||||
} else {
|
||||
// rfc4122, version 4 form
|
||||
var r
|
||||
|
||||
// rfc4122 requires these characters
|
||||
uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-'
|
||||
uuid[14] = '4'
|
||||
|
||||
// Fill in random data. At i==19 set the high bits of clock sequence as
|
||||
// per rfc4122, sec. 4.1.5
|
||||
for (i = 0; i < 36; i++) {
|
||||
if (!uuid[i]) {
|
||||
r = 0 | (Math.random() * 16)
|
||||
uuid[i] = chars[i == 19 ? (r & 0x3) | 0x8 : r]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return uuid.join('')
|
||||
},
|
||||
uuidSplice () {
|
||||
this.uuidOne = this.uuid(13, 16)
|
||||
this.uuidTwo = this.uuid(13, 16)
|
||||
this.uuidSnum = this.uuidOne + this.uuidTwo
|
||||
this.uuidSnum = this.uuidSnum.replace(/\s+/g, '')
|
||||
console.log('this.uuidOne', this.uuidSnum)
|
||||
this.addOrUpdateVisible = true
|
||||
this.disabled = false
|
||||
console.log('显示数据=============》', val)
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.UpdateState = false
|
||||
this.$refs.addOrUpdate.dataFormShowDetails = val
|
||||
this.$refs.addOrUpdate.init()
|
||||
})
|
||||
this.disabled = true
|
||||
},
|
||||
showDocument (val) {
|
||||
// 第一步：创建文档
|
||||
// 不存在文档时创建空文档
|
||||
this.uuidSplice()
|
||||
const uuidParam = val.infoList.filter((item) => {
|
||||
if (item.attrType === '技术文档') {
|
||||
return item
|
||||
}
|
||||
})
|
||||
if (uuidParam.length > 0) {
|
||||
this.uuidSnum = uuidParam[0].attrValue.split('/')[1].split('.')[0]
|
||||
} else {
|
||||
const type = pinyin(val.type, {
|
||||
pattern: 'initial'
|
||||
}).replace(/\s*/g, '')
|
||||
const obj = {
|
||||
attrType: '技术文档',
|
||||
attrValue: type + '/' + this.uuidSnum + '.md',
|
||||
delFlag: 0
|
||||
}
|
||||
val.infoList.push(obj)
|
||||
}
|
||||
|
||||
// 存在时加入文档
|
||||
this.$http
|
||||
.put('/resource/update', val)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.$message({
|
||||
message: this.$t('prompt.success'),
|
||||
type: 'success',
|
||||
duration: 500,
|
||||
onClose: () => {
|
||||
// 打开这个空的开发文档
|
||||
window.open(
|
||||
window.SITE_CONFIG.frontUrl + '?id=' + this.uuidSnum + '&&type=' + val.type,
|
||||
'_blank'
|
||||
)
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
// 第二部，update列数据，成功后打开文档编辑
|
||||
console.log(val)
|
||||
window.open(window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type, '_blank')
|
||||
},
|
||||
getDataList2 (names) {
|
||||
if (names != null) {
|
||||
this.$http
|
||||
.get(
|
||||
this.mixinViewModuleOptions.getDataListURL +
|
||||
'?' +
|
||||
qs.stringify({
|
||||
this.$http.get(
|
||||
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||
// order: this.order,
|
||||
// orderField: this.orderField,
|
||||
// type: '组件服务',
|
||||
|
|
@ -509,6 +249,7 @@ export default {
|
|||
})
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log('res', res)
|
||||
if (res.code !== 0) {
|
||||
this.dataList = []
|
||||
this.total = 0
|
||||
|
|
@ -523,18 +264,6 @@ export default {
|
|||
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||
}
|
||||
this.dataListLoading = false
|
||||
this.dataList.map((item, index) => {
|
||||
const dataListSinforList = []
|
||||
item.infoList.map((itemson, indexson) => {
|
||||
if (
|
||||
itemson.attrType === '应用领域' ||
|
||||
itemson.attrType === '组件类型'
|
||||
) {
|
||||
dataListSinforList.push(itemson)
|
||||
}
|
||||
})
|
||||
this.dataList[index].infoList2 = dataListSinforList
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未查询到相关信息')
|
||||
this.reset()
|
||||
|
|
@ -547,423 +276,37 @@ export default {
|
|||
this.$message.error('查询信息不能为空')
|
||||
}
|
||||
},
|
||||
// fullScreen () {
|
||||
// if (window.outerHeight === screen.availHeight) {
|
||||
// if (window.outerWidth === screen.availWidth) {
|
||||
// this.qp = false
|
||||
// } else {
|
||||
// this.qp = true
|
||||
// }
|
||||
// } else {
|
||||
// this.qp = true
|
||||
// }
|
||||
// },
|
||||
// 点击关联应用按钮
|
||||
showRelateApplication (row) {
|
||||
this.$http
|
||||
.get(
|
||||
`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`
|
||||
fullScreen () {
|
||||
if (window.outerHeight === screen.availHeight) {
|
||||
if (window.outerWidth === screen.availWidth) {
|
||||
console.log(
|
||||
'全屏1',
|
||||
window.outerHeight,
|
||||
screen.availHeight,
|
||||
window.outerWidth,
|
||||
screen.availWidth
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
if (res && res.data) {
|
||||
this.relateApplicationVisible = true
|
||||
this.relateInfo = {
|
||||
id: row.id,
|
||||
responseData: res.data,
|
||||
linkType: '2'
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
// 是否展示关联应用弹窗
|
||||
handleIsShowRelatePopup (type) {
|
||||
this.relateApplicationVisible = type
|
||||
},
|
||||
// 新上架
|
||||
clear () {
|
||||
console.log('清空----------------------------------------')
|
||||
this.notFilled = []
|
||||
this.showPutOnTheShelfFlag = false
|
||||
this.showPutOnTheShelfFlag2 = false
|
||||
this.insertList = []
|
||||
this.putOnTheShelfList = []
|
||||
this.radio = ''
|
||||
this.submitFrom = {
|
||||
type: '组件服务',
|
||||
deptId: '',
|
||||
delFlag: 0,
|
||||
infoList: [
|
||||
{
|
||||
attrType: '组件类型',
|
||||
attrValue: '',
|
||||
delFlag: 0
|
||||
}
|
||||
]
|
||||
}
|
||||
this.reset()
|
||||
},
|
||||
showPutOnTheShelf () {
|
||||
this.showPutOnTheShelfFlag = true
|
||||
this.$http.get('/category/getCategoryTree').then((res) => {
|
||||
this.insertList = res.data.data.filter(
|
||||
(item) => item.name === '组件服务一'
|
||||
)[0]
|
||||
})
|
||||
},
|
||||
showPutOnTheShelfVue () {
|
||||
this.showPutOnTheShelfFlag = false
|
||||
this.showPutOnTheShelfFlag2 = true
|
||||
this.submitFrom.infoList[0].attrValue = this.radio
|
||||
this.putOnTheShelfList = this.insertList.children.filter(
|
||||
(item) => item.name === this.radio
|
||||
)[0].children
|
||||
},
|
||||
changeInfoList (obj) {
|
||||
console.log(obj, this.submitFrom)
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.filter(
|
||||
(item) => item.attrType !== obj.attrType
|
||||
this.qp = false
|
||||
} else {
|
||||
console.log(
|
||||
'不是全屏2',
|
||||
window.outerHeight,
|
||||
screen.availHeight,
|
||||
window.outerWidth,
|
||||
screen.availWidth
|
||||
)
|
||||
this.submitFrom.infoList.push(obj)
|
||||
},
|
||||
changeAdd () {
|
||||
const arr = []
|
||||
switch (this.radio) {
|
||||
case '智能算法':
|
||||
arr.push('算法优势')
|
||||
arr.push('计费标准信息')
|
||||
break
|
||||
case '开发组件':
|
||||
case '业务组件':
|
||||
arr.push('功能介绍')
|
||||
break
|
||||
this.qp = true
|
||||
}
|
||||
arr.push('应用场景')
|
||||
arr.push('常见问题')
|
||||
this.$refs.putOnTheShelf.submit(arr)
|
||||
},
|
||||
submitData () {
|
||||
console.log('提交11111111111===============>', this.putOnTheShelfList, this.submitFrom)
|
||||
const arr = []
|
||||
this.putOnTheShelfList.map((item) => {
|
||||
item.children.map((child) => {
|
||||
if (child.children) {
|
||||
if (
|
||||
child.name === '算法优势' ||
|
||||
child.name === '应用场景' ||
|
||||
child.name === '功能介绍'
|
||||
) {
|
||||
arr.push(child.name)
|
||||
if (
|
||||
this.submitFrom.infoList.filter(
|
||||
(value) => value.attrType === child.name
|
||||
).length === 0
|
||||
) {
|
||||
this.submitFrom.infoList.push({
|
||||
attrType: child.name,
|
||||
attrValue: child.note1,
|
||||
delFlag: 0
|
||||
})
|
||||
}
|
||||
}
|
||||
child.children.map((val) => {
|
||||
arr.push(val.name)
|
||||
if (
|
||||
val.type === 'input' ||
|
||||
val.type === 'textArea' ||
|
||||
val.type === 'select' ||
|
||||
val.type === 'checkBox' ||
|
||||
val.type === 'radio'
|
||||
) {
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.filter(
|
||||
(item) => item.attrType !== val.name
|
||||
} else {
|
||||
console.log(
|
||||
'不是全屏3',
|
||||
window.outerHeight,
|
||||
screen.availHeight,
|
||||
window.outerWidth,
|
||||
screen.availWidth
|
||||
)
|
||||
this.qp = true
|
||||
}
|
||||
if (val.note1 == '' || val.note1) {
|
||||
switch (val.name) {
|
||||
case '算法名称':
|
||||
case '应用名称':
|
||||
case '组件名称':
|
||||
case '图层名称':
|
||||
this.submitFrom.name = val.note1
|
||||
break
|
||||
case '算法描述':
|
||||
case '应用描述':
|
||||
case '组件描述':
|
||||
case '图层描述':
|
||||
this.submitFrom.description = val.note1
|
||||
break
|
||||
case '共享条件':
|
||||
this.submitFrom.shareCondition = val.note1
|
||||
break
|
||||
case '共享类型':
|
||||
this.submitFrom.shareType = val.note1
|
||||
break
|
||||
case '服务接口':
|
||||
this.submitFrom.apiUrl = val.note1
|
||||
break
|
||||
case '接口请求方式':
|
||||
this.submitFrom.apiMethodType = val.note1
|
||||
break
|
||||
case '访问地址':
|
||||
this.submitFrom.link = val.note1
|
||||
break
|
||||
case '部门联系人':
|
||||
this.submitFrom.deptContacts = val.note1
|
||||
break
|
||||
case '部门联系人电话':
|
||||
this.submitFrom.deptPhone = val.note1
|
||||
break
|
||||
case '归属部门':
|
||||
this.submitFrom.deptId = val.note1
|
||||
break
|
||||
case '能力类型':
|
||||
this.submitFrom.type = val.note1
|
||||
break
|
||||
default:
|
||||
if (
|
||||
val.type !== 'image' &&
|
||||
val.type !== 'file' &&
|
||||
val.type !== 'video'
|
||||
) {
|
||||
this.submitFrom.infoList.push({
|
||||
attrType: val.name,
|
||||
attrValue: val.note1,
|
||||
delFlag: 0
|
||||
})
|
||||
} else {
|
||||
if (
|
||||
this.submitFrom.infoList.filter(
|
||||
(value) => value.attrType === val.name
|
||||
).length === 0
|
||||
) {
|
||||
this.submitFrom.infoList.push({
|
||||
attrType: val.name,
|
||||
attrValue: val.note1,
|
||||
delFlag: 0,
|
||||
note2: val.note2 || null
|
||||
})
|
||||
}
|
||||
}
|
||||
break
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.sort(
|
||||
(a, b) => arr.indexOf(a.attrType) - arr.indexOf(b.attrType)
|
||||
)
|
||||
this.notFilled = []
|
||||
if (!this.submitFrom.name) {
|
||||
this.notFilled.push('算法名称')
|
||||
this.notFilled.push('图层名称')
|
||||
this.notFilled.push('组件名称')
|
||||
}
|
||||
if (!this.submitFrom.description) {
|
||||
this.notFilled.push('算法描述')
|
||||
this.notFilled.push('图层描述')
|
||||
this.notFilled.push('组件描述')
|
||||
}
|
||||
if (!this.submitFrom.shareCondition) {
|
||||
this.notFilled.push('共享条件')
|
||||
}
|
||||
if (!this.submitFrom.deptContacts) {
|
||||
this.notFilled.push('部门联系人')
|
||||
}
|
||||
if (!this.submitFrom.deptId) {
|
||||
this.notFilled.push('归属部门')
|
||||
}
|
||||
if (!this.submitFrom.deptPhone) {
|
||||
this.notFilled.push('部门联系人电话')
|
||||
}
|
||||
if (this.radio === '智能算法' && !this.submitFrom.apiUrl) {
|
||||
if ((this.submitFrom.infoList.filter(val => val.attrType === '使用方式')[0].attrValue === '调用接口')) {
|
||||
this.notFilled.push('服务接口')
|
||||
}
|
||||
}
|
||||
if (this.radio === '智能算法' && !this.submitFrom.apiMethodType) {
|
||||
if ((this.submitFrom.infoList.filter(val => val.attrType === '使用方式')[0].attrValue === '调用接口')) {
|
||||
this.notFilled.push('接口请求方式')
|
||||
}
|
||||
}
|
||||
if (this.radio === '智能算法' && (!this.submitFrom.infoList.filter(val => val.attrType === '算法类别')[0] || !this.submitFrom.infoList.filter(val => val.attrType === '算法类别')[0].attrValue)) {
|
||||
this.notFilled.push('算法类别')
|
||||
}
|
||||
if (!this.submitFrom.infoList.filter(val => val.attrType === '应用领域')[0] || !this.submitFrom.infoList.filter(val => val.attrType === '应用领域')[0].attrValue) {
|
||||
this.notFilled.push('应用领域')
|
||||
}
|
||||
if (this.radio === '图层服务' && (!this.submitFrom.infoList.filter(val => val.attrType === '服务地址')[0] || !this.submitFrom.infoList.filter(val => val.attrType === '服务地址')[0].attrValue)) {
|
||||
this.notFilled.push('服务地址')
|
||||
}
|
||||
if ((this.radio === '业务组件' || this.radio === '开发组件') && (!this.submitFrom.infoList.filter(val => val.attrType === '组件地址')[0] || !this.submitFrom.infoList.filter(val => val.attrType === '组件地址')[0].attrValue)) {
|
||||
this.notFilled.push('组件地址')
|
||||
}
|
||||
console.log(this.submitFrom, this.notFilled, '表单验证')
|
||||
if (this.notFilled.length > 0) {
|
||||
this.$message({
|
||||
message: '请填写必填字段！',
|
||||
type: 'warning'
|
||||
})
|
||||
} else {
|
||||
if (this.submitFrom.id) {
|
||||
// 解决编辑无组件类型
|
||||
this.submitFrom.infoList.map((val) => {
|
||||
if (val.attrType === '组件类型') {
|
||||
val.attrValue = this.radio
|
||||
}
|
||||
})
|
||||
console.log('编辑===============>', this.submitFrom)
|
||||
console.log(this.submitFrom.infoList, '===============abc')
|
||||
// 去重
|
||||
const newArr = this.submitFrom.infoList.filter(
|
||||
(element, index, self) => {
|
||||
return (
|
||||
self.findIndex((x) => x.attrType === element.attrType) === index
|
||||
)
|
||||
}
|
||||
)
|
||||
this.submitFrom.infoList = newArr
|
||||
// 检验是否有空值
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.filter(item => item.attrValue)
|
||||
this.$http
|
||||
.put('/resource/update', this.submitFrom)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
this.$message.error('修改失败!')
|
||||
} else {
|
||||
this.$message.success('修改成功！')
|
||||
this.clear()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
} else {
|
||||
console.log('提交11111111111===============>', this.putOnTheShelfList, this.submitFrom)
|
||||
this.$http
|
||||
.post('/resource/insert?source= b', this.submitFrom)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
this.$message.error('上架失败!')
|
||||
} else {
|
||||
this.$message.success('上架成功！')
|
||||
this.clear()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 新修改
|
||||
UpdateData (item) {
|
||||
this.$http.get('/category/getCategoryTree').then((res) => {
|
||||
this.insertList = res.data.data.filter(
|
||||
(item) => item.name === '组件服务一'
|
||||
)[0]
|
||||
this.radio = item.infoList.filter(
|
||||
(val) => val.attrType === '组件类型'
|
||||
)[0].attrValue
|
||||
this.putOnTheShelfList = this.insertList.children.filter(
|
||||
(item) => item.name === this.radio
|
||||
)[0].children
|
||||
this.putOnTheShelfList.map((parent) => {
|
||||
parent.children.map((child) => {
|
||||
if (
|
||||
child.name === '算法优势' ||
|
||||
child.name === '应用场景' ||
|
||||
child.name === '功能介绍'
|
||||
) {
|
||||
const obj = item.infoList.filter(
|
||||
(val) => val.attrType === child.name
|
||||
)[0]
|
||||
if (obj) {
|
||||
child.note1 = obj.attrValue
|
||||
}
|
||||
} else {
|
||||
if (child.children) {
|
||||
child.children.map((data) => {
|
||||
if (
|
||||
data.name === '计费标准信息' ||
|
||||
data.name === '常见问题'
|
||||
) {
|
||||
const obj = item.infoList.filter(
|
||||
(val) => val.attrType === child.name
|
||||
)[0]
|
||||
if (obj) {
|
||||
data.note1 = obj.attrValue
|
||||
}
|
||||
} else {
|
||||
switch (data.name) {
|
||||
case '算法名称':
|
||||
case '应用名称':
|
||||
case '组件名称':
|
||||
case '图层名称':
|
||||
data.note1 = item.name
|
||||
break
|
||||
case '算法描述':
|
||||
case '应用描述':
|
||||
case '组件描述':
|
||||
case '图层描述':
|
||||
data.note1 = item.description
|
||||
break
|
||||
case '共享条件':
|
||||
data.note1 = item.shareCondition
|
||||
break
|
||||
case '共享类型':
|
||||
data.note1 = item.shareType
|
||||
break
|
||||
case '服务接口':
|
||||
data.note1 = item.apiUrl
|
||||
break
|
||||
case '接口请求方式':
|
||||
data.note1 = item.apiMethodType
|
||||
break
|
||||
case '访问地址':
|
||||
data.note1 = item.link
|
||||
break
|
||||
case '部门联系人':
|
||||
data.note1 = item.deptContacts
|
||||
break
|
||||
case '部门联系人电话':
|
||||
data.note1 = item.deptPhone
|
||||
break
|
||||
case '归属部门':
|
||||
data.note1 = item.deptId
|
||||
break
|
||||
case '能力类型':
|
||||
data.note1 = item.type
|
||||
break
|
||||
default:
|
||||
// eslint-disable-next-line no-case-declarations
|
||||
const obj1 = item.infoList.filter(
|
||||
(val) => val.attrType === data.name
|
||||
)[0]
|
||||
if (obj1) {
|
||||
data.note1 = obj1.attrValue
|
||||
}
|
||||
break
|
||||
}
|
||||
if (
|
||||
data.type === 'image' ||
|
||||
data.type === 'file' ||
|
||||
data.type === 'video'
|
||||
) {
|
||||
const obj1 = item.infoList.filter(
|
||||
(val) => val.attrType === data.name
|
||||
)[0]
|
||||
if (obj1) {
|
||||
data.note2 = obj1.note2
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
this.submitFrom.id = item.id
|
||||
this.showPutOnTheShelfFlag2 = true
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -972,10 +315,4 @@ export default {
|
|||
.el-tooltip__popper {
|
||||
max-width: 50%;
|
||||
}
|
||||
// ::v-deep .el-table .cell {
|
||||
// width: 200px;
|
||||
// }
|
||||
::v-deep .el-upload-list__item-name {
|
||||
width: 400px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,128 +0,0 @@
|
|||
<!--
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-20 10:38:17
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-20 11:33:13
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<template>
|
||||
<div class="bsabilityimport">
|
||||
<div class="item" @click="downloadTemplate()">
|
||||
<svg t="1655692930310" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1593" width="200" height="200"><path d="M599.13 0.476L33.55 109.306a20.778 20.778 0 0 0-16.492 20.42v764.308a20.778 20.778 0 0 0 16.372 20.48l565.58 108.83a20.837 20.837 0 0 0 3.81 0.654 19.29 19.29 0 0 0 12.622-4.465 21.313 21.313 0 0 0 7.56-16.015V20.361a21.313 21.313 0 0 0-7.56-16.074 19.23 19.23 0 0 0-16.313-3.81z m-206.11 696.08l-46.14-83.348c-10.597-18.575-20.241-37.864-32.148-59.951h-2.203c-10.538 21.67-20.004 40.305-29.767 58.344l-43.937 76.323-87.278-5 115.557-175.985L158.454 342.8l91.147-5.953 41.317 70.608c9.466 16.55 18.337 33.697 30.541 55.784h2.798c9.824-22.683 18.159-40.543 27.03-58.404l38.935-77.395 86.683-5.953-108.592 188.249L483.93 701.915zM966.519 122.76H663.487v143.36h40.364v40.96h-40.364v102.4h40.364v40.96h-40.364V552.9h40.364v40.96h-40.364v122.939h40.364v40.96h-40.364v143.419h302.972a40.781 40.781 0 0 0 40.424-40.96V163.72a40.781 40.781 0 0 0-40.364-40.96zM905.912 757.7H744.275v-40.96h161.637z m0-163.9H744.275v-40.9h161.637z m0-143.418H744.275v-40.9h161.637z m0-143.42H744.275v-40.84h161.637z" fill="#1296db" p-id="1594"></path></svg>
|
||||
<span>下载模板</span>
|
||||
</div>
|
||||
<el-upload
|
||||
ref="addUpload"
|
||||
class="item"
|
||||
:action="fileUploadUrl"
|
||||
:on-success="onSuccess"
|
||||
:on-remove="onRemove"
|
||||
:show-file-list='false'
|
||||
:on-error="onErrorFile"
|
||||
:on-exceed='onExceed'
|
||||
:limit='1'
|
||||
:on-preview="onPreview"
|
||||
list-type="text"
|
||||
>
|
||||
<svg t="1655692986683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2083" width="200" height="200"><path d="M192 256v29h9.9c-6.5-9.3-9.9-19-9.9-29z m384 128c-41.9 0-82.3-2.2-120-6.4L590.2 512 467.5 634.8c34.4 3.4 70.8 5.2 108.5 5.2 212.1 0 384-57.3 384-128V256c0 70.7-171.9 128-384 128z m-263.9-99h51.3l17.2 17.2c57.2 11.3 124 17.8 195.4 17.8 212.1 0 384-57.3 384-128S788.1 64 576 64s-384 57.3-384 128c0 36.6 46.2 69.7 120.1 93zM576 704c-59.1 0-115.2-4.5-165.2-12.4L363.4 739H192v93c0 70.7 171.9 128 384 128s384-57.3 384-128V576c0 70.7-171.9 128-384 128z" fill="#E6C27C" p-id="2084"></path><path d="M336.9 349H198.6l98.9 98.9H64v128.2h233.5L198.6 675h138.3l162.9-163z" fill="#497CAD" p-id="2085"></path></svg>
|
||||
<div>导入数据</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Cookies from 'js-cookie'
|
||||
export default {
|
||||
name: '',
|
||||
components: {
|
||||
|
||||
},
|
||||
props: {
|
||||
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/resource//importResource?token=' + Cookies.get('ucsToken')
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
downloadTemplate () {
|
||||
window.open(window.SITE_CONFIG.apiURL + '/%E8%83%BD%E5%8A%9B%E8%B5%84%E6%BA%90%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF.xlsx?token=' + Cookies.get('ucsToken'))
|
||||
},
|
||||
onSuccess (res, file) {
|
||||
this.$message({
|
||||
message: '导入成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.$refs.addUpload.clearFiles()
|
||||
},
|
||||
onErrorFile () {
|
||||
this.$message('导入失败！')
|
||||
this.$refs.addUpload.clearFiles() // 去掉文件列表
|
||||
},
|
||||
onRemove (file, fileList) {
|
||||
console.log(file, fileList)
|
||||
},
|
||||
onPreview (file) {
|
||||
console.log('点击预览===============>', file)
|
||||
window.open(file.response.data)
|
||||
},
|
||||
onExceed (files, fileList) {
|
||||
this.$message.warning('当前附件数量已达上限，请先删除部分附件！')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
.bsabilityimport {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
padding: 250px 300px;
|
||||
.item {
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid rgba(0, 0, 0, 0);
|
||||
span {
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
margin-top: 20px;
|
||||
}
|
||||
div {
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
.item:hover {
|
||||
cursor: pointer;
|
||||
border: 1px solid #1296db;
|
||||
border-radius: 10px;
|
||||
svg {
|
||||
animation: turn 2s linear infinite;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes turn {
|
||||
0% {
|
||||
-webkit-transform: rotateY(0deg);
|
||||
}
|
||||
25% {
|
||||
-webkit-transform: rotateY(90deg);
|
||||
}
|
||||
50% {
|
||||
-webkit-transform: rotateY(180deg);
|
||||
}
|
||||
75% {
|
||||
-webkit-transform: rotateY(270deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotateY(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -10,27 +10,9 @@
|
|||
<!-- 挂载和修改-->
|
||||
<div key="1" v-if="!disabled">
|
||||
<!-- 挂载-->
|
||||
<div
|
||||
style="
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
"
|
||||
>
|
||||
填写字段
|
||||
</div>
|
||||
<el-checkbox-group
|
||||
v-model="checkList"
|
||||
@change="showListChagne"
|
||||
style="margin-bottom: 20px"
|
||||
>
|
||||
<el-checkbox-button
|
||||
v-for="item in dataForm.showListAll"
|
||||
:label="item.name"
|
||||
:key="item.id"
|
||||
>{{ item.name }}</el-checkbox-button
|
||||
>
|
||||
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">填写字段</div>
|
||||
<el-checkbox-group v-model="checkList" @change="showListChagne" style="margin-bottom:20px;">
|
||||
<el-checkbox-button v-for="item in dataForm.showListAll" :label="item.name" :key="item.id">{{item.name}}</el-checkbox-button>
|
||||
</el-checkbox-group>
|
||||
<el-form
|
||||
v-if="!UpdateState"
|
||||
|
|
@ -40,40 +22,19 @@
|
|||
@keyup.enter.native="dataFormSubmitHandle()"
|
||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
||||
>
|
||||
<div v-show="checkList.indexOf('必填信息') > -1">
|
||||
<div
|
||||
style="
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
"
|
||||
>
|
||||
必填信息
|
||||
</div>
|
||||
<div v-show="checkList.indexOf('必填信息')>-1">
|
||||
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">必填信息</div>
|
||||
<el-form-item label="应用名称" prop="name">
|
||||
<el-input
|
||||
v-model="dataForm.name"
|
||||
placeholder="请输入组件名称"
|
||||
></el-input>
|
||||
<el-input v-model="dataForm.name" placeholder="请输入组件名称" ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="应用描述" prop="description">
|
||||
<el-input
|
||||
v-model="dataForm.description"
|
||||
placeholder="请输入组件描述"
|
||||
></el-input>
|
||||
<el-input v-model="dataForm.description" placeholder="请输入组件描述" ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门联系人" prop="deptContacts">
|
||||
<el-input
|
||||
v-model="dataForm.deptContacts"
|
||||
placeholder="请输入部门联系人"
|
||||
></el-input>
|
||||
<el-input v-model="dataForm.deptContacts" placeholder="请输入部门联系人" ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门联系人电话" prop="deptPhone">
|
||||
<el-input
|
||||
v-model="dataForm.deptPhone"
|
||||
placeholder="请输入部门联系人电话"
|
||||
></el-input>
|
||||
<el-input v-model="dataForm.deptPhone" placeholder="请输入部门联系人电话" ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="共享条件" prop="shareCondition">
|
||||
<el-select
|
||||
|
|
@ -89,8 +50,7 @@
|
|||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="共享类型" prop="shareType"
|
||||
><el-select
|
||||
<el-form-item label="共享类型" prop="shareType"><el-select
|
||||
v-model="dataForm.shareType"
|
||||
placeholder="请选择共享类型"
|
||||
>
|
||||
|
|
@ -104,47 +64,16 @@
|
|||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="共享方式" prop="shareMode">
|
||||
<el-input
|
||||
v-model="dataForm.shareMode"
|
||||
placeholder="请输入共享方式"
|
||||
></el-input>
|
||||
<el-input v-model="dataForm.shareMode" placeholder="请输入共享方式" ></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div
|
||||
v-for="item in dataForm.showList"
|
||||
:key="item.id"
|
||||
v-show="item.name !== '必填信息'"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
"
|
||||
>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
<el-form-item
|
||||
:label="child.name"
|
||||
v-for="child in item.children"
|
||||
:key="child.id"
|
||||
v-show="item.children"
|
||||
>
|
||||
<el-input
|
||||
v-model="child.note1"
|
||||
:placeholder="'请输入' + child.name"
|
||||
v-if="child.type == 'input'"
|
||||
></el-input>
|
||||
<el-input
|
||||
v-model="child.note1"
|
||||
:placeholder="'请输入' + child.name"
|
||||
type="textarea"
|
||||
:rows="2"
|
||||
v-if="child.type == 'textArea'"
|
||||
></el-input>
|
||||
<div v-for="item in dataForm.showList" :key="item.id" v-show="item.name !== '必填信息'">
|
||||
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">{{item.name}}</div>
|
||||
<el-form-item :label="child.name" v-for="child in item.children" :key="child.id" v-show="item.children">
|
||||
<el-input v-model="child.note1" :placeholder="'请输入'+child.name" v-if="child.type=='input'"></el-input>
|
||||
<el-input v-model="child.note1" :placeholder="'请输入'+child.name" type="textarea" :rows="2" v-if="child.type=='textArea'"></el-input>
|
||||
<el-select
|
||||
v-else-if="child.type == 'select'"
|
||||
v-else-if="child.type=='select'"
|
||||
v-model="child.note1"
|
||||
:placeholder="'请选择' + child.name"
|
||||
>
|
||||
|
|
@ -156,24 +85,9 @@
|
|||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<upload
|
||||
v-else-if="child.type == 'images'"
|
||||
:child="child"
|
||||
limit="5"
|
||||
accept=".jpg,.png"
|
||||
></upload>
|
||||
<upload
|
||||
v-else-if="child.type == 'image'"
|
||||
:child="child"
|
||||
limit="1"
|
||||
accept=".jpg,.png"
|
||||
></upload>
|
||||
<upload
|
||||
v-else-if="child.type == 'video'"
|
||||
:child="child"
|
||||
limit="1"
|
||||
accept=".mp4"
|
||||
></upload>
|
||||
<upload v-else-if="child.type=='images'" :child='child' limit='5' accept='.jpg,.png'></upload>
|
||||
<upload v-else-if="child.type=='image'" :child='child' limit='1' accept='.jpg,.png'></upload>
|
||||
<upload v-else-if="child.type=='video'" :child='child' limit='1' accept='.mp4'></upload>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
|
|
@ -271,7 +185,8 @@
|
|||
v-if="
|
||||
item.attrType != '应用领域' &&
|
||||
item.attrType != '应用类型' &&
|
||||
item.attrType != '发布端'
|
||||
item.attrType != '发布端' &&
|
||||
item.attrType != '应用状态'
|
||||
"
|
||||
></el-input>
|
||||
<el-select
|
||||
|
|
@ -913,10 +828,10 @@ export default {
|
|||
console.log('表单数据=======================》', this.dataForm)
|
||||
if (!this.UpdateState) {
|
||||
this.dataForm.infoList = []
|
||||
this.dataForm.showListAll.forEach((val) => {
|
||||
this.dataForm.showListAll.forEach(val => {
|
||||
if (val.name !== '必填信息') {
|
||||
if (val.name === '服务接口信息') {
|
||||
val.children.forEach((item) => {
|
||||
val.children.forEach(item => {
|
||||
if (item.name === '服务接口') {
|
||||
this.dataForm.apiUrl = item.note1
|
||||
}
|
||||
|
|
@ -928,7 +843,7 @@ export default {
|
|||
}
|
||||
})
|
||||
} else {
|
||||
val.children.forEach((item) => {
|
||||
val.children.forEach(item => {
|
||||
this.dataForm.infoList.push({
|
||||
attrType: item.name,
|
||||
attrValue: item.note1,
|
||||
|
|
@ -980,15 +895,8 @@ export default {
|
|||
{ leading: true, trailing: false }
|
||||
),
|
||||
showListChagne () {
|
||||
this.dataForm.showList = this.dataForm.showListAll.filter(
|
||||
(item) => this.checkList.indexOf(item.name) > -1
|
||||
)
|
||||
console.log(
|
||||
'属性变更===================>',
|
||||
this.checkList,
|
||||
this.dataForm.showList,
|
||||
this.dataForm.showListAll
|
||||
)
|
||||
this.dataForm.showList = this.dataForm.showListAll.filter(item => this.checkList.indexOf(item.name) > -1)
|
||||
console.log('属性变更===================>', this.checkList, this.dataForm.showList, this.dataForm.showListAll)
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,10 @@
|
|||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-ability__bsabilityai">
|
||||
<el-form :inline="true" :model="dataForm">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="dataForm"
|
||||
>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="dataForm.name"
|
||||
|
|
@ -10,29 +13,20 @@
|
|||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList2(dataForm.name)">{{
|
||||
$t("query")
|
||||
}}</el-button>
|
||||
<el-button @click="getDataList2(dataForm.name)">{{ $t("query") }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="info" @click="exportHandle()">{{
|
||||
$t("export")
|
||||
}}</el-button>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:save')"
|
||||
type="primary"
|
||||
@click="addOrUpdateHandleServe()"
|
||||
>挂接</el-button
|
||||
>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="showPutOnTheShelf()"
|
||||
>上架</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
|
|
@ -51,8 +45,8 @@
|
|||
:data="dataList"
|
||||
border
|
||||
@selection-change="dataListSelectionChangeHandle"
|
||||
style="width: 100%"
|
||||
height="650px"
|
||||
style="width: 100%;"
|
||||
:height="qp ? '810px' : '650px'"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
|
|
@ -61,81 +55,40 @@
|
|||
width="50"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="name"
|
||||
label="应用名称"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="description"
|
||||
label="应用描述"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="deptName"
|
||||
label="归属部门"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="deptContacts"
|
||||
label="部门联系人"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="deptPhone"
|
||||
label="部门联系人电话"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<af-table-column
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
prop="shareCondition"
|
||||
label="共享条件"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></af-table-column>
|
||||
<template v-if="dataList[0] && dataList[0].infoList2">
|
||||
|
||||
<el-table-column
|
||||
v-for="(item, index) in dataList[0].infoList2"
|
||||
v-for="(item, index) in dataList[0].infoList"
|
||||
:key="index"
|
||||
:label="item.attrType"
|
||||
header-align="center"
|
||||
align="center"
|
||||
:show-overflow-tooltip="true"
|
||||
width="280"
|
||||
show-overflow-tooltip="true"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ findValue(scope.row.infoList2, item.attrType) }}
|
||||
{{
|
||||
findValue(scope.row.infoList, item.attrType)
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
<el-table-column
|
||||
:label="$t('handle')"
|
||||
fixed="right"
|
||||
header-align="center"
|
||||
align="center"
|
||||
width="300"
|
||||
width="94"
|
||||
right="0"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="UpdateData(scope.row)"
|
||||
@click="UpdateHandle(scope.row)"
|
||||
>{{ $t("update") }}</el-button
|
||||
>
|
||||
<el-button
|
||||
|
|
@ -146,35 +99,9 @@
|
|||
>{{ $t("delete") }}</el-button
|
||||
>
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
<el-button type="text" size="small" @click="showDocument(scope.row)"
|
||||
>技术文档</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="applyAndAssembly(scope.row)"
|
||||
>应用与组件</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="applyAndDataResource(scope.row)"
|
||||
>应用与数据资源</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="applyAndProject(scope.row)"
|
||||
>应用与项目</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="applyAndInfrastructure(scope.row)"
|
||||
>应用与基础设施</el-button
|
||||
>展示</el-button
|
||||
>
|
||||
<el-button type="text" size="small" @click="showDocument(scope.row)">开发文档</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -195,28 +122,7 @@
|
|||
ref="addOrUpdate"
|
||||
@refreshDataList="getDataList"
|
||||
></add-or-update>
|
||||
<relate-application
|
||||
v-if="relateApplicationResourceVisible"
|
||||
ref="relateApplication"
|
||||
:relateInfo="relationData"
|
||||
:nameArray="topNameArray"
|
||||
@isShowRelatePopup="handleIsShowRelatePopupApply"
|
||||
></relate-application>
|
||||
</div>
|
||||
<el-dialog
|
||||
:title="submitFrom.id?'修改'+radio:'上架'+radio"
|
||||
:visible.sync="showPutOnTheShelfFlag2"
|
||||
:close-on-click-modal='false'
|
||||
:close-on-press-escape='false'
|
||||
:destroy-on-close='true'
|
||||
:before-close='clear'
|
||||
width="50%">
|
||||
<putOnTheShelf :required="required" :notFilled="notFilled":putOnTheShelfList='putOnTheShelfList' @changeInfoList='changeInfoList' :type='radio' :typeInput='typeInput'></putOnTheShelf>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="clear">取 消</el-button>
|
||||
<el-button type="primary" @click="submitData">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
|
|
@ -224,17 +130,12 @@
|
|||
import mixinViewModule from '@/mixins/view-module'
|
||||
import AddOrUpdate from './bsabilityservice-add-or-update'
|
||||
import dictionaries from '@/utils/dictionaries'
|
||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
||||
import qs from 'qs'
|
||||
import { type } from 'os'
|
||||
import putOnTheShelf from '@/views/modules/putOnTheShelf'
|
||||
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
data () {
|
||||
return {
|
||||
required: ['归属部门', '部门联系人', '部门联系人电话', '应用领域', '共享条件', '应用名称', '应用描述', '应用类型'],
|
||||
notFilled: [],
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: '/resource/page',
|
||||
getDataListIsPage: true,
|
||||
|
|
@ -253,50 +154,25 @@ export default {
|
|||
delFlag: 0,
|
||||
type: '应用资源'
|
||||
},
|
||||
qp: false,
|
||||
relateApplicationResourceVisible: false,
|
||||
relationData: {}, // 打开穿梭框时传递的参数
|
||||
topNameArray: [], //
|
||||
radio: '应用资源',
|
||||
insertList: [],
|
||||
putOnTheShelfList: [],
|
||||
showPutOnTheShelfFlag2: false,
|
||||
submitFrom: {
|
||||
type: '应用资源',
|
||||
deptId: '',
|
||||
delFlag: 0,
|
||||
infoList: [
|
||||
// {
|
||||
// attrType: '组件类型',
|
||||
// attrValue: '',
|
||||
// delFlag: 0
|
||||
// }
|
||||
]
|
||||
},
|
||||
typeInput: '应用资源'
|
||||
qp: false
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
components: {
|
||||
AddOrUpdate,
|
||||
RelateApplication,
|
||||
putOnTheShelf
|
||||
AddOrUpdate
|
||||
},
|
||||
created () {
|
||||
this.dataForm.name = ''
|
||||
this.dataForm.type = '应用资源'
|
||||
},
|
||||
mounted () {
|
||||
// window.addEventListener('resize', this.a)
|
||||
// this.fullScreen()
|
||||
window.addEventListener('resize', this.a)
|
||||
this.fullScreen()
|
||||
},
|
||||
methods: {
|
||||
reset () {
|
||||
this.$http
|
||||
.get(
|
||||
this.mixinViewModuleOptions.getDataListURL +
|
||||
'?' +
|
||||
qs.stringify({
|
||||
this.$http.get(
|
||||
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||
// order: this.order,
|
||||
// orderField: this.orderField,
|
||||
// type: '组件服务',
|
||||
|
|
@ -308,60 +184,40 @@ export default {
|
|||
type: '应用资源',
|
||||
name: ''
|
||||
})
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
|
||||
).then(({ data: res }) => {
|
||||
this.dataForm.name = ''
|
||||
if (res.code !== 0) {
|
||||
this.dataList = []
|
||||
this.total = 0
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
|
||||
? res.data.list
|
||||
: res.data
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage
|
||||
? res.data.total
|
||||
: 0
|
||||
this.dataList = this.mixinViewModuleOptions.getDataListIsPage ? res.data.list : res.data
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||
if (this.mixinViewModuleOptions.requestCallback) {
|
||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||
}
|
||||
this.dataListLoading = false
|
||||
this.dataList.map((item, index) => {
|
||||
const dataListSinforList = []
|
||||
item.infoList.map((itemson, indexson) => {
|
||||
if (
|
||||
itemson.attrType === '应用领域'
|
||||
) {
|
||||
dataListSinforList.push(itemson)
|
||||
}
|
||||
})
|
||||
this.dataList[index].infoList2 = dataListSinforList
|
||||
})
|
||||
})
|
||||
.catch(() => {
|
||||
}).catch(() => {
|
||||
this.dataListLoading = false
|
||||
})
|
||||
},
|
||||
showDetail (val) {
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
||||
// this.addOrUpdateVisible = true
|
||||
// this.disabled = false
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.addOrUpdate.UpdateState = false
|
||||
// this.$refs.addOrUpdate.dataFormShowDetails = val
|
||||
// this.$refs.addOrUpdate.init()
|
||||
// })
|
||||
// this.disabled = true
|
||||
this.addOrUpdateVisible = true
|
||||
this.disabled = false
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.UpdateState = false
|
||||
this.$refs.addOrUpdate.dataFormShowDetails = val
|
||||
this.$refs.addOrUpdate.init()
|
||||
})
|
||||
this.disabled = true
|
||||
},
|
||||
showDocument (val) {
|
||||
console.log(val)
|
||||
window.open(
|
||||
window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type,
|
||||
'_blank'
|
||||
)
|
||||
window.open(window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type, '_blank')
|
||||
},
|
||||
findValue (list, type) {
|
||||
const found = list.find((item) => item.attrType === type)
|
||||
const found = list.find(item => item.attrType === type)
|
||||
if (found) {
|
||||
return found.attrValue
|
||||
} else {
|
||||
|
|
@ -370,11 +226,8 @@ export default {
|
|||
},
|
||||
getDataList2 (names) {
|
||||
if (names != null) {
|
||||
this.$http
|
||||
.get(
|
||||
this.mixinViewModuleOptions.getDataListURL +
|
||||
'?' +
|
||||
qs.stringify({
|
||||
this.$http.get(
|
||||
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||
// order: this.order,
|
||||
// orderField: this.orderField,
|
||||
// type: '组件服务',
|
||||
|
|
@ -395,442 +248,53 @@ export default {
|
|||
}
|
||||
if (res.data.list.length !== 0) {
|
||||
this.dataList = res.data.list
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage
|
||||
? res.data.total
|
||||
: 0
|
||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||
if (this.mixinViewModuleOptions.requestCallback) {
|
||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||
}
|
||||
this.dataListLoading = false
|
||||
this.dataList.map((item, index) => {
|
||||
const dataListSinforList = []
|
||||
item.infoList.map((itemson, indexson) => {
|
||||
if (
|
||||
itemson.attrType === '应用领域'
|
||||
) {
|
||||
dataListSinforList.push(itemson)
|
||||
}
|
||||
})
|
||||
this.dataList[index].infoList2 = dataListSinforList
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未查询到相关信息')
|
||||
this.reset()
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
}).catch(() => {
|
||||
this.dataListLoading = false
|
||||
})
|
||||
} else {
|
||||
this.$message.error('查询不能输入为空')
|
||||
}
|
||||
},
|
||||
// fullScreen () {
|
||||
// if (window.outerHeight === screen.availHeight) {
|
||||
// if (window.outerWidth === screen.availWidth) {
|
||||
// console.log(
|
||||
// '全屏1',
|
||||
// window.outerHeight,
|
||||
// screen.availHeight,
|
||||
// window.outerWidth,
|
||||
// screen.availWidth
|
||||
// )
|
||||
// this.qp = false
|
||||
// } else {
|
||||
// console.log(
|
||||
// '不是全屏2',
|
||||
// window.outerHeight,
|
||||
// screen.availHeight,
|
||||
// window.outerWidth,
|
||||
// screen.availWidth
|
||||
// )
|
||||
// this.qp = true
|
||||
// }
|
||||
// } else {
|
||||
// console.log(
|
||||
// '不是全屏3',
|
||||
// window.outerHeight,
|
||||
// screen.availHeight,
|
||||
// window.outerWidth,
|
||||
// screen.availWidth
|
||||
// )
|
||||
// this.qp = true
|
||||
// }
|
||||
// },
|
||||
// 应用与组件
|
||||
applyAndAssembly (val) {
|
||||
console.log('vvvv', val)
|
||||
// 根据id和类型查询已关联的组件，将id,type和查出来的数据传递给组件
|
||||
const type = '组件服务'
|
||||
const id = val.id
|
||||
this.$http
|
||||
.get('/dataResourceRel/queryResourceRelByKeyId', {
|
||||
params: {
|
||||
keyId: id,
|
||||
type: type,
|
||||
referenceName: ''
|
||||
}
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
console.log('rrrrressssz', res.data)
|
||||
this.relateApplicationResourceVisible = true
|
||||
this.relationData = {
|
||||
id: id,
|
||||
linkType: '1',
|
||||
responseData: res.data
|
||||
}
|
||||
this.topNameArray = ['未关联组件名称', '已关联组件名称']
|
||||
console.log(' this.relationData', this.relationData)
|
||||
// 将数据传递给引入的组件
|
||||
})
|
||||
},
|
||||
// 应用与数据资源
|
||||
applyAndDataResource (val) {
|
||||
console.log('数据资源')
|
||||
},
|
||||
// 应用与项目
|
||||
applyAndProject (val) {
|
||||
const type = '项目'
|
||||
const id = val.id
|
||||
this.$http
|
||||
.get('/dataResourceRel/queryResourceRelByKeyId', {
|
||||
params: {
|
||||
keyId: id,
|
||||
type: type,
|
||||
referenceName: ''
|
||||
}
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
console.log('rrrrressssx', res.data)
|
||||
this.relateApplicationResourceVisible = true
|
||||
this.relationData = {
|
||||
id: id,
|
||||
linkType: '1',
|
||||
responseData: res.data
|
||||
}
|
||||
this.topNameArray = ['未关联项目名称', '已关联项目名称']
|
||||
// 将数据传递给引入的组件
|
||||
})
|
||||
},
|
||||
// 应用与基础设施
|
||||
applyAndInfrastructure (val) {
|
||||
const type = '基础设施'
|
||||
const id = val.id
|
||||
this.$http
|
||||
.get('/dataResourceRel/queryResourceRelByKeyId', {
|
||||
params: {
|
||||
keyId: id,
|
||||
type: type,
|
||||
referenceName: ''
|
||||
}
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
console.log('rrrrressssj', res.data)
|
||||
this.relateApplicationResourceVisible = true
|
||||
this.relationData = {
|
||||
id: id,
|
||||
linkType: '1',
|
||||
responseData: res.data
|
||||
}
|
||||
this.topNameArray = ['未关联基础设施名称', '已关联基础设施名称']
|
||||
// 将数据传递给引入的组件
|
||||
})
|
||||
},
|
||||
// 是否展示关联应用弹窗
|
||||
handleIsShowRelatePopupApply (type) {
|
||||
this.relateApplicationResourceVisible = type
|
||||
},
|
||||
// 新上架
|
||||
clear () {
|
||||
this.notFilled = []
|
||||
this.showPutOnTheShelfFlag2 = false
|
||||
this.insertList = []
|
||||
this.putOnTheShelfList = []
|
||||
this.radio = '应用资源'
|
||||
this.submitFrom = {
|
||||
type: '应用资源',
|
||||
deptId: '',
|
||||
delFlag: 0,
|
||||
infoList: [
|
||||
// {
|
||||
// attrType: '组件类型',
|
||||
// attrValue: '',
|
||||
// delFlag: 0
|
||||
// }
|
||||
]
|
||||
}
|
||||
this.reset()
|
||||
},
|
||||
// 上架
|
||||
showPutOnTheShelf () {
|
||||
this.showPutOnTheShelfFlag2 = true
|
||||
this.$http.get('/category/getCategoryTree').then(res => {
|
||||
this.insertList = res.data.data.filter(item => item.name === '应用资源一')[0]
|
||||
console.log(this.insertList, this, this.radio, 'hhhhhhhhhhh')
|
||||
this.putOnTheShelfList = this.insertList.children
|
||||
})
|
||||
},
|
||||
changeInfoList (obj) {
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.filter((item) => item.attrType !== obj.attrType)
|
||||
this.submitFrom.infoList.push(obj)
|
||||
},
|
||||
submitData () {
|
||||
const arr = []
|
||||
this.putOnTheShelfList.map(item => {
|
||||
item.children.map(child => {
|
||||
if (child.children) {
|
||||
if (child.name === '算法优势' || child.name === '应用场景' || child.name === '功能介绍') {
|
||||
arr.push(child.name)
|
||||
if (this.submitFrom.infoList.filter(value => value.attrType === child.name).length === 0) {
|
||||
this.submitFrom.infoList.push({
|
||||
attrType: child.name,
|
||||
attrValue: child.note1,
|
||||
delFlag: 0
|
||||
})
|
||||
}
|
||||
}
|
||||
child.children.map(val => {
|
||||
arr.push(val.name)
|
||||
if (val.type === 'input' || val.type === 'textArea' || val.type === 'select' || val.type === 'checkBox' || val.type === 'radio') {
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.filter((item) => item.attrType !== val.name)
|
||||
}
|
||||
if (val.note1 || val.note1) {
|
||||
switch (val.name) {
|
||||
case '算法名称':
|
||||
case '应用名称':
|
||||
case '组件名称':
|
||||
case '图层名称':
|
||||
this.submitFrom.name = val.note1
|
||||
break
|
||||
case '算法描述':
|
||||
case '应用描述':
|
||||
case '组件描述':
|
||||
case '图层描述':
|
||||
this.submitFrom.description = val.note1
|
||||
break
|
||||
case '共享条件':
|
||||
this.submitFrom.shareCondition = val.note1
|
||||
break
|
||||
case '共享类型':
|
||||
this.submitFrom.shareType = val.note1
|
||||
break
|
||||
case '服务接口':
|
||||
this.submitFrom.apiUrl = val.note1
|
||||
break
|
||||
case '接口请求方式':
|
||||
this.submitFrom.apiMethodType = val.note1
|
||||
break
|
||||
case '访问地址':
|
||||
this.submitFrom.link = val.note1
|
||||
break
|
||||
case '部门联系人':
|
||||
this.submitFrom.deptContacts = val.note1
|
||||
break
|
||||
case '部门联系人电话':
|
||||
this.submitFrom.deptPhone = val.note1
|
||||
break
|
||||
case '归属部门':
|
||||
this.submitFrom.deptId = val.note1
|
||||
break
|
||||
case '能力类型':
|
||||
this.submitFrom.type = val.note1
|
||||
break
|
||||
default:
|
||||
if (val.type !== 'image' && val.type !== 'file' && val.type !== 'video') {
|
||||
this.submitFrom.infoList.push({
|
||||
attrType: val.name,
|
||||
attrValue: val.note1,
|
||||
delFlag: 0
|
||||
})
|
||||
fullScreen () {
|
||||
if (window.outerHeight === screen.availHeight) {
|
||||
if (window.outerWidth === screen.availWidth) {
|
||||
console.log(
|
||||
'全屏1',
|
||||
window.outerHeight,
|
||||
screen.availHeight,
|
||||
window.outerWidth,
|
||||
screen.availWidth
|
||||
)
|
||||
this.qp = false
|
||||
} else {
|
||||
if (this.submitFrom.infoList.filter(value => value.attrType === val.name).length === 0) {
|
||||
this.submitFrom.infoList.push({
|
||||
attrType: val.name,
|
||||
attrValue: val.note1,
|
||||
delFlag: 0,
|
||||
note2: val.note2 || null
|
||||
})
|
||||
}
|
||||
}
|
||||
break
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.sort((a, b) => arr.indexOf(a.attrType) - arr.indexOf(b.attrType))
|
||||
this.notFilled = []
|
||||
console.log(this.submitFrom, '表单验证')
|
||||
if (!this.submitFrom.name) {
|
||||
this.notFilled.push('应用名称')
|
||||
}
|
||||
if (!this.submitFrom.description) {
|
||||
this.notFilled.push('应用描述')
|
||||
}
|
||||
if (!this.submitFrom.shareCondition) {
|
||||
this.notFilled.push('共享条件')
|
||||
}
|
||||
if (!this.submitFrom.deptId) {
|
||||
this.notFilled.push('归属部门')
|
||||
}
|
||||
if (!this.submitFrom.deptContacts) {
|
||||
this.notFilled.push('部门联系人')
|
||||
}
|
||||
if (!this.submitFrom.deptPhone) {
|
||||
this.notFilled.push('部门联系人电话')
|
||||
}
|
||||
if (!this.submitFrom.infoList.filter(val => val.attrType == '应用领域')[0] || !this.submitFrom.infoList.filter(val => val.attrType == '应用领域')[0].attrValue) {
|
||||
this.notFilled.push('应用领域')
|
||||
}
|
||||
// if (!this.submitFrom.infoList.filter(val => val.attrType == '应用状态')[0] || !this.submitFrom.infoList.filter(val => val.attrType == '应用状态')[0].attrValue) {
|
||||
// this.notFilled.push('应用状态')
|
||||
// }
|
||||
if (!this.submitFrom.infoList.filter(val => val.attrType == '应用类型')[0] || !this.submitFrom.infoList.filter(val => val.attrType == '应用类型')[0].attrValue) {
|
||||
this.notFilled.push('应用类型')
|
||||
}
|
||||
if (this.notFilled.length > 0) {
|
||||
this.$message({
|
||||
message: '请填写必填字段！',
|
||||
type: 'warning'
|
||||
})
|
||||
} else {
|
||||
if (this.submitFrom.id) {
|
||||
// 解决编辑无组件类型
|
||||
this.submitFrom.infoList.map(val => {
|
||||
if (val.attrType === '组件类型') {
|
||||
val.attrValue = this.radio
|
||||
}
|
||||
})
|
||||
console.log('编辑===============>', this.submitFrom)
|
||||
// 检验是否有空值
|
||||
this.submitFrom.infoList = this.submitFrom.infoList.filter(item => item.attrValue)
|
||||
this.$http
|
||||
.put('/resource/update', this.submitFrom)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
this.$message.error('修改失败!')
|
||||
this.showPutOnTheShelfFlag2 = false
|
||||
} else {
|
||||
this.$message.success('修改成功！')
|
||||
this.showPutOnTheShelfFlag2 = false
|
||||
this.clear()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
} else {
|
||||
this.$http
|
||||
.post('/resource/insert?source= b', this.submitFrom)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
this.$message.error('上架失败!')
|
||||
this.showPutOnTheShelfFlag2 = false
|
||||
} else {
|
||||
this.$message.success('上架成功！')
|
||||
this.showPutOnTheShelfFlag2 = false
|
||||
this.clear()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 新修改
|
||||
UpdateData (item) {
|
||||
this.$http.get('/category/getCategoryTree').then(res => {
|
||||
this.insertList = res.data.data.filter(item => item.name === '应用资源一')[0]
|
||||
this.radio = '应用资源'
|
||||
// this.radio = item.infoList.filter(val => val.attrType === '应用资源')[0].attrValue
|
||||
this.putOnTheShelfList = this.insertList.children
|
||||
// this.putOnTheShelfList = this.insertList.children.filter(item => item.name === this.radio)[0].children
|
||||
this.putOnTheShelfList.map(parent => {
|
||||
parent.children.map(child => {
|
||||
if (child.name === '算法优势' || child.name === '应用场景' || child.name === '功能介绍') {
|
||||
const obj = item.infoList.filter(val => val.attrType === child.name)[0]
|
||||
if (obj) {
|
||||
child.note1 = obj.attrValue
|
||||
console.log(
|
||||
'不是全屏2',
|
||||
window.outerHeight,
|
||||
screen.availHeight,
|
||||
window.outerWidth,
|
||||
screen.availWidth
|
||||
)
|
||||
this.qp = true
|
||||
}
|
||||
} else {
|
||||
if (child.children) {
|
||||
child.children.map(data => {
|
||||
if (data.name === '计费标准信息' || data.name === '常见问题') {
|
||||
const obj = item.infoList.filter(val => val.attrType === child.name)[0]
|
||||
if (obj) {
|
||||
data.note1 = obj.attrValue
|
||||
console.log(
|
||||
'不是全屏3',
|
||||
window.outerHeight,
|
||||
screen.availHeight,
|
||||
window.outerWidth,
|
||||
screen.availWidth
|
||||
)
|
||||
this.qp = true
|
||||
}
|
||||
} else {
|
||||
switch (data.name) {
|
||||
case '算法名称':
|
||||
case '应用名称':
|
||||
case '组件名称':
|
||||
case '图层名称':
|
||||
data.note1 = item.name
|
||||
break
|
||||
case '算法描述':
|
||||
case '应用描述':
|
||||
case '组件描述':
|
||||
case '图层描述':
|
||||
data.note1 = item.description
|
||||
break
|
||||
case '共享条件':
|
||||
data.note1 = item.shareCondition
|
||||
break
|
||||
case '共享类型':
|
||||
data.note1 = item.shareType
|
||||
break
|
||||
case '服务接口':
|
||||
data.note1 = item.apiUrl
|
||||
break
|
||||
case '接口请求方式':
|
||||
data.note1 = item.apiMethodType
|
||||
break
|
||||
case '访问地址':
|
||||
data.note1 = item.link
|
||||
break
|
||||
case '部门联系人':
|
||||
data.note1 = item.deptContacts
|
||||
break
|
||||
case '部门联系人电话':
|
||||
data.note1 = item.deptPhone
|
||||
break
|
||||
case '归属部门':
|
||||
data.note1 = item.deptId
|
||||
break
|
||||
case '能力类型':
|
||||
data.note1 = item.type
|
||||
break
|
||||
default:
|
||||
// eslint-disable-next-line no-case-declarations
|
||||
const obj1 = item.infoList.filter(val => val.attrType === data.name)[0]
|
||||
if (obj1) {
|
||||
data.note1 = obj1.attrValue
|
||||
}
|
||||
break
|
||||
}
|
||||
if (data.type === 'image' || data.type === 'file' || data.type === 'video') {
|
||||
const obj1 = item.infoList.filter(val => val.attrType === data.name)[0]
|
||||
if (obj1) {
|
||||
data.note2 = obj1.note2
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
this.submitFrom.id = item.id
|
||||
this.showPutOnTheShelfFlag2 = true
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -839,7 +303,4 @@ export default {
|
|||
.el-tooltip__popper {
|
||||
max-width: 50%;
|
||||
}
|
||||
::v-deep .el-upload-list__item-name {
|
||||
width: 400px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
{{ this.$route.meta.type }}
|
||||
<div class="mod-ability__bsabilityvideo">
|
||||
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
|
||||
<el-form-item>
|
||||
|
|
|
|||
|
|
@ -1,114 +0,0 @@
|
|||
<!-- 数据资源目录编制 /bscatalogue/dataResources -->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-pay__order">
|
||||
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
|
||||
<el-form-item>
|
||||
<ren-select v-model="dataForm.status" dict-type="category" :placeholder="$t('dataresources.componentType')"></ren-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input v-model="dataForm.orderId" :placeholder="$t('dataresources.componentName')" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-date-picker v-model="dataForm.applydate" value-format="yyyy-MM-dd" type="date" :placeholder="$t('dataresources.putOnDate')" clearable></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="resetDataList()">{{ $t('reset') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
|
||||
<el-table-column prop="productName" :label="$t('dataresources.resourcesName')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="orderId" :label="$t('dataresources.resourcesCode')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="payAmount" :label="$t('dataresources.resourcesProvide')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="status" :label="$t('dataresources.resourcesAbstract')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="payAt" :label="$t('dataresources.putOnDate')" 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="primary" @click="showRelateApplication(scope.row)">{{ $t('dataresources.associatedApplication') }}</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>
|
||||
<!-- 弹窗, 新增 / 修改 -->
|
||||
<!-- <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> -->
|
||||
<relate-application v-if="relateApplicationVisible" ref="relateApplication" :relateInfo="relateInfo" @isShowRelatePopup="handleIsShowRelatePopup"></relate-application>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mixinViewModule from '@/mixins/view-module'
|
||||
// import AddOrUpdate from './order-add-or-update'
|
||||
import { addDynamicRoute } from '@/router'
|
||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
||||
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
data () {
|
||||
return {
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: '/pay/order/page',
|
||||
getDataListIsPage: true,
|
||||
deleteURL: '/pay/order',
|
||||
deleteIsBatch: true
|
||||
},
|
||||
dataForm: {
|
||||
orderId: '',
|
||||
status: '',
|
||||
userId: ''
|
||||
},
|
||||
// 关联应用弹窗
|
||||
relateApplicationVisible: false,
|
||||
relateInfo: {
|
||||
id: '',
|
||||
responseData: {},
|
||||
linkType: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
// AddOrUpdate,
|
||||
RelateApplication
|
||||
},
|
||||
methods: {
|
||||
// 重置
|
||||
resetDataList () {
|
||||
this.dataForm = {
|
||||
orderId: '',
|
||||
status: '',
|
||||
userId: ''
|
||||
},
|
||||
this.page = 1 // 当前页码
|
||||
this.query()
|
||||
},
|
||||
// 点击关联应用按钮
|
||||
showRelateApplication (row) {
|
||||
this.$http.get(`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`).then(({ data: res }) => {
|
||||
if (res && res.data) {
|
||||
this.relateApplicationVisible = true
|
||||
this.relateInfo = {
|
||||
id: row.id,
|
||||
responseData: res.data,
|
||||
linkType: '2'
|
||||
}
|
||||
}
|
||||
}).catch(() => { })
|
||||
},
|
||||
// 是否展示关联应用弹窗
|
||||
handleIsShowRelatePopup (type) {
|
||||
this.relateApplicationVisible = type
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,107 +0,0 @@
|
|||
<!-- 基础设施目录编制 /bscatalogue/infrastructure -->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-pay__order">
|
||||
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
|
||||
<el-form-item>
|
||||
<ren-select v-model="dataForm.status" dict-type="resourceType" :placeholder="$t('infrastructure.resourceCategory')"></ren-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input v-model="dataForm.orderId" :placeholder="$t('infrastructure.resourceName')" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="resetDataList()">{{ $t('reset') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
|
||||
<el-table-column prop="orderId" :label="$t('infrastructure.resourceName')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="productName" :label="$t('infrastructure.district')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="payAmount" :label="$t('infrastructure.street')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="status" :label="$t('infrastructure.department')" 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="primary" @click="showRelateApplication(scope.row)">{{ $t('infrastructure.associatedApplication') }}</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>
|
||||
<!-- 弹窗, 新增 / 修改 -->
|
||||
<!-- <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> -->
|
||||
<relate-application v-if="relateApplicationVisible" ref="relateApplication" :relateInfo="relateInfo" @isShowRelatePopup="handleIsShowRelatePopup"></relate-application>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mixinViewModule from '@/mixins/view-module'
|
||||
// import AddOrUpdate from './order-add-or-update'
|
||||
import { addDynamicRoute } from '@/router'
|
||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
data () {
|
||||
return {
|
||||
mixinViewModuleOptions: {
|
||||
getDataListURL: '/resource/page',
|
||||
getDataListIsPage: true,
|
||||
deleteURL: '',
|
||||
deleteIsBatch: true
|
||||
},
|
||||
dataForm: {
|
||||
orderId: '',
|
||||
status: '',
|
||||
userId: '',
|
||||
type: '基础设施'
|
||||
},
|
||||
// 关联应用弹窗
|
||||
relateApplicationVisible: false,
|
||||
relateInfo: {
|
||||
id: '',
|
||||
responseData: {},
|
||||
linkType: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
// AddOrUpdate,
|
||||
RelateApplication
|
||||
},
|
||||
methods: {
|
||||
// 重置
|
||||
resetDataList () {
|
||||
this.dataForm.orderId = ''
|
||||
this.page = 1 // 当前页码
|
||||
this.query()
|
||||
},
|
||||
// 点击关联应用按钮
|
||||
showRelateApplication (row) {
|
||||
this.$http.get(`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`).then(({ data: res }) => {
|
||||
if (res && res.data) {
|
||||
this.relateApplicationVisible = true
|
||||
this.relateInfo = {
|
||||
id: row.id,
|
||||
responseData: res.data,
|
||||
linkType: '2'
|
||||
}
|
||||
}
|
||||
}).catch(() => { })
|
||||
},
|
||||
// 是否展示关联应用弹窗
|
||||
handleIsShowRelatePopup (type) {
|
||||
this.relateApplicationVisible = type
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,475 +0,0 @@
|
|||
<template>
|
||||
<div class="ability-box">
|
||||
<div class="top">
|
||||
<div class="type">{{ type }}</div>
|
||||
<el-button type="primary" size="small" @click="clickOpen">添加</el-button>
|
||||
</div>
|
||||
|
||||
<el-dialog :visible.sync="showModal" title="请选择" @close="close" :close-on-click-modal="false"
|
||||
:close-on-press-escape="false" :key="showKey" append-to-body>
|
||||
<div class="relate-application-content" v-if="type==='组件服务'">
|
||||
<el-transfer v-model="selectedArray" filterable :filter-method="filterMethod" filter-placeholder="请输入名称"
|
||||
:titles="nameArray" :props="{
|
||||
key: 'id',
|
||||
label: 'name',
|
||||
}" :data="transferData">
|
||||
</el-transfer>
|
||||
</div>
|
||||
<div v-else-if="type==='数据资源'" class="dataTransfer">
|
||||
<el-transfer v-model="selectedArray" filter-placeholder="请输入名称"
|
||||
:titles="nameArray" :props="{
|
||||
key: 'id',
|
||||
label: 'name',
|
||||
}" :data="transferData">
|
||||
</el-transfer>
|
||||
<el-input
|
||||
v-model="searchValue"
|
||||
placeholder="请输入名称"
|
||||
></el-input>
|
||||
<el-button @click="rest" class="restClick">重置</el-button>
|
||||
</div>
|
||||
<el-pagination
|
||||
v-if="type==='数据资源'"
|
||||
:current-page="currentPage"
|
||||
:page-size="15"
|
||||
layout="total, prev, pager, next"
|
||||
:total="total"
|
||||
@current-change="pageCurrentChangeHandle"
|
||||
>
|
||||
</el-pagination>
|
||||
<template slot="footer">
|
||||
<el-button @click="showModal = false">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="confirmSubmitHandle()">{{
|
||||
$t("confirm")
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<DisplayList :displayList="displayList" showKey="name"></DisplayList>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import InfrastructureModal from '../assignedScene/components/infrastructure-modal.vue'
|
||||
import DisplayList from '../assignedScene/components/display-list.vue'
|
||||
|
||||
const sjzyArray = [
|
||||
{
|
||||
zyname: '城阳区图书馆总分馆、社区图书室明细信息',
|
||||
sjcczl: 0.02,
|
||||
zycode: '307013110716000007',
|
||||
ygxjghjls: 0,
|
||||
jghxxjlzs: 0,
|
||||
neibukeshi: '',
|
||||
xgxt: '城阳区图书馆及总分馆、社区图书室明细信息',
|
||||
ygxdsjccl: 0,
|
||||
zygszl: 'et',
|
||||
ykfjghjls: 0,
|
||||
syqk: 0,
|
||||
zyformat: '电子表格',
|
||||
guid: '277c51e0-066b-441d-9262-6e53ce6fc99a',
|
||||
TGBM: '城阳区文化和旅游局',
|
||||
ykfdsjccl: 0
|
||||
},
|
||||
{
|
||||
zyname: '2021年度西海岸新区科技型中小企业名单信息',
|
||||
sjcczl: 0,
|
||||
zycode: '307013109000000010',
|
||||
ygxjghjls: 0,
|
||||
jghxxjlzs: 0,
|
||||
neibukeshi: '高新技术科',
|
||||
xgxt: '2021年度西海岸新区科技型中小企业名单信息，企业名称，入库编号。',
|
||||
ygxdsjccl: 0,
|
||||
zygszl: 'access',
|
||||
ykfjghjls: 0,
|
||||
syqk: 0,
|
||||
zyformat: '数据库',
|
||||
guid: '6ed1a478-443a-48ee-8af0-4c7ac2681a94',
|
||||
TGBM: '青岛西海岸新区工业和信息化局（区科技局、区大数据局）',
|
||||
ykfdsjccl: 0
|
||||
},
|
||||
{
|
||||
zyname: '西海岸新区高新技术企业名单信息',
|
||||
sjcczl: 0,
|
||||
zycode: '307013109000000012',
|
||||
ygxjghjls: 0,
|
||||
jghxxjlzs: 0,
|
||||
neibukeshi: '高新技术科',
|
||||
xgxt: '西海岸新区高新技术企业名单信息',
|
||||
ygxdsjccl: 0,
|
||||
zygszl: 'access',
|
||||
ykfjghjls: 0,
|
||||
syqk: 0,
|
||||
zyformat: '数据库',
|
||||
guid: '770a9127-e7fd-4a6b-ba17-c80cf06ab670',
|
||||
TGBM: '青岛西海岸新区工业和信息化局（区科技局、区大数据局）',
|
||||
ykfdsjccl: 0
|
||||
},
|
||||
{
|
||||
zyname: '西海岸新区高新技术企业认定补助名单信息',
|
||||
sjcczl: 0,
|
||||
zycode: '307013109000000011',
|
||||
ygxjghjls: 0,
|
||||
jghxxjlzs: 0,
|
||||
neibukeshi: '高新技术科',
|
||||
xgxt: '西海岸新区高新技术企业认定补助名单信息，企业名称、扶持项目。',
|
||||
ygxdsjccl: 0,
|
||||
zygszl: 'access',
|
||||
ykfjghjls: 0,
|
||||
syqk: 0,
|
||||
zyformat: '数据库',
|
||||
guid: 'ae52c5f8-ef6e-4ae9-a657-79dcb6f65643',
|
||||
TGBM: '青岛西海岸新区工业和信息化局（区科技局、区大数据局）',
|
||||
ykfdsjccl: 0
|
||||
},
|
||||
{
|
||||
zyname: '青岛西海岸新区第六批区级非物质文化遗产代表性项目名录',
|
||||
sjcczl: 0,
|
||||
zycode: '307013109026000037',
|
||||
ygxjghjls: 0,
|
||||
jghxxjlzs: 0,
|
||||
neibukeshi: '艺术科',
|
||||
xgxt: '青岛西海岸新区第六批区级非物质文化遗产代表性项目名录，如项目类别、序号、项目名称、申报单位',
|
||||
ygxdsjccl: 0,
|
||||
zygszl: 'et',
|
||||
ykfjghjls: 0,
|
||||
syqk: 0,
|
||||
zyformat: '电子表格',
|
||||
guid: '6d80a3b1-744e-4292-a904-0168d640b1fc',
|
||||
TGBM: '青岛西海岸新区文化和旅游局（区新闻出版广电局、区文物局）',
|
||||
ykfdsjccl: 0
|
||||
}
|
||||
]
|
||||
|
||||
const res = {
|
||||
code: 0,
|
||||
msg: 'success',
|
||||
data: {
|
||||
PageCount: '2115',
|
||||
data: sjzyArray,
|
||||
rows: '10573'
|
||||
}
|
||||
}
|
||||
|
||||
const keyObj = {
|
||||
"数据资源": {
|
||||
idKey: 'id',
|
||||
nameKey: 'name'
|
||||
},
|
||||
"组件服务": {
|
||||
idKey: 'id',
|
||||
nameKey: 'name'
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
nameArray: {
|
||||
type: Array,
|
||||
default: () => ['未选择名称', '已选择名称']
|
||||
},
|
||||
// 最多选择的数据个数
|
||||
maxNum: {
|
||||
type: Number,
|
||||
default: 10
|
||||
},
|
||||
getDataParams: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
methods: 'get',
|
||||
url: '',
|
||||
postData: {}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
showKey: 0,
|
||||
showModal: false,
|
||||
transferData: [],
|
||||
selectedArray: [],
|
||||
allData: [],
|
||||
displayList: [], // 用于展示的list
|
||||
total: 0,
|
||||
currentPage: 1,
|
||||
newNum: 1,
|
||||
searchValue: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
showModal (newVal) {
|
||||
if (newVal) {
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
newNum (newVal) {
|
||||
if (newVal) {
|
||||
this.getDataParams.postData.pageNum = newVal
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
searchValue (newVal) {
|
||||
if (newVal) {
|
||||
this.getDataParams.postData.serviceName = newVal
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getDataInfo (dataForm) {
|
||||
await this.getData()
|
||||
const arr = []
|
||||
const attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type)
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(val => {
|
||||
const _obj = {
|
||||
type: val.type,
|
||||
id: val.resourceId,
|
||||
name: val.resource && val.resource.name
|
||||
}
|
||||
arr.push(_obj)
|
||||
})
|
||||
}
|
||||
|
||||
// 展示
|
||||
this.displayList = JSON.parse(JSON.stringify(arr))
|
||||
// 已选中
|
||||
this.selectedArray = arr.map(v => v.id)
|
||||
this.$nextTick(() => {
|
||||
console.log(999, this.displayList)
|
||||
})
|
||||
},
|
||||
// 获取列表
|
||||
getData () {
|
||||
if (this.getDataParams.url === '') {
|
||||
return
|
||||
}
|
||||
if (this.type === '组件服务') {
|
||||
this.$http[this.getDataParams.methods](this.getDataParams.url, {
|
||||
params: this.getDataParams.postData
|
||||
}).then(res => {
|
||||
console.log('res.data----获取列表-------->', res.data)
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.transferData = []
|
||||
this.allData = [];
|
||||
(res.data.data || []).map(v => {
|
||||
this.transferData.push({
|
||||
type: this.type,
|
||||
id: v[keyObj[this.type].idKey],
|
||||
name: v[keyObj[this.type].nameKey] || '--'
|
||||
})
|
||||
})
|
||||
this.allData = JSON.parse(JSON.stringify(this.transferData))
|
||||
console.log(this.allData, 'this.transferData')
|
||||
}).catch(err => {
|
||||
this.$message.error(err)
|
||||
})
|
||||
} else if (this.type === '数据资源') {
|
||||
this.getDataParams.postData.pageNum = this.newNum
|
||||
this.$http[this.getDataParams.methods](this.getDataParams.url,
|
||||
this.getDataParams.postData
|
||||
).then(res => {
|
||||
console.log('res.data----获取列表-------->', res.data)
|
||||
this.total = Number(res.data.data.rows)
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.transferData = []
|
||||
this.allData = [];
|
||||
(res.data.data.data || []).map(v => {
|
||||
this.transferData.push({
|
||||
type: this.type,
|
||||
id: v.guid,
|
||||
name: v.zyname || '--'
|
||||
})
|
||||
})
|
||||
this.allData = JSON.parse(JSON.stringify(this.transferData))
|
||||
}).catch(err => {
|
||||
this.$message.error(err)
|
||||
})
|
||||
}
|
||||
},
|
||||
filterMethod (query, item) {
|
||||
console.log('1111111111111111111111111')
|
||||
return item.name && item.name.indexOf(query) > -1
|
||||
},
|
||||
confirmSubmitHandle () {
|
||||
if (this.selectedArray.length > this.maxNum) {
|
||||
return this.$message.error('最多选择十条数据！')
|
||||
}
|
||||
this.showModal = false
|
||||
this.displayList = []
|
||||
this.allData.map(v => {
|
||||
if (this.selectedArray.includes(v.id)) {
|
||||
this.displayList.push(v)
|
||||
}
|
||||
})
|
||||
this.$emit('update', {
|
||||
title: this.type,
|
||||
list: this.selectedArray
|
||||
})
|
||||
},
|
||||
getDisplay (displayList) {
|
||||
this.displayList = []
|
||||
this.displayList = displayList
|
||||
},
|
||||
close () {
|
||||
this.showModal = false
|
||||
// this.selectedArray = []
|
||||
this.allData = []
|
||||
this.transferData = []
|
||||
},
|
||||
pageCurrentChangeHandle (val) {
|
||||
console.log(this.newNum, val, 'wowowo')
|
||||
this.newNum = val
|
||||
},
|
||||
clickOpen () {
|
||||
this.searchValue = ''
|
||||
this.getDataParams.postData.serviceName = ''
|
||||
this.currentPage = 1
|
||||
this.showModal = true
|
||||
this.getData()
|
||||
},
|
||||
rest () {
|
||||
this.currentPage = 1
|
||||
this.searchValue = ''
|
||||
this.getDataParams.postData.serviceName = ''
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
components: { InfrastructureModal, DisplayList },
|
||||
mounted () {
|
||||
console.log(this.type, 'this.type')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.ability-box {
|
||||
margin-bottom: 10px;
|
||||
|
||||
.show-box {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.type {
|
||||
padding-right: 12px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 100px;
|
||||
box-sizing: border-box;
|
||||
text-align: right;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.list-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
margin-left: 100px;
|
||||
}
|
||||
|
||||
.list-item {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
width: 380px;
|
||||
text-align: left;
|
||||
margin-right: 10px;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__body {
|
||||
height: 580px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox-button__inner {
|
||||
width: 130px;
|
||||
margin: 0 10px 5px;
|
||||
border-left: unset !important;
|
||||
border-radius: unset !important;
|
||||
border: 1px solid #dcdfe6 !important;
|
||||
}
|
||||
|
||||
.relate-application-content {
|
||||
height: 100%;
|
||||
|
||||
::v-deep .el-transfer {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel {
|
||||
width: 39.5%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel__body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel__list.is-filterable {
|
||||
height: calc(100% - 102px);
|
||||
}
|
||||
}
|
||||
.dataTransfer {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
::v-deep .el-transfer {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel {
|
||||
width: 39.5%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
::v-deep .el-transfer-panel__body {
|
||||
height: 100%;
|
||||
}
|
||||
::v-deep .el-transfer-panel__list {
|
||||
height: calc(100% - 102px);
|
||||
margin-top: 4rem;
|
||||
}
|
||||
::v-deep .el-input {
|
||||
position: absolute;
|
||||
font-size: 14px;
|
||||
display: inline-block;
|
||||
width: 30%;
|
||||
top: 52px;
|
||||
left: 12px;
|
||||
}
|
||||
.restClick {
|
||||
position: absolute;
|
||||
top: 52px;
|
||||
left: 284px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,133 +0,0 @@
|
|||
<template>
|
||||
<div class="question-box">
|
||||
<div class="title">
|
||||
{{ title }}
|
||||
</div>
|
||||
<div v-for="(item, index) in dataInfo" :key="index">
|
||||
<el-form-item :label="keyTextObj.nameObj.text">
|
||||
<el-input v-model="item[keyTextObj.nameObj.key]" :placeholder="`请输入${keyTextObj.nameObj.text}`"
|
||||
style="width:90%">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="keyTextObj.descObj.text">
|
||||
<el-input type="textarea" :rows="2" v-model="item[keyTextObj.descObj.key]"
|
||||
:placeholder="`请输入${keyTextObj.descObj.text}`" style="width:90%">
|
||||
</el-input>
|
||||
<el-button style="margin-left:10px" @click="deleteItem(index)" type="danger" size="small"
|
||||
v-if="dataInfo.length > 1">删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-button class="add-btn" size="small" v-if="index == dataInfo.length - 1" @click="addItem" type="primary">
|
||||
添加
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
dataForm: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '常见问题'
|
||||
},
|
||||
keyTextObj: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
nameObj: {
|
||||
text: '问题名称',
|
||||
key: 'question'
|
||||
},
|
||||
descObj: {
|
||||
text: '问题描述',
|
||||
key: 'answer'
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataInfo: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataInfo: {
|
||||
handler(newVal) {
|
||||
this.dataInfo = newVal;
|
||||
this.$emit('update', {
|
||||
title: this.title,
|
||||
list: newVal
|
||||
})
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getDataInfo(dataForm) {
|
||||
let arr = []
|
||||
if (dataForm && (dataForm.id || dataForm.id === 0)) {
|
||||
let fuseAttrList = dataForm.fuseAttrList || [];
|
||||
let obj = fuseAttrList.find(v => v.attrType === this.title) || {}
|
||||
let attrValue = JSON.parse(obj.attrValue || "[]")
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(v => {
|
||||
arr.push({
|
||||
[this.keyTextObj.nameObj.key]: v[this.keyTextObj.nameObj.key],
|
||||
[this.keyTextObj.descObj.key]: v[this.keyTextObj.descObj.key],
|
||||
})
|
||||
})
|
||||
} else {
|
||||
arr = []
|
||||
arr.push({
|
||||
[this.keyTextObj.nameObj.key]: '',
|
||||
[this.keyTextObj.descObj.key]: '',
|
||||
})
|
||||
}
|
||||
} else {
|
||||
arr = []
|
||||
arr.push({
|
||||
[this.keyTextObj.nameObj.key]: '',
|
||||
[this.keyTextObj.descObj.key]: '',
|
||||
})
|
||||
}
|
||||
this.dataInfo = arr;
|
||||
},
|
||||
// 新增
|
||||
addItem() {
|
||||
let index = this.dataInfo.length - 1;
|
||||
if (this.dataInfo[index][this.keyTextObj.nameObj.key] === '' || this.dataInfo[index][this.keyTextObj.descObj.key] === '') {
|
||||
return this.$message.warning('请填写完整信息！')
|
||||
}
|
||||
this.dataInfo.push({
|
||||
[this.keyTextObj.nameObj.key]: '',
|
||||
[this.keyTextObj.descObj.key]: '',
|
||||
})
|
||||
},
|
||||
// 删除
|
||||
deleteItem(list, index) {
|
||||
this.dataInfo.splice(index, 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.question-box {
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.add-btn {
|
||||
margin-top: -12px;
|
||||
margin-left: 100px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,178 +0,0 @@
|
|||
<!-- 融合服务--组合能力 -->
|
||||
<template>
|
||||
<div class="content-box">
|
||||
<div class="title">
|
||||
{{ title }}
|
||||
</div>
|
||||
<div class="no-data loading-box" v-loading="loading" v-if="loading">
|
||||
</div>
|
||||
<div v-if="!loading">
|
||||
<div v-for="(item, index) in dataInfo" :key="index">
|
||||
<el-form-item label="能力类别" prop="">
|
||||
<el-select v-model="item.type" placeholder="请选择能力类别" @change="(data) => filterSelect(data, item)"
|
||||
:disabled="disabledType">
|
||||
<el-option v-for="val in typeOptions" :key="val.value" :label="val.value" :value="val.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select class="ability-input" style="margin-left: 20px;max-width:530px" v-model="item.resourceId"
|
||||
placeholder="请选择能力" filterable :disabled="disabledType">
|
||||
<el-option style="max-width:530px" v-for="val in item.abilityOptions" :key="val.id"
|
||||
:label="val.name || '--'" :value="val.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button style="margin-left:10px" @click="deleteItem(dataInfo, index)" type="danger" size="small"
|
||||
v-if="!disabledType && dataInfo.length > 1">删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-button style="margin-left:100px" size="small" v-if="!disabledType && index == dataInfo.length - 1"
|
||||
@click="addItem(dataInfo, 0)" type="primary">添加
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
dataForm: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '组合能力'
|
||||
},
|
||||
// 是否可编辑
|
||||
disabledType: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
typeOptions: [
|
||||
{
|
||||
value: '数据资源',
|
||||
},
|
||||
{
|
||||
value: '组件服务',
|
||||
},
|
||||
{
|
||||
value: '基础设施',
|
||||
},
|
||||
],
|
||||
dataInfo: [],
|
||||
abilityArrayCopy: [],
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataInfo: {
|
||||
handler(newVal) {
|
||||
this.dataInfo = newVal;
|
||||
let arr = newVal.map((v, index) => {
|
||||
return {
|
||||
sequence: index,
|
||||
resourceId: v.resourceId,
|
||||
}
|
||||
})
|
||||
this.$emit('update', {
|
||||
title: this.title,
|
||||
list: arr
|
||||
})
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
async getDataInfo(dataForm) {
|
||||
await this.getAbility()
|
||||
let arr = []
|
||||
let attrValue = dataForm.fuseResourceList || []
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(v => {
|
||||
let _obj = {
|
||||
type: v.resource && v.resource.type,
|
||||
resourceId: v.resourceId,
|
||||
}
|
||||
this.filterSelect(v.resource && v.resource.type, _obj)
|
||||
arr.push(_obj)
|
||||
})
|
||||
} else {
|
||||
arr = []
|
||||
arr.push({
|
||||
type: "",
|
||||
resourceId: "",
|
||||
abilityOptions: []
|
||||
})
|
||||
}
|
||||
this.dataInfo = arr;
|
||||
this.$nextTick(() => {
|
||||
console.log(999, this.dataInfo)
|
||||
})
|
||||
},
|
||||
// 新增
|
||||
addItem(list) {
|
||||
list.push({
|
||||
type: "",
|
||||
resourceId: "",
|
||||
abilityOptions: []
|
||||
})
|
||||
},
|
||||
// 删除
|
||||
deleteItem(list, index) {
|
||||
list.splice(index, 1)
|
||||
},
|
||||
// 获取能力
|
||||
getAbility() {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.abilityArrayCopy = []
|
||||
this.loading = true;
|
||||
this.$http.get(`/resource/list`, {}).then(({ data: res }) => {
|
||||
this.loading = false;
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.abilityArrayCopy = res.data || []
|
||||
resolve(res)
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error(err)
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
},
|
||||
filterSelect(type, item) {
|
||||
let arr = this.abilityArrayCopy.filter(v => v.type == type)
|
||||
let selectArray = this.dataInfo.map(v => v.resourceId) || [];
|
||||
// 过滤掉已选的
|
||||
item.abilityOptions = arr.filter(v => !selectArray.includes(v.id))
|
||||
console.log('abilityOptions------------>', item.abilityOptions);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content-box {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-box {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.ability-input {
|
||||
width: calc(100% - 300px);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,154 +0,0 @@
|
|||
<template>
|
||||
<el-dialog :visible.sync="isShow" :title="childName" :close-on-click-modal="false" :close-on-press-escape="false">
|
||||
<el-table
|
||||
border
|
||||
:data="tableData"
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
prop="id"
|
||||
label="主键id"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="fuseId"
|
||||
label="融合服务id"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
v-if="childName==='融合资源属性'"
|
||||
prop="attrType"
|
||||
label="属性类型"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
v-if="childName==='融合资源属性'"
|
||||
prop="attrValue"
|
||||
label="属性值"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
v-if="childName==='资源融合关系'"
|
||||
prop="resourceId"
|
||||
label="资源id"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
v-if="childName==='资源融合关系'"
|
||||
prop="sequence"
|
||||
label="资源挂载顺序"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
</el-table>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'quill/dist/quill.snow.css'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
childName: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// columns: {
|
||||
// type: Array,
|
||||
// default: function () {
|
||||
// return []
|
||||
// }
|
||||
// },
|
||||
tableData: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
methods: {
|
||||
show () {
|
||||
this.visible = true
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
cursor: pointer;
|
||||
}
|
||||
.detial-form ::v-deep {
|
||||
.el-form-item {
|
||||
margin-bottom: 0px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.el-form-item__label {
|
||||
line-height: 32px;
|
||||
}
|
||||
.el-form-item__content {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.mod-sys__menu {
|
||||
.menu-list,
|
||||
.icon-list {
|
||||
.el-input__inner,
|
||||
.el-input__suffix {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
&-icon-popover {
|
||||
width: 458px;
|
||||
overflow: hidden;
|
||||
}
|
||||
&-icon-inner {
|
||||
width: 478px;
|
||||
max-height: 258px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
&-icon-list {
|
||||
width: 458px;
|
||||
padding: 0;
|
||||
margin: -8px 0 0 -8px;
|
||||
> .el-button {
|
||||
padding: 8px;
|
||||
margin: 8px 0 0 8px;
|
||||
> span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -48,6 +48,8 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
onSuccess (res, file) {
|
||||
console.log('limit', this.limit)
|
||||
console.log(res, file, this.child)
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error('上传图片失败')
|
||||
}
|
||||
|
|
@ -86,8 +88,10 @@ export default {
|
|||
} else {
|
||||
this.child.note1 = arr.join(';')
|
||||
}
|
||||
console.log(this.child.note1)
|
||||
},
|
||||
onPreview (file) {
|
||||
console.log('点击预览===============>', file)
|
||||
window.open(file.response.data)
|
||||
},
|
||||
onExceed (files, fileList) {
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,557 +0,0 @@
|
|||
<template>
|
||||
<div class='container'>
|
||||
<div>
|
||||
<span class='title-style'>组件服务</span>
|
||||
<span class='page-introduction'>发布情况统计</span>
|
||||
<button class='back-btn' @click="backBtn">返回</button>
|
||||
</div>
|
||||
|
||||
<div class='container-body'>
|
||||
<div class='container-body1'>
|
||||
<span style='font-size:18px;color;#000000;'>评分发布情况</span>
|
||||
<div id="main1" style="width: 400px;height:200px;"></div>
|
||||
</div>
|
||||
<div class='container-body2'>
|
||||
<span style='font-size:18px;color;#000000;'>发布量情况分布</span>
|
||||
<div id="main2" style="width: 400px;height:200px;"></div>
|
||||
</div>
|
||||
<div class='container-body3'>
|
||||
<span style='font-size:18px;color;#000000;'>应用领域分布情况</span>
|
||||
<div id="main3" style="width: 400px;height:200px;"></div>
|
||||
</div>
|
||||
<div class='container-body4'>
|
||||
<div style='margin-bottom:30px'>
|
||||
<span style='font-size:18px;color;#000000;'>被调用组件及数量</span>
|
||||
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
|
||||
</div>
|
||||
<div v-for="(item,index) in usedList" :key='index' >
|
||||
<div style='display:flex'>
|
||||
<div class='ranking-img' :style="{background:colorList[index%5],width: widthList[index%5]}">
|
||||
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
|
||||
</div>
|
||||
<span class='num-style'>{{item.name}}</span>
|
||||
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.resourceCarNum}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='container-body5'>
|
||||
<div style='margin-bottom:30px'>
|
||||
<span style='font-size:18px;color;#000000;'>被申请组件及数量</span>
|
||||
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
|
||||
</div>
|
||||
<div v-for="(item,index) in applicationList" :key='index' >
|
||||
<div style='display:flex'>
|
||||
<div class='ranking-img' :style="{background:colorList[index%5],width: widthList[index%5]}">
|
||||
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
|
||||
</div>
|
||||
<span class='num-style'>{{item.name}}</span>
|
||||
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.resourceCarNum}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='footer'>
|
||||
<div class='footer-left' ></div>
|
||||
<span style='color:#b7c2d1;font-size:16px'>到底啦</span>
|
||||
<div class='footer-right'></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
export default {
|
||||
props:{
|
||||
tableId:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
fatherId:{
|
||||
type:Number,
|
||||
default:null,
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
data1:[],
|
||||
data2: [
|
||||
// { value: 1048,name: '算法' },
|
||||
// { value: 735, name: '图层' },
|
||||
// { nums: 580, attr_value: '开发' },
|
||||
// { nums: 484, attr_value: '业务' },
|
||||
],
|
||||
data3: [
|
||||
// { value: 1048,name: '算法' },
|
||||
],
|
||||
colorList:['linear-gradient(to right, rgba(251, 59, 5,0.6),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)','linear-gradient(to right,rgba(250, 179, 2,.6),transparent)','linear-gradient(to right,rgba(82, 106, 255,.6),transparent','linear-gradient(to right,rgba(82, 106, 255,.6),transparent)',],
|
||||
widthList:['90px','80px','70px','60px','50px'],
|
||||
numColorList:['#fc5656','#ff8a00','#f9af0a','#808fff','#808fff'],
|
||||
usedList:[{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称四',resourceCarNum:111},{name:'组件名称五',resourceCarNum:111},],
|
||||
applicationList:[{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称四',resourceCarNum:111},{name:'组件名称五',resourceCarNum:111},]
|
||||
}
|
||||
},
|
||||
created(){
|
||||
if(this.fatherId===1){
|
||||
this.getBeCalled()
|
||||
this.getBeApplied()
|
||||
this.getAlgorithm()
|
||||
this.getDistributed()
|
||||
this.getScoreList()
|
||||
}else{
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
|
||||
|
||||
},
|
||||
methods:{
|
||||
// 评分发布情况
|
||||
getScoreList () {
|
||||
this.$http.get('/census/center/v3/assemblerScoreInfo' ,{
|
||||
params : {
|
||||
id:this.tableId,
|
||||
resourceType:"应用资源"
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
let arry=[]
|
||||
arry=res.data.data
|
||||
arry.forEach((item)=>{
|
||||
|
||||
const single={
|
||||
value:item.scoreNum,
|
||||
name:item.score
|
||||
}
|
||||
// const newList=[]
|
||||
this.data1.push(single)
|
||||
// this.data2=newList
|
||||
this.myEcharts1()
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
// 算法图层开发业务
|
||||
getAlgorithm () {
|
||||
this.$http.get('/census/center/v3/assemblerUsedInfo' ,{
|
||||
params : {
|
||||
id:this.tableId,
|
||||
resourceType:"组件服务"
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
let arry=[]
|
||||
arry=res.data.data
|
||||
arry.forEach((item)=>{
|
||||
|
||||
const single={
|
||||
value:item.nums,
|
||||
name:item.attr_value
|
||||
}
|
||||
// const newList=[]
|
||||
this.data2.push(single)
|
||||
// this.data2=newList
|
||||
this.myEcharts2()
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
// 应用领域分布
|
||||
getDistributed () {
|
||||
this.$http.get('/census/center/v3/applicationAreaCapabilityList' ,{
|
||||
params : {
|
||||
id:this.tableId,
|
||||
resourceType:"应用资源"
|
||||
}
|
||||
}).then(res => {
|
||||
let arry=[]
|
||||
arry=res.data.data
|
||||
arry.forEach((item)=>{
|
||||
const single={
|
||||
value:item.total,
|
||||
name:item.type
|
||||
}
|
||||
const newList=[]
|
||||
this.data3.push(single)
|
||||
// this.data2=newList
|
||||
this.myEcharts3()
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
// 被调用组件及数量
|
||||
getBeCalled () {
|
||||
this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
|
||||
params : {
|
||||
id:this.tableId,
|
||||
resourceType:"应用资源"
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
this.applicationList =res.data.data
|
||||
})
|
||||
},
|
||||
// 被申请组件及数量
|
||||
getBeApplied () {
|
||||
this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
|
||||
params : {
|
||||
id:this.tableId,
|
||||
resourceType:"组件服务"
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
this.applicationList =res.data.data
|
||||
})
|
||||
},
|
||||
myEcharts1(){
|
||||
var chartDom = document.getElementById('main1');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: '',
|
||||
top: '14%',
|
||||
left: '55%',
|
||||
width:"auto",
|
||||
height:"auto",
|
||||
orient: "vertical",
|
||||
itemGap: 15,
|
||||
itemWidth: 14,
|
||||
// 使用回调函数
|
||||
formatter: function(name) {
|
||||
var data = option.series[0].data;
|
||||
var total = 0;
|
||||
var tarValue;
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
total += Number(data[i].value);
|
||||
if (data[i].name == name) {
|
||||
tarValue = data[i].value;
|
||||
}
|
||||
}
|
||||
var v = tarValue;
|
||||
var p = Math.round(((v / total) * 100));
|
||||
return `${name} ${p}%`;
|
||||
},
|
||||
itemStyle:{},
|
||||
textStyle: {
|
||||
color: "#666666",
|
||||
padding:[0,8,0,18]
|
||||
},
|
||||
},
|
||||
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
center:['22%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: this.data1
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
option && myChart.setOption(option);
|
||||
},
|
||||
myEcharts2(){
|
||||
var chartDom = document.getElementById('main2');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: '',
|
||||
top: '22%',
|
||||
left: '50%',
|
||||
width:"auto",
|
||||
height:"auto",
|
||||
orient: "vertical",
|
||||
itemGap: 15,
|
||||
itemWidth: 14,
|
||||
// 使用回调函数
|
||||
formatter: function(name) {
|
||||
var data = option.series[0].data;
|
||||
var total = 0;
|
||||
var tarValue;
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
total += Number(data[i].value);
|
||||
if (data[i].name == name) {
|
||||
tarValue = data[i].value;
|
||||
}
|
||||
}
|
||||
var v = tarValue;
|
||||
var p = Math.round(((tarValue / total) * 100));
|
||||
return `${name} ${p}%`;
|
||||
},
|
||||
itemStyle:{},
|
||||
textStyle: {
|
||||
color: "#666666",
|
||||
padding:[0,8,0,18]
|
||||
},
|
||||
},
|
||||
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
|
||||
series: [
|
||||
{
|
||||
// name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
center:['22%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: this.data2
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
option && myChart.setOption(option);
|
||||
},
|
||||
myEcharts3(){
|
||||
var chartDom = document.getElementById('main3');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: "vertical", type: 'scroll',
|
||||
top: '22%',
|
||||
left: '50%',
|
||||
width:"auto",
|
||||
height:"auto",
|
||||
orient: "vertical",
|
||||
itemGap: 15,
|
||||
itemWidth: 14,
|
||||
|
||||
// 使用回调函数
|
||||
formatter: function(name) {
|
||||
var data = option.series[0].data;
|
||||
var total = 0;
|
||||
var tarValue;
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
total += Number(data[i].value);
|
||||
if (data[i].name == name) {
|
||||
tarValue = data[i].value;
|
||||
}
|
||||
}
|
||||
var v = tarValue;
|
||||
var p = Math.round(((tarValue / total) * 100));
|
||||
return `{a|${name}} {b|${p}%}`;
|
||||
},
|
||||
itemStyle:{},
|
||||
textStyle: {
|
||||
rich: {
|
||||
// 通过富文本rich给每个项设置样式，下面的oneone、twotwo、threethree可以理解为"每一列"的样式
|
||||
a: {
|
||||
// 设置文字、数学、英语这一列的样式
|
||||
width: 100,
|
||||
color: "#666666",
|
||||
fontSize: 12,
|
||||
// fontWeight: "bolder",
|
||||
},
|
||||
b: {
|
||||
// 设置10分、20分、30分这一列的样式
|
||||
width: 35,
|
||||
color: "#333",
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
color: "#666666",
|
||||
backgroundColor: "transparent",
|
||||
padding:[0,8,0,18]
|
||||
},
|
||||
},
|
||||
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
|
||||
series: [
|
||||
{
|
||||
// name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
center:['22%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
// emphasis: {
|
||||
// label: {
|
||||
// show: true,
|
||||
// fontSize: '40',
|
||||
// fontWeight: 'bold'
|
||||
// }
|
||||
// },
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data:this.data3
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
option && myChart.setOption(option);
|
||||
},
|
||||
backBtn(){
|
||||
this.$emit('closeChild')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.container{
|
||||
padding-top: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.title-style{
|
||||
font-size: 24px;
|
||||
color:#000000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.page-introduction{
|
||||
font-size: 18px;
|
||||
color:#666666;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.back-btn{
|
||||
background: #3e8ef7;
|
||||
border-color: rgba(101, 165, 249,0);
|
||||
color: #FFF;
|
||||
margin-left:1030px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
.container-body{
|
||||
width:1300px;
|
||||
margin-top:30px;
|
||||
display: flex;
|
||||
flex-wrap:wrap
|
||||
}
|
||||
.container-body1{
|
||||
width:420px;
|
||||
height:250px;
|
||||
background-color: #ffffff;
|
||||
margin-right:20px;
|
||||
padding-top:20px;
|
||||
padding-left: 20px;
|
||||
|
||||
}
|
||||
.container-body2{
|
||||
width:420px;
|
||||
height:250px;
|
||||
background-color: #ffffff;
|
||||
margin-right:20px;
|
||||
padding-top:20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.container-body3{
|
||||
width:420px;
|
||||
height:250px;
|
||||
background-color: #ffffff;
|
||||
padding-top:20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.container-body4{
|
||||
width:640px;
|
||||
height:300px;
|
||||
background-color: #ffffff;
|
||||
padding-top:20px;
|
||||
padding-left: 20px;
|
||||
margin-top: 20px;
|
||||
margin-right: 20px;
|
||||
background-image:url("../../../assets/img/排行榜背景图.png");
|
||||
background-repeat:no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.container-body5{
|
||||
width:640px;
|
||||
height:300px;
|
||||
background-color: #ffffff;
|
||||
padding-top:20px;
|
||||
padding-left: 20px;
|
||||
margin-top: 20px;
|
||||
background-image:url("../../../assets/img/排行榜背景图.png");
|
||||
background-repeat:no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.footer{
|
||||
display: flex;
|
||||
margin-top:50px;
|
||||
margin-left:365px;
|
||||
}
|
||||
.footer-left{
|
||||
width:250px;
|
||||
height:1px;
|
||||
background-color:#e0eaf8;
|
||||
margin-right:10px;
|
||||
margin-top:8px
|
||||
}
|
||||
.footer-right{
|
||||
width:250px;
|
||||
height:1px;
|
||||
background-color:#e0eaf8;
|
||||
margin-left:10px;
|
||||
margin-top:8px
|
||||
}
|
||||
.ranking-img{
|
||||
width:60px;
|
||||
height:26px;
|
||||
display: flex;
|
||||
line-height: 26px;
|
||||
margin-bottom:15px;
|
||||
margin-right:10px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.num-style{
|
||||
position:absolute;
|
||||
display: flex;
|
||||
margin-left:90px;
|
||||
margin-top:5px;
|
||||
color:#333333;
|
||||
font-size: 16px;
|
||||
}
|
||||
.count-style{
|
||||
position:absolute;
|
||||
display: flex;
|
||||
margin-left:400px;
|
||||
margin-top:5px;
|
||||
color:#333333;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,554 +0,0 @@
|
|||
<template>
|
||||
<div class='container'>
|
||||
<div>
|
||||
<span class='title-style'>组件服务</span>
|
||||
<span class='page-introduction'>使用情况统计</span>
|
||||
<button class='back-btn' @click="backBtn">返回</button>
|
||||
</div>
|
||||
|
||||
<div class='container-body'>
|
||||
<!-- <div class='container-body1'>
|
||||
<span style='font-size:18px;color;#000000;'>评分发布情况</span>
|
||||
<div id="main1" style="width: 400px;height:200px;"></div>
|
||||
</div> -->
|
||||
<div class='container-body2'>
|
||||
<span style='font-size:18px;color;#000000;'>使用组件数量分布</span>
|
||||
<div id="main2" style="width: 400px;height:200px;"></div>
|
||||
</div>
|
||||
<div class='container-body3'>
|
||||
<span style='font-size:18px;color;#000000;'>使用组件应用领域分布情况</span>
|
||||
<div id="main3" style="width: 400px;height:200px;"></div>
|
||||
</div>
|
||||
<div class='container-body4'>
|
||||
<div style='margin-bottom:30px'>
|
||||
<span style='font-size:18px;color;#000000;'>Top5使用组件</span>
|
||||
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
|
||||
</div>
|
||||
<div v-for="(item,index) in usedList" :key='index' >
|
||||
<div style='display:flex'>
|
||||
<div class='ranking-img' :style="{background:colorList[index%5],width: widthList[index%5]}">
|
||||
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
|
||||
</div>
|
||||
<span class='num-style'>{{item.name}}</span>
|
||||
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.useNum}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='container-body5'>
|
||||
<div style='margin-bottom:30px'>
|
||||
<span style='font-size:18px;color;#000000;'>使用组件评分</span>
|
||||
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
|
||||
</div>
|
||||
<div v-for="(item,index) in applicationList" :key='index' >
|
||||
<div style='display:flex'>
|
||||
<div class='ranking-img' :style="{background:colorList[index%5],width: widthList[index%5]}">
|
||||
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
|
||||
</div>
|
||||
<span class='num-style'>{{item.name}}</span>
|
||||
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.score}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='footer'>
|
||||
<div class='footer-left' ></div>
|
||||
<span style='color:#b7c2d1;font-size:16px'>到底啦</span>
|
||||
<div class='footer-right'></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
tableId: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
fatherId: {
|
||||
type: Number,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
data1: [],
|
||||
data2: [
|
||||
// { value: 1048,name: '算法' },
|
||||
// { value: 735, name: '图层' },
|
||||
// { nums: 580, attr_value: '开发' },
|
||||
// { nums: 484, attr_value: '业务' },
|
||||
],
|
||||
data3: [
|
||||
// { value: 1048,name: '算法' },
|
||||
],
|
||||
colorList: ['linear-gradient(to right, rgba(251, 59, 5,0.6),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)', 'linear-gradient(to right,rgba(250, 179, 2,.6),transparent)', 'linear-gradient(to right,rgba(82, 106, 255,.6),transparent', 'linear-gradient(to right,rgba(82, 106, 255,.6),transparent)'],
|
||||
widthList: ['90px', '80px', '70px', '60px', '50px'],
|
||||
numColorList: ['#fc5656', '#ff8a00', '#f9af0a', '#808fff', '#808fff'],
|
||||
usedList: [{ name: '组件名称一', useNum: 111 }, { name: '组件名称一', useNum: 111 }, { name: '组件名称一', useNum: 111 }, { name: '组件名称四', useNum: 111 }, { name: '组件名称五', useNum: 111 }],
|
||||
applicationList: [{ name: '组件名称一', score: 111 }, { name: '组件名称一', score: 111 }, { name: '组件名称一', score: 111 }, { name: '组件名称四', score: 111 }, { name: '组件名称五', score: 111 }]
|
||||
}
|
||||
},
|
||||
created () {
|
||||
if (this.fatherId === 1) {
|
||||
this.getBeCalled()
|
||||
this.getBeApplied()
|
||||
this.getAlgorithm()
|
||||
this.getDistributed()
|
||||
this.getScoreList()
|
||||
} else {
|
||||
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 评分发布情况
|
||||
getScoreList () {
|
||||
this.$http.get('/census/center/v3/assemblerScoreInfo', {
|
||||
params: {
|
||||
id: this.tableId,
|
||||
resourceType: '应用资源'
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
let arry = []
|
||||
arry = res.data.data
|
||||
arry.forEach((item) => {
|
||||
const single = {
|
||||
value: item.scoreNum,
|
||||
name: item.score
|
||||
}
|
||||
// const newList=[]
|
||||
this.data1.push(single)
|
||||
// this.data2=newList
|
||||
this.myEcharts1()
|
||||
})
|
||||
})
|
||||
},
|
||||
// 算法图层开发业务
|
||||
getAlgorithm () {
|
||||
this.$http.get('/census/center/v3/assemblerUsedInfo', {
|
||||
params: {
|
||||
id: this.tableId,
|
||||
resourceType: '组件服务'
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
let arry = []
|
||||
arry = res.data.data
|
||||
arry.forEach((item) => {
|
||||
const single = {
|
||||
value: item.nums,
|
||||
name: item.attr_value
|
||||
}
|
||||
// const newList=[]
|
||||
this.data2.push(single)
|
||||
// this.data2=newList
|
||||
this.myEcharts2()
|
||||
})
|
||||
})
|
||||
},
|
||||
// 应用领域分布
|
||||
getDistributed () {
|
||||
this.$http.get('/census/center/v3/applicationUsedAreaCapabilityList', {
|
||||
params: {
|
||||
id: this.tableId,
|
||||
resourceType: '组件服务'
|
||||
}
|
||||
}).then(res => {
|
||||
let arry = []
|
||||
arry = res.data.data
|
||||
arry.forEach((item) => {
|
||||
const single = {
|
||||
value: item.total,
|
||||
name: item.type
|
||||
}
|
||||
this.data3.push(single)
|
||||
this.myEcharts3()
|
||||
})
|
||||
})
|
||||
},
|
||||
// top5使用组件
|
||||
getBeCalled () {
|
||||
this.$http.get('/census/center/v3/assemblerUseTopInfo', {
|
||||
params: {
|
||||
id: this.tableId,
|
||||
resourceType: '组件服务'
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
this.usedList = res.data.data
|
||||
})
|
||||
},
|
||||
// 使用组件评分5
|
||||
getBeApplied () {
|
||||
this.$http.get('/census/center/v3/assemblerUseScoreTopInfo', {
|
||||
params: {
|
||||
id: this.tableId,
|
||||
resourceType: '应用资源'
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
this.applicationList = res.data.data
|
||||
})
|
||||
},
|
||||
myEcharts1 () {
|
||||
var chartDom = document.getElementById('main1')
|
||||
var myChart = echarts.init(chartDom)
|
||||
var option
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: '',
|
||||
top: '14%',
|
||||
left: '55%',
|
||||
width: 'auto',
|
||||
height: 'auto',
|
||||
orient: 'vertical',
|
||||
itemGap: 15,
|
||||
itemWidth: 14,
|
||||
// 使用回调函数
|
||||
formatter: function (name) {
|
||||
var data = option.series[0].data
|
||||
var total = 0
|
||||
var tarValue
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
total += Number(data[i].value)
|
||||
if (data[i].name == name) {
|
||||
tarValue = data[i].value
|
||||
}
|
||||
}
|
||||
var v = tarValue
|
||||
var p = Math.round(((v / total) * 100))
|
||||
return `${name} ${p}%`
|
||||
},
|
||||
itemStyle: {},
|
||||
textStyle: {
|
||||
color: '#666666',
|
||||
padding: [0, 8, 0, 18]
|
||||
}
|
||||
},
|
||||
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
center: ['22%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: this.data1
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
option && myChart.setOption(option)
|
||||
},
|
||||
myEcharts2 () {
|
||||
var chartDom = document.getElementById('main2')
|
||||
var myChart = echarts.init(chartDom)
|
||||
var option
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: '',
|
||||
top: '22%',
|
||||
left: '50%',
|
||||
width: 'auto',
|
||||
height: 'auto',
|
||||
orient: 'vertical',
|
||||
itemGap: 15,
|
||||
itemWidth: 14,
|
||||
// 使用回调函数
|
||||
formatter: function (name) {
|
||||
var data = option.series[0].data
|
||||
var total = 0
|
||||
var tarValue
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
total += Number(data[i].value)
|
||||
if (data[i].name == name) {
|
||||
tarValue = data[i].value
|
||||
}
|
||||
}
|
||||
var v = tarValue
|
||||
var p = Math.round(((tarValue / total) * 100))
|
||||
return `${name} ${p}%`
|
||||
},
|
||||
itemStyle: {},
|
||||
textStyle: {
|
||||
color: '#666666',
|
||||
padding: [0, 8, 0, 18]
|
||||
}
|
||||
},
|
||||
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
|
||||
series: [
|
||||
{
|
||||
// name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
center: ['22%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: this.data2
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
option && myChart.setOption(option)
|
||||
},
|
||||
myEcharts3 () {
|
||||
var chartDom = document.getElementById('main3')
|
||||
var myChart = echarts.init(chartDom)
|
||||
var option
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: 'vertical',
|
||||
type: 'scroll',
|
||||
top: '22%',
|
||||
left: '50%',
|
||||
width: 'auto',
|
||||
height: 'auto',
|
||||
orient: 'vertical',
|
||||
itemGap: 15,
|
||||
itemWidth: 14,
|
||||
|
||||
// 使用回调函数
|
||||
formatter: function (name) {
|
||||
var data = option.series[0].data
|
||||
var total = 0
|
||||
var tarValue
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
total += Number(data[i].value)
|
||||
if (data[i].name == name) {
|
||||
tarValue = data[i].value
|
||||
}
|
||||
}
|
||||
// var v = tarValue;
|
||||
var p = Math.round(((tarValue / total) * 100))
|
||||
console.log('@@@@', tarValue, total)
|
||||
return `{a|${name}} {b|${p}%}`
|
||||
},
|
||||
itemStyle: {},
|
||||
textStyle: {
|
||||
rich: {
|
||||
// 通过富文本rich给每个项设置样式，下面的oneone、twotwo、threethree可以理解为"每一列"的样式
|
||||
a: {
|
||||
// 设置文字、数学、英语这一列的样式
|
||||
width: 100,
|
||||
color: '#000000',
|
||||
fontSize: 12,
|
||||
fontWeight: 'bolder'
|
||||
},
|
||||
b: {
|
||||
// 设置10分、20分、30分这一列的样式
|
||||
width: 35,
|
||||
color: '#333',
|
||||
fontSize: 12
|
||||
}
|
||||
},
|
||||
color: '#666666',
|
||||
backgroundColor: 'transparent',
|
||||
padding: [0, 8, 0, 18]
|
||||
}
|
||||
},
|
||||
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
|
||||
series: [
|
||||
{
|
||||
// name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
center: ['22%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
// emphasis: {
|
||||
// label: {
|
||||
// show: true,
|
||||
// fontSize: '40',
|
||||
// fontWeight: 'bold'
|
||||
// }
|
||||
// },
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: this.data3
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
option && myChart.setOption(option)
|
||||
},
|
||||
backBtn () {
|
||||
this.$emit('closeChild2')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.container {
|
||||
padding-top: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.title-style {
|
||||
font-size: 24px;
|
||||
color: #000000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.page-introduction {
|
||||
font-size: 18px;
|
||||
color: #666666;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.back-btn {
|
||||
background: #3e8ef7;
|
||||
border-color: rgba(101, 165, 249, 0);
|
||||
color: #fff;
|
||||
margin-left: 1030px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
.container-body {
|
||||
width: 1300px;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.container-body1 {
|
||||
width: 420px;
|
||||
height: 250px;
|
||||
background-color: #ffffff;
|
||||
margin-right: 20px;
|
||||
padding-top: 20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.container-body2 {
|
||||
width: 640px;
|
||||
height: 250px;
|
||||
background-color: #ffffff;
|
||||
margin-right: 20px;
|
||||
padding-top: 20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.container-body3 {
|
||||
width: 640px;
|
||||
height: 250px;
|
||||
background-color: #ffffff;
|
||||
padding-top: 20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.container-body4 {
|
||||
width: 640px;
|
||||
height: 300px;
|
||||
background-color: #ffffff;
|
||||
padding-top: 20px;
|
||||
padding-left: 20px;
|
||||
margin-top: 20px;
|
||||
margin-right: 20px;
|
||||
background-image: url("../../../assets/img/排行榜背景图.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.container-body5 {
|
||||
width: 640px;
|
||||
height: 300px;
|
||||
background-color: #ffffff;
|
||||
padding-top: 20px;
|
||||
padding-left: 20px;
|
||||
margin-top: 20px;
|
||||
background-image: url("../../../assets/img/排行榜背景图.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.footer {
|
||||
display: flex;
|
||||
margin-top: 50px;
|
||||
margin-left: 365px;
|
||||
}
|
||||
.footer-left {
|
||||
width: 250px;
|
||||
height: 1px;
|
||||
background-color: #e0eaf8;
|
||||
margin-right: 10px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.footer-right {
|
||||
width: 250px;
|
||||
height: 1px;
|
||||
background-color: #e0eaf8;
|
||||
margin-left: 10px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.ranking-img {
|
||||
width: 60px;
|
||||
height: 26px;
|
||||
display: flex;
|
||||
line-height: 26px;
|
||||
margin-bottom: 15px;
|
||||
margin-right: 10px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.num-style {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
margin-left: 90px;
|
||||
width: 200px;
|
||||
margin-top: 5px;
|
||||
color: #333333;
|
||||
font-size: 16px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
.count-style {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
margin-left: 400px;
|
||||
margin-top: 5px;
|
||||
color: #333333;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,748 +0,0 @@
|
|||
<template>
|
||||
<div >
|
||||
<div class='container'>
|
||||
<!-- <div class='container-left' v-if='homeIsShow'>
|
||||
<div class='left-search'>
|
||||
<div>
|
||||
<input type="text" class='input-style' placeholder="请输入部门关键词" v-model="inputTxt">
|
||||
<div class='input-search' @click='searchBtn'>
|
||||
<img src="@/assets/img/搜索.png" style='margin-top:7px;margin-left:16px' >
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-tree
|
||||
class='tree-style'
|
||||
:data="treeData"
|
||||
:props="defaultProps"
|
||||
accordion
|
||||
@node-click="handleNodeClick">
|
||||
<span slot-scope="{ node }" class='tree-text-style'>
|
||||
<img src="@/assets/img/一级图标.png" style="width: 16px; height: 16px" />
|
||||
{{ node.label }}
|
||||
</span>
|
||||
</el-tree>
|
||||
</div> -->
|
||||
<el-form :inline="true">
|
||||
<!--起始日期 @keyup.enter.native="getDataList()"-->
|
||||
<el-form-item>
|
||||
<el-date-picker
|
||||
v-model="value1"
|
||||
type="datetimerange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
format='yyyy-MM-dd HH:mm:ss'
|
||||
value-format='yyyy-MM-dd HH:mm:ss'
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<!--审核状态-->
|
||||
<el-form-item>
|
||||
<el-select
|
||||
v-model="examineStatus"
|
||||
placeholder="请选审核状态"
|
||||
clearable
|
||||
>
|
||||
<el-option
|
||||
label="审核完成"
|
||||
value="1"
|
||||
></el-option>
|
||||
<el-option
|
||||
label="审核中"
|
||||
value="0"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!--部门-->
|
||||
<el-form-item>
|
||||
<el-select
|
||||
v-model="abilityDepartment"
|
||||
placeholder="请选择部门"
|
||||
clearable
|
||||
>
|
||||
<el-option label="全部" value=""></el-option>
|
||||
<el-option v-for="item in departmentSelects" :key="item.label" v-bind="item"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!--类型-->
|
||||
<el-form-item>
|
||||
<el-select
|
||||
v-model="abilityType"
|
||||
placeholder="请选择类型"
|
||||
clearable
|
||||
>
|
||||
<el-option label="全部" value=""></el-option>
|
||||
<el-option v-for="item in typeOptions" :key="item.value" :label="item.name" v-bind="item"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!--操作按钮查询-->
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
|
||||
</el-form-item>
|
||||
<!--操作按钮重置-->
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="resetDataList()">{{ $t('reset') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-card shadow="never" class="aui-card--fill" v-if='homeIsShow'>
|
||||
<div class="mod-demand__bsdemand">
|
||||
<!-- <div class='top-box'>
|
||||
<span class='title'>能力统计</span>
|
||||
<div class='title-list-style'>
|
||||
<div v-for="(item,index) in titleList" :key='index' class='title-single' :class="{'choseStyle':choseId=== index}" @click="choseBtn(index)">
|
||||
<span class='box-style'>{{item.name}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class='second-title'>
|
||||
<span style='margin-right:30px' :class="[departmentId===1?'departmentStyle':'']" @click="handleChose(1)">
|
||||
能力上架统计
|
||||
</span>
|
||||
<span :class="[departmentId===2?'departmentStyle':'']" @click="handleChose(2)">
|
||||
能力使用统计
|
||||
</span>
|
||||
<!-- <span v-if='this.choseId===0' :class="[departmentId===3?'departmentStyle':'']" @click="handleChose(3)">
|
||||
能力上架明细
|
||||
</span>
|
||||
<span v-if='this.choseId===0' :class="[departmentId===4?'departmentStyle':'']" @click="handleChose(4)">
|
||||
能力使用明细
|
||||
</span> -->
|
||||
<span v-if="detailFlag" class="detail-button" @click="goToDetail()">
|
||||
明细
|
||||
</span>
|
||||
<span v-else class="detail-button" @click="goToBack()">
|
||||
返回
|
||||
</span>
|
||||
</div>
|
||||
<div class='line-style'></div>
|
||||
<!--统计表-->
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:header-cell-style="{textAlign:'center'}"
|
||||
:cell-style="{textAlign:'center'}"
|
||||
border
|
||||
style="width: 100%" v-if='this.departmentId===1 ||this.departmentId===2'>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="部门名称"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column label="组件">
|
||||
<el-table-column
|
||||
prop="znsf"
|
||||
label="智能算法"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="tcfw"
|
||||
label="图层服务"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="kfzj"
|
||||
label="通用开发组件"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="ywzj"
|
||||
label="业务能力组件"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="yyzy"
|
||||
label="应用资源"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="zj"
|
||||
label="总计"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--明细表-->
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:header-cell-style="{textAlign:'center'}"
|
||||
:cell-style="{textAlign:'center'}"
|
||||
border
|
||||
style="width: 100%" v-if='this.departmentId===3 ||this.departmentId===4'>
|
||||
<el-table-column
|
||||
prop="deptName"
|
||||
label="部门"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="resourceName"
|
||||
label="资源名称"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="type"
|
||||
label="类型"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="createDate"
|
||||
label="日期"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="approveStatus"
|
||||
label="状态"
|
||||
min-width="100%">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="block">
|
||||
<el-pagination
|
||||
@current-change="handleCurrentChange"
|
||||
layout="total, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
:page-size="5"
|
||||
:current-page="currentPage"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<component-used v-if='UsedIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild2='closeChild2'></component-used>
|
||||
<component-services v-if='servicesIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild='closeChild'></component-services>
|
||||
<application-resources v-if='resourcesIsShow' :tableId='tableId' :fatherId='fatherId' @closeApplication='closeApplication'></application-resources>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentServices from './componentServices.vue'
|
||||
import applicationResources from './applicationResources.vue'
|
||||
import ComponentUsed from './componentUsed.vue'
|
||||
import { mapState } from 'vuex'
|
||||
export default {
|
||||
components: { componentServices, applicationResources, ComponentUsed },
|
||||
data () {
|
||||
return {
|
||||
inputTxt: '',
|
||||
tableId: '',
|
||||
fatherId: '',
|
||||
treeData: [{
|
||||
label: '一级 1',
|
||||
children: [{
|
||||
label: '二级 1-1',
|
||||
children: [{
|
||||
label: '三级 1-1-1'
|
||||
}]
|
||||
}]
|
||||
}, {
|
||||
label: '一级 2',
|
||||
children: [{
|
||||
label: '二级 2-1',
|
||||
children: [{
|
||||
label: '三级 2-1-1'
|
||||
}]
|
||||
}, {
|
||||
label: '二级 2-2',
|
||||
children: [{
|
||||
label: '三级 2-2-1'
|
||||
}]
|
||||
}]
|
||||
}, {
|
||||
label: '一级 3',
|
||||
children: [{
|
||||
label: '二级 3-1',
|
||||
children: [{
|
||||
label: '三级 3-1-1'
|
||||
}]
|
||||
}, {
|
||||
label: '二级 3-2',
|
||||
children: [{
|
||||
label: '三级 3-2-1'
|
||||
}]
|
||||
}]
|
||||
}],
|
||||
total: null,
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'name'
|
||||
},
|
||||
choseId: 0,
|
||||
departmentId: 1,
|
||||
currentPage: 1,
|
||||
homeIsShow: true,
|
||||
servicesIsShow: false,
|
||||
resourcesIsShow: false,
|
||||
UsedIsShow: false,
|
||||
titleList: [
|
||||
{ name: '组件服务', key: 1 }, { name: '应用资源', key: 2 }, { name: '基础设施', key: 3 }, { name: '数据资源', key: 3 }, { name: '知识库', key: 3 }
|
||||
],
|
||||
tableData: [{ deptName: '部门', resourceNum: 222 }],
|
||||
examineStatus: '0',//审核状态
|
||||
value1:[],//起始时间
|
||||
abilityDepartment:"",//部门
|
||||
abilityType:"",//能力
|
||||
beginTime: '',//开始时间
|
||||
endTime: '',//结束时间
|
||||
typeOptions:[
|
||||
{ name: '智能算法', value: 1 },
|
||||
{ name: '图层服务', value: 2 },
|
||||
{ name: '通用开发组件', value: 3 },
|
||||
{ name: '页面开发组件', value: 4 },
|
||||
{ name: '应用资源', value: 5 }],//类型备选列表
|
||||
detailFlag:true,//明细返回按钮显示标志位
|
||||
}
|
||||
},
|
||||
created () {
|
||||
//当前设定的日期时间
|
||||
let d = new Date
|
||||
let year1,month1,day1;
|
||||
[year1,month1,day1] = [d.getFullYear(),d.getMonth(),d.getDate()]
|
||||
let date1 = new Date(year1, month1, day1,7)
|
||||
this.value1.push(date1)
|
||||
//前一天设定的日期时间
|
||||
let year2,month2,day2
|
||||
d.setTime(d.getTime()-24*60*60*1000);
|
||||
[year2,month2,day2] = [d.getFullYear(),d.getMonth(),d.getDate()]
|
||||
let date2 = new Date(year2,month2,day2,7)
|
||||
this.value1.unshift(date2)
|
||||
},
|
||||
mounted () {
|
||||
this.getFirstTree()
|
||||
},
|
||||
computed: {
|
||||
...mapState(['departmentSelects'])
|
||||
},
|
||||
methods: {
|
||||
// 搜索框
|
||||
// searchBtn(){
|
||||
// this.getALLTree()
|
||||
// },
|
||||
// //树
|
||||
// handleNodeClick(data) {
|
||||
// console.log(data.name);
|
||||
// this.getTreeName(data)
|
||||
// },
|
||||
// 翻页
|
||||
handleCurrentChange (val) {
|
||||
if (this.choseId === 0) {
|
||||
this.getFirstTree(val)
|
||||
} else if (this.choseId === 1) {
|
||||
this.getReleaseTree(val)
|
||||
}
|
||||
},
|
||||
getTreeName (data) {
|
||||
this.$http.get('/census/center/v3/treeList/', {
|
||||
params: {
|
||||
keywords: data.name,
|
||||
deptId: '1067246875800000066'
|
||||
// pageNo: pageNo || 1,
|
||||
// pageSize: 20
|
||||
}
|
||||
}).then(res => {
|
||||
this.tableData = res.data.data
|
||||
})
|
||||
},
|
||||
// // 获取部门列表
|
||||
// getALLTree () {
|
||||
// this.$http.get('/census/center/v3/treeList/' ,{
|
||||
// params : {
|
||||
// keywords:this.inputTxt,
|
||||
// deptId:'1067246875800000066',
|
||||
// // pageNo: pageNo || 1,
|
||||
// // pageSize: 20
|
||||
// }
|
||||
// }).then(res => {
|
||||
// this.treeData =res.data.data
|
||||
// // this.tableData =res.data.data
|
||||
// })
|
||||
// },
|
||||
|
||||
// 组件服务部门发布情况--改为能力上架统计
|
||||
getFirstTree (page) {
|
||||
this.$http.get('/census/center/selectDeptDetailTypeCountList/', {
|
||||
params: {
|
||||
page: page || 1,
|
||||
limit: 5,
|
||||
approveStatus: '',
|
||||
deptId: '',
|
||||
params: '',
|
||||
startDate: ''
|
||||
}
|
||||
}).then(res => {
|
||||
let result= res.data.data
|
||||
for(let i=0;i<result.length;i++){
|
||||
if(!result[i].hasOwnProperty('yyzy') ){
|
||||
result[i].yyzy= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('kfzj') ){
|
||||
result[i].kfzj= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('znsf') ){
|
||||
result[i].znsf= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('tcfw') ){
|
||||
result[i].tcfw= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('ywzj') ){
|
||||
result[i].ywzj= 0
|
||||
}
|
||||
result[i].zj=parseInt(result[i].yyzy)+ parseInt(result[i].kfzj)+parseInt(result[i].znsf)+parseInt(result[i].ywzj)+parseInt(result[i].tcfw)
|
||||
}
|
||||
this.tableData = res.data.data
|
||||
this.total = res.data.data.total
|
||||
})
|
||||
},
|
||||
// 组件服务部门使用情况列表-改为能力使用统计
|
||||
getSecondTree () {
|
||||
this.$http.get('/census/center/selectApplyDeptDetailTypeCountList/', {
|
||||
params: {
|
||||
// page: page || 1,
|
||||
limit: 5,
|
||||
approveStatus: '',
|
||||
deptId: '',
|
||||
params: '',
|
||||
startDate: ''
|
||||
}
|
||||
}).then(res => {
|
||||
let result= res.data.data
|
||||
for(let i=0;i<result.length;i++){
|
||||
if(!result[i].hasOwnProperty('yyzy') ){
|
||||
result[i].yyzy= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('kfzj') ){
|
||||
result[i].kfzj= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('znsf') ){
|
||||
result[i].znsf= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('tcfw') ){
|
||||
result[i].tcfw= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('ywzj') ){
|
||||
result[i].ywzj= 0
|
||||
}
|
||||
result[i].zj=parseInt(result[i].yyzy)+ parseInt(result[i].kfzj)+parseInt(result[i].znsf)+parseInt(result[i].ywzj)+parseInt(result[i].tcfw)
|
||||
}
|
||||
this.tableData = res.data.data
|
||||
this.total = res.data.data.total
|
||||
})
|
||||
},
|
||||
// 能力上架明细
|
||||
getOneDetail (page) {
|
||||
this.$http.get('/census/center/selectCensusResourceTable/', {
|
||||
params: {
|
||||
limit: 5,
|
||||
// page: page || 1,
|
||||
approveStatus: '',
|
||||
deptId: '',
|
||||
params: '',
|
||||
startDate: ''
|
||||
}
|
||||
}).then(res => {
|
||||
this.tableData = res.data.data
|
||||
this.total = res.data.data.total
|
||||
})
|
||||
},
|
||||
// 能力使用明细
|
||||
getTwoDetail (page) {
|
||||
this.$http.get('/census/center/selectCensusApplyTable/', {
|
||||
params: {
|
||||
limit: 5,
|
||||
// page: page || 1,
|
||||
approveStatus: '',
|
||||
deptId: '',
|
||||
params: '',
|
||||
startDate: ''
|
||||
}
|
||||
}).then(res => {
|
||||
this.tableData = res.data.data
|
||||
this.total = res.data.data.total
|
||||
})
|
||||
},
|
||||
getReleaseTree (page) {
|
||||
this.$http.get('/census/center/selectApplyDeptDetailTypeCountList/', {
|
||||
params: {
|
||||
limit: 5,
|
||||
// page: page || 1,
|
||||
approveStatus: '',
|
||||
deptId: '',
|
||||
params: '',
|
||||
startDate: ''
|
||||
}
|
||||
}).then(res => {
|
||||
let result= res.data.data
|
||||
for(let i=0;i<result.length;i++){
|
||||
if(!result[i].hasOwnProperty('yyzy') ){
|
||||
result[i].yyzy= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('kfzj') ){
|
||||
result[i].kfzj= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('znsf') ){
|
||||
result[i].znsf= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('tcfw') ){
|
||||
result[i].tcfw= 0
|
||||
}
|
||||
if(!result[i].hasOwnProperty('ywzj') ){
|
||||
result[i].ywzj= 0
|
||||
}
|
||||
result[i].zj=parseInt(result[i].yyzy)+ parseInt(result[i].kfzj)+parseInt(result[i].znsf)+parseInt(result[i].ywzj)+parseInt(result[i].tcfw)
|
||||
}
|
||||
this.tableData = res.data.data
|
||||
this.total = res.data.data.total
|
||||
})
|
||||
},
|
||||
// 应用资源部门使用情况列表
|
||||
getUsedTree () {
|
||||
this.$http.get('/census/center/v3/resourceReleaseDetails/', {
|
||||
params: {
|
||||
limit: 5,
|
||||
page: 1,
|
||||
// id:'1067246875800000066',
|
||||
resourceType: '应用资源'
|
||||
}
|
||||
}).then(res => {
|
||||
this.tableData = res.data.data.list
|
||||
})
|
||||
},
|
||||
handleClick (row) {
|
||||
if (this.choseId === 0) {
|
||||
if (this.departmentId === 1) {
|
||||
this.homeIsShow = false
|
||||
this.servicesIsShow = true
|
||||
this.tableId = row.deptId
|
||||
this.fatherId = 1
|
||||
} else if (this.departmentId === 2) {
|
||||
this.homeIsShow = false
|
||||
this.UsedIsShow = true
|
||||
this.tableId = row.deptId
|
||||
this.fatherId = 1
|
||||
}
|
||||
} else if (this.choseId === 1) {
|
||||
this.homeIsShow = false
|
||||
this.resourcesIsShow = true
|
||||
this.tableId = row.deptId
|
||||
this.fatherId = 2
|
||||
}
|
||||
},
|
||||
// 选择组件
|
||||
choseBtn (index) {
|
||||
this.choseId = index
|
||||
this.handleChose(1)
|
||||
},
|
||||
// choseBtn(index){
|
||||
// this.choseId=index
|
||||
// if (index===0){
|
||||
// this.homeIsShow=false
|
||||
// this.servicesIsShow=true
|
||||
// } else if(index===1){
|
||||
// this.homeIsShow=false
|
||||
// this.servicesIsShow=false
|
||||
// this.resourcesIsShow=true
|
||||
// }
|
||||
// },
|
||||
// 选择发布or使用表格
|
||||
handleChose (index) {
|
||||
this.departmentId = index
|
||||
if (index === 1) {
|
||||
if (this.choseId === 0) {
|
||||
this.getFirstTree()
|
||||
} else if (this.choseId === 1) {
|
||||
//this.getReleaseTree()
|
||||
}
|
||||
} else if (index === 2) {
|
||||
if (this.choseId === 0) {
|
||||
this.getSecondTree()
|
||||
} else {
|
||||
//this.getUsedTree()
|
||||
}
|
||||
}
|
||||
else if (index === 3) {
|
||||
if (this.choseId === 0) {
|
||||
this.getOneDetail()
|
||||
} else {
|
||||
//this.getUsedTree()
|
||||
}
|
||||
} else if (index === 4) {
|
||||
if (this.choseId === 0) {
|
||||
this.getTwoDetail()
|
||||
} else {
|
||||
// this.getUsedTree()
|
||||
}
|
||||
}
|
||||
},
|
||||
// 翻页
|
||||
handleSizeChange (val) {
|
||||
console.log(`每页 ${val} 条`)
|
||||
},
|
||||
closeChild () {
|
||||
this.homeIsShow = true
|
||||
this.servicesIsShow = false
|
||||
this.handleCurrentChange(1)
|
||||
},
|
||||
closeChild2 () {
|
||||
this.homeIsShow = true
|
||||
this.UsedIsShow = false
|
||||
this.handleCurrentChange(1)
|
||||
},
|
||||
closeApplication () {
|
||||
this.homeIsShow = true
|
||||
this.resourcesIsShow = false
|
||||
this.handleCurrentChange(1)
|
||||
},
|
||||
//明细按钮函数//明细按钮函数//明细按钮函数//明细按钮函数//明细按钮函数//明细按钮函数
|
||||
goToDetail(){
|
||||
this.detailFlag = !this.detailFlag;
|
||||
if(this.departmentId===1){
|
||||
this.handleChose(3);
|
||||
//this.departmentId = 1;
|
||||
}else if(this.departmentId===2){
|
||||
this.handleChose(4);
|
||||
//this.departmentId = 2;
|
||||
}else{
|
||||
|
||||
}
|
||||
},
|
||||
//返回按钮
|
||||
goToBack(){
|
||||
//departmentId 1，3 2，4 两个值共同判断
|
||||
this.detailFlag = !this.detailFlag;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.container-left {
|
||||
width: 250px;
|
||||
height: 1000px;
|
||||
display: inline-block;
|
||||
// background-color: #ffffff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.left-search {
|
||||
width: 250px;
|
||||
height: 76px;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
.input-style {
|
||||
width: 210px;
|
||||
height: 36px;
|
||||
margin: 20px 20px;
|
||||
padding-left: 20px;
|
||||
border-radius: 18px;
|
||||
border: 1px solid transparent;
|
||||
background-color: #f2f4fa;
|
||||
}
|
||||
input::placeholder {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: #b0b3ca;
|
||||
}
|
||||
.input-search {
|
||||
width: 44px;
|
||||
height: 30px;
|
||||
background-color: #ffffff;
|
||||
position: absolute;
|
||||
border-radius: 15px;
|
||||
top: 38px;
|
||||
left: 196px;
|
||||
}
|
||||
::v-deep.tree-style {
|
||||
.el-tree-node__label {
|
||||
font-size: 16px;
|
||||
}
|
||||
.el-tree-node__content {
|
||||
width: 240px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.top-box {
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
background-color: #fafafc;
|
||||
display: inline-block;
|
||||
}
|
||||
.title {
|
||||
display: flex;
|
||||
font-size: 20px;
|
||||
color: #000000;
|
||||
font-weight: bold;
|
||||
padding-left: 15px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.title-list-style {
|
||||
display: flex;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.title-single {
|
||||
font-size: 14px;
|
||||
width: 90px;
|
||||
color: #666666;
|
||||
height: 24px;
|
||||
margin-left: 10px;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.box-style {
|
||||
width: 90px;
|
||||
height: 24px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.second-title {
|
||||
margin-top: 20px;
|
||||
font-size: 14px;
|
||||
color: #979eb9;
|
||||
cursor: pointer;
|
||||
.detail-button{
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
right: 60px;
|
||||
background-color: #0058e1;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
margin-top: -20px;
|
||||
border-radius: 2px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.line-style {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #f5f6fa;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.aui-card--fill {
|
||||
width: 100% !important;
|
||||
padding: 0px !important;
|
||||
}
|
||||
.choseStyle {
|
||||
color: #526aff;
|
||||
border: 1px solid #526aff;
|
||||
}
|
||||
.departmentStyle {
|
||||
color: #526aff;
|
||||
}
|
||||
::v-deep .tree-text-styleJ {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,330 +0,0 @@
|
|||
<template>
|
||||
<el-card shadow="never" class="roomBox">
|
||||
<div class="roomExamineSearch">
|
||||
<el-input
|
||||
v-model="roomName"
|
||||
style="width: 160px"
|
||||
placeholder="请输入会议室名称"
|
||||
></el-input>
|
||||
<el-select
|
||||
v-model="value"
|
||||
style="width: 160px"
|
||||
clearable
|
||||
placeholder="请选择审核状态"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button type="primary" @click="searchData">查询</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-table border style="width: 100%" :data="tableData">
|
||||
<el-table-column
|
||||
label="申请人"
|
||||
prop="name"
|
||||
header-align="center"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="申请部门"
|
||||
prop="dept"
|
||||
header-align="center"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="申请会议室"
|
||||
prop="roomName"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="申请时段"
|
||||
prop="bookDate"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="申请状态"
|
||||
prop="state"
|
||||
header-align="center"
|
||||
align="center"
|
||||
:formatter="formatter"
|
||||
></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"
|
||||
@click="taskDetails(scope.row, scope.row.state)"
|
||||
>{{ scope.row.state == '1' ? '处理' : '详情' }}</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
:page-size="100"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
<el-dialog
|
||||
:title="lookData.roomName"
|
||||
:visible.sync="dialogVisible"
|
||||
width="50%"
|
||||
>
|
||||
<div class="modalResult" style="margin-bottom: 20px">处理结果</div>
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 0.01rem;
|
||||
border-top: 1px solid #ccc;
|
||||
transform: scaleY(0.5);
|
||||
"
|
||||
></div>
|
||||
<div
|
||||
class="modalExamine"
|
||||
style="display: flex; flex-direction: column; margin-top: 20px"
|
||||
>
|
||||
<span style="margin-bottom: 20px">
|
||||
审核结果：{{ lookData.state === '2' ? '通过' : '不通过' }}
|
||||
</span>
|
||||
<span style="width: 90%; margin-bottom: 20px">
|
||||
审核意见：{{ lookData.auditViem }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="modalYuyue" style="margin-bottom: 20px">预约信息</div>
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 0.01rem;
|
||||
border-top: 1px solid #ccc;
|
||||
transform: scaleY(0.5);
|
||||
"
|
||||
></div>
|
||||
<div class="modalTime" style="margin-bottom: 20px">
|
||||
<div style="margin: 20px 0 20px 0">
|
||||
预约日期：{{ lookData.bookDate }}
|
||||
</div>
|
||||
<div>预约时段：{{ lookData.startTime }}-{{ lookData.endTime }}</div>
|
||||
<div
|
||||
class="modalContent"
|
||||
style="
|
||||
width: 85%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 15px 0 15px 0;
|
||||
"
|
||||
>
|
||||
<span>预约人：{{ lookData.name }}</span>
|
||||
<span>联系方式：{{ lookData.phone }}</span>
|
||||
<span>预约部门：{{ lookData.dept }}</span>
|
||||
</div>
|
||||
<div style="width: 800px; margin-bottom: 30px">
|
||||
使用事项：{{ lookData.matter }}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div style="display: flex; align-items: center">
|
||||
<span>附件：</span>
|
||||
<el-button
|
||||
v-show="file != ''"
|
||||
size="mini"
|
||||
@click="downloadTemplate(file)"
|
||||
>下载</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog
|
||||
:title="lookData.roomName"
|
||||
:visible.sync="dialogVisibleChuli"
|
||||
width="50%"
|
||||
>
|
||||
<div class="modalResult" style="margin-bottom: 10px">预约信息</div>
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 0.01rem;
|
||||
border-top: 1px solid #ccc;
|
||||
transform: scaleY(0.5);
|
||||
"
|
||||
></div>
|
||||
<el-row style="display: flex; margin-top: 20px">
|
||||
<el-col :span="8">预约日期：{{ lookData.bookDate }}</el-col>
|
||||
<el-col :span="8"
|
||||
>预约时段：{{ lookData.startTime }}-{{ lookData.endTime }}</el-col
|
||||
>
|
||||
</el-row>
|
||||
<div class="modalTime">
|
||||
<el-row class="modalContent" style="margin: 15px 0 15px 0">
|
||||
<el-col :span="8">申请人：{{ lookData.name }}</el-col>
|
||||
<el-col :span="8">联系方式：{{ lookData.phone }}</el-col>
|
||||
<el-col :span="8">申请部门：{{ lookData.dept }}</el-col>
|
||||
</el-row>
|
||||
<el-row style="margin-bottom: 30px">
|
||||
<el-col :span="24"> 使用事项：{{ lookData.matter }} </el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="2">审核结果：</el-col>
|
||||
<el-col :span="8" style="display: flex">
|
||||
<el-radio v-model="radio" label="2">通过</el-radio>
|
||||
<el-radio v-model="radio" label="3">不通过</el-radio>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="display: flex; margin-top: 20px">
|
||||
<el-col :span="2">审核意见：</el-col>
|
||||
<el-col :span="16">
|
||||
<el-input type="textarea" v-model="desc"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="No">取 消</el-button>
|
||||
<el-button type="primary" @click="ok">确 定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</el-card>
|
||||
</template>
|
||||
<script>
|
||||
import Cookies from 'js-cookie'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
options: [
|
||||
{
|
||||
value: '1',
|
||||
label: '待审核',
|
||||
},
|
||||
{
|
||||
value: '0',
|
||||
label: '审核完成',
|
||||
},
|
||||
],
|
||||
value: '',
|
||||
limit: 10,
|
||||
page: 1,
|
||||
total: 0,
|
||||
roomName: '',
|
||||
tableData: [],
|
||||
dialogVisible: false,
|
||||
dialogVisibleChuli: false,
|
||||
lookData: {},
|
||||
radio: '2',
|
||||
desc: '',
|
||||
id: '',
|
||||
num: '',
|
||||
file: '',
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getSerach()
|
||||
},
|
||||
methods: {
|
||||
getSerach() {
|
||||
this.$http
|
||||
.get(
|
||||
`/bookMeeting/auditPage?page=${this.page}&limit=${this.limit}&roomName=${this.roomName}&state=${this.value}`
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res, 7777777)
|
||||
this.tableData = res.data.list
|
||||
this.total = res.data.total
|
||||
})
|
||||
},
|
||||
downloadTemplate(file) {
|
||||
// window.SITE_CONFIG.apiURL +
|
||||
window.open(`${file}?token=` + Cookies.get('ucsToken'))
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.limit = val
|
||||
this.getSerach()
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.page = val
|
||||
this.getSerach()
|
||||
},
|
||||
searchData() {
|
||||
this.getSerach()
|
||||
},
|
||||
taskDetails(item, num) {
|
||||
if (num == '1') {
|
||||
this.dialogVisibleChuli = true
|
||||
this.id = item.id
|
||||
} else {
|
||||
this.dialogVisible = true
|
||||
this.$http.get(`bookMeeting/${item.id}`).then(({ data: res }) => {
|
||||
console.log(55555555)
|
||||
this.file = res.data.file
|
||||
})
|
||||
}
|
||||
this.lookData = item
|
||||
},
|
||||
|
||||
ok() {
|
||||
let query = {
|
||||
auditViem: this.desc,
|
||||
state: this.radio,
|
||||
id: this.id,
|
||||
}
|
||||
this.$http.put('/bookMeeting', query).then(({ data: res }) => {
|
||||
this.dialogVisibleChuli = false
|
||||
this.radio = '2'
|
||||
this.desc = ''
|
||||
this.getSerach()
|
||||
})
|
||||
},
|
||||
No() {
|
||||
this.radio = '2'
|
||||
this.desc = ''
|
||||
this.dialogVisibleChuli = false
|
||||
},
|
||||
formatter(row, column) {
|
||||
return row.state == '1' ? '待审核' : '审核完成'
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.roomBox {
|
||||
min-height: calc(calc(100vh - 50px - 38px - 30px));
|
||||
.roomHeadSpan {
|
||||
font-weight: 600;
|
||||
}
|
||||
.roomExamineSearch {
|
||||
display: flex;
|
||||
width: 410px;
|
||||
margin-bottom: 20px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
// ::v-deep .el-input {
|
||||
// margin-right: 15px;
|
||||
// display: inline-block;
|
||||
// }
|
||||
// ::v-deep .el-select {
|
||||
// margin-right: 20px;
|
||||
// display: inline-block;
|
||||
// }
|
||||
</style>
|
||||
|
|
@ -1,417 +0,0 @@
|
|||
<!-- 流程业务表单 -->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
|
||||
<!-- 申请人详情 -->
|
||||
<div>
|
||||
<h3>申请人信息</h3>
|
||||
<div class="big-BOX">
|
||||
<p>
|
||||
<span>申请人：<span> {{dataForm.content.applyUserName || '--'}}</span></span>
|
||||
<span>电话：<span>{{dataForm.content.applyUserPhone || '--'}}</span></span>
|
||||
<span>单位：<span>{{dataForm.content.applyUserDeptName || '--'}}</span></span>
|
||||
</p>
|
||||
<p>
|
||||
<span>应用领域：<span>{{dataForm.content.detailsField || '--'}}</span></span>
|
||||
<span> 需求类型：<span> {{dataForm.content.detailsType || '--'}}</span></span>
|
||||
<span> 需求标题： <span> {{dataForm.content.demandSubject || '--'}}</span></span>
|
||||
</p>
|
||||
<p>
|
||||
<span> 需求描述：<span> {{dataForm.content.demandDetails|| '--'}}</span></span>
|
||||
</p>
|
||||
<p>
|
||||
<span> 申请附件：<span> {{dataForm.content.enclosure|| '--'}}<button @click="downloadFile(dataForm.content.enclosure)">下载</button></span></span>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 申请能力 -->
|
||||
<div class="AbilityApply">
|
||||
<h3>申请能力</h3>
|
||||
<ul v-for="item in dataList" :key="item.id">
|
||||
<li class="title">{{item.address}}</li>
|
||||
<li class="clearfix">
|
||||
<img
|
||||
src="~@/assets/img/imgLeft.png"
|
||||
/>
|
||||
<div>
|
||||
<h2>{{item.name}}<span>{{item.type}}</span></h2>
|
||||
<p>{{item.describe}}</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- 流程综合组件 -->
|
||||
<!-- <ren-process-multiple
|
||||
v-if="processVisible"
|
||||
updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
|
||||
saveFormUrl="/processForm/tabilityapplication"
|
||||
dataFormName="dataForm"
|
||||
ref="renProcessMultiple"
|
||||
></ren-process-multiple> -->
|
||||
|
||||
<!-- 审批 -->
|
||||
<div class="agreeOr">
|
||||
<h3>审批</h3>
|
||||
<div>
|
||||
<el-radio-group v-model="agreeOrList" style="width:230px;">
|
||||
<el-radio-button label="同意" class="blueAll">同意</el-radio-button>
|
||||
<el-radio-button label="退回" class="redAll">退回</el-radio-button>
|
||||
</el-radio-group>
|
||||
<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-import></ren-process-detail-import>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 引入工作流公共方法
|
||||
import processModule from '@/mixins/process-module'
|
||||
import qs from 'qs'
|
||||
import RenProcessDetailImport from '@/components/ren-process-detail/src/ren-process-detail-import'
|
||||
export default {
|
||||
// 注入公共方法
|
||||
mixins: [processModule],
|
||||
data () {
|
||||
return {
|
||||
visible: true,
|
||||
// 表单属性是否可编辑
|
||||
// fieldDisabled: false,
|
||||
// dataForm: {
|
||||
// id: '',
|
||||
// user: '',
|
||||
// phone: '',
|
||||
// unit: '',
|
||||
// area: '',
|
||||
// system: '',
|
||||
// scene: '',
|
||||
// basis: ''
|
||||
// }
|
||||
dataForm: {
|
||||
id: '',
|
||||
content: []
|
||||
},
|
||||
dataList: [
|
||||
{
|
||||
// img: '~@/assets/img/imgLeft.png',
|
||||
address: '青岛市应急管理局',
|
||||
name: '组件名称',
|
||||
type: '组件服务',
|
||||
describe: '资源描述资源描述资源描述资源描述资源描述资源描述'
|
||||
},
|
||||
{
|
||||
// img: '~@/assets/img/imgLeft.png',
|
||||
address: '青岛市应急管理局',
|
||||
name: '组件名称',
|
||||
type: '组件服务',
|
||||
describe: '资源描述资源描述资源描述资源描述资源描述资源描述'
|
||||
},
|
||||
{
|
||||
// img: '~@/assets/img/imgLeft.png',
|
||||
address: '青岛市应急管理局',
|
||||
name: '组件名称',
|
||||
type: '组件服务',
|
||||
describe: '资源描述资源描述资源描述资源描述资源描述资源描述'
|
||||
}
|
||||
],
|
||||
inputAgree: '',
|
||||
inputNo: '',
|
||||
agreeOrList: '同意'
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// 将业务KEY赋值给表单
|
||||
this.dataForm.id = this.$route.params.businessKey
|
||||
console.log(this.dataForm, 'ela')
|
||||
this.init()
|
||||
// 流程回调
|
||||
var callbacks = {
|
||||
startProcessSuccessCallback: this.closeCurrentTab,
|
||||
startProcessErrorCallback: this.startProcessErrorCallback,
|
||||
taskHandleSuccessCallback: this.closeCurrentTab,
|
||||
taskHandleErrorCallback: this.taskHandleErrorCallback,
|
||||
formSaveSuccessCallback: null,
|
||||
formSaveErrorCallback: null
|
||||
}
|
||||
// 初始化综合组件
|
||||
this.initProcessMultiple(callbacks)
|
||||
},
|
||||
computed: {
|
||||
// dataRule () {
|
||||
// return {
|
||||
// inputAgree: [
|
||||
// { required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||
// ],
|
||||
// inputNo: [
|
||||
// { required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
},
|
||||
components: {
|
||||
RenProcessDetailImport
|
||||
},
|
||||
methods: {
|
||||
init () {
|
||||
// this.visible = true
|
||||
this.$nextTick(() => {
|
||||
// this.$refs.dataForm.resetFields()
|
||||
if (this.dataForm.id) {
|
||||
// 如业务KEY已存在，不允许编辑
|
||||
// this.fieldDisabled = true
|
||||
this.getInfo()
|
||||
console.log(this.dataForm, 'init')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取信息
|
||||
getInfo () {
|
||||
this.$http
|
||||
.get(`/demanData/${this.dataForm.id}`)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log(res.data)
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
console.log(res.data, 'elas')
|
||||
this.dataForm.content = res.data
|
||||
console.log(this.dataForm, 'ela')
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
// 申请能力
|
||||
applyData () {
|
||||
this.$http
|
||||
.get(`/resource/select/${this.dataForm.id}`)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log(res.data, 'wh')
|
||||
// return this.$message.error(res.msg)
|
||||
}
|
||||
// console.log(res.data, 'elas')
|
||||
// this.dataForm.content = res.data
|
||||
// console.log(this.dataForm, 'ela')
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
|
||||
// 同意与退回
|
||||
agreeOrNot () {
|
||||
if (this.agreeOrList === '同意') {
|
||||
console.log('this.dataForm', this.dataForm)
|
||||
const params = qs.stringify({
|
||||
taskId: this.dataForm.content.instanceId,
|
||||
comment: this.inputAgree
|
||||
})
|
||||
console.log(params)
|
||||
this.$http.post('/act/task/complete?' + params).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log(res)
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
}).catch(() => {})
|
||||
} else if (this.agreeOrList === '退回') {
|
||||
const params = qs.stringify({
|
||||
taskId: this.dataForm.content.instanceId,
|
||||
comment: this.inputNo
|
||||
})
|
||||
this.$http.post('/act/task/backToFirst?', params).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 启动流程出错回调
|
||||
startProcessErrorCallback (data) {
|
||||
console.log(data)
|
||||
},
|
||||
// 任务处理出错回调
|
||||
taskHandleErrorCallback (data) {}
|
||||
},
|
||||
mounted () {
|
||||
this.applyData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
::v-deep .big-BOX{
|
||||
background:rgba(244,245,248,0.8);
|
||||
padding:24px;
|
||||
h3{
|
||||
font-size:16px;
|
||||
color:#212121
|
||||
}
|
||||
p{
|
||||
width:78%;
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
color:#212121;
|
||||
font-size:14px;
|
||||
span{
|
||||
display:inline-block;
|
||||
margin-left:8px;
|
||||
line-height:32px;
|
||||
span{
|
||||
font-weight:bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
p:last-of-type{
|
||||
margin-top:16px;
|
||||
width:100%;
|
||||
span{
|
||||
display:flex;
|
||||
span{
|
||||
padding-left:12px;
|
||||
height:32px;
|
||||
background:rgba(232,234,239,1);
|
||||
border-radius:2px;
|
||||
button{
|
||||
background:unset;
|
||||
border:0;
|
||||
color:#0558e1;
|
||||
font-size:14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .AbilityApply{
|
||||
margin-top:32px;
|
||||
|
||||
h3{
|
||||
font-size:16px;
|
||||
color:#212121;
|
||||
border-bottom:1px solid #dddee1;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
ul{
|
||||
padding-left: 0px;
|
||||
li{
|
||||
list-style:none;
|
||||
padding: 30px 0;
|
||||
border-bottom: 1px solid #dddee1;
|
||||
display:flex;
|
||||
img{
|
||||
width:100px;
|
||||
height:100px;
|
||||
}
|
||||
div{
|
||||
margin-left:16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
h2{
|
||||
margin-bottom:20px;
|
||||
font-size:20px;
|
||||
color:#000;
|
||||
display:flex;
|
||||
span{
|
||||
display:block;
|
||||
font-size:14px;
|
||||
color:#ffffff;
|
||||
margin-left:8px;
|
||||
background:rgba(0,184,230,0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 5px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
p{
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.clearfix:after{
|
||||
display:block;
|
||||
content:"";
|
||||
clear:both;
|
||||
}
|
||||
.title{
|
||||
color:#0558e1;
|
||||
font-size:18px;
|
||||
padding-bottom:0;
|
||||
border-bottom: 0;
|
||||
|
||||
}
|
||||
.title:before {
|
||||
content: "";
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
background: #0558e1;
|
||||
vertical-align: middle;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
::v-deep .agreeOr>div{
|
||||
display:flex;
|
||||
align-items: center;
|
||||
.el-input{
|
||||
margin-right: 10px;
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
}
|
||||
::v-deep .agreeOr>div:last-of-type{
|
||||
margin-top:15px;
|
||||
}
|
||||
.blueAll{
|
||||
::v-deep .el-radio-button__inner{
|
||||
width:80px;
|
||||
height:32px;
|
||||
line-height:32px;
|
||||
padding:0;
|
||||
border-radius:2px;
|
||||
background:#0558e1;
|
||||
color:#ffffff;
|
||||
border:1px solid #0558e1;
|
||||
}
|
||||
}
|
||||
.inputBule{
|
||||
width:55px;
|
||||
height:32px;
|
||||
line-height:32px;
|
||||
padding:0;
|
||||
border-radius:2px;
|
||||
background:#0558e1;
|
||||
color:#ffffff;
|
||||
border:1px solid #0558e1;
|
||||
}
|
||||
::v-deep .is-active{
|
||||
background:#ffffff;
|
||||
color:#0558e1;
|
||||
}
|
||||
.redAll{
|
||||
margin-left:10px;
|
||||
::v-deep .el-radio-button__inner{
|
||||
width:80px;
|
||||
height:32px;
|
||||
line-height:32px;
|
||||
padding:0;
|
||||
border-radius:2px;
|
||||
border:1px solid #e83a48;
|
||||
background:#ffffff;
|
||||
color:#e83a48;
|
||||
margin-left:10px;
|
||||
}
|
||||
:v-deep .el-radio-button__inner{
|
||||
box-shadow: unset;
|
||||
}
|
||||
}
|
||||
.blueInput{
|
||||
width:55px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -64,55 +64,25 @@
|
|||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- 流程综合组件 -->
|
||||
<!-- <ren-process-multiple
|
||||
<ren-process-multiple
|
||||
v-if="processVisible"
|
||||
updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
|
||||
saveFormUrl="/processForm/tabilityapplication"
|
||||
dataFormName="dataForm"
|
||||
ref="renProcessMultiple"
|
||||
></ren-process-multiple> -->
|
||||
<!-- 审批 -->
|
||||
<div class="agreeOr" v-if="taskId">
|
||||
<div>
|
||||
<el-button type="primary" @click="showDialog('同意')">同意</el-button>
|
||||
<el-button type="danger" plain @click="showDialog('拒绝')"
|
||||
>驳回</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 审批弹窗 -->
|
||||
<el-dialog
|
||||
title="审批意见"
|
||||
:close-on-click-modal="false"
|
||||
: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>
|
||||
></ren-process-multiple>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 引入工作流公共方法
|
||||
import processModule from '@/mixins/process-module'
|
||||
import qs from 'qs'
|
||||
import debounce from 'lodash/debounce'
|
||||
import bus from '@/views/bus.js'
|
||||
export default {
|
||||
// 注入公共方法
|
||||
mixins: [processModule],
|
||||
data () {
|
||||
return {
|
||||
// visible: false,
|
||||
visible: false,
|
||||
// 表单属性是否可编辑
|
||||
fieldDisabled: false,
|
||||
dataForm: {
|
||||
|
|
@ -124,13 +94,7 @@ export default {
|
|||
system: '',
|
||||
scene: '',
|
||||
basis: ''
|
||||
},
|
||||
// 审批
|
||||
dialogVisible: false,
|
||||
dialogType: '',
|
||||
input: '',
|
||||
visible: true,
|
||||
taskId: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
|
|
@ -149,8 +113,6 @@ export default {
|
|||
}
|
||||
// 初始化综合组件
|
||||
this.initProcessMultiple(callbacks)
|
||||
this.taskId = this.$route.params.taskId
|
||||
this.dataForm.taskId = this.$route.params.taskId
|
||||
},
|
||||
computed: {
|
||||
dataRule () {
|
||||
|
|
@ -202,128 +164,6 @@ export default {
|
|||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
// 审批
|
||||
showDialog (title) {
|
||||
this.dialogVisible = true
|
||||
this.dialogType = title
|
||||
},
|
||||
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 === '同意') {
|
||||
if (this.input !== '') {
|
||||
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
|
||||
}
|
||||
bus.$emit('AbilityResourcesRemovedInit')
|
||||
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(() => {})
|
||||
this.tabRemoveHandle(data)
|
||||
} else {
|
||||
this.$message.error('请输入审批意见！')
|
||||
}
|
||||
} else if (this.dialogType === '拒绝') {
|
||||
if (this.input !== '') {
|
||||
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
|
||||
}
|
||||
bus.$emit('AbilityResourcesRemovedInit')
|
||||
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)
|
||||
} else {
|
||||
this.$message.error('请输入审批意见！')
|
||||
}
|
||||
}
|
||||
},
|
||||
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)
|
||||
|
|
@ -333,12 +173,3 @@ export default {
|
|||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.agreeOr {
|
||||
& > div {
|
||||
// text-align: right;
|
||||
padding-right: 40px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,294 +0,0 @@
|
|||
<template>
|
||||
<div class="wrapper">
|
||||
<div>
|
||||
<el-form
|
||||
:model="dataForm"
|
||||
ref="dataForm"
|
||||
@keyup.enter.native="dataFormSubmitHandle()"
|
||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
||||
>
|
||||
<el-tooltip placement="bottom" :content="dataForm.comment">
|
||||
<template #title>
|
||||
<span>{{ dataForm.comment }}</span>
|
||||
</template>
|
||||
<el-form-item label="评论内容">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="dataForm.comment"
|
||||
:disabled="fieldDisabled"
|
||||
placeholder="评论内容"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-tooltip>
|
||||
</el-form>
|
||||
</div>
|
||||
<!-- 流程综合组件 -->
|
||||
<!-- <ren-process-multiple
|
||||
v-if="processVisible"
|
||||
updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
|
||||
saveFormUrl="/processForm/tabilityapplication"
|
||||
dataFormName="dataForm"
|
||||
ref="renProcessMultiple"
|
||||
></ren-process-multiple> -->
|
||||
<!-- 审批 -->
|
||||
<div class="agreeOr" v-if="taskId">
|
||||
<div>
|
||||
<el-button type="primary" @click="showDialog('同意')">同意</el-button>
|
||||
<el-button type="danger" plain @click="showDialog('拒绝')"
|
||||
>驳回</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 审批弹窗 -->
|
||||
<el-dialog
|
||||
title="审批意见"
|
||||
:close-on-click-modal="false"
|
||||
: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 qs from 'qs'
|
||||
import debounce from 'lodash/debounce'
|
||||
import bus from '@/views/bus.js'
|
||||
|
||||
export default {
|
||||
// 注入公共方法
|
||||
mixins: [processModule],
|
||||
components: {},
|
||||
props: {
|
||||
// fromList: {
|
||||
// // type: Array,
|
||||
// // default: () => {
|
||||
// // return []
|
||||
// // }
|
||||
// }
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// processVisible: true,
|
||||
// visible: false,
|
||||
// 表单属性是否可编辑
|
||||
fieldDisabled: false,
|
||||
dataForm: [],
|
||||
id: '',
|
||||
shifoushizujian: true,
|
||||
// 审批
|
||||
dialogVisible: false,
|
||||
dialogType: '',
|
||||
input: '',
|
||||
visible: true,
|
||||
taskId: ''
|
||||
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
computed: {},
|
||||
methods: {
|
||||
init () {
|
||||
this.visible = true
|
||||
// this.getInfo(this.$router.currentRoute.params.params.params.resourceDTO.id)
|
||||
// this.dataForm = this.$router.currentRoute.params.params.params.resourceDTO
|
||||
// this.id=this.$router.currentRoute
|
||||
this.$nextTick(() => {
|
||||
this.$refs.dataForm.resetFields()
|
||||
// if (this.dataForm.id) {
|
||||
// 如业务KEY已存在，不允许编辑
|
||||
this.fieldDisabled = true
|
||||
// this.id = this.$router.currentRoute.businessKey
|
||||
this.getInfo(this.$router.currentRoute.params.businessKey)
|
||||
console.log('id', this.$router.currentRoute.params.businessKey)
|
||||
// }
|
||||
})
|
||||
},
|
||||
getInfo (id) {
|
||||
this.$http.get('/demandComment/' + id).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.dataForm = res.data
|
||||
// this.dataForm = res.data.resourceDTO
|
||||
// if (this.dataForm.type != '应用资源') {
|
||||
// this.shifoushizujian = false
|
||||
// } else {
|
||||
// this.shifoushizujian = true
|
||||
// }
|
||||
console.log('this.dataForm', this.dataForm)
|
||||
})
|
||||
},
|
||||
// 审批
|
||||
showDialog (title) {
|
||||
this.dialogVisible = true
|
||||
this.dialogType = title
|
||||
},
|
||||
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 === '同意') {
|
||||
if (this.input !== '') {
|
||||
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
|
||||
}
|
||||
bus.$emit('AbilityResourcesRemovedInit')
|
||||
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(() => {})
|
||||
this.tabRemoveHandle(data)
|
||||
} else {
|
||||
this.$message.error('请输入审批意见！')
|
||||
}
|
||||
} else if (this.dialogType === '拒绝') {
|
||||
if (this.input !== '') {
|
||||
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
|
||||
}
|
||||
bus.$emit('AbilityResourcesRemovedInit')
|
||||
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)
|
||||
} else {
|
||||
this.$message.error('请输入审批意见！')
|
||||
}
|
||||
}
|
||||
},
|
||||
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 }
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// this.dataForm = this.$router.currentRoute.params.id
|
||||
this.init()
|
||||
console.log('fromList', this.$router.currentRoute.params.businessKey)
|
||||
// this.dataForm = this.$router.currentRoute.params.params.params.resourceDTO
|
||||
var callbacks = {
|
||||
startProcessSuccessCallback: this.closeCurrentTab,
|
||||
startProcessErrorCallback: this.startProcessErrorCallback,
|
||||
taskHandleSuccessCallback: this.closeCurrentTab,
|
||||
taskHandleErrorCallback: this.taskHandleErrorCallback,
|
||||
formSaveSuccessCallback: null,
|
||||
formSaveErrorCallback: null
|
||||
}
|
||||
// 初始化综合组件
|
||||
this.initProcessMultiple(callbacks)
|
||||
this.taskId = this.$route.params.taskId
|
||||
this.dataForm.taskId = this.$route.params.taskId
|
||||
},
|
||||
mounted () {}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" >
|
||||
.kuandukuandukuandu {
|
||||
max-width: 1500px;
|
||||
}
|
||||
.agreeOr {
|
||||
& > div {
|
||||
// text-align: right;
|
||||
padding-right: 40px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-textarea__inner {
|
||||
height: 100px;
|
||||
resize: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,136 +0,0 @@
|
|||
<!-- 流程业务表单 -->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
|
||||
<el-form-item label="申请人" prop="user">
|
||||
<el-input v-model="dataForm.user" :disabled="fieldDisabled" placeholder="请输入申请人"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请电话" prop="phone">
|
||||
<el-input v-model="dataForm.phone" :disabled="fieldDisabled" placeholder="请输入申请人电话"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请单位" prop="unit">
|
||||
<el-input v-model="dataForm.unit" :disabled="fieldDisabled" placeholder="请输入申请单位"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="所在地区" prop="area">
|
||||
<el-input v-model="dataForm.area" :disabled="fieldDisabled" placeholder="请输入所在地区"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="申请应用" prop="system">
|
||||
<el-input v-model="dataForm.system" :disabled="fieldDisabled" placeholder="请输入申请应用"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="应用场景" prop="scene">
|
||||
<el-input v-model="dataForm.scene" :disabled="fieldDisabled" placeholder="请输入应用场景"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请依据" prop="basis">
|
||||
<el-input v-model="dataForm.basis" :disabled="fieldDisabled" placeholder="请输入申请依据"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="dataForm.enclosure" label="申请附件" prop="enclosure">
|
||||
<el-button @click="downloadFile(dataForm.enclosure, '申请附件')">附件下载</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- 流程综合组件 -->
|
||||
<ren-process-multiple v-if="processVisible" updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId" saveFormUrl="/processForm/tabilityapplication" dataFormName="dataForm" ref="renProcessMultiple" ></ren-process-multiple>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 引入工作流公共方法
|
||||
import processModule from '@/mixins/process-module'
|
||||
export default {
|
||||
// 注入公共方法
|
||||
mixins: [processModule],
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
// 表单属性是否可编辑
|
||||
fieldDisabled: false,
|
||||
dataForm: {
|
||||
id: '',
|
||||
user: '',
|
||||
phone: '',
|
||||
unit: '',
|
||||
area: '',
|
||||
system: '',
|
||||
scene: '',
|
||||
basis: '',
|
||||
enclosure: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// 将业务KEY赋值给表单
|
||||
this.dataForm.id = this.$route.params.businessKey
|
||||
this.init()
|
||||
// 流程回调
|
||||
var callbacks = {
|
||||
startProcessSuccessCallback: this.closeCurrentTab,
|
||||
startProcessErrorCallback: this.startProcessErrorCallback,
|
||||
taskHandleSuccessCallback: this.closeCurrentTab,
|
||||
taskHandleErrorCallback: this.taskHandleErrorCallback,
|
||||
formSaveSuccessCallback: null,
|
||||
formSaveErrorCallback: null
|
||||
}
|
||||
// 初始化综合组件
|
||||
this.initProcessMultiple(callbacks)
|
||||
},
|
||||
computed: {
|
||||
dataRule () {
|
||||
return {
|
||||
user: [
|
||||
{ required: true, message: '请输入申请人', trigger: 'blur' }
|
||||
],
|
||||
phone: [
|
||||
{ required: true, message: '请输入申请人电话', trigger: 'blur' },
|
||||
{ type: 'string', pattern: /^1[3456789]\d{9}$/, message: '请输入正确的电话号码', trigger: 'blur' }
|
||||
],
|
||||
unit: [
|
||||
{ required: true, message: '请输入申请单位', trigger: 'blur' }
|
||||
],
|
||||
// area: [
|
||||
// { required: true, message: '请输入所在地区', trigger: 'blur' }
|
||||
// ],
|
||||
system: [
|
||||
{ required: true, message: '请输入申请应用', trigger: 'blur' }
|
||||
],
|
||||
scene: [
|
||||
{ required: true, message: '请输入应用场景', trigger: 'blur' }
|
||||
],
|
||||
basis: [
|
||||
{ required: true, message: '请输入申请依据', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init () {
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.dataForm.resetFields()
|
||||
if (this.dataForm.id) {
|
||||
// 如业务KEY已存在，不允许编辑
|
||||
this.fieldDisabled = true
|
||||
this.getInfo()
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取信息
|
||||
getInfo () {
|
||||
this.$http.get(`/processForm/tabilityapplication/${this.dataForm.id}`).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.dataForm = {
|
||||
...this.dataForm,
|
||||
...res.data
|
||||
}
|
||||
}).catch(() => {})
|
||||
},
|
||||
// 启动流程出错回调
|
||||
startProcessErrorCallback (data) {
|
||||
console.log(data)
|
||||
},
|
||||
// 任务处理出错回调
|
||||
taskHandleErrorCallback (data) {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,134 +1,64 @@
|
|||
<!-- 流程业务表单 -->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
|
||||
<!-- 申请人详情 -->
|
||||
<div>
|
||||
<h3>申请人信息</h3>
|
||||
<div class="big-BOX">
|
||||
<p>
|
||||
<span>申请人：<span> {{dataForm.content.user || '--'}}</span></span>
|
||||
<span>电话：<span>{{dataForm.content.phone || '--'}}</span></span>
|
||||
<span>单位：<span>{{dataForm.content.unit || '--'}}</span></span>
|
||||
</p>
|
||||
<p>
|
||||
<span>申请应用：<span>{{dataForm.content.system || '--'}}</span></span>
|
||||
<span> 应用场景：<span> {{dataForm.content.scene || '--'}}</span></span>
|
||||
<span> 申请依据： <span> {{dataForm.content.basis || '--'}}</span></span>
|
||||
</p>
|
||||
<p>
|
||||
<span> 能力应用期望效果：<span> {{dataForm.content.demandDetails|| '--'}}</span></span>
|
||||
</p>
|
||||
<p v-if="dataForm.content.enclosure">
|
||||
<span> 申请附件：<span> {{dataForm.content.enclosure|| '--'}}<button @click="downloadFile(dataForm.content.enclosure)">下载</button></span></span>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 申请能力 -->
|
||||
<div class="AbilityApply">
|
||||
<h3>申请能力</h3>
|
||||
<ul v-for="item in dataList" :key="item.id">
|
||||
<li class="title">{{item.address}}</li>
|
||||
<li class="clearfix">
|
||||
<img
|
||||
src="~@/assets/img/imgLeft.png"
|
||||
/>
|
||||
<div>
|
||||
<h2>{{item.name}}<span>{{item.type}}</span></h2>
|
||||
<p>{{item.describe}}</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
|
||||
<el-form-item label="申请人" prop="user">
|
||||
<el-input v-model="dataForm.user" :disabled="fieldDisabled" placeholder="请输入申请人"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请电话" prop="phone">
|
||||
<el-input v-model="dataForm.phone" :disabled="fieldDisabled" placeholder="请输入申请人电话"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请单位" prop="unit">
|
||||
<el-input v-model="dataForm.unit" :disabled="fieldDisabled" placeholder="请输入申请单位"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="所在地区" prop="area">
|
||||
<el-input v-model="dataForm.area" :disabled="fieldDisabled" placeholder="请输入所在地区"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="申请应用" prop="system">
|
||||
<el-input v-model="dataForm.system" :disabled="fieldDisabled" placeholder="请输入申请应用"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="应用场景" prop="scene">
|
||||
<el-input v-model="dataForm.scene" :disabled="fieldDisabled" placeholder="请输入应用场景"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请依据" prop="basis">
|
||||
<el-input v-model="dataForm.basis" :disabled="fieldDisabled" placeholder="请输入申请依据"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="dataForm.enclosure" label="申请附件" prop="enclosure">
|
||||
<el-button @click="downloadFile(dataForm.enclosure, '申请附件')">附件下载</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- 流程综合组件 -->
|
||||
<!-- <ren-process-multiple
|
||||
v-if="processVisible"
|
||||
updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
|
||||
saveFormUrl="/processForm/tabilityapplication"
|
||||
dataFormName="dataForm"
|
||||
ref="renProcessMultiple"
|
||||
></ren-process-multiple> -->
|
||||
|
||||
<!-- 审批 -->
|
||||
<div class="agreeOr">
|
||||
<h3>审批</h3>
|
||||
<div>
|
||||
<el-radio-group v-model="agreeOrList" style="width:230px;">
|
||||
<el-radio-button label="同意" class="blueAll">同意</el-radio-button>
|
||||
<el-radio-button label="退回" class="redAll">退回</el-radio-button>
|
||||
</el-radio-group>
|
||||
<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-import></ren-process-detail-import>
|
||||
<ren-process-multiple v-if="processVisible" updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId" saveFormUrl="/processForm/tabilityapplication" dataFormName="dataForm" ref="renProcessMultiple" ></ren-process-multiple>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 引入工作流公共方法
|
||||
import processModule from '@/mixins/process-module'
|
||||
import qs from 'qs'
|
||||
import RenProcessDetailImport from '@/components/ren-process-detail/src/ren-process-detail-import'
|
||||
export default {
|
||||
// 注入公共方法
|
||||
mixins: [processModule],
|
||||
data () {
|
||||
return {
|
||||
visible: true,
|
||||
visible: false,
|
||||
// 表单属性是否可编辑
|
||||
// fieldDisabled: false,
|
||||
// dataForm: {
|
||||
// id: '',
|
||||
// user: '',
|
||||
// phone: '',
|
||||
// unit: '',
|
||||
// area: '',
|
||||
// system: '',
|
||||
// scene: '',
|
||||
// basis: ''
|
||||
// }
|
||||
fieldDisabled: false,
|
||||
dataForm: {
|
||||
id: '',
|
||||
content: []
|
||||
},
|
||||
dataList: [
|
||||
{
|
||||
// img: '~@/assets/img/imgLeft.png',
|
||||
address: '青岛市应急管理局',
|
||||
name: '组件名称',
|
||||
type: '组件服务',
|
||||
describe: '资源描述资源描述资源描述资源描述资源描述资源描述'
|
||||
},
|
||||
{
|
||||
// img: '~@/assets/img/imgLeft.png',
|
||||
address: '青岛市应急管理局',
|
||||
name: '组件名称',
|
||||
type: '组件服务',
|
||||
describe: '资源描述资源描述资源描述资源描述资源描述资源描述'
|
||||
},
|
||||
{
|
||||
// img: '~@/assets/img/imgLeft.png',
|
||||
address: '青岛市应急管理局',
|
||||
name: '组件名称',
|
||||
type: '组件服务',
|
||||
describe: '资源描述资源描述资源描述资源描述资源描述资源描述'
|
||||
user: '',
|
||||
phone: '',
|
||||
unit: '',
|
||||
area: '',
|
||||
system: '',
|
||||
scene: '',
|
||||
basis: '',
|
||||
enclosure: ''
|
||||
}
|
||||
],
|
||||
inputAgree: '',
|
||||
inputNo: '',
|
||||
agreeOrList: '同意'
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// 将业务KEY赋值给表单
|
||||
this.dataForm.id = this.$route.params.businessKey
|
||||
console.log(this.dataForm, 'ela')
|
||||
this.init()
|
||||
// 流程回调
|
||||
var callbacks = {
|
||||
|
|
@ -143,275 +73,64 @@ export default {
|
|||
this.initProcessMultiple(callbacks)
|
||||
},
|
||||
computed: {
|
||||
// dataRule () {
|
||||
// return {
|
||||
// inputAgree: [
|
||||
// { required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||
dataRule () {
|
||||
return {
|
||||
user: [
|
||||
{ required: true, message: '请输入申请人', trigger: 'blur' }
|
||||
],
|
||||
phone: [
|
||||
{ required: true, message: '请输入申请人电话', trigger: 'blur' },
|
||||
{ type: 'string', pattern: /^1[3456789]\d{9}$/, message: '请输入正确的电话号码', trigger: 'blur' }
|
||||
],
|
||||
unit: [
|
||||
{ required: true, message: '请输入申请单位', trigger: 'blur' }
|
||||
],
|
||||
// area: [
|
||||
// { required: true, message: '请输入所在地区', trigger: 'blur' }
|
||||
// ],
|
||||
// inputNo: [
|
||||
// { required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
},
|
||||
components: {
|
||||
RenProcessDetailImport
|
||||
system: [
|
||||
{ required: true, message: '请输入申请应用', trigger: 'blur' }
|
||||
],
|
||||
scene: [
|
||||
{ required: true, message: '请输入应用场景', trigger: 'blur' }
|
||||
],
|
||||
basis: [
|
||||
{ required: true, message: '请输入申请依据', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init () {
|
||||
// this.visible = true
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
// this.$refs.dataForm.resetFields()
|
||||
this.$refs.dataForm.resetFields()
|
||||
if (this.dataForm.id) {
|
||||
// 如业务KEY已存在，不允许编辑
|
||||
// this.fieldDisabled = true
|
||||
this.fieldDisabled = true
|
||||
this.getInfo()
|
||||
console.log(this.dataForm, 'init')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取信息
|
||||
getInfo () {
|
||||
this.$http
|
||||
.get(`/processForm/tabilityapplication/${this.dataForm.id}`)
|
||||
.then(({ data: res }) => {
|
||||
this.$http.get(`/processForm/tabilityapplication/${this.dataForm.id}`).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log(res.data)
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
console.log(res.data, 'elas')
|
||||
this.dataForm.content = res.data
|
||||
console.log(this.dataForm, 'ela')
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
// 申请能力
|
||||
applyData () {
|
||||
this.$http
|
||||
.get(`/resource/select/${this.dataForm.instanceId}`)
|
||||
.then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log(res.data, 'hhhhh')
|
||||
// return this.$message.error(res.msg)
|
||||
}
|
||||
// console.log(res.data, 'elas')
|
||||
// this.dataForm.content = res.data
|
||||
// console.log(this.dataForm, 'ela')
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
|
||||
// 同意与退回
|
||||
agreeOrNot () {
|
||||
if (this.agreeOrList === '同意') {
|
||||
console.log('this.dataForm', this.dataForm)
|
||||
const params = qs.stringify({
|
||||
taskId: this.dataForm.content.instanceId,
|
||||
comment: this.inputAgree
|
||||
})
|
||||
console.log(params)
|
||||
this.$http.post('/act/task/complete?' + params).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
console.log(res)
|
||||
this.$message.error(res.msg)
|
||||
this.dataForm = {
|
||||
...this.dataForm,
|
||||
...res.data
|
||||
}
|
||||
}).catch(() => {})
|
||||
} else if (this.agreeOrList === '退回') {
|
||||
const params = qs.stringify({
|
||||
taskId: this.dataForm.content.instanceId,
|
||||
comment: this.inputNo
|
||||
})
|
||||
this.$http.post('/act/task/backToFirst?', params).then(({ data: res }) => {
|
||||
if (res.code !== 0) {
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 启动流程出错回调
|
||||
startProcessErrorCallback (data) {
|
||||
console.log(data)
|
||||
},
|
||||
// 任务处理出错回调
|
||||
taskHandleErrorCallback (data) {}
|
||||
},
|
||||
mounted () {
|
||||
this.applyData()
|
||||
taskHandleErrorCallback (data) {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
::v-deep .big-BOX {
|
||||
background: rgba(244, 245, 248, 0.8);
|
||||
padding: 24px;
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
}
|
||||
p {
|
||||
width: 78%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #212121;
|
||||
font-size: 14px;
|
||||
span {
|
||||
display: inline-block;
|
||||
margin-left: 8px;
|
||||
line-height: 32px;
|
||||
span {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
p:last-of-type {
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .AbilityApply {
|
||||
margin-top: 32px;
|
||||
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
border-bottom: 1px solid #dddee1;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
ul {
|
||||
padding-left: 0px;
|
||||
li {
|
||||
list-style: none;
|
||||
padding: 30px 0;
|
||||
border-bottom: 1px solid #dddee1;
|
||||
display: flex;
|
||||
img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
div {
|
||||
margin-left: 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
h2 {
|
||||
margin-bottom: 20px;
|
||||
font-size: 20px;
|
||||
color: #000;
|
||||
display: flex;
|
||||
span {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
color: #ffffff;
|
||||
margin-left: 8px;
|
||||
background: rgba(0, 184, 230, 0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 5px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.clearfix:after {
|
||||
display: block;
|
||||
content: "";
|
||||
clear: both;
|
||||
}
|
||||
.title {
|
||||
color: #0558e1;
|
||||
font-size: 18px;
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
.title:before {
|
||||
content: "";
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
background: #0558e1;
|
||||
vertical-align: middle;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .agreeOr > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.el-input {
|
||||
margin-right: 10px;
|
||||
margin-left: 32px;
|
||||
}
|
||||
}
|
||||
::v-deep .agreeOr > div:last-of-type {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.blueAll {
|
||||
::v-deep .el-radio-button__inner {
|
||||
width: 80px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
padding: 0;
|
||||
border-radius: 2px;
|
||||
background: #ffffff;
|
||||
color: #0558e1;
|
||||
border: 1px solid #0558e1;
|
||||
}
|
||||
::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
||||
box-shadow: unset !important;
|
||||
background: #0558e1;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.inputBule {
|
||||
width: 55px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
padding: 0;
|
||||
border-radius: 2px;
|
||||
background: #0558e1;
|
||||
color: #ffffff;
|
||||
border: 1px solid #0558e1;
|
||||
}
|
||||
.redAll {
|
||||
margin-left: 10px;
|
||||
::v-deep .el-radio-button__inner {
|
||||
width: 80px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
padding: 0;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #e83a48;
|
||||
background: #ffffff;
|
||||
color: #e83a48;
|
||||
margin-left: 10px;
|
||||
}
|
||||
::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
||||
box-shadow: unset !important;
|
||||
color: #ffffff;
|
||||
background: #e83a48;
|
||||
}
|
||||
}
|
||||
.blueInput {
|
||||
width: 55px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue