Compare commits
20 Commits
master
...
hi-ucs-xha
Author | SHA1 | Date |
---|---|---|
gaoyuanwei | 0d5de8e4d9 | |
gaoyuanwei | 276ebfd3bc | |
wuhongjian | e2b8c6a9bd | |
wuhongjian | 6be6ffae6a | |
wuhongjian | 6481dac6d8 | |
a0049873 | 356953ec5d | |
wuhongjian | ade205cc03 | |
a0049873 | 37c22b5c25 | |
a0049873 | e1cc54f1a1 | |
wuhongjian | bb614e285a | |
a0049873 | f392764b0a | |
a0049873 | 69e71e841a | |
a0049873 | 0cfb08788a | |
wuhongjian | 05be0ae3fb | |
wuhongjian | 0ba396e9d3 | |
gaoyuanwei | 7e1eaa8410 | |
gaoyuanwei | 22e395109f | |
wuhongjian | 90163aa9e3 | |
wuhongjian | fdb6c28f3c | |
wuhongjian | 6260158c16 |
|
@ -1,12 +1 @@
|
||||||
back/*.zip
|
back/dist-西海岸-后台管理.zip
|
||||||
back/public/index.html
|
|
||||||
back/dist-西海岸-后台管理-带配置文件.zip
|
|
||||||
back/dist-市局-后台管理-带配置文件.zip
|
|
||||||
back/dist-包头-后台管理.zip
|
|
||||||
back/dist-市局-后台管理.zip
|
|
||||||
back/dist-市局-后台管理-v0.8.2.1.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
|
|
||||||
|
|
|
@ -22,7 +22,6 @@
|
||||||
"carddragger": "^0.3.6",
|
"carddragger": "^0.3.6",
|
||||||
"clipboard": "^2.0.6",
|
"clipboard": "^2.0.6",
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.6.5",
|
||||||
"crypto-js": "^4.1.1",
|
|
||||||
"echarts": "^4.7.0",
|
"echarts": "^4.7.0",
|
||||||
"element-ui": "^2.13.2",
|
"element-ui": "^2.13.2",
|
||||||
"file-saver": "^2.0.5",
|
"file-saver": "^2.0.5",
|
||||||
|
@ -34,7 +33,6 @@
|
||||||
"lodash": "^4.17.19",
|
"lodash": "^4.17.19",
|
||||||
"monaco-editor": "^0.20.0",
|
"monaco-editor": "^0.20.0",
|
||||||
"monaco-editor-webpack-plugin": "^1.9.0",
|
"monaco-editor-webpack-plugin": "^1.9.0",
|
||||||
"pinyin-pro": "^3.11.0",
|
|
||||||
"qs": "^6.9.4",
|
"qs": "^6.9.4",
|
||||||
"quill": "^1.3.7",
|
"quill": "^1.3.7",
|
||||||
"sass": "^1.51.0",
|
"sass": "^1.51.0",
|
||||||
|
@ -58,7 +56,6 @@
|
||||||
"@vue/cli-service": "^4.4.6",
|
"@vue/cli-service": "^4.4.6",
|
||||||
"@vue/eslint-config-standard": "^5.1.2",
|
"@vue/eslint-config-standard": "^5.1.2",
|
||||||
"babel-eslint": "^10.1.0",
|
"babel-eslint": "^10.1.0",
|
||||||
"crypto-js": "^4.1.1",
|
|
||||||
"element-theme-chalk": "^2.13.2",
|
"element-theme-chalk": "^2.13.2",
|
||||||
"eslint": "^7.5.0",
|
"eslint": "^7.5.0",
|
||||||
"eslint-plugin-import": "^2.22.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]
|
|
|
@ -2,7 +2,7 @@
|
||||||
* @Author: hisense.wuhongjian
|
* @Author: hisense.wuhongjian
|
||||||
* @Date: 2022-04-11 10:11:40
|
* @Date: 2022-04-11 10:11:40
|
||||||
* @LastEditors: hisense.wuhongjian
|
* @LastEditors: hisense.wuhongjian
|
||||||
* @LastEditTime: 2022-08-29 09:54:59
|
* @LastEditTime: 2022-06-13 11:21:09
|
||||||
* @Description: 告诉大家这是什么
|
* @Description: 告诉大家这是什么
|
||||||
-->
|
-->
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
|
@ -11,11 +11,10 @@
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
<link rel="shortcut icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="shortcut icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
<script type="text/javascript" src="./config/basicConfig.js"></script>
|
|
||||||
<!-- 站点配置 -->
|
<!-- 站点配置 -->
|
||||||
<script>
|
<script>
|
||||||
window.SITE_CONFIG = {};
|
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['nodeEnv'] = '<%= process.env.VUE_APP_NODE_ENV %>';
|
||||||
window.SITE_CONFIG['apiURL'] = ''; // api请求地址
|
window.SITE_CONFIG['apiURL'] = ''; // api请求地址
|
||||||
window.SITE_CONFIG['storeState'] = {}; // vuex本地储存初始化状态(用于不刷新页面的情况下,也能重置初始化项目中所有状态)
|
window.SITE_CONFIG['storeState'] = {}; // vuex本地储存初始化状态(用于不刷新页面的情况下,也能重置初始化项目中所有状态)
|
||||||
|
@ -28,19 +27,54 @@
|
||||||
'isTab': true, // 是否通过tab展示内容?
|
'isTab': true, // 是否通过tab展示内容?
|
||||||
'iframeURL': '' // 是否通过iframe嵌套展示内容? (以http[s]://开头, 自动匹配)
|
'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['menuList'] = []; // 左侧菜单列表(后台返回,未做处理)
|
||||||
window.SITE_CONFIG['permissions'] = []; // 页面按钮操作权限(后台返回,未做处理)
|
window.SITE_CONFIG['permissions'] = []; // 页面按钮操作权限(后台返回,未做处理)
|
||||||
window.SITE_CONFIG['dynamicRoutes'] = []; // 动态路由列表
|
window.SITE_CONFIG['dynamicRoutes'] = []; // 动态路由列表
|
||||||
window.SITE_CONFIG['dynamicMenuRoutes'] = []; // 动态(菜单)路由列表
|
window.SITE_CONFIG['dynamicMenuRoutes'] = []; // 动态(菜单)路由列表
|
||||||
window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] = false; // 动态(菜单)路由是否已经添加的状态标示(用于判断是否需要重新拉取数据并进行动态添加操作)
|
window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] = false; // 动态(菜单)路由是否已经添加的状态标示(用于判断是否需要重新拉取数据并进行动态添加操作)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<!-- 开发环境 -->
|
||||||
|
<% if (process.env.VUE_APP_NODE_ENV === 'dev') { %>
|
||||||
<script>
|
<script>
|
||||||
window.SITE_CONFIG['frontUrl'] = _global.config.previewUrl + '#/vueTemplateDemo';
|
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.166:8888/renren-admin';
|
||||||
window.SITE_CONFIG['previewUrl'] = _global.config.previewUrl;
|
window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
|
||||||
window.SITE_CONFIG['apiURL'] = _global.config.apiURL;
|
// window.SITE_CONFIG['apiURL'] = 'http://15.2.23.141:8000/renren-admin';
|
||||||
// WebSocket地址
|
// WebSocket地址
|
||||||
window.SITE_CONFIG['socketURL'] =_global.config.socketURL;
|
window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
|
||||||
</script>
|
</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>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 6.4 KiB |
Before Width: | Height: | Size: 6.2 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 4.8 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 5.5 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 5.0 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1013 B |
Before Width: | Height: | Size: 1015 B |
Before Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1016 B |
Before Width: | Height: | Size: 1020 B |
Before Width: | Height: | Size: 64 KiB |
Before Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 40 KiB |
Before Width: | Height: | Size: 3.1 KiB |
Before Width: | Height: | Size: 32 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 102 B |
Before Width: | Height: | Size: 9.8 KiB |
Before Width: | Height: | Size: 9.4 KiB |
Before Width: | Height: | Size: 9.4 KiB |
Before Width: | Height: | Size: 3.0 KiB |
Before Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 74 KiB |
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
|
* @Author: hisense.wuhongjian
|
||||||
* @Date: 2022-04-11 16:30:04
|
* @Date: 2022-04-11 16:30:04
|
||||||
* @LastEditors: hisense.liangjunhua
|
* @LastEditors: hisense.wuhongjian
|
||||||
* @LastEditTime: 2022-07-16 15:07:44
|
* @LastEditTime: 2022-06-06 13:14:02
|
||||||
* @Description: 告诉大家这是什么
|
* @Description: 告诉大家这是什么
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<el-card shadow="never" class="aui-card--fill">
|
<el-card shadow="never" class="aui-card--fill">
|
||||||
<!-- 流程图 -->
|
<!-- 流程图 -->
|
||||||
<!-- <h4>{{ $t('process.flowImage') }}</h4>
|
<h4>{{ $t('process.flowImage') }}</h4>
|
||||||
<img :src="getResourceURL()" class="image"> -->
|
<img :src="getResourceURL()" class="image">
|
||||||
<!-- 流转详情 -->
|
<!-- 流转详情 -->
|
||||||
<h4>{{ $t('process.circulation') }}</h4>
|
<h4>{{ $t('process.circulation') }}</h4>
|
||||||
<div class="mod-sys__dict">
|
<div class="mod-sys__dict">
|
||||||
|
|
|
@ -486,7 +486,7 @@ $--cascader-tag-background: #f0f2f5;
|
||||||
|
|
||||||
/* Group
|
/* 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-offset-bottom: 12px !default;
|
||||||
$--group-option-fill-hover: rgba($--color-black, 0.06) !default;
|
$--group-option-fill-hover: rgba($--color-black, 0.06) !default;
|
||||||
$--group-title-color: $--color-black !default;
|
$--group-title-color: $--color-black !default;
|
||||||
|
|
|
@ -25,7 +25,6 @@ t.choose = 'Please Choose'
|
||||||
t.fileName = 'File Name'
|
t.fileName = 'File Name'
|
||||||
t.design = 'Online Design'
|
t.design = 'Online Design'
|
||||||
t.preview = 'Preview'
|
t.preview = 'Preview'
|
||||||
t.reset='Reset'
|
|
||||||
|
|
||||||
t.prompt = {}
|
t.prompt = {}
|
||||||
t.prompt.title = 'Prompt'
|
t.prompt.title = 'Prompt'
|
||||||
|
|
|
@ -25,7 +25,6 @@ t.choose = '请选择'
|
||||||
t.fileName = '文件名'
|
t.fileName = '文件名'
|
||||||
t.design = '在线设计'
|
t.design = '在线设计'
|
||||||
t.preview = '预览'
|
t.preview = '预览'
|
||||||
t.reset = '重置'
|
|
||||||
|
|
||||||
t.prompt = {}
|
t.prompt = {}
|
||||||
t.prompt.title = '提示'
|
t.prompt.title = '提示'
|
||||||
|
@ -36,7 +35,6 @@ t.prompt.deleteBatch = '请选择删除项'
|
||||||
|
|
||||||
t.validate = {}
|
t.validate = {}
|
||||||
t.validate.required = '必填项不能为空'
|
t.validate.required = '必填项不能为空'
|
||||||
t.validate.pwdStrength = '密码需包含字母、数字、标点符号,并超过8位'
|
|
||||||
t.validate.format = '{attr}格式错误'
|
t.validate.format = '{attr}格式错误'
|
||||||
|
|
||||||
t.upload = {}
|
t.upload = {}
|
||||||
|
@ -547,33 +545,4 @@ t.notice.new = '有新通知'
|
||||||
t.notice.disconnect = '连接断开'
|
t.notice.disconnect = '连接断开'
|
||||||
t.notice.disconnectMessage = 'WebSocket连接已断开,请检查网络'
|
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
|
export default t
|
||||||
|
|
|
@ -25,7 +25,6 @@ t.choose = '請選擇'
|
||||||
t.fileName = '文件名'
|
t.fileName = '文件名'
|
||||||
t.design = '在線設計'
|
t.design = '在線設計'
|
||||||
t.preview = '預覽'
|
t.preview = '預覽'
|
||||||
t.reset='重置'
|
|
||||||
|
|
||||||
t.prompt = {}
|
t.prompt = {}
|
||||||
t.prompt.title = '提示'
|
t.prompt.title = '提示'
|
||||||
|
|
|
@ -17,8 +17,8 @@ export default {
|
||||||
exportURL: '', // 导出接口,API地址
|
exportURL: '', // 导出接口,API地址
|
||||||
requestCallback: null // 获取列表以后执行的回调
|
requestCallback: null // 获取列表以后执行的回调
|
||||||
},
|
},
|
||||||
flag: false,
|
flag:false,
|
||||||
time: null,
|
time:null,
|
||||||
// 默认属性
|
// 默认属性
|
||||||
dataForm: {
|
dataForm: {
|
||||||
}, // 查询条件
|
}, // 查询条件
|
||||||
|
@ -102,22 +102,13 @@ export default {
|
||||||
return item
|
return item
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
this.total = this.mixinViewModuleOptions.getDataListIsPage ? this.dataList.length : 0
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log('数据列表', this.dataList, this.mixinViewModuleOptions.getDataListURL)
|
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) {
|
if (this.mixinViewModuleOptions.requestCallback) {
|
||||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,12 +5,6 @@ import { isURL } from '@/utils/validate'
|
||||||
import store from '@/store'
|
import store from '@/store'
|
||||||
import Cookies from 'js-cookie'
|
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)
|
Vue.use(Router)
|
||||||
|
|
||||||
// 页面路由(独立页面)
|
// 页面路由(独立页面)
|
||||||
|
@ -41,8 +35,7 @@ export const moduleRoutes = {
|
||||||
meta: { title: '主入口布局' },
|
meta: { title: '主入口布局' },
|
||||||
children: [
|
children: [
|
||||||
// todos 临时调整,后期去掉
|
// todos 临时调整,后期去掉
|
||||||
// { path: '/home', redirect: '/bscatalogue-bscatalogue', 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: '/home', redirect: '/workBench-workBench', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } },
|
|
||||||
{ path: '/iframe', component: null, name: 'iframe', meta: { title: 'iframe', 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
|
route.meta.iframeURL = URL
|
||||||
} else {
|
} else {
|
||||||
const urlArr = URL.split('?')
|
const urlArr = URL.split('?')
|
||||||
// debugger
|
debugger
|
||||||
URL = urlArr[0].replace(/^\//, '').replace(/_/g, '-')
|
URL = urlArr[0].replace(/^\//, '').replace(/_/g, '-')
|
||||||
route.path = route.name = URL.replace(/\//g, '-')
|
route.path = route.name = URL.replace(/\//g, '-')
|
||||||
route.component = () => import(`@/views/modules/${URL}`)
|
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 Vue from 'vue'
|
||||||
import Vuex from 'vuex'
|
import Vuex from 'vuex'
|
||||||
import cloneDeep from 'lodash/cloneDeep'
|
import cloneDeep from 'lodash/cloneDeep'
|
||||||
|
@ -19,7 +12,7 @@ export default new Vuex.Store({
|
||||||
// 导航条, 布局风格, default(白色) / colorful(鲜艳)
|
// 导航条, 布局风格, default(白色) / colorful(鲜艳)
|
||||||
navbarLayoutType: 'colorful',
|
navbarLayoutType: 'colorful',
|
||||||
// 侧边栏, 布局皮肤, default(白色) / dark(黑色)
|
// 侧边栏, 布局皮肤, default(白色) / dark(黑色)
|
||||||
sidebarLayoutSkin: 'default',
|
sidebarLayoutSkin: 'dark',
|
||||||
// 侧边栏, 折叠状态
|
// 侧边栏, 折叠状态
|
||||||
sidebarFold: false,
|
sidebarFold: false,
|
||||||
// 侧边栏, 菜单
|
// 侧边栏, 菜单
|
||||||
|
@ -69,12 +62,12 @@ export default new Vuex.Store({
|
||||||
// dispatch('getDepartmentSelects')
|
// dispatch('getDepartmentSelects')
|
||||||
},
|
},
|
||||||
getCatalogueTree ({ commit }) {
|
getCatalogueTree ({ commit }) {
|
||||||
// http.get('bscatalogue/bscatalogue/page').then(res => {
|
http.get('bscatalogue/bscatalogue/page').then(res => {
|
||||||
// if (res.data.code === 0) {
|
if (res.data.code === 0) {
|
||||||
// console.log(22222, res.data)
|
console.log(22222, res.data)
|
||||||
// commit('setCatalogueTree', res.data.data)
|
commit('setCatalogueTree', res.data.data)
|
||||||
// }
|
}
|
||||||
// })
|
})
|
||||||
},
|
},
|
||||||
getDepartmentSelects ({ commit }) {
|
getDepartmentSelects ({ commit }) {
|
||||||
http.get('applyRecord/bsAbilityApplyRecord/page').then(({ data: res }) => {
|
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">
|
<el-dropdown class="aui-content--tabs-tools">
|
||||||
<i class="el-icon-arrow-down"></i>
|
<i class="el-icon-arrow-down"></i>
|
||||||
<el-dropdown-menu slot="dropdown" :show-timeout="0">
|
<el-dropdown-menu slot="dropdown" :show-timeout="0">
|
||||||
<el-dropdown-item
|
<el-dropdown-item @click.native="tabRemoveHandle($store.state.contentTabsActiveName)">{{ $t('contentTabs.closeCurrent') }}</el-dropdown-item>
|
||||||
@click.native="tabRemoveHandle($store.state.contentTabsActiveName)"
|
<el-dropdown-item @click.native="tabsCloseOtherHandle()">{{ $t('contentTabs.closeOther') }}</el-dropdown-item>
|
||||||
>{{ $t("contentTabs.closeCurrent") }}</el-dropdown-item
|
<el-dropdown-item @click.native="tabsCloseAllHandle()">{{ $t('contentTabs.closeAll') }}</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-menu>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
<el-tabs
|
<el-tabs v-model="$store.state.contentTabsActiveName" @tab-click="tabSelectedHandle" @tab-remove="tabRemoveHandle">
|
||||||
v-model="$store.state.contentTabsActiveName"
|
|
||||||
@tab-click="tabSelectedHandle"
|
|
||||||
@tab-remove="tabRemoveHandle"
|
|
||||||
>
|
|
||||||
<el-tab-pane
|
<el-tab-pane
|
||||||
v-for="item in $store.state.contentTabs"
|
v-for="item in $store.state.contentTabs"
|
||||||
:key="item.name"
|
:key="item.name"
|
||||||
:name="item.name"
|
:name="item.name"
|
||||||
:label="item.title"
|
:label="item.title"
|
||||||
:closable="item.name !== 'home'"
|
:closable="item.name !== 'home'"
|
||||||
:class="{ 'is-iframe': tabIsIframe(item.iframeURL) }"
|
:class="{ 'is-iframe': tabIsIframe(item.iframeURL) }">
|
||||||
>
|
|
||||||
<template v-if="item.name === 'home'">
|
<template v-if="item.name === 'home'">
|
||||||
<svg
|
<svg slot="label" class="icon-svg aui-content--tabs-icon-nav" aria-hidden="true"><use xlink:href="#icon-home"></use></svg>
|
||||||
slot="label"
|
|
||||||
class="icon-svg aui-content--tabs-icon-nav"
|
|
||||||
aria-hidden="true"
|
|
||||||
>
|
|
||||||
<use xlink:href="#icon-home"></use>
|
|
||||||
</svg>
|
|
||||||
</template>
|
</template>
|
||||||
<iframe
|
<iframe v-if="tabIsIframe(item.iframeURL)" :src="item.iframeURL" width="100%" height="100%" frameborder="0" scrolling="yes"></iframe>
|
||||||
v-if="tabIsIframe(item.iframeURL)"
|
|
||||||
:src="item.iframeURL"
|
|
||||||
width="100%"
|
|
||||||
height="100%"
|
|
||||||
frameborder="0"
|
|
||||||
scrolling="yes"
|
|
||||||
></iframe>
|
|
||||||
<keep-alive v-else>
|
<keep-alive v-else>
|
||||||
<router-view
|
<router-view v-if="item.name === $store.state.contentTabsActiveName" />
|
||||||
v-if="item.name === $store.state.contentTabsActiveName"
|
|
||||||
/>
|
|
||||||
</keep-alive>
|
</keep-alive>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
|
@ -65,91 +38,59 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { isURL } from "@/utils/validate";
|
import { isURL } from '@/utils/validate'
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data () {
|
||||||
return {};
|
return {
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// tabs, 是否通过iframe展示
|
// tabs, 是否通过iframe展示
|
||||||
tabIsIframe(url) {
|
tabIsIframe (url) {
|
||||||
return isURL(url);
|
return isURL(url)
|
||||||
},
|
},
|
||||||
// tabs, 选中tab
|
// tabs, 选中tab
|
||||||
tabSelectedHandle(tab) {
|
tabSelectedHandle (tab) {
|
||||||
tab = this.$store.state.contentTabs.filter(
|
tab = this.$store.state.contentTabs.filter(item => item.name === tab.name)[0]
|
||||||
(item) => item.name === tab.name
|
|
||||||
)[0];
|
|
||||||
if (tab) {
|
if (tab) {
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
name: /^iframe_.+/.test(tab.name) ? "iframe" : tab.name,
|
'name': /^iframe_.+/.test(tab.name) ? 'iframe' : tab.name,
|
||||||
params: { ...tab.params },
|
'params': { ...tab.params },
|
||||||
query: { ...tab.query },
|
'query': { ...tab.query }
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// tabs, 删除tab
|
// tabs, 删除tab
|
||||||
tabRemoveHandle(tabName) {
|
tabRemoveHandle (tabName) {
|
||||||
if (tabName === "home") {
|
if (tabName === 'home') {
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(
|
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => item.name !== tabName)
|
||||||
(item) => item.name !== tabName
|
|
||||||
);
|
|
||||||
if (this.$store.state.contentTabs.length <= 0) {
|
if (this.$store.state.contentTabs.length <= 0) {
|
||||||
this.$store.state.sidebarMenuActiveName =
|
this.$store.state.sidebarMenuActiveName = this.$store.state.contentTabsActiveName = 'home'
|
||||||
this.$store.state.contentTabsActiveName = "home";
|
return false
|
||||||
return false;
|
|
||||||
}
|
}
|
||||||
// 当前选中tab被删除
|
// 当前选中tab被删除
|
||||||
if (tabName === this.$store.state.contentTabsActiveName) {
|
if (tabName === this.$store.state.contentTabsActiveName) {
|
||||||
let tab =
|
let tab = this.$store.state.contentTabs[this.$store.state.contentTabs.length - 1]
|
||||||
this.$store.state.contentTabs[
|
|
||||||
this.$store.state.contentTabs.length - 1
|
|
||||||
];
|
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
name: /^iframe_.+/.test(tab.name) ? "iframe" : tab.name,
|
name: /^iframe_.+/.test(tab.name) ? 'iframe' : tab.name,
|
||||||
params: { ...tab.params },
|
params: { ...tab.params },
|
||||||
query: { ...tab.query },
|
query: { ...tab.query }
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// tabs, 关闭其它
|
// tabs, 关闭其它
|
||||||
tabsCloseOtherHandle() {
|
tabsCloseOtherHandle () {
|
||||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(
|
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => {
|
||||||
(item) => {
|
return item.name === 'home' || item.name === this.$store.state.contentTabsActiveName
|
||||||
return (
|
})
|
||||||
item.name === "home" ||
|
|
||||||
item.name === this.$store.state.contentTabsActiveName
|
|
||||||
);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
// tabs, 关闭全部
|
// tabs, 关闭全部
|
||||||
tabsCloseAllHandle() {
|
tabsCloseAllHandle () {
|
||||||
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(
|
this.$store.state.contentTabs = this.$store.state.contentTabs.filter(item => item.name === 'home')
|
||||||
(item) => item.name === "home"
|
this.$router.push({ 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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</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>
|
<template>
|
||||||
<el-dialog
|
<el-dialog
|
||||||
:visible.sync="visible"
|
:visible.sync="visible"
|
||||||
|
@ -20,7 +13,7 @@
|
||||||
<el-input v-model="dataForm.password" type="password" :placeholder="$t('updatePassword.password')"></el-input>
|
<el-input v-model="dataForm.password" type="password" :placeholder="$t('updatePassword.password')"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item prop="newPassword" :label="$t('updatePassword.newPassword')">
|
<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>
|
||||||
<el-form-item prop="confirmPassword" :label="$t('updatePassword.confirmPassword')">
|
<el-form-item prop="confirmPassword" :label="$t('updatePassword.confirmPassword')">
|
||||||
<el-input v-model="dataForm.confirmPassword" type="password" :placeholder="$t('updatePassword.confirmPassword')"></el-input>
|
<el-input v-model="dataForm.confirmPassword" type="password" :placeholder="$t('updatePassword.confirmPassword')"></el-input>
|
||||||
|
@ -35,7 +28,6 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import debounce from 'lodash/debounce'
|
import debounce from 'lodash/debounce'
|
||||||
import { Encrypt } from '@/utils/crypto'
|
|
||||||
import { clearLoginInfo } from '@/utils'
|
import { clearLoginInfo } from '@/utils'
|
||||||
export default {
|
export default {
|
||||||
data () {
|
data () {
|
||||||
|
@ -50,28 +42,6 @@ export default {
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
dataRule () {
|
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) => {
|
var validateConfirmPassword = (rule, value, callback) => {
|
||||||
if (this.dataForm.newPassword !== value) {
|
if (this.dataForm.newPassword !== value) {
|
||||||
return callback(new Error(this.$t('updatePassword.validate.confirmPassword')))
|
return callback(new Error(this.$t('updatePassword.validate.confirmPassword')))
|
||||||
|
@ -83,8 +53,7 @@ export default {
|
||||||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||||
],
|
],
|
||||||
newPassword: [
|
newPassword: [
|
||||||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' },
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
|
||||||
{ validator: validatePassword, trigger: 'blur' }
|
|
||||||
],
|
],
|
||||||
confirmPassword: [
|
confirmPassword: [
|
||||||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' },
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' },
|
||||||
|
@ -94,33 +63,19 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
changeInput (value) {
|
|
||||||
if (value !== value.replace(/ /g, '')) {
|
|
||||||
this.$message({
|
|
||||||
message: '密码中不允许存在空格!',
|
|
||||||
type: 'warning'
|
|
||||||
})
|
|
||||||
this.dataForm.newPassword = value.replace(/ /g, '')
|
|
||||||
// console.log('密码发生变化=============>', value)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
init () {
|
init () {
|
||||||
this.visible = true
|
this.visible = true
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs.dataForm.resetFields()
|
this.$refs['dataForm'].resetFields()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
// 表单提交
|
// 表单提交
|
||||||
dataFormSubmitHandle: debounce(function () {
|
dataFormSubmitHandle: debounce(function () {
|
||||||
this.$refs.dataForm.validate((valid) => {
|
this.$refs['dataForm'].validate((valid) => {
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
this.$http.put('/sys/user/password', {
|
this.$http.put('/sys/user/password', this.dataForm).then(({ data: res }) => {
|
||||||
confirmPassword: Encrypt(this.dataForm.confirmPassword),
|
|
||||||
newPassword: Encrypt(this.dataForm.newPassword),
|
|
||||||
password: Encrypt(this.dataForm.password)
|
|
||||||
}).then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
|
@ -136,7 +91,7 @@ export default {
|
||||||
})
|
})
|
||||||
}).catch(() => {})
|
}).catch(() => {})
|
||||||
})
|
})
|
||||||
}, 1000, { leading: true, trailing: false })
|
}, 1000, { 'leading': true, 'trailing': false })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,102 +1,59 @@
|
||||||
<template>
|
<template>
|
||||||
<nav
|
<nav class="aui-navbar" :class="`aui-navbar--${$store.state.navbarLayoutType}`">
|
||||||
class="aui-navbar"
|
|
||||||
:class="`aui-navbar--${$store.state.navbarLayoutType}`"
|
|
||||||
>
|
|
||||||
<div class="aui-navbar__header">
|
<div class="aui-navbar__header">
|
||||||
<h1 class="aui-navbar__brand" @click="$router.push({ name: 'home' })">
|
<h1 class="aui-navbar__brand" @click="$router.push({ name: 'home' })">
|
||||||
<a class="aui-navbar__brand-mini" href="javascript:;">{{
|
<a class="aui-navbar__brand-lg" href="javascript:;">{{ $t('brand.lg') }}</a>
|
||||||
$t("brand.mini")
|
<a class="aui-navbar__brand-mini" href="javascript:;">{{ $t('brand.mini') }}</a>
|
||||||
}}</a>
|
|
||||||
<a class="aui-navbar__brand-lg" href="javascript:;">{{
|
|
||||||
$t("brand.lg")
|
|
||||||
}}</a>
|
|
||||||
<span>——</span>
|
|
||||||
<span class="back-title-text">后台管理系统</span>
|
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="aui-navbar__body">
|
<div class="aui-navbar__body">
|
||||||
<el-menu class="aui-navbar__menu mr-auto" mode="horizontal">
|
<el-menu class="aui-navbar__menu mr-auto" mode="horizontal">
|
||||||
<!-- <el-menu-item
|
<el-menu-item index="1" @click="$store.state.sidebarFold = !$store.state.sidebarFold">
|
||||||
index="1"
|
<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--switch" aria-hidden="true"><use xlink:href="#icon-outdent"></use></svg>
|
||||||
@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>
|
||||||
<el-menu-item index="2" @click="refresh()">
|
<el-menu-item index="2" @click="refresh()">
|
||||||
<svg
|
<svg class="icon-svg aui-navbar__icon-menu aui-navbar__icon-menu--refresh" aria-hidden="true"><use xlink:href="#icon-sync"></use></svg>
|
||||||
class="
|
</el-menu-item>
|
||||||
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>
|
||||||
<el-menu class="aui-navbar__menu" mode="horizontal">
|
<el-menu class="aui-navbar__menu" mode="horizontal">
|
||||||
<el-menu-item index="1">
|
<el-menu-item index="1">
|
||||||
<el-dropdown placement="bottom" :show-timeout="0">
|
<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-menu slot="dropdown">
|
||||||
<el-dropdown-item
|
<el-dropdown-item v-for="(val, key) in i18nMessages" :key="key" @click.native="$i18n.locale = key">{{ val._lang }}</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-menu>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item index="2">
|
<el-menu-item index="2">
|
||||||
<a href="//115.28.200.119:9091" target="_blank">
|
<a href="//115.28.200.119:9091" target="_blank">
|
||||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
|
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-earth"></use></svg>
|
||||||
<use xlink:href="#icon-earth"></use>
|
|
||||||
</svg>
|
|
||||||
</a>
|
</a>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item index="3" v-if="$hasPermission('sys:notice:all')">
|
<el-menu-item index="3" v-if="$hasPermission('sys:notice:all')">
|
||||||
<el-badge :is-dot="messageTip">
|
<el-badge :is-dot="messageTip">
|
||||||
<a href="#" @click="myNoticeRouter()"
|
<a href="#" @click="myNoticeRouter()"><i class="el-icon-bell"></i></a>
|
||||||
><i class="el-icon-bell"></i
|
|
||||||
></a>
|
|
||||||
</el-badge>
|
</el-badge>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item index="4" @click="fullscreenHandle()">
|
<el-menu-item index="4" @click="fullscreenHandle()">
|
||||||
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
|
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-fullscreen"></use></svg>
|
||||||
<use xlink:href="#icon-fullscreen"></use>
|
|
||||||
</svg>
|
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item index="5" class="aui-navbar__avatar">
|
<el-menu-item index="5" class="aui-navbar__avatar">
|
||||||
<el-dropdown placement="bottom" :show-timeout="0">
|
<el-dropdown placement="bottom" :show-timeout="0">
|
||||||
<span class="el-dropdown-link">
|
<span class="el-dropdown-link">
|
||||||
<img src="~@/assets/img/avatar.png" />
|
<img src="~@/assets/img/avatar.png">
|
||||||
<span>{{ $store.state.user.name }}</span>
|
<span>{{ $store.state.user.name }}</span>
|
||||||
<i class="el-icon-arrow-down"></i>
|
<i class="el-icon-arrow-down"></i>
|
||||||
</span>
|
</span>
|
||||||
<el-dropdown-menu slot="dropdown">
|
<el-dropdown-menu slot="dropdown">
|
||||||
<el-dropdown-item @click.native="updatePasswordHandle()">{{
|
<el-dropdown-item @click.native="updatePasswordHandle()">{{ $t('updatePassword.title') }}</el-dropdown-item>
|
||||||
$t("updatePassword.title")
|
<el-dropdown-item @click.native="logoutHandle()">{{ $t('logout') }}</el-dropdown-item>
|
||||||
}}</el-dropdown-item>
|
|
||||||
<el-dropdown-item @click.native="logoutHandle()">{{
|
|
||||||
$t("logout")
|
|
||||||
}}</el-dropdown-item>
|
|
||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</el-menu>
|
</el-menu>
|
||||||
</div>
|
</div>
|
||||||
<!-- 弹窗, 修改密码 -->
|
<!-- 弹窗, 修改密码 -->
|
||||||
<update-password
|
<update-password v-if="updatePasswordVisible" ref="updatePassword"></update-password>
|
||||||
v-if="updatePasswordVisible"
|
|
||||||
ref="updatePassword"
|
|
||||||
></update-password>
|
|
||||||
</nav>
|
</nav>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
@ -151,17 +108,14 @@ export default {
|
||||||
this.$router.replace('notice-notice-user')
|
this.$router.replace('notice-notice-user')
|
||||||
},
|
},
|
||||||
getUnReadCount () {
|
getUnReadCount () {
|
||||||
this.$http
|
this.$http.get('/sys/notice/mynotice/unread').then(({ data: res }) => {
|
||||||
.get('/sys/notice/mynotice/unread')
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
if (res.data > 0) {
|
if (res.data > 0) {
|
||||||
this.messageTip = true
|
this.messageTip = true
|
||||||
}
|
}
|
||||||
})
|
}).catch(() => {})
|
||||||
.catch(() => {})
|
|
||||||
},
|
},
|
||||||
// 全屏
|
// 全屏
|
||||||
fullscreenHandle () {
|
fullscreenHandle () {
|
||||||
|
@ -183,57 +137,20 @@ export default {
|
||||||
},
|
},
|
||||||
// 退出
|
// 退出
|
||||||
logoutHandle () {
|
logoutHandle () {
|
||||||
this.$confirm(
|
this.$confirm(this.$t('prompt.info', { handle: this.$t('logout') }), this.$t('prompt.title'), {
|
||||||
this.$t('prompt.info', { handle: this.$t('logout') }),
|
|
||||||
this.$t('prompt.title'),
|
|
||||||
{
|
|
||||||
confirmButtonText: this.$t('confirm'),
|
confirmButtonText: this.$t('confirm'),
|
||||||
cancelButtonText: this.$t('cancel'),
|
cancelButtonText: this.$t('cancel'),
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
}
|
}).then(() => {
|
||||||
)
|
this.$http.post('/logout').then(({ data: res }) => {
|
||||||
.then(() => {
|
|
||||||
this.$http
|
|
||||||
.post('/logout')
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
clearLoginInfo()
|
clearLoginInfo()
|
||||||
this.$router.push({ name: 'login' })
|
this.$router.push({ name: 'login' })
|
||||||
})
|
}).catch(() => {})
|
||||||
.catch(() => {})
|
}).catch(() => {})
|
||||||
})
|
|
||||||
.catch(() => {})
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</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>
|
<template>
|
||||||
<el-submenu
|
<el-submenu v-if="menu.children && menu.children.length >= 1" :index="menu.id" :popper-append-to-body="false">
|
||||||
v-if="menu.children && menu.children.length >= 1"
|
|
||||||
:index="menu.id"
|
|
||||||
:popper-append-to-body="false"
|
|
||||||
>
|
|
||||||
<template slot="title">
|
<template slot="title">
|
||||||
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true">
|
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true"><use :xlink:href="`#${menu.icon}`"></use></svg>
|
||||||
<use :xlink:href="`#${menu.icon}`"></use>
|
<span>{{ menu.name }}</span>
|
||||||
</svg>
|
|
||||||
<span class="first-level-text">{{ menu.name }}</span>
|
|
||||||
</template>
|
</template>
|
||||||
<sub-menu
|
<sub-menu v-for="item in menu.children" :key="item.id" :menu="item"></sub-menu>
|
||||||
v-for="item in menu.children"
|
|
||||||
:key="item.id"
|
|
||||||
:menu="item"
|
|
||||||
></sub-menu>
|
|
||||||
</el-submenu>
|
</el-submenu>
|
||||||
<el-menu-item v-else :index="menu.id" ref="li">
|
<el-menu-item v-else :index="menu.id" ref="li">
|
||||||
<a
|
<a
|
||||||
:href="
|
:href="isBrowserTabOpen(menu.id) ? getBrowserTabOpenURL(menu.id) : 'javascript:;'"
|
||||||
isBrowserTabOpen(menu.id)
|
|
||||||
? getBrowserTabOpenURL(menu.id)
|
|
||||||
: 'javascript:;'
|
|
||||||
"
|
|
||||||
:target="isBrowserTabOpen(menu.id) ? '_blank' : '_self'"
|
:target="isBrowserTabOpen(menu.id) ? '_blank' : '_self'"
|
||||||
@click="
|
@click="isBrowserTabOpen(menu.id) ? 'return false;' : gotoRouteHandle(menu.id)">
|
||||||
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>
|
||||||
"
|
|
||||||
>
|
|
||||||
<svg class="icon-svg aui-sidebar__menu-icon" aria-hidden="true">
|
|
||||||
<use :xlink:href="`#${menu.icon}`"></use>
|
|
||||||
</svg>
|
|
||||||
<span>{{ menu.name }}</span>
|
<span>{{ menu.name }}</span>
|
||||||
</a>
|
</a>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import SubMenu from "./main-sidebar-sub-menu";
|
import SubMenu from './main-sidebar-sub-menu'
|
||||||
export default {
|
export default {
|
||||||
name: "sub-menu",
|
name: 'sub-menu',
|
||||||
data() {
|
data () {
|
||||||
return {
|
return {
|
||||||
browserTabOpenList: ["1156748733921165314"],
|
browserTabOpenList: [
|
||||||
};
|
'1156748733921165314',
|
||||||
|
]
|
||||||
|
}
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
menu: {
|
menu: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: true,
|
required: true
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
SubMenu,
|
SubMenu
|
||||||
},
|
},
|
||||||
created() {
|
created () {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
if (this.$refs.li) {
|
if (this.$refs.li) {
|
||||||
let $li = this.$refs.li.$el;
|
let $li = this.$refs.li.$el
|
||||||
let $a = $li.firstElementChild;
|
let $a = $li.firstElementChild
|
||||||
if ($a) {
|
if ($a) {
|
||||||
let pl = "0",
|
let pl = '0', pr = '0'
|
||||||
pr = "0";
|
|
||||||
if ($li.currentStyle) {
|
if ($li.currentStyle) {
|
||||||
pl = $li.currentStyle["paddingLeft"];
|
pl = $li.currentStyle['paddingLeft']
|
||||||
pr = $li.currentStyle["paddingRight"];
|
pr = $li.currentStyle['paddingRight']
|
||||||
} else {
|
} else {
|
||||||
pl = window.document.defaultView.getComputedStyle($li, null)[
|
pl = window.document.defaultView.getComputedStyle($li, null)['paddingLeft']
|
||||||
"paddingLeft"
|
pr = window.document.defaultView.getComputedStyle($li, null)['paddingRight']
|
||||||
];
|
|
||||||
pr = window.document.defaultView.getComputedStyle($li, null)[
|
|
||||||
"paddingRight"
|
|
||||||
];
|
|
||||||
}
|
}
|
||||||
$li.setAttribute("style", `padding-left: 0; padding-right: 0;`);
|
$li.setAttribute('style', `padding-left: 0; padding-right: 0;`)
|
||||||
$a.setAttribute(
|
$a.setAttribute('style', `padding-left: ${pl}; padding-right: ${pr};`)
|
||||||
"style",
|
|
||||||
`padding-left: ${pl}; padding-right: ${pr};`
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 是否通过浏览器Tab打开菜单
|
// 是否通过浏览器Tab打开菜单
|
||||||
isBrowserTabOpen(menuId) {
|
isBrowserTabOpen (menuId) {
|
||||||
return (
|
return this.browserTabOpenList.filter(item => item === menuId).length >= 1;
|
||||||
this.browserTabOpenList.filter((item) => item === menuId).length >= 1
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
// 获取浏览器Tab打开菜单URL
|
// 获取浏览器Tab打开菜单URL
|
||||||
getBrowserTabOpenURL(menuId) {
|
getBrowserTabOpenURL (menuId) {
|
||||||
var route = window.SITE_CONFIG["dynamicMenuRoutes"].filter(
|
var route = window.SITE_CONFIG['dynamicMenuRoutes'].filter(item => item.meta.menuId === menuId)[0]
|
||||||
(item) => item.meta.menuId === menuId
|
return route ? route.meta.iframeURL : '';
|
||||||
)[0];
|
|
||||||
return route ? route.meta.iframeURL : "";
|
|
||||||
},
|
},
|
||||||
// 通过menuId与动态(菜单)路由进行匹配跳转至指定路由
|
// 通过menuId与动态(菜单)路由进行匹配跳转至指定路由
|
||||||
gotoRouteHandle(menuId) {
|
gotoRouteHandle (menuId) {
|
||||||
var route = window.SITE_CONFIG["dynamicMenuRoutes"].filter(
|
var route = window.SITE_CONFIG['dynamicMenuRoutes'].filter(item => item.meta.menuId === menuId)[0]
|
||||||
(item) => item.meta.menuId === menuId
|
|
||||||
)[0];
|
|
||||||
if (route) {
|
if (route) {
|
||||||
this.$router.push({ name: route.name });
|
this.$router.push({ name: route.name })
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.aui-sidebar__menu {
|
.aui-sidebar__menu {
|
||||||
.first-level-text {
|
.el-menu-item > a {
|
||||||
font-size: 16px;
|
|
||||||
color: #212121;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
.el-menu-item {
|
|
||||||
&.is-active {
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: #0058e1;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
display: block;
|
display: block;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
span {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</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>
|
<template>
|
||||||
<aside
|
<aside :class="['aui-sidebar', `aui-sidebar--${$store.state.sidebarLayoutSkin}`]">
|
||||||
:class="['aui-sidebar', `aui-sidebar--${$store.state.sidebarLayoutSkin}`]"
|
|
||||||
>
|
|
||||||
<div class="aui-sidebar__inner">
|
<div class="aui-sidebar__inner">
|
||||||
<el-menu
|
<el-menu
|
||||||
:default-active="$store.state.sidebarMenuActiveName"
|
:default-active="$store.state.sidebarMenuActiveName"
|
||||||
:collapse="$store.state.sidebarFold"
|
:collapse="$store.state.sidebarFold"
|
||||||
:unique-opened="true"
|
:unique-opened="true"
|
||||||
:collapseTransition="false"
|
:collapseTransition="false"
|
||||||
class="aui-sidebar__menu"
|
class="aui-sidebar__menu">
|
||||||
>
|
<sub-menu v-for="menu in $store.state.sidebarMenuList" :key="menu.id" :menu="menu" />
|
||||||
<sub-menu
|
|
||||||
v-for="menu in $store.state.sidebarMenuList"
|
|
||||||
:key="menu.id"
|
|
||||||
:menu="menu"
|
|
||||||
/>
|
|
||||||
</el-menu>
|
</el-menu>
|
||||||
</div>
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import SubMenu from "./main-sidebar-sub-menu";
|
import SubMenu from './main-sidebar-sub-menu'
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data () {
|
||||||
return {};
|
return {
|
||||||
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
SubMenu,
|
SubMenu
|
||||||
},
|
},
|
||||||
created() {
|
created () {
|
||||||
this.$store.state.sidebarMenuList = window.SITE_CONFIG["menuList"];
|
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;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</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>
|
<template>
|
||||||
<div class="aui-theme-tools" :class="{ 'aui-theme-tools--open': isOpen }">
|
<div class="aui-theme-tools" :class="{ 'aui-theme-tools--open': isOpen }">
|
||||||
<div class="aui-theme-tools__toggle" @click="isOpen = !isOpen">
|
<div class="aui-theme-tools__toggle" @click="isOpen = !isOpen">
|
||||||
<svg class="icon-svg" aria-hidden="true">
|
<svg class="icon-svg" aria-hidden="true"><use xlink:href="#icon-setting"></use></svg>
|
||||||
<use xlink:href="#icon-setting"></use>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="aui-theme-tools__content">
|
<div class="aui-theme-tools__content">
|
||||||
<div class="aui-theme-tools__item">
|
<div class="aui-theme-tools__item">
|
||||||
<h3>Navbar</h3>
|
<h3>Navbar</h3>
|
||||||
<el-checkbox
|
<el-checkbox v-model="$store.state.navbarLayoutType" true-label="colorful">colorful 鲜艳</el-checkbox>
|
||||||
v-model="$store.state.navbarLayoutType"
|
|
||||||
true-label="colorful"
|
|
||||||
>colorful 鲜艳</el-checkbox
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="aui-theme-tools__item">
|
<div class="aui-theme-tools__item">
|
||||||
<h3>Sidebar</h3>
|
<h3>Sidebar</h3>
|
||||||
<el-checkbox v-model="$store.state.sidebarLayoutSkin" true-label="dark"
|
<el-checkbox v-model="$store.state.sidebarLayoutSkin" true-label="dark">dark 黑色</el-checkbox>
|
||||||
>dark 黑色</el-checkbox
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="aui-theme-tools__item">
|
<div class="aui-theme-tools__item">
|
||||||
<h3>Theme</h3>
|
<h3>Theme</h3>
|
||||||
<el-radio-group v-model="themeColor" @change="themeColorChangeHandle">
|
<el-radio-group v-model="themeColor" @change="themeColorChangeHandle">
|
||||||
<el-radio
|
<el-radio v-for="item in themeList" :key="item.name" :label="item.name">{{ `${item.name} ${item.desc}` }}</el-radio>
|
||||||
v-for="item in themeList"
|
|
||||||
:key="item.name"
|
|
||||||
:label="item.name"
|
|
||||||
>{{ `${item.name} ${item.desc}` }}</el-radio
|
|
||||||
>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -45,50 +24,38 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data () {
|
||||||
return {
|
return {
|
||||||
isOpen: false,
|
isOpen: false,
|
||||||
themeList: require("@/element-ui/config.js"),
|
themeList: require('@/element-ui/config.js'),
|
||||||
themeColor: "blue",
|
themeColor: 'turquoise'
|
||||||
};
|
}
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.themeColorChangeHandle("blue");
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
themeColorChangeHandle(val) {
|
themeColorChangeHandle (val) {
|
||||||
var styleList = [
|
var styleList = [
|
||||||
{
|
{
|
||||||
id: "J_elementTheme",
|
id: 'J_elementTheme',
|
||||||
url: `${
|
url: `${process.env.BASE_URL}element-theme/${val}/index.css?t=${new Date().getTime()}`
|
||||||
process.env.BASE_URL
|
|
||||||
}element-theme/${val}/index.css?t=${new Date().getTime()}`,
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "J_auiTheme",
|
id: 'J_auiTheme',
|
||||||
url: `${
|
url: `${process.env.BASE_URL}element-theme/${val}/aui.css?t=${new Date().getTime()}`
|
||||||
process.env.BASE_URL
|
}
|
||||||
}element-theme/${val}/aui.css?t=${new Date().getTime()}`,
|
]
|
||||||
},
|
|
||||||
];
|
|
||||||
for (var i = 0; i < styleList.length; i++) {
|
for (var i = 0; i < styleList.length; i++) {
|
||||||
var el = document.querySelector(`#${styleList[i].id}`);
|
var el = document.querySelector(`#${styleList[i].id}`)
|
||||||
if (el) {
|
if (el) {
|
||||||
el.href = styleList[i].url;
|
el.href = styleList[i].url
|
||||||
continue;
|
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>
|
<template>
|
||||||
<div
|
<div v-loading.fullscreen.lock="loading" :element-loading-text="$t('loading')" :class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]">
|
||||||
v-loading.fullscreen.lock="loading"
|
|
||||||
:element-loading-text="$t('loading')"
|
|
||||||
:class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]"
|
|
||||||
>
|
|
||||||
<template v-if="!loading">
|
<template v-if="!loading">
|
||||||
<main-navbar />
|
<main-navbar />
|
||||||
<main-sidebar />
|
<main-sidebar />
|
||||||
|
@ -51,22 +47,20 @@ export default {
|
||||||
created () {
|
created () {
|
||||||
this.windowResizeHandle()
|
this.windowResizeHandle()
|
||||||
this.routeHandle(this.$route)
|
this.routeHandle(this.$route)
|
||||||
Promise.all([this.getUserInfo(), this.getPermissions()]).then(() => {
|
Promise.all([
|
||||||
|
this.getUserInfo(),
|
||||||
|
this.getPermissions()
|
||||||
|
]).then(() => {
|
||||||
this.loading = false
|
this.loading = false
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 窗口改变大小
|
// 窗口改变大小
|
||||||
windowResizeHandle () {
|
windowResizeHandle () {
|
||||||
this.$store.state.sidebarFold =
|
this.$store.state.sidebarFold = document.documentElement['clientWidth'] <= 992 || false
|
||||||
document.documentElement.clientWidth <= 992 || false
|
window.addEventListener('resize', debounce(() => {
|
||||||
window.addEventListener(
|
this.$store.state.sidebarFold = document.documentElement['clientWidth'] <= 992 || false
|
||||||
'resize',
|
}, 150))
|
||||||
debounce(() => {
|
|
||||||
this.$store.state.sidebarFold =
|
|
||||||
document.documentElement.clientWidth <= 992 || false
|
|
||||||
}, 150)
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
// 路由, 监听
|
// 路由, 监听
|
||||||
routeHandle (route) {
|
routeHandle (route) {
|
||||||
|
@ -75,66 +69,52 @@ export default {
|
||||||
}
|
}
|
||||||
let tab = {}
|
let tab = {}
|
||||||
let routeName = route.name
|
let routeName = route.name
|
||||||
const routeMeta = route.meta
|
let routeMeta = route.meta
|
||||||
if (route.name === 'iframe') {
|
if (route.name === 'iframe') {
|
||||||
const url = route.query.url || ''
|
let url = route.query.url || ''
|
||||||
if (!isURL(url)) {
|
if (!isURL(url)) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
const key = route.query.key || new Date().getTime()
|
let key = route.query.key || new Date().getTime()
|
||||||
routeName = `${routeName}_${key}`
|
routeName = `${routeName}_${key}`
|
||||||
routeMeta.title = key.toString()
|
routeMeta.title = key.toString()
|
||||||
routeMeta.menuId = route.query.menuId || ''
|
routeMeta.menuId = route.query.menuId || ''
|
||||||
routeMeta.iframeURL = url
|
routeMeta.iframeURL = url
|
||||||
}
|
}
|
||||||
tab = this.$store.state.contentTabs.filter(
|
tab = this.$store.state.contentTabs.filter(item => item.name === routeName)[0]
|
||||||
(item) => item.name === routeName
|
|
||||||
)[0]
|
|
||||||
if (!tab) {
|
if (!tab) {
|
||||||
tab = {
|
tab = {
|
||||||
...window.SITE_CONFIG.contentTabDefault,
|
...window.SITE_CONFIG['contentTabDefault'],
|
||||||
...routeMeta,
|
...routeMeta,
|
||||||
name: routeName,
|
'name': routeName,
|
||||||
params: { ...route.params },
|
'params': { ...route.params },
|
||||||
query: { ...route.query }
|
'query': { ...route.query }
|
||||||
}
|
}
|
||||||
this.$store.state.contentTabs =
|
this.$store.state.contentTabs = this.$store.state.contentTabs.concat(tab)
|
||||||
this.$store.state.contentTabs.concat(tab)
|
|
||||||
}
|
}
|
||||||
this.$store.state.sidebarMenuActiveName = tab.menuId
|
this.$store.state.sidebarMenuActiveName = tab.menuId
|
||||||
this.$store.state.contentTabsActiveName = tab.name
|
this.$store.state.contentTabsActiveName = tab.name
|
||||||
},
|
},
|
||||||
// 获取当前管理员信息
|
// 获取当前管理员信息
|
||||||
getUserInfo () {
|
getUserInfo () {
|
||||||
return this.$http
|
return this.$http.get('/sys/user/info').then(({ data: res }) => {
|
||||||
.get('/sys/user/info')
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
this.$store.state.user.id = res.data.id
|
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
|
this.$store.state.user.superAdmin = res.data.superAdmin
|
||||||
})
|
}).catch(() => {})
|
||||||
.catch(() => {})
|
|
||||||
},
|
},
|
||||||
// 获取权限
|
// 获取权限
|
||||||
getPermissions () {
|
getPermissions () {
|
||||||
return this.$http
|
return this.$http.get('/sys/menu/permissions').then(({ data: res }) => {
|
||||||
.get('/sys/menu/permissions')
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
window.SITE_CONFIG.permissions = res.data
|
window.SITE_CONFIG['permissions'] = res.data
|
||||||
})
|
}).catch(() => {})
|
||||||
.catch(() => {})
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</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>
|
|
|
@ -638,6 +638,7 @@ export default {
|
||||||
description: '',
|
description: '',
|
||||||
downloads: 0,
|
downloads: 0,
|
||||||
image: '',
|
image: '',
|
||||||
|
showList: [],
|
||||||
infoList: [],
|
infoList: [],
|
||||||
link: '',
|
link: '',
|
||||||
name: '',
|
name: '',
|
||||||
|
|
|
@ -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>
|
<template>
|
||||||
<el-card shadow="never" class="aui-card--fill">
|
<el-card shadow="never" class="aui-card--fill">
|
||||||
<div class="mod-ability__bsabilityai">
|
<div class="mod-ability__bsabilityai">
|
||||||
<el-form :inline="true" :model="dataForm">
|
<el-form
|
||||||
|
:inline="true"
|
||||||
|
:model="dataForm"
|
||||||
|
>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="dataForm.name"
|
v-model="dataForm.name"
|
||||||
|
@ -10,34 +13,29 @@
|
||||||
></el-input>
|
></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="primary" @click="getDataList2(dataForm.name)">{{
|
<el-button @click="getDataList2(dataForm.name)">{{
|
||||||
$t('query')
|
$t("query")
|
||||||
}}</el-button>
|
}}</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="info" @click="exportHandle()">{{
|
<el-button type="info" @click="exportHandle()">{{
|
||||||
$t('export')
|
$t("export")
|
||||||
}}</el-button>
|
}}</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- <el-form-item>
|
<el-form-item>
|
||||||
<el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:save')"
|
v-if="$hasPermission('ability:bsabilityai:save')"
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="addOrUpdateHandleAI()"
|
@click="addOrUpdateHandleAI()"
|
||||||
>挂接</el-button
|
>挂接</el-button
|
||||||
>
|
>
|
||||||
</el-form-item> -->
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="showPutOnTheShelf()"
|
|
||||||
>上架</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:delete')"
|
v-if="$hasPermission('ability:bsabilityai:delete')"
|
||||||
type="danger"
|
type="danger"
|
||||||
@click="deleteHandle2()"
|
@click="deleteHandle2()"
|
||||||
>{{ $t('deleteBatch') }}</el-button
|
>{{ $t("deleteBatch") }}</el-button
|
||||||
>
|
>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
|
@ -46,11 +44,12 @@
|
||||||
</el-form>
|
</el-form>
|
||||||
<el-table
|
<el-table
|
||||||
v-loading="dataListLoading"
|
v-loading="dataListLoading"
|
||||||
|
v-if="dataList[0].infoList"
|
||||||
:data="dataList"
|
:data="dataList"
|
||||||
|
:height="qp ? '650px' : '650px'"
|
||||||
border
|
border
|
||||||
@selection-change="dataListSelectionChangeHandle"
|
@selection-change="dataListSelectionChangeHandle"
|
||||||
style="width: 100%"
|
style="width: 100%;"
|
||||||
height="650px"
|
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
type="selection"
|
type="selection"
|
||||||
|
@ -59,68 +58,24 @@
|
||||||
width="50"
|
width="50"
|
||||||
></el-table-column>
|
></el-table-column>
|
||||||
<af-table-column
|
<af-table-column
|
||||||
:show-overflow-tooltip="true"
|
|
||||||
width="280"
|
|
||||||
prop="name"
|
prop="name"
|
||||||
label="组件名称"
|
label="组件名称"
|
||||||
header-align="center"
|
header-align="center"
|
||||||
align="center"
|
align="center"
|
||||||
></af-table-column>
|
></af-table-column>
|
||||||
<af-table-column
|
<af-table-column
|
||||||
:show-overflow-tooltip="true"
|
v-for="(item, index) in dataList[0].infoList"
|
||||||
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"
|
|
||||||
:key="index"
|
:key="index"
|
||||||
:label="item.attrType"
|
:label="item.attrType"
|
||||||
header-align="center"
|
header-align="center"
|
||||||
align="center"
|
align="center"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ findValue(scope.row.infoList2, item.attrType) }}
|
{{
|
||||||
|
findValue(scope.row.infoList, item.attrType)
|
||||||
|
}}
|
||||||
</template>
|
</template>
|
||||||
</af-table-column>
|
</af-table-column>
|
||||||
</template>
|
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:label="$t('handle')"
|
:label="$t('handle')"
|
||||||
fixed="right"
|
fixed="right"
|
||||||
|
@ -129,38 +84,25 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<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
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
@click="UpdateData(scope.row)"
|
@click="UpdateHandle(scope.row)"
|
||||||
>{{ $t('update') }}</el-button
|
>{{ $t("update") }}</el-button
|
||||||
>
|
>
|
||||||
<el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:delete')"
|
v-if="$hasPermission('ability:bsabilityai:delete')"
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
@click="deleteHandle2(scope.row.id)"
|
@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 type="text" size="small" @click="showDetail(scope.row)"
|
||||||
>详情</el-button
|
>展示</el-button
|
||||||
>
|
>
|
||||||
<el-button type="text" size="small" @click="showDocument(scope.row)"
|
<el-button type="text" size="small" @click="showDocument(scope.row)"
|
||||||
>技术文档</el-button
|
>开发文档</el-button
|
||||||
>
|
|
||||||
<el-button
|
|
||||||
type="text"
|
|
||||||
size="small"
|
|
||||||
@click="showRelateApplication(scope.row)"
|
|
||||||
>关联应用</el-button
|
|
||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
@ -182,57 +124,7 @@
|
||||||
ref="addOrUpdate"
|
ref="addOrUpdate"
|
||||||
@refreshDataList="getDataList"
|
@refreshDataList="getDataList"
|
||||||
></add-or-update>
|
></add-or-update>
|
||||||
<relate-application
|
|
||||||
v-if="relateApplicationVisible"
|
|
||||||
ref="relateApplication"
|
|
||||||
:nameArray="['未关联应用名称', '已关联应用名称']"
|
|
||||||
:relateInfo="relateInfo"
|
|
||||||
@isShowRelatePopup="handleIsShowRelatePopup"
|
|
||||||
></relate-application>
|
|
||||||
</div>
|
</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>
|
</el-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -241,32 +133,10 @@ import mixinViewModule from '@/mixins/view-module'
|
||||||
import AddOrUpdate from './bsabilityai-add-or-update'
|
import AddOrUpdate from './bsabilityai-add-or-update'
|
||||||
import dictionaries from '@/utils/dictionaries'
|
import dictionaries from '@/utils/dictionaries'
|
||||||
import qs from 'qs'
|
import qs from 'qs'
|
||||||
import { pinyin } from 'pinyin-pro'
|
|
||||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
|
||||||
import putOnTheShelf from '@/views/modules/putOnTheShelf'
|
|
||||||
export default {
|
export default {
|
||||||
mixins: [mixinViewModule],
|
mixins: [mixinViewModule],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
required: ['归属部门', '部门联系人', '部门联系人电话', '应用领域', '共享条件', '算法名称', '算法描述', '图层名称', '图层描述', '组件名称', '组件描述', '组件地址', '服务地址', '服务接口', '接口请求方式', '算法类别'],
|
|
||||||
notFilled: [],
|
|
||||||
insertList: [],
|
|
||||||
putOnTheShelfList: [],
|
|
||||||
radio: '',
|
|
||||||
showPutOnTheShelfFlag: false,
|
|
||||||
showPutOnTheShelfFlag2: false,
|
|
||||||
submitFrom: {
|
|
||||||
type: '组件服务',
|
|
||||||
deptId: '',
|
|
||||||
delFlag: 0,
|
|
||||||
infoList: [
|
|
||||||
{
|
|
||||||
attrType: '组件类型',
|
|
||||||
attrValue: '',
|
|
||||||
delFlag: 0
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
mixinViewModuleOptions: {
|
mixinViewModuleOptions: {
|
||||||
getDataListURL: '/resource/page',
|
getDataListURL: '/resource/page',
|
||||||
getDataListIsPage: true,
|
getDataListIsPage: true,
|
||||||
|
@ -285,58 +155,25 @@ export default {
|
||||||
selectType: 0,
|
selectType: 0,
|
||||||
type: '组件服务'
|
type: '组件服务'
|
||||||
},
|
},
|
||||||
// qp: false,
|
qp: false
|
||||||
// 关联应用弹窗
|
|
||||||
relateApplicationVisible: false,
|
|
||||||
relateInfo: {
|
|
||||||
id: '',
|
|
||||||
responseData: {},
|
|
||||||
linkType: ''
|
|
||||||
},
|
|
||||||
typeInput: '组件服务',
|
|
||||||
uuidOne: '',
|
|
||||||
uuidTwo: '',
|
|
||||||
uuidSnum: ''
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {},
|
watch: {},
|
||||||
components: {
|
components: {
|
||||||
AddOrUpdate,
|
AddOrUpdate
|
||||||
RelateApplication,
|
|
||||||
putOnTheShelf
|
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
this.dataForm.name = ''
|
this.dataForm.name = ''
|
||||||
this.dataForm.type = '组件服务'
|
this.dataForm.type = '组件服务'
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
// window.addEventListener('resize', this.a)
|
window.addEventListener('resize', this.a)
|
||||||
// this.fullScreen()
|
this.fullScreen()
|
||||||
},
|
},
|
||||||
methods: {
|
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 () {
|
reset () {
|
||||||
this.$http
|
this.$http.get(
|
||||||
.get(
|
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||||
this.mixinViewModuleOptions.getDataListURL +
|
|
||||||
'?' +
|
|
||||||
qs.stringify({
|
|
||||||
// order: this.order,
|
// order: this.order,
|
||||||
// orderField: this.orderField,
|
// orderField: this.orderField,
|
||||||
// type: '组件服务',
|
// type: '组件服务',
|
||||||
|
@ -359,19 +196,6 @@ export default {
|
||||||
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
|
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
|
||||||
? res.data.list
|
? res.data.list
|
||||||
: res.data
|
: 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
|
this.total = this.mixinViewModuleOptions.getDataListIsPage
|
||||||
? res.data.total
|
? res.data.total
|
||||||
: 0
|
: 0
|
||||||
|
@ -385,7 +209,7 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
findValue (list, type) {
|
findValue (list, type) {
|
||||||
const found = list.find((item) => item.attrType === type)
|
const found = list.find(item => item.attrType === type)
|
||||||
if (found) {
|
if (found) {
|
||||||
return found.attrValue
|
return found.attrValue
|
||||||
} else {
|
} else {
|
||||||
|
@ -393,109 +217,25 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
showDetail (val) {
|
showDetail (val) {
|
||||||
console.log(val)
|
|
||||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
|
||||||
// this.addOrUpdateHandle(id)
|
// this.addOrUpdateHandle(id)
|
||||||
// this.addOrUpdateVisible = true
|
this.addOrUpdateVisible = true
|
||||||
// this.disabled = false
|
this.disabled = false
|
||||||
// this.$nextTick(() => {
|
console.log('显示数据=============》', val)
|
||||||
// this.$refs.addOrUpdate.UpdateState = false
|
this.$nextTick(() => {
|
||||||
// this.$refs.addOrUpdate.dataFormShowDetails = val
|
this.$refs.addOrUpdate.UpdateState = false
|
||||||
// this.$refs.addOrUpdate.init()
|
this.$refs.addOrUpdate.dataFormShowDetails = val
|
||||||
// })
|
this.$refs.addOrUpdate.init()
|
||||||
// this.disabled = true
|
})
|
||||||
},
|
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)
|
|
||||||
},
|
},
|
||||||
showDocument (val) {
|
showDocument (val) {
|
||||||
// 第一步:创建文档
|
console.log(val)
|
||||||
// 不存在文档时创建空文档
|
window.open(window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type, '_blank')
|
||||||
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列数据,成功后打开文档编辑
|
|
||||||
},
|
},
|
||||||
getDataList2 (names) {
|
getDataList2 (names) {
|
||||||
if (names != null) {
|
if (names != null) {
|
||||||
this.$http
|
this.$http.get(
|
||||||
.get(
|
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||||
this.mixinViewModuleOptions.getDataListURL +
|
|
||||||
'?' +
|
|
||||||
qs.stringify({
|
|
||||||
// order: this.order,
|
// order: this.order,
|
||||||
// orderField: this.orderField,
|
// orderField: this.orderField,
|
||||||
// type: '组件服务',
|
// type: '组件服务',
|
||||||
|
@ -509,6 +249,7 @@ export default {
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
.then(({ data: res }) => {
|
.then(({ data: res }) => {
|
||||||
|
console.log('res', res)
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
this.dataList = []
|
this.dataList = []
|
||||||
this.total = 0
|
this.total = 0
|
||||||
|
@ -523,18 +264,6 @@ export default {
|
||||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||||
}
|
}
|
||||||
this.dataListLoading = false
|
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 {
|
} else {
|
||||||
this.$message.error('未查询到相关信息')
|
this.$message.error('未查询到相关信息')
|
||||||
this.reset()
|
this.reset()
|
||||||
|
@ -547,423 +276,37 @@ export default {
|
||||||
this.$message.error('查询信息不能为空')
|
this.$message.error('查询信息不能为空')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// fullScreen () {
|
fullScreen () {
|
||||||
// if (window.outerHeight === screen.availHeight) {
|
if (window.outerHeight === screen.availHeight) {
|
||||||
// if (window.outerWidth === screen.availWidth) {
|
if (window.outerWidth === screen.availWidth) {
|
||||||
// this.qp = false
|
console.log(
|
||||||
// } else {
|
'全屏1',
|
||||||
// this.qp = true
|
window.outerHeight,
|
||||||
// }
|
screen.availHeight,
|
||||||
// } else {
|
window.outerWidth,
|
||||||
// this.qp = true
|
screen.availWidth
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// 点击关联应用按钮
|
|
||||||
showRelateApplication (row) {
|
|
||||||
this.$http
|
|
||||||
.get(
|
|
||||||
`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`
|
|
||||||
)
|
)
|
||||||
.then(({ data: res }) => {
|
this.qp = false
|
||||||
if (res && res.data) {
|
} else {
|
||||||
this.relateApplicationVisible = true
|
console.log(
|
||||||
this.relateInfo = {
|
'不是全屏2',
|
||||||
id: row.id,
|
window.outerHeight,
|
||||||
responseData: res.data,
|
screen.availHeight,
|
||||||
linkType: '2'
|
window.outerWidth,
|
||||||
}
|
screen.availWidth
|
||||||
}
|
|
||||||
})
|
|
||||||
.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.submitFrom.infoList.push(obj)
|
this.qp = true
|
||||||
},
|
|
||||||
changeAdd () {
|
|
||||||
const arr = []
|
|
||||||
switch (this.radio) {
|
|
||||||
case '智能算法':
|
|
||||||
arr.push('算法优势')
|
|
||||||
arr.push('计费标准信息')
|
|
||||||
break
|
|
||||||
case '开发组件':
|
|
||||||
case '业务组件':
|
|
||||||
arr.push('功能介绍')
|
|
||||||
break
|
|
||||||
}
|
}
|
||||||
arr.push('应用场景')
|
} else {
|
||||||
arr.push('常见问题')
|
console.log(
|
||||||
this.$refs.putOnTheShelf.submit(arr)
|
'不是全屏3',
|
||||||
},
|
window.outerHeight,
|
||||||
submitData () {
|
screen.availHeight,
|
||||||
console.log('提交11111111111===============>', this.putOnTheShelfList, this.submitFrom)
|
window.outerWidth,
|
||||||
const arr = []
|
screen.availWidth
|
||||||
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
|
|
||||||
)
|
)
|
||||||
|
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 {
|
.el-tooltip__popper {
|
||||||
max-width: 50%;
|
max-width: 50%;
|
||||||
}
|
}
|
||||||
// ::v-deep .el-table .cell {
|
|
||||||
// width: 200px;
|
|
||||||
// }
|
|
||||||
::v-deep .el-upload-list__item-name {
|
|
||||||
width: 400px;
|
|
||||||
}
|
|
||||||
</style>
|
</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 key="1" v-if="!disabled">
|
||||||
<!-- 挂载-->
|
<!-- 挂载-->
|
||||||
<div
|
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">填写字段</div>
|
||||||
style="
|
<el-checkbox-group v-model="checkList" @change="showListChagne" style="margin-bottom:20px;">
|
||||||
text-align: center;
|
<el-checkbox-button v-for="item in dataForm.showListAll" :label="item.name" :key="item.id">{{item.name}}</el-checkbox-button>
|
||||||
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-checkbox-group>
|
||||||
<el-form
|
<el-form
|
||||||
v-if="!UpdateState"
|
v-if="!UpdateState"
|
||||||
|
@ -40,40 +22,19 @@
|
||||||
@keyup.enter.native="dataFormSubmitHandle()"
|
@keyup.enter.native="dataFormSubmitHandle()"
|
||||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
||||||
>
|
>
|
||||||
<div v-show="checkList.indexOf('必填信息') > -1">
|
<div v-show="checkList.indexOf('必填信息')>-1">
|
||||||
<div
|
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">必填信息</div>
|
||||||
style="
|
|
||||||
text-align: center;
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 18px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
必填信息
|
|
||||||
</div>
|
|
||||||
<el-form-item label="应用名称" prop="name">
|
<el-form-item label="应用名称" prop="name">
|
||||||
<el-input
|
<el-input v-model="dataForm.name" placeholder="请输入组件名称" ></el-input>
|
||||||
v-model="dataForm.name"
|
|
||||||
placeholder="请输入组件名称"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="应用描述" prop="description">
|
<el-form-item label="应用描述" prop="description">
|
||||||
<el-input
|
<el-input v-model="dataForm.description" placeholder="请输入组件描述" ></el-input>
|
||||||
v-model="dataForm.description"
|
|
||||||
placeholder="请输入组件描述"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="部门联系人" prop="deptContacts">
|
<el-form-item label="部门联系人" prop="deptContacts">
|
||||||
<el-input
|
<el-input v-model="dataForm.deptContacts" placeholder="请输入部门联系人" ></el-input>
|
||||||
v-model="dataForm.deptContacts"
|
|
||||||
placeholder="请输入部门联系人"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="部门联系人电话" prop="deptPhone">
|
<el-form-item label="部门联系人电话" prop="deptPhone">
|
||||||
<el-input
|
<el-input v-model="dataForm.deptPhone" placeholder="请输入部门联系人电话" ></el-input>
|
||||||
v-model="dataForm.deptPhone"
|
|
||||||
placeholder="请输入部门联系人电话"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="共享条件" prop="shareCondition">
|
<el-form-item label="共享条件" prop="shareCondition">
|
||||||
<el-select
|
<el-select
|
||||||
|
@ -89,8 +50,7 @@
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="共享类型" prop="shareType"
|
<el-form-item label="共享类型" prop="shareType"><el-select
|
||||||
><el-select
|
|
||||||
v-model="dataForm.shareType"
|
v-model="dataForm.shareType"
|
||||||
placeholder="请选择共享类型"
|
placeholder="请选择共享类型"
|
||||||
>
|
>
|
||||||
|
@ -104,47 +64,16 @@
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="共享方式" prop="shareMode">
|
<el-form-item label="共享方式" prop="shareMode">
|
||||||
<el-input
|
<el-input v-model="dataForm.shareMode" placeholder="请输入共享方式" ></el-input>
|
||||||
v-model="dataForm.shareMode"
|
|
||||||
placeholder="请输入共享方式"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div v-for="item in dataForm.showList" :key="item.id" v-show="item.name !== '必填信息'">
|
||||||
v-for="item in dataForm.showList"
|
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">{{item.name}}</div>
|
||||||
:key="item.id"
|
<el-form-item :label="child.name" v-for="child in item.children" :key="child.id" v-show="item.children">
|
||||||
v-show="item.name !== '必填信息'"
|
<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
|
|
||||||
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
|
<el-select
|
||||||
v-else-if="child.type == 'select'"
|
v-else-if="child.type=='select'"
|
||||||
v-model="child.note1"
|
v-model="child.note1"
|
||||||
:placeholder="'请选择' + child.name"
|
:placeholder="'请选择' + child.name"
|
||||||
>
|
>
|
||||||
|
@ -156,24 +85,9 @@
|
||||||
>
|
>
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
<upload
|
<upload v-else-if="child.type=='images'" :child='child' limit='5' accept='.jpg,.png'></upload>
|
||||||
v-else-if="child.type == 'images'"
|
<upload v-else-if="child.type=='image'" :child='child' limit='1' accept='.jpg,.png'></upload>
|
||||||
:child="child"
|
<upload v-else-if="child.type=='video'" :child='child' limit='1' accept='.mp4'></upload>
|
||||||
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>
|
</el-form-item>
|
||||||
</div>
|
</div>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
@ -271,7 +185,8 @@
|
||||||
v-if="
|
v-if="
|
||||||
item.attrType != '应用领域' &&
|
item.attrType != '应用领域' &&
|
||||||
item.attrType != '应用类型' &&
|
item.attrType != '应用类型' &&
|
||||||
item.attrType != '发布端'
|
item.attrType != '发布端' &&
|
||||||
|
item.attrType != '应用状态'
|
||||||
"
|
"
|
||||||
></el-input>
|
></el-input>
|
||||||
<el-select
|
<el-select
|
||||||
|
@ -913,10 +828,10 @@ export default {
|
||||||
console.log('表单数据=======================》', this.dataForm)
|
console.log('表单数据=======================》', this.dataForm)
|
||||||
if (!this.UpdateState) {
|
if (!this.UpdateState) {
|
||||||
this.dataForm.infoList = []
|
this.dataForm.infoList = []
|
||||||
this.dataForm.showListAll.forEach((val) => {
|
this.dataForm.showListAll.forEach(val => {
|
||||||
if (val.name !== '必填信息') {
|
if (val.name !== '必填信息') {
|
||||||
if (val.name === '服务接口信息') {
|
if (val.name === '服务接口信息') {
|
||||||
val.children.forEach((item) => {
|
val.children.forEach(item => {
|
||||||
if (item.name === '服务接口') {
|
if (item.name === '服务接口') {
|
||||||
this.dataForm.apiUrl = item.note1
|
this.dataForm.apiUrl = item.note1
|
||||||
}
|
}
|
||||||
|
@ -928,7 +843,7 @@ export default {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
val.children.forEach((item) => {
|
val.children.forEach(item => {
|
||||||
this.dataForm.infoList.push({
|
this.dataForm.infoList.push({
|
||||||
attrType: item.name,
|
attrType: item.name,
|
||||||
attrValue: item.note1,
|
attrValue: item.note1,
|
||||||
|
@ -980,15 +895,8 @@ export default {
|
||||||
{ leading: true, trailing: false }
|
{ leading: true, trailing: false }
|
||||||
),
|
),
|
||||||
showListChagne () {
|
showListChagne () {
|
||||||
this.dataForm.showList = this.dataForm.showListAll.filter(
|
this.dataForm.showList = this.dataForm.showListAll.filter(item => this.checkList.indexOf(item.name) > -1)
|
||||||
(item) => this.checkList.indexOf(item.name) > -1
|
console.log('属性变更===================>', this.checkList, this.dataForm.showList, this.dataForm.showListAll)
|
||||||
)
|
|
||||||
console.log(
|
|
||||||
'属性变更===================>',
|
|
||||||
this.checkList,
|
|
||||||
this.dataForm.showList,
|
|
||||||
this.dataForm.showListAll
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
|
|
|
@ -1,7 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<el-card shadow="never" class="aui-card--fill">
|
<el-card shadow="never" class="aui-card--fill">
|
||||||
<div class="mod-ability__bsabilityai">
|
<div class="mod-ability__bsabilityai">
|
||||||
<el-form :inline="true" :model="dataForm">
|
<el-form
|
||||||
|
:inline="true"
|
||||||
|
:model="dataForm"
|
||||||
|
>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="dataForm.name"
|
v-model="dataForm.name"
|
||||||
|
@ -10,29 +13,20 @@
|
||||||
></el-input>
|
></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button @click="getDataList2(dataForm.name)">{{
|
<el-button @click="getDataList2(dataForm.name)">{{ $t("query") }}</el-button>
|
||||||
$t("query")
|
|
||||||
}}</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="info" @click="exportHandle()">{{
|
<el-button type="info" @click="exportHandle()">{{
|
||||||
$t("export")
|
$t("export")
|
||||||
}}</el-button>
|
}}</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- <el-form-item>
|
<el-form-item>
|
||||||
<el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:save')"
|
v-if="$hasPermission('ability:bsabilityai:save')"
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="addOrUpdateHandleServe()"
|
@click="addOrUpdateHandleServe()"
|
||||||
>挂接</el-button
|
>挂接</el-button
|
||||||
>
|
>
|
||||||
</el-form-item> -->
|
|
||||||
<el-form-item>
|
|
||||||
<el-button
|
|
||||||
type="primary"
|
|
||||||
@click="showPutOnTheShelf()"
|
|
||||||
>上架</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button
|
<el-button
|
||||||
|
@ -51,8 +45,8 @@
|
||||||
:data="dataList"
|
:data="dataList"
|
||||||
border
|
border
|
||||||
@selection-change="dataListSelectionChangeHandle"
|
@selection-change="dataListSelectionChangeHandle"
|
||||||
style="width: 100%"
|
style="width: 100%;"
|
||||||
height="650px"
|
:height="qp ? '810px' : '650px'"
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
type="selection"
|
type="selection"
|
||||||
|
@ -61,81 +55,40 @@
|
||||||
width="50"
|
width="50"
|
||||||
></el-table-column>
|
></el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:show-overflow-tooltip="true"
|
|
||||||
width="280"
|
|
||||||
prop="name"
|
prop="name"
|
||||||
label="应用名称"
|
label="应用名称"
|
||||||
header-align="center"
|
header-align="center"
|
||||||
align="center"
|
align="center"
|
||||||
></el-table-column>
|
></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
|
<el-table-column
|
||||||
v-for="(item, index) in dataList[0].infoList2"
|
v-for="(item, index) in dataList[0].infoList"
|
||||||
:key="index"
|
:key="index"
|
||||||
:label="item.attrType"
|
:label="item.attrType"
|
||||||
header-align="center"
|
header-align="center"
|
||||||
align="center"
|
align="center"
|
||||||
:show-overflow-tooltip="true"
|
show-overflow-tooltip="true"
|
||||||
width="280"
|
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ findValue(scope.row.infoList2, item.attrType) }}
|
{{
|
||||||
|
findValue(scope.row.infoList, item.attrType)
|
||||||
|
}}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</template>
|
|
||||||
<el-table-column
|
<el-table-column
|
||||||
:label="$t('handle')"
|
:label="$t('handle')"
|
||||||
fixed="right"
|
fixed="right"
|
||||||
header-align="center"
|
header-align="center"
|
||||||
align="center"
|
align="center"
|
||||||
width="300"
|
width="94"
|
||||||
|
right="0"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
@click="UpdateData(scope.row)"
|
@click="UpdateHandle(scope.row)"
|
||||||
>{{ $t("update") }}</el-button
|
>{{ $t("update") }}</el-button
|
||||||
>
|
>
|
||||||
<el-button
|
<el-button
|
||||||
|
@ -146,35 +99,9 @@
|
||||||
>{{ $t("delete") }}</el-button
|
>{{ $t("delete") }}</el-button
|
||||||
>
|
>
|
||||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
<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="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 type="text" size="small" @click="showDocument(scope.row)">开发文档</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
@ -195,28 +122,7 @@
|
||||||
ref="addOrUpdate"
|
ref="addOrUpdate"
|
||||||
@refreshDataList="getDataList"
|
@refreshDataList="getDataList"
|
||||||
></add-or-update>
|
></add-or-update>
|
||||||
<relate-application
|
|
||||||
v-if="relateApplicationResourceVisible"
|
|
||||||
ref="relateApplication"
|
|
||||||
:relateInfo="relationData"
|
|
||||||
:nameArray="topNameArray"
|
|
||||||
@isShowRelatePopup="handleIsShowRelatePopupApply"
|
|
||||||
></relate-application>
|
|
||||||
</div>
|
</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>
|
</el-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -224,17 +130,12 @@
|
||||||
import mixinViewModule from '@/mixins/view-module'
|
import mixinViewModule from '@/mixins/view-module'
|
||||||
import AddOrUpdate from './bsabilityservice-add-or-update'
|
import AddOrUpdate from './bsabilityservice-add-or-update'
|
||||||
import dictionaries from '@/utils/dictionaries'
|
import dictionaries from '@/utils/dictionaries'
|
||||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
|
||||||
import qs from 'qs'
|
import qs from 'qs'
|
||||||
import { type } from 'os'
|
import { type } from 'os'
|
||||||
import putOnTheShelf from '@/views/modules/putOnTheShelf'
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
mixins: [mixinViewModule],
|
mixins: [mixinViewModule],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
required: ['归属部门', '部门联系人', '部门联系人电话', '应用领域', '共享条件', '应用名称', '应用描述', '应用类型'],
|
|
||||||
notFilled: [],
|
|
||||||
mixinViewModuleOptions: {
|
mixinViewModuleOptions: {
|
||||||
getDataListURL: '/resource/page',
|
getDataListURL: '/resource/page',
|
||||||
getDataListIsPage: true,
|
getDataListIsPage: true,
|
||||||
|
@ -253,50 +154,25 @@ export default {
|
||||||
delFlag: 0,
|
delFlag: 0,
|
||||||
type: '应用资源'
|
type: '应用资源'
|
||||||
},
|
},
|
||||||
qp: false,
|
qp: false
|
||||||
relateApplicationResourceVisible: false,
|
|
||||||
relationData: {}, // 打开穿梭框时传递的参数
|
|
||||||
topNameArray: [], //
|
|
||||||
radio: '应用资源',
|
|
||||||
insertList: [],
|
|
||||||
putOnTheShelfList: [],
|
|
||||||
showPutOnTheShelfFlag2: false,
|
|
||||||
submitFrom: {
|
|
||||||
type: '应用资源',
|
|
||||||
deptId: '',
|
|
||||||
delFlag: 0,
|
|
||||||
infoList: [
|
|
||||||
// {
|
|
||||||
// attrType: '组件类型',
|
|
||||||
// attrValue: '',
|
|
||||||
// delFlag: 0
|
|
||||||
// }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
typeInput: '应用资源'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {},
|
watch: {},
|
||||||
components: {
|
components: {
|
||||||
AddOrUpdate,
|
AddOrUpdate
|
||||||
RelateApplication,
|
|
||||||
putOnTheShelf
|
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
this.dataForm.name = ''
|
this.dataForm.name = ''
|
||||||
this.dataForm.type = '应用资源'
|
this.dataForm.type = '应用资源'
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
// window.addEventListener('resize', this.a)
|
window.addEventListener('resize', this.a)
|
||||||
// this.fullScreen()
|
this.fullScreen()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
reset () {
|
reset () {
|
||||||
this.$http
|
this.$http.get(
|
||||||
.get(
|
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||||
this.mixinViewModuleOptions.getDataListURL +
|
|
||||||
'?' +
|
|
||||||
qs.stringify({
|
|
||||||
// order: this.order,
|
// order: this.order,
|
||||||
// orderField: this.orderField,
|
// orderField: this.orderField,
|
||||||
// type: '组件服务',
|
// type: '组件服务',
|
||||||
|
@ -308,60 +184,40 @@ export default {
|
||||||
type: '应用资源',
|
type: '应用资源',
|
||||||
name: ''
|
name: ''
|
||||||
})
|
})
|
||||||
)
|
|
||||||
.then(({ data: res }) => {
|
).then(({ data: res }) => {
|
||||||
this.dataForm.name = ''
|
this.dataForm.name = ''
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
this.dataList = []
|
this.dataList = []
|
||||||
this.total = 0
|
this.total = 0
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
|
this.dataList = this.mixinViewModuleOptions.getDataListIsPage ? res.data.list : res.data
|
||||||
? res.data.list
|
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||||
: res.data
|
|
||||||
this.total = this.mixinViewModuleOptions.getDataListIsPage
|
|
||||||
? res.data.total
|
|
||||||
: 0
|
|
||||||
if (this.mixinViewModuleOptions.requestCallback) {
|
if (this.mixinViewModuleOptions.requestCallback) {
|
||||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||||
}
|
}
|
||||||
this.dataListLoading = false
|
this.dataListLoading = false
|
||||||
this.dataList.map((item, index) => {
|
}).catch(() => {
|
||||||
const dataListSinforList = []
|
|
||||||
item.infoList.map((itemson, indexson) => {
|
|
||||||
if (
|
|
||||||
itemson.attrType === '应用领域'
|
|
||||||
) {
|
|
||||||
dataListSinforList.push(itemson)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.dataList[index].infoList2 = dataListSinforList
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
this.dataListLoading = false
|
this.dataListLoading = false
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
showDetail (val) {
|
showDetail (val) {
|
||||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
this.addOrUpdateVisible = true
|
||||||
// this.addOrUpdateVisible = true
|
this.disabled = false
|
||||||
// this.disabled = false
|
this.$nextTick(() => {
|
||||||
// this.$nextTick(() => {
|
this.$refs.addOrUpdate.UpdateState = false
|
||||||
// this.$refs.addOrUpdate.UpdateState = false
|
this.$refs.addOrUpdate.dataFormShowDetails = val
|
||||||
// this.$refs.addOrUpdate.dataFormShowDetails = val
|
this.$refs.addOrUpdate.init()
|
||||||
// this.$refs.addOrUpdate.init()
|
})
|
||||||
// })
|
this.disabled = true
|
||||||
// this.disabled = true
|
|
||||||
},
|
},
|
||||||
showDocument (val) {
|
showDocument (val) {
|
||||||
console.log(val)
|
console.log(val)
|
||||||
window.open(
|
window.open(window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type, '_blank')
|
||||||
window.SITE_CONFIG.frontUrl + '?id=' + val.id + '&&type=' + val.type,
|
|
||||||
'_blank'
|
|
||||||
)
|
|
||||||
},
|
},
|
||||||
findValue (list, type) {
|
findValue (list, type) {
|
||||||
const found = list.find((item) => item.attrType === type)
|
const found = list.find(item => item.attrType === type)
|
||||||
if (found) {
|
if (found) {
|
||||||
return found.attrValue
|
return found.attrValue
|
||||||
} else {
|
} else {
|
||||||
|
@ -370,11 +226,8 @@ export default {
|
||||||
},
|
},
|
||||||
getDataList2 (names) {
|
getDataList2 (names) {
|
||||||
if (names != null) {
|
if (names != null) {
|
||||||
this.$http
|
this.$http.get(
|
||||||
.get(
|
this.mixinViewModuleOptions.getDataListURL + '?' + qs.stringify({
|
||||||
this.mixinViewModuleOptions.getDataListURL +
|
|
||||||
'?' +
|
|
||||||
qs.stringify({
|
|
||||||
// order: this.order,
|
// order: this.order,
|
||||||
// orderField: this.orderField,
|
// orderField: this.orderField,
|
||||||
// type: '组件服务',
|
// type: '组件服务',
|
||||||
|
@ -395,442 +248,53 @@ export default {
|
||||||
}
|
}
|
||||||
if (res.data.list.length !== 0) {
|
if (res.data.list.length !== 0) {
|
||||||
this.dataList = res.data.list
|
this.dataList = res.data.list
|
||||||
this.total = this.mixinViewModuleOptions.getDataListIsPage
|
this.total = this.mixinViewModuleOptions.getDataListIsPage ? res.data.total : 0
|
||||||
? res.data.total
|
|
||||||
: 0
|
|
||||||
if (this.mixinViewModuleOptions.requestCallback) {
|
if (this.mixinViewModuleOptions.requestCallback) {
|
||||||
this.mixinViewModuleOptions.requestCallback(res.data)
|
this.mixinViewModuleOptions.requestCallback(res.data)
|
||||||
}
|
}
|
||||||
this.dataListLoading = false
|
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 {
|
} else {
|
||||||
this.$message.error('未查询到相关信息')
|
this.$message.error('未查询到相关信息')
|
||||||
this.reset()
|
this.reset()
|
||||||
}
|
}
|
||||||
})
|
}).catch(() => {
|
||||||
.catch(() => {
|
|
||||||
this.dataListLoading = false
|
this.dataListLoading = false
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
this.$message.error('查询不能输入为空')
|
this.$message.error('查询不能输入为空')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// fullScreen () {
|
fullScreen () {
|
||||||
// if (window.outerHeight === screen.availHeight) {
|
if (window.outerHeight === screen.availHeight) {
|
||||||
// if (window.outerWidth === screen.availWidth) {
|
if (window.outerWidth === screen.availWidth) {
|
||||||
// console.log(
|
console.log(
|
||||||
// '全屏1',
|
'全屏1',
|
||||||
// window.outerHeight,
|
window.outerHeight,
|
||||||
// screen.availHeight,
|
screen.availHeight,
|
||||||
// window.outerWidth,
|
window.outerWidth,
|
||||||
// screen.availWidth
|
screen.availWidth
|
||||||
// )
|
)
|
||||||
// this.qp = false
|
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
|
|
||||||
})
|
|
||||||
} else {
|
} else {
|
||||||
if (this.submitFrom.infoList.filter(value => value.attrType === val.name).length === 0) {
|
console.log(
|
||||||
this.submitFrom.infoList.push({
|
'不是全屏2',
|
||||||
attrType: val.name,
|
window.outerHeight,
|
||||||
attrValue: val.note1,
|
screen.availHeight,
|
||||||
delFlag: 0,
|
window.outerWidth,
|
||||||
note2: val.note2 || null
|
screen.availWidth
|
||||||
})
|
)
|
||||||
}
|
this.qp = true
|
||||||
}
|
|
||||||
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
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
if (child.children) {
|
console.log(
|
||||||
child.children.map(data => {
|
'不是全屏3',
|
||||||
if (data.name === '计费标准信息' || data.name === '常见问题') {
|
window.outerHeight,
|
||||||
const obj = item.infoList.filter(val => val.attrType === child.name)[0]
|
screen.availHeight,
|
||||||
if (obj) {
|
window.outerWidth,
|
||||||
data.note1 = obj.attrValue
|
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 {
|
.el-tooltip__popper {
|
||||||
max-width: 50%;
|
max-width: 50%;
|
||||||
}
|
}
|
||||||
::v-deep .el-upload-list__item-name {
|
|
||||||
width: 400px;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<el-card shadow="never" class="aui-card--fill">
|
<el-card shadow="never" class="aui-card--fill">
|
||||||
|
{{ this.$route.meta.type }}
|
||||||
<div class="mod-ability__bsabilityvideo">
|
<div class="mod-ability__bsabilityvideo">
|
||||||
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
|
||||||
<el-form-item>
|
<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: {
|
methods: {
|
||||||
onSuccess (res, file) {
|
onSuccess (res, file) {
|
||||||
|
console.log('limit', this.limit)
|
||||||
|
console.log(res, file, this.child)
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error('上传图片失败')
|
return this.$message.error('上传图片失败')
|
||||||
}
|
}
|
||||||
|
@ -86,8 +88,10 @@ export default {
|
||||||
} else {
|
} else {
|
||||||
this.child.note1 = arr.join(';')
|
this.child.note1 = arr.join(';')
|
||||||
}
|
}
|
||||||
|
console.log(this.child.note1)
|
||||||
},
|
},
|
||||||
onPreview (file) {
|
onPreview (file) {
|
||||||
|
console.log('点击预览===============>', file)
|
||||||
window.open(file.response.data)
|
window.open(file.response.data)
|
||||||
},
|
},
|
||||||
onExceed (files, fileList) {
|
onExceed (files, fileList) {
|
||||||
|
|
|
@ -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-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<!-- 流程综合组件 -->
|
<!-- 流程综合组件 -->
|
||||||
<!-- <ren-process-multiple
|
<ren-process-multiple
|
||||||
v-if="processVisible"
|
v-if="processVisible"
|
||||||
updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
|
updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
|
||||||
saveFormUrl="/processForm/tabilityapplication"
|
saveFormUrl="/processForm/tabilityapplication"
|
||||||
dataFormName="dataForm"
|
dataFormName="dataForm"
|
||||||
ref="renProcessMultiple"
|
ref="renProcessMultiple"
|
||||||
></ren-process-multiple> -->
|
></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>
|
|
||||||
</el-card>
|
</el-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// 引入工作流公共方法
|
// 引入工作流公共方法
|
||||||
import processModule from '@/mixins/process-module'
|
import processModule from '@/mixins/process-module'
|
||||||
import qs from 'qs'
|
|
||||||
import debounce from 'lodash/debounce'
|
|
||||||
import bus from '@/views/bus.js'
|
|
||||||
export default {
|
export default {
|
||||||
// 注入公共方法
|
// 注入公共方法
|
||||||
mixins: [processModule],
|
mixins: [processModule],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
// visible: false,
|
visible: false,
|
||||||
// 表单属性是否可编辑
|
// 表单属性是否可编辑
|
||||||
fieldDisabled: false,
|
fieldDisabled: false,
|
||||||
dataForm: {
|
dataForm: {
|
||||||
|
@ -124,13 +94,7 @@ export default {
|
||||||
system: '',
|
system: '',
|
||||||
scene: '',
|
scene: '',
|
||||||
basis: ''
|
basis: ''
|
||||||
},
|
}
|
||||||
// 审批
|
|
||||||
dialogVisible: false,
|
|
||||||
dialogType: '',
|
|
||||||
input: '',
|
|
||||||
visible: true,
|
|
||||||
taskId: ''
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
|
@ -149,8 +113,6 @@ export default {
|
||||||
}
|
}
|
||||||
// 初始化综合组件
|
// 初始化综合组件
|
||||||
this.initProcessMultiple(callbacks)
|
this.initProcessMultiple(callbacks)
|
||||||
this.taskId = this.$route.params.taskId
|
|
||||||
this.dataForm.taskId = this.$route.params.taskId
|
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
dataRule () {
|
dataRule () {
|
||||||
|
@ -202,128 +164,6 @@ export default {
|
||||||
})
|
})
|
||||||
.catch(() => {})
|
.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) {
|
startProcessErrorCallback (data) {
|
||||||
console.log(data)
|
console.log(data)
|
||||||
|
@ -333,12 +173,3 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</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>
|
|