Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 9223b210 by liuyong
Options

修改bug

2 parents 237375f5 6d4d32cc
Expand all
Inline Side-by-side
Showing with 3309 additions and 550 deletions
.env.development
NODE_ENV = 'development' NODE_ENV = 'development'
VUE_APP_BASE_URL = "/api" VUE_APP_BASE_URL = ""
.env.production
NODE_ENV = 'production' NODE_ENV = 'production'
VUE_APP_BASE_URL = "http://43.143.211.42:7003" VUE_APP_BASE_URL = "http://192.168.0.120:80"
package.json
...@@ -11,6 +11,7 @@ ...@@ -11,6 +11,7 @@
"@wangeditor/editor-for-vue": "^1.0.2", "@wangeditor/editor-for-vue": "^1.0.2",
"axios": "^1.6.2", "axios": "^1.6.2",
"core-js": "^3.8.3", "core-js": "^3.8.3",
"echarts": "^5.5.0",
"element-ui": "^2.15.14", "element-ui": "^2.15.14",
"jquery": "^3.7.1", "jquery": "^3.7.1",
"scss": "^0.2.4", "scss": "^0.2.4",
......
public/drawio/extention/js/exScratchpad.js
function initSetScratchpad() {//左侧便签本初始化数据 function initSetScratchpad() {
//左侧便签本初始化数据
$.ajax({ $.ajax({
method: "post", method: 'post',
url: `http://${ajaxUrl}:7003/short-cut-model/qSCMList`, url: `http://${ajaxUrl}/eadc-architecture/short-cut-model/qSCMList`,
data: JSON.stringify({}), data: JSON.stringify({}),
success: function(result) { success: function (result) {
let images = []; let images = []
result.data.forEach(item => { result.data.forEach((item) => {
images.push({ images.push({
xml: item.icon, xml: item.icon,
h: item.height, h: item.height,
w: item.width, w: item.width,
title: item.title ? item.title : null title: item.title ? item.title : null,
}) })
}) })
// console.log(images) // console.log(images)
let xml = '<mxlibrary>'+JSON.stringify(images, null, 2)+'</mxlibrary>'; let xml = '<mxlibrary>' + JSON.stringify(images, null, 2) + '</mxlibrary>'
let request = window.indexedDB.open('database', 2); let request = window.indexedDB.open('database', 2)
request.onsuccess = function (event) { request.onsuccess = function (event) {
let db = request.result; let db = request.result
let trx = db.transaction('filesInfo', 'readwrite'); let trx = db.transaction('filesInfo', 'readwrite')
let trx2 = db.transaction('files', 'readwrite'); let trx2 = db.transaction('files', 'readwrite')
trx.objectStore('filesInfo').put({ trx.objectStore('filesInfo').put({
title: '.scratchpad', title: '.scratchpad',
size: xml.length, size: xml.length,
lastModified: Date.now(), lastModified: Date.now(),
type: 'L' type: 'L',
}) })
trx2.objectStore('files').put({ trx2.objectStore('files').put({
title: '.scratchpad', title: '.scratchpad',
data: xml data: xml,
}) })
} }
}, },
error: function(error) { error: function (error) {
console.error(error) console.error(error)
} },
}); })
// const images = [ // const images = [
// { // {
...@@ -55,32 +55,33 @@ function initSetScratchpad() {//左侧便签本初始化数据 ...@@ -55,32 +55,33 @@ function initSetScratchpad() {//左侧便签本初始化数据
// 若为压缩的xml,则内容是diagram的内容 // 若为压缩的xml,则内容是diagram的内容
} }
function saveScratchpad(data) {//左侧便签本保存数据 function saveScratchpad(data) {
//左侧便签本保存数据
let params = []; let params = []
if(data.length > 0) { if (data.length > 0) {
data.forEach(item => { data.forEach((item) => {
params.push({ params.push({
icon: item.xml, icon: item.xml,
height: item.h, height: item.h,
width: item.w, width: item.w,
title: item.title ? item.title : null, title: item.title ? item.title : null,
sort: 1 sort: 1,
}) })
}) })
}else { } else {
params = []; params = []
} }
$.ajax({ $.ajax({
method: "post", method: 'post',
url: `http://${ajaxUrl}:7003/short-cut-model/cSCModel`, url: `http://${ajaxUrl}/eadc-architecture/short-cut-model/cSCModel`,
data: JSON.stringify(params), data: JSON.stringify(params),
contentType: 'application/json', contentType: 'application/json',
success: function(result) { success: function (result) {
console.log(result) console.log(result)
}, },
error: function(error) { error: function (error) {
console.error(error) console.error(error)
} },
}); })
} }
public/drawio/extention/js/url.js
// const ajaxUrl = '172.20.10.3:7003'; // const ajaxUrl = '172.20.10.3:7003';
const ajaxUrl = '43.143.211.42'; // const ajaxUrl = '43.143.211.42';
const ajaxUrl = '192.168.0.120:80'
public/echarts.min.js deleted 100644 → 0
This diff could not be displayed because it is too large.
public/index.html
<!DOCTYPE html> <!DOCTYPE html>
<html lang=""> <html lang="">
<head> <head>
<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" />
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
<link type="text/css" rel="stylesheet" href="./jsmind/jsmind.css" /> <link type="text/css" rel="stylesheet" href="./jsmind/jsmind.css" />
<script type="text/javascript" src="./jsmind/jsmind.js"></script> <script type="text/javascript" src="./jsmind/jsmind.js"></script>
<script type="text/javascript" src="./jsmind/jsmind.draggable-node.js"></script> <script
type="text/javascript"
src="./jsmind/jsmind.draggable-node.js"
></script>
<script type="text/javascript" src="./jsmind/dom-to-image.js"></script> <script type="text/javascript" src="./jsmind/dom-to-image.js"></script>
<script type="text/javascript" src="./jsmind/jsmind.screenshot.js"></script> <script type="text/javascript" src="./jsmind/jsmind.screenshot.js"></script>
<script type="text/javascript" src="./echarts.min.js"></script> <!-- <script type="text/javascript" src="./echarts.min.js"></script> -->
</head> </head>
<body> <body>
<noscript> <noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> <strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- <script type="text/javascript" src="http://192.168.0.186:9001/web-apps/apps/api/documents/api.js"></script> --> <!-- <script type="text/javascript" src="http://192.168.0.186:9001/web-apps/apps/api/documents/api.js"></script> -->
...@@ -23,19 +30,20 @@ ...@@ -23,19 +30,20 @@
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
</body> </body>
<style> <style>
html,body{ html,
body {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
::-webkit-scrollbar{ ::-webkit-scrollbar {
width: 8px; width: 8px;
} }
::-webkit-scrollbar-track{ ::-webkit-scrollbar-track {
background-color: #fff; background-color: #fff;
} }
::-webkit-scrollbar-thumb{ ::-webkit-scrollbar-thumb {
border-radius: 8px; border-radius: 8px;
background-color: #ccc; background-color: #ccc;
} }
......
src/api/interface.js
// 接口url import { EADC_ARRCHITECTURE } from '@/config/micromodule'
// 列表接口url
// 批量计划管理分页查询 // 批量计划管理分页查询
export const batchPlanManagement = '/network/bat-plan-info/' export const batchPlanManagement = EADC_ARRCHITECTURE + '/bat-plan-info/'
// 概设材料审查 - 技术路线分页查询
export const queryConceptualReview = EADC_ARRCHITECTURE + '/prel-des-rvw/' ///network/prel-des-rvw/
export const queryAppArchiControlRequirements =
EADC_ARRCHITECTURE + '/app-archi-control-requirements/'
// 需求管理-需求发布分页查询
export const queryDemandManagement = EADC_ARRCHITECTURE + '/need-info/'
// 项目列表
export const queryProjectInfo = EADC_ARRCHITECTURE + '/prj-info/'
// 概设材料意见编制
export const queryConceptualViewOrg = EADC_ARRCHITECTURE + '/online-rev-wr/qy/'
// 系统架构管控要求-评审情况(概要设计)-分页查询
export const queryPrelDesInspecte = EADC_ARRCHITECTURE + '/prel-des-inspecte/'
// 概设关联业务管理 - 概设统计分析
export const queryQyNeedReviewCount =
EADC_ARRCHITECTURE + '/online-rev-wr/qyNeedReviewCount'
// 概设关联业务管理 - 总体架构维护
export const queryArcAstSys = EADC_ARRCHITECTURE + '/arc-ast-sys/'
// 架构督查- 督查通报管理列表
export const querySupervisionNotifyManagement =
EADC_ARRCHITECTURE + '/reportManage/selectReportManage'
// 架构督查- 督查问题整改列表
export const querySupervisionProblem =
EADC_ARRCHITECTURE + '/rectifyReform/selectRectifyReform'
// 概设评审基础管理
export const queryConceptualBaseManagement = EADC_ARRCHITECTURE + '/int-info/'
src/components/Form.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-12 14:55:59 * @Date: 2024-03-12 14:55:59
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-03-14 10:33:49 * @LastEditTime: 2024-03-26 15:54:50
--> -->
<!-- /** <!-- /**
* 搜索栏公共组件 * 搜索栏公共组件
...@@ -17,17 +17,24 @@ ...@@ -17,17 +17,24 @@
:label-width="labelWidth" :label-width="labelWidth"
:label-position="labelPosition" :label-position="labelPosition"
> >
<el-form-item <el-col
:span="item.span || 8"
v-for="(item, index) in formOptions" v-for="(item, index) in formOptions"
:key="newKeys[index]" :key="newKeys[index]"
:prop="item.prop"
:label="item.label"
:rules="item.rules"
> >
<SearchFormItem v-model="formData[item.prop]" :itemOptions="item" /> <el-form-item :prop="item.prop" :label="item.label" :rules="item.rules">
</el-form-item>
<!-- 自定义插槽，可用于特殊表单块 --> <!-- 自定义插槽，可用于特殊表单块 -->
<slot></slot> <template v-if="item.__slotName">
<slot :name="item.__slotName" :data="item"></slot>
</template>
<SearchFormItem
v-else
v-model="formData[item.prop]"
:itemOptions="item"
/>
</el-form-item>
</el-col>
</el-form> </el-form>
</div> </div>
</template> </template>
...@@ -78,7 +85,6 @@ export default { ...@@ -78,7 +85,6 @@ export default {
formData: {}, formData: {},
} }
}, },
computed: { computed: {
newKeys() { newKeys() {
return this.formOptions.map((v) => { return this.formOptions.map((v) => {
...@@ -108,9 +114,10 @@ export default { ...@@ -108,9 +114,10 @@ export default {
}, },
// 获取表单数据 // 获取表单数据
getData() { getData() {
this.onValidate(() => { return this.formData
this.$emit('getData', this.formData) // this.onValidate(() => {
}) // this.$emit('getData', this.formData)
// })
}, },
// 导出 // 导出
onExport() { onExport() {
...@@ -139,7 +146,6 @@ export default { ...@@ -139,7 +146,6 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.form-box { .form-box {
// display: flex;
margin-top: 10px; margin-top: 10px;
.btn-box { .btn-box {
display: flex; display: flex;
...@@ -149,21 +155,19 @@ export default { ...@@ -149,21 +155,19 @@ export default {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
/deep/ .el-form-item__label { /deep/ .el-form-item__label {
margin-bottom: 10px;
flex-shrink: 0; flex-shrink: 0;
color: #000; color: #000;
} }
.el-form-item {
margin-bottom: 0;
// display: flex;
&.is-error {
margin-bottom: 25px;
}
}
// el-input宽度 // el-input宽度
/deep/ .form-item { /deep/ .form-item {
.el-input { .el-input,
width: 220px !important; .el-select {
width: 100% !important;
}
.el-rate {
display: flex;
height: 40px;
align-items: center;
} }
} }
} }
......
src/components/ListPage.vue
...@@ -4,10 +4,18 @@ ...@@ -4,10 +4,18 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-12 14:01:57 * @Date: 2024-03-12 14:01:57
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-03-12 16:02:21 * @LastEditTime: 2024-03-15 14:24:23
--> -->
<template> <template>
<div class="list-page"> <div class="list-page">
<!-- 一级tab切换栏 -->
<div class="tabWrap">
<slot name="tabWrap" />
</div>
<!-- 二级tab切换栏 -->
<div class="subTabWrap">
<slot name="subTabWrap" />
</div>
<!-- 头部搜索区域 --> <!-- 头部搜索区域 -->
<div class="formWrap"> <div class="formWrap">
<slot name="formWrap" /> <slot name="formWrap" />
......
src/components/SearchForm.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-12 14:55:59 * @Date: 2024-03-12 14:55:59
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-03-14 08:59:05 * @LastEditTime: 2024-03-18 09:56:15
--> -->
<!-- /** <!-- /**
* 搜索栏公共组件 * 搜索栏公共组件
...@@ -37,8 +37,7 @@ ...@@ -37,8 +37,7 @@
<!-- 自定义插槽，可用于特殊表单块 --> <!-- 自定义插槽，可用于特殊表单块 -->
<slot></slot> <slot></slot>
</el-form> <el-form-item>
<!-- 提交按钮 --> <!-- 提交按钮 -->
<div class="btn-box"> <div class="btn-box">
<el-button <el-button
...@@ -50,16 +49,6 @@ ...@@ -50,16 +49,6 @@
@click="onSearch" @click="onSearch"
>查询</el-button >查询</el-button
> >
<!-- <el-button
v-if="btnItems.includes('export')"
size="mini"
type="primary"
class="btn-export"
@click="onExport"
>导出</el-button
> -->
<el-button <el-button
size="medium" size="medium"
type="default" type="default"
...@@ -69,6 +58,8 @@ ...@@ -69,6 +58,8 @@
>重置</el-button >重置</el-button
> >
</div> </div>
</el-form-item>
</el-form>
</div> </div>
</template> </template>
...@@ -87,6 +78,7 @@ export default { ...@@ -87,6 +78,7 @@ export default {
* initValue: '阿黄', // 字段初始值 * initValue: '阿黄', // 字段初始值
* placeholder: '请输入用户名', // elementui组件属性 * placeholder: '请输入用户名', // elementui组件属性
* rules: [{ required: true, message: '必填项', trigger: 'blur' }], // elementui组件属性 * rules: [{ required: true, message: '必填项', trigger: 'blur' }], // elementui组件属性
* dictType: 'build_type', // 如果是字典下拉框，传这个字段，值是对应的字典
* events: { // elementui组件方法 * events: { // elementui组件方法
* input (val) { * input (val) {
* console.log(val) * console.log(val)
...@@ -191,6 +183,7 @@ export default { ...@@ -191,6 +183,7 @@ export default {
} }
.el-form { .el-form {
display: flex; display: flex;
flex-wrap: wrap;
/deep/ .el-form-item__label { /deep/ .el-form-item__label {
// padding-right: 0; // padding-right: 0;
margin-bottom: 10px; margin-bottom: 10px;
......
src/components/SearchFormItem.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-12 15:11:47 * @Date: 2024-03-12 15:11:47
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-03-13 16:54:21 * @LastEditTime: 2024-03-26 15:30:38
--> -->
<template> <template>
<div class="form-item"> <div class="form-item">
...@@ -33,12 +33,31 @@ ...@@ -33,12 +33,31 @@
> >
<el-option <el-option
v-for="item in itemOptions.options" v-for="item in itemOptions.options"
:key="item.value" :key="item[handleSelectValue]"
:label="item.label" :label="item[handleSelectLabel]"
:value="item.value" :value="item[handleSelectValue]"
></el-option> ></el-option>
</el-select> </el-select>
<el-radio-group
v-if="isRadio"
v-bind="bindProps"
v-on="bindEvents"
v-model="currentVal"
>
<el-radio
v-for="item in itemOptions.options"
:key="item.value"
:label="item.value"
>{{ item.label }}</el-radio
>
</el-radio-group>
<el-rate
v-if="isRate"
v-bind="bindProps"
v-on="bindEvents"
v-model="currentVal"
></el-rate>
<!-- datetimerange/daterange --> <!-- datetimerange/daterange -->
<!-- <el-date-picker <!-- <el-date-picker
v-if="isDatePickerDateRange" v-if="isDatePickerDateRange"
...@@ -79,7 +98,6 @@ ...@@ -79,7 +98,6 @@
:type="itemOptions.type" :type="itemOptions.type"
clearable clearable
placeholder="请选择日期" placeholder="请选择日期"
style="width: 300px"
></el-date-picker> ></el-date-picker>
<el-cascader <el-cascader
v-if="isCascader" v-if="isCascader"
...@@ -115,6 +133,18 @@ export default { ...@@ -115,6 +133,18 @@ export default {
}, },
computed: { computed: {
handleSelectValue() {
if (this.itemOptions.keyOption) {
return this.itemOptions.keyOption['value']
}
return 'value'
},
handleSelectLabel() {
if (this.itemOptions.keyOption) {
return this.itemOptions.keyOption['label']
}
return 'label'
},
// 双向绑定数据值 // 双向绑定数据值
currentVal: { currentVal: {
get() { get() {
...@@ -155,6 +185,14 @@ export default { ...@@ -155,6 +185,14 @@ export default {
isSelect() { isSelect() {
return this.itemOptions.element === 'el-select' return this.itemOptions.element === 'el-select'
}, },
// el-radio
isRadio() {
return this.itemOptions.element === 'el-radio'
},
// el-rate
isRate() {
return this.itemOptions.element === 'el-rate'
},
// el-date-picker (type: datetimerange/daterange) // el-date-picker (type: datetimerange/daterange)
isDatePickerDateRange() { isDatePickerDateRange() {
const isDatePicker = this.itemOptions.element === 'el-date-picker' const isDatePicker = this.itemOptions.element === 'el-date-picker'
...@@ -185,9 +223,19 @@ export default { ...@@ -185,9 +223,19 @@ export default {
}, },
}, },
created() {}, created() {
// 字典下拉框处理
if (this.isSelect && this.itemOptions.dictType) {
this.getDictTypeOptions(this.itemOptions.dictType)
}
},
methods: { methods: {
/**
* @description: 获取下拉框字典，并缓存
* @param {String} key 对应字典接口的参数值
* @author: pan
*/
async getDictTypeOptions(key) { async getDictTypeOptions(key) {
var dictTypeOptions = [] var dictTypeOptions = []
var storedDic = localStorage.getItem('dic_' + key) var storedDic = localStorage.getItem('dic_' + key)
...@@ -196,20 +244,13 @@ export default { ...@@ -196,20 +244,13 @@ export default {
} else { } else {
const params = { key } const params = { key }
const res = await getDianXingAnLiSelectData(params) const res = await getDianXingAnLiSelectData(params)
if (res.code !== 200) return
dictTypeOptions = res.data dictTypeOptions = res.data
const jsonStr = JSON.stringify(res.data) const jsonStr = JSON.stringify(res.data)
localStorage.setItem('dic_' + key, jsonStr) localStorage.setItem('dic_' + key, jsonStr)
// await getDianXingAnLiSelectData(params).then((res) => {
// if (res.code === 200) {
// var options = res.data
// var jsonStr = JSON.stringify(options)
// localStorage.setItem('dic_' + key, jsonStr)
// dictTypeOptions = res.data
// console.log(dictTypeOptions)
// }
// })
} }
return dictTypeOptions this.itemOptions.options = dictTypeOptions
this.$forceUpdate()
}, },
}, },
......
src/components/TableConfig.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-11 14:53:40 * @Date: 2024-03-11 14:53:40
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-03-14 09:46:17 * @LastEditTime: 2024-03-22 17:17:18
--> -->
<!-- 示例 <!-- 示例
columns: [{ label: '头像', prop: 'avatar', align: 'center', __slotName: 'avatar',callback: (row, title) => { columns: [{ label: '头像', prop: 'avatar', align: 'center', __slotName: 'avatar',callback: (row, title) => {
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
<template> <template>
<div class="tableConfig"> <div class="tableConfig">
<el-table <el-table
ref="tableConfig"
class="config-table" class="config-table"
v-loading="loading" v-loading="loading"
v-bind="$attrs" v-bind="$attrs"
...@@ -72,6 +73,11 @@ ...@@ -72,6 +73,11 @@
v-for="items in item.actionButtons" v-for="items in item.actionButtons"
:key="items.title" :key="items.title"
v-bind="items" v-bind="items"
:disabled="
items.disabledCallback
? items.disabledCallback(scope.row, items.title)
: false
"
@click="item.callback(scope.row, items.title)" @click="item.callback(scope.row, items.title)"
><span v-if="!items.circle">{{ items.title }}</span></el-button ><span v-if="!items.circle">{{ items.title }}</span></el-button
> >
...@@ -207,9 +213,15 @@ export default { ...@@ -207,9 +213,15 @@ export default {
this.queryData() this.queryData()
}, },
methods: { methods: {
clearSelection() {
this.$refs.tableConfig.clearSelection()
},
handleToText(item, state) { handleToText(item, state) {
console.log(item, state) let val = state
const obj = item.options.find((v) => v.value === state) || {} if (!val) {
val = item.emptyToNum || 0
}
const obj = item.options.find((v) => v.value == val) || {}
return obj['label'] return obj['label']
}, },
/** /**
......
src/components/onlyOffice/demo.vue
...@@ -14,17 +14,17 @@ ...@@ -14,17 +14,17 @@
import vabOnlyOffice from './index.vue' import vabOnlyOffice from './index.vue'
export default { export default {
components: { vabOnlyOffice }, components: {vabOnlyOffice},
data() { data() {
return { return {
documentServerUrl: 'http://121.201.2.228:53327/', documentServerUrl: 'http://43.143.211.42:19231/',
config: { config: {
document: { document: {
fileType: 'doc', fileType: 'docx',
// 给服务端用的唯一id，同一个id就会获取服务器缓存里的文件（有这个key，就会先根据它去缓存里找），这项如果最开始只是先试用，可以先给个空字符串 // 给服务端用的唯一id，同一个id就会获取服务器缓存里的文件（有这个key，就会先根据它去缓存里找），这项如果最开始只是先试用，可以先给个空字符串
key: '737bb9e67f', key: '71df19fbd1',
// 文件名 // 文件名
title: 'text.docx', title: '65f90a662c18a9e9f1878156.docx',
//相关权限 //相关权限
// permissions: { // permissions: {
// copy: true, //定义内容是否可以复制到剪贴板。如果该参数设置为false，则只能在当前文档编辑器中粘贴内容。默认值为true。 // copy: true, //定义内容是否可以复制到剪贴板。如果该参数设置为false，则只能在当前文档编辑器中粘贴内容。默认值为true。
...@@ -33,7 +33,7 @@ export default { ...@@ -33,7 +33,7 @@ export default {
// print: true, //定义是否可以打印文档。如果打印权限设置为“false”的打印菜单选项将是缺席的文件菜单。默认值为true // print: true, //定义是否可以打印文档。如果打印权限设置为“false”的打印菜单选项将是缺席的文件菜单。默认值为true
// }, // },
// 所要渲染的文件的绝对路径，这个参数很重要，它传的不是文件的本地地址，而是需要把文件传到项目所依赖的服务器，然后拿到文件在服务器的url地址（这个一般情况需要后端支持）才可以用，这个参数决定了能不能实例化出来onlyoffice对象 // 所要渲染的文件的绝对路径，这个参数很重要，它传的不是文件的本地地址，而是需要把文件传到项目所依赖的服务器，然后拿到文件在服务器的url地址（这个一般情况需要后端支持）才可以用，这个参数决定了能不能实例化出来onlyoffice对象
url: 'http://172.20.10.9:9997/downloadFile/22', url: 'http://43.143.211.42:7006/downloadFile/29',
}, },
documentType: 'word', documentType: 'word',
height: '100%', height: '100%',
...@@ -52,7 +52,7 @@ export default { ...@@ -52,7 +52,7 @@ export default {
name: '', name: '',
}, },
// 指定文档存储服务器的绝对路径 // 指定文档存储服务器的绝对路径
callbackUrl: 'http://192.168.8.120:9997/callback?fileId=22', callbackUrl: 'http://43.143.211.42:7006/callback?fileId=29',
}, },
}, },
} }
......
src/config/micromodule.js 0 → 100644
// 架构元模型
export const EADC_ARRCHITECTURE = '/eadc-architecture'
// 共享能力
export const EADC_SHARED_ABILITY = '/eadc-shared-ability'
// 架构知识库
export const EADC_KNOWLEDGE_POOL = '/eadc-knowledge-pool'
src/main.js
...@@ -2,17 +2,45 @@ import Vue from 'vue' ...@@ -2,17 +2,45 @@ import Vue from 'vue'
import App from './App.vue' import App from './App.vue'
import router from './router' import router from './router'
import store from './store' import store from './store'
import * as echarts from 'echarts'
import ElementUI from 'element-ui' import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css'
import './styles/element-variables.scss' import './styles/element-variables.scss'
import initDirective from './directive' import initDirective from './directive'
initDirective(Vue) initDirective(Vue)
Vue.prototype.$echarts = echarts
Vue.config.productionTip = false Vue.config.productionTip = false
Vue.use(ElementUI) Vue.use(ElementUI)
Date.prototype.format = function (fmt) {
if (!fmt) {
fmt = 'yyyy-MM-dd hh:mm:ss'
}
var o = {
'M+': this.getMonth() + 1, // 月份
'd+': this.getDate(), // 日
'h+': this.getHours(), // 小时
'm+': this.getMinutes(), // 分
's+': this.getSeconds(), // 秒
'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
S: this.getMilliseconds(), // 毫秒
}
if (/(y+)/.test(fmt))
fmt = fmt.replace(
RegExp.$1,
(this.getFullYear() + '').substr(4 - RegExp.$1.length),
)
for (let k in o) {
if (new RegExp('(' + k + ')').test(fmt))
fmt = fmt.replace(
RegExp.$1,
RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length),
)
}
return fmt
}
new Vue({ new Vue({
router, router,
store, store,
......
src/router/index.js
...@@ -244,6 +244,62 @@ const routes = [ ...@@ -244,6 +244,62 @@ const routes = [
name: 'batchPlanManagement', name: 'batchPlanManagement',
component: () => import('@/views/batchPlanManagement/index.vue'), component: () => import('@/views/batchPlanManagement/index.vue'),
}, },
{
path: '/main/conceptualReview', // 概设材料审查列表
name: 'conceptualReview',
component: () => import('@/views/conceptualReview/index.vue'),
},
{
path: '/main/conceptualExamine', // 概设材料审查页面
name: 'conceptualExamine',
component: () => import('@/views/conceptualReview/Examine.vue'),
},
{
path: '/main/demandManagement', // 需求管理列表页
name: 'demandManagement',
component: () => import('@/views/demandManagement/index.vue'),
},
{
path: '/main/conceptualViewOrg', // 概设材料意见编制
name: 'conceptualViewOrg',
component: () => import('@/views/conceptualViewOrg/index.vue'),
},
{
path: '/main/conceptualBaseManagement', // 概设评审基础管理
name: 'conceptualBaseManagement',
component: () => import('@/views/conceptualBaseManagement/index.vue'),
},
{
path: '/main/onlineReview', // 评审意见编制- 在线辅助审核
name: 'onlineReview',
component: () => import('@/views/conceptualViewOrg/OnlineReview.vue'),
},
{
path: '/main/conceptualRelated', // 概设关联业务管理
name: 'conceptualRelated',
component: () => import('@/views/conceptualRelated/index.vue'),
},
{
path: '/main/supervisionNotifyManagement', // 架构督查督查通报管理
name: 'supervisionNotifyManagement',
component: () =>
import('@/views/supervisionNotifyManagement/index.vue'),
},
{
path: '/main/supervisionProblemEdit', // 架构督查督查问题整改
name: 'supervisionProblemEdit',
component: () => import('@/views/supervisionProblemEdit/index.vue'),
},
{
path: '/main/architectureFollowExamine', // 架构督查架构遵从检查
name: 'architectureFollowExamine',
component: () => import('@/views/architectureFollowExamine/index.vue'),
},
{
path: '/main/artPolicyExamine', // 架构督查-技术政策审查
name: 'artPolicyExamine',
component: () => import('@/views/artPolicyExamine/index.vue'),
},
], ],
}, },
] ]
......
src/styles/common.scss
...@@ -114,4 +114,5 @@ $color-primary: #0d867f; ...@@ -114,4 +114,5 @@ $color-primary: #0d867f;
.searchTable { .searchTable {
width: 100%; width: 100%;
height: 100%;
} }
src/utils/dictionary.js
...@@ -5,3 +5,76 @@ export const approvalStatusOptions = [ ...@@ -5,3 +5,76 @@ export const approvalStatusOptions = [
{ label: '审批通过', value: 3 }, { label: '审批通过', value: 3 },
{ label: '驳回', value: 4 }, { label: '驳回', value: 4 },
] ]
// 是否续建
export const prjPlanClass = [
{ label: '否', value: 1 },
{ label: '是', value: 2 },
]
export const buildType = [
{ label: '统推', value: '1' },
{ label: '自建', value: '2' },
]
// 评审材料名称枚举
export const archiPrjReviewEnum = [
{ label: '一致性评审', value: 'CONFORMANCE_REVIEW' },
// { label: '架构遵从', value: 'ARCHITECTURE_CONFORMANCE' },
{ label: '关键技术深度评审', value: 'KEY_TECHNOLOGY_REVIEW' },
{ label: '功能深度评审', value: 'FUNCTIONAL_DEPTH_REVIEW' },
{ label: '数据深度评审', value: 'DATA_DEPTH_REVIEW' },
{ label: '安全架构遵从', value: 'SECURITY_ARCHITECTURE_CONFORMANCE' },
{ label: '部署架构审查', value: 'DEPLOYMENT_ARCHITECTURE_REVIEW' },
{ label: '技术架构遵从', value: 'TECHNICAL_ARCHITECTURE_CONFORMANCE' },
{ label: '应用架构遵从', value: 'APPLICATION_ARCHITECTURE_CONFORMANCE' },
{
label: '物理数据架构遵从',
value: 'PHYSICAL_DATA_ARCHITECTURE_CONFORMANCE',
},
{ label: '运安符合性审查', value: 'OPERATIONAL_SAFETY_COMPLIANCE_REVIEW' },
{ label: '功能满足审查', value: 'FUNCTIONAL_SATISFACTION_REVIEW' },
{ label: '运行可靠性审查', value: 'OPERATIONAL_RELIABILITY_REVIEW' },
{ label: '系统实用性审查', value: 'SYSTEM_PRACTICALITY_REVIEW' },
{ label: '系统安全性审查', value: 'SYSTEM_SECURITY_REVIEW' },
{ label: '资源复用性审查', value: 'RESOURCE_REUSABILITY_REVIEW' },
{ label: '报告规范性', value: 'REPORT_NORM' },
{ label: '架构遵从', value: 'FRAMEWORK_OBEY' },
{ label: '技术路线', value: 'TECH_ROUTE' },
{ label: '功能偏差', value: 'FUNCTION_UNLIKE' },
{ label: '系统部署', value: 'APP_DEP' },
{ label: '系统集成', value: 'APP_INT' },
{ label: '系统安全', value: 'APP_SAFE' },
{ label: '功能重复风险', value: 'FUNCTION_S_RISK' },
{ label: '数据重复录入风险', value: 'DATA_S_INSERT_RISK' },
]
// 材料清单
export const materialOptions = [
{ label: '技术规范书', value: '技术规范书' },
{ label: '可行性研究报告', value: '可行性研究报告' },
{ label: '需求规格说明书', value: '需求规格说明书' },
{ label: '概要设计说明书', value: '概要设计说明书' },
{ label: '安全防护方案', value: '安全防护方案' },
{ label: '其他', value: '其他' },
]
// 推送状态
export const pushStateOptions = [
{ label: '已反馈', value: 1 },
{ label: '未反馈', value: 0 },
]
// 在线评审状态
export const onlineApprovalStatusOptions = [
{ label: '待评审', value: 2 },
{ label: '通过', value: 1 },
{ label: '未通过', value: 0 },
]
// 发送状态
export const sendStateOptions = [
{ label: '发送成功', value: 1 },
{ label: '未发送', value: 2 },
{ label: '发送失败', value: 3 },
]
export const completionStatus = [
{ label: '未完成', value: 0 },
{ label: '已完成', value: 1 },
]
src/views/Main/menu.js 0 → 100644
export const menuOptions = [
{
name: '架构全景大屏及智能驾驶舱',
width: '420',
children: [
{
name: '架构全景智能大屏',
children: [
{
name: 'XX网数字化项目建设分析',
path: '',
},
{
name: '公司架构蓝图实现情况分析',
path: '',
},
],
},
{
name: '智能驾驶舱',
children: [
{
name: '管理智能驾驶舱',
path: '',
},
{
name: '业务智能驾驶舱',
path: '',
},
{
name: '项目智能驾驶舱',
path: '',
},
],
},
],
},
{
name: '总体架构资产设计与维护',
width: '440',
children: [
{
name: '架构元模型管理',
children: [
{
name: '架构元素管理',
path: '/main/archiEleList',
},
{
name: '架构元素关系管理',
path: '/main/archi-ele-rela',
},
{
name: '元模型管理',
path: '/main/metaModelList',
},
{
name: '架构视图配置',
path: '/main/archi-view-config',
},
{
name: '元模型字典管理',
path: '/main/meta-model-dic',
},
],
},
{
name: '总体架构资产维护',
children: [
{
name: '架构资产管理',
path: '/main/busiAssetslist',
},
{
name: '架构视图管理',
path: '/main/archiViewManage',
},
{
name: '企业中台服务清单',
path: '/main/comCenterServeList',
},
{
name: '现状架构资产管理',
path: '/main/currentAssetsList',
},
{
name: '架构演进路线资产管理',
path: '/main/archiEvoluteLine',
},
{
name: '总体架构资产可视化展示',
path: '/main/archiAssetVisualShow',
},
{
name: '总体架构资产智能搜索',
path: '/main/archiIntelligenceSearch',
},
],
},
],
},
{
name: '系统架构设计与管控',
width: '1100',
children: [
{
name: '系统架构资产管理',
children: [
{
name: '系统信息管理',
path: '/main/systemInfoManage',
},
{
name: '项目信息管理',
path: '/main/projectInfoManage',
},
{
name: '系统架构资产维护',
path: '/main/archiAssetManage',
},
],
},
{
name: '系统架构设计',
children: [
{
name: '系统架构视图设计',
path: '/main/systemArchiViewDesign',
},
{
name: '概设阶段架构设计',
path: '/main/summaryArchiDesign',
},
{
name: '其他视图设计',
path: '/main/otherArchiDesign',
},
],
},
{
name: '系统架构管控要求',
children: [
{
name: '评审情况(概要设计)',
path: '/main/reviewSituation',
},
{
name: '概设架构遵从检查',
path: '/main/reviewArchiFollowCheck',
},
{
name: '概设架构政策审查',
path: '/main/reviewArchiPoliticeCheck',
},
],
},
{
name: '概要设计评审',
children: [
{
name: '批次计划管理',
path: '/main/batchPlanManagement',
},
{
name: '需求管理',
path: '/main/demandManagement',
},
{
name: '概设材料审查',
path: '/main/conceptualReview',
children: [
{
name: '审查',
path: '/main/conceptualExamine',
},
],
},
{
name: '概设材料意见编制',
path: '/main/conceptualViewOrg',
},
{
name: '概设关联业务管理',
path: '/main/conceptualRelated',
},
{
name: '概设评审基础管理',
path: '/main/conceptualBaseManagement',
},
],
},
{
name: '架构督查',
children: [
{
name: '收集资料配置',
path: '',
},
{
name: '督查材料收集',
path: '',
},
{
name: '架构督查分析',
path: '',
},
{
name: '督查通报管理',
path: '/main/supervisionNotifyManagement',
},
{
name: '督查问题整改',
path: '/main/supervisionProblemEdit',
},
{
name: '架构遵从检查',
path: '/main/architectureFollowExamine',
},
{
name: '技术政策审查',
path: '/main/artPolicyExamine',
},
],
},
],
},
{
name: '架构资产服务与辅助分析',
width: '220',
children: [
{
name: '架构资产服务与辅助分析',
children: [
{
name: '架构遵从符合度检查',
path: '',
},
{
name: '技术政策符合度检查',
path: '',
},
],
},
],
},
{
name: '架构知识库',
width: '700',
children: [
{
name: '专家人才库',
children: [
{
name: '专家人才库管理',
path: '/main/etp-Manage',
},
],
},
{
name: '技术政策库',
children: [
{
name: '技术政策结构化',
path: '/main/techPoliticsFabric',
},
{
name: '技术政策库关联使用',
path: '/main/techPoliticsRelativeUse',
},
],
},
{
name: '报告模板库',
children: [
{
name: '报告模板结构化',
path: '/main/reportTemplateFabric',
},
{
name: '报告模板关联使用',
path: '/main/reportTemplateRelativeUse',
},
],
},
{
name: '典型案例库',
children: [
{
name: '典型案例库管理',
path: '/main/typicalExampleManage',
},
{
name: '典型案例库关联使用',
path: '/main/typicalExampleRelativeUse',
},
{
name: '总体架构资产文档库',
path: '/main/totalArchiPropertyDocument',
},
],
},
],
},
]
src/views/archi-intelligence-search/index.vue
<template> <template>
<div class="archiIntelligenceSearch"> <div class="archiIntelligenceSearch">
<div class="left_container"> <div class="left_container">
<div class="search_menu_item" style="margin-top: 15px;"> <div class="search_menu_item" style="margin-top: 15px">
<span class="search_title">架构内容:</span> <span class="search_title">架构内容:</span>
<!-- <el-input v-no-backslash v-model="query_item1" placeholder="请输入" style="width: 300px;" maxlength="100"></el-input> --> <!-- <el-input v-no-backslash v-model="query_item1" placeholder="请输入" style="width: 300px;" maxlength="100"></el-input> -->
<el-input placeholder="请输入内容" v-no-backslash v-model="query_item1" clearable style="width: 300px;"> <el-input
placeholder="请输入内容"
v-no-backslash
v-model="query_item1"
clearable
style="width: 300px"
>
<template slot="append"> <template slot="append">
<div style="cursor: pointer;width: 50px;height: 35px;display: flex;justify-content: center;align-items: center;" @click="select1"> <div
style="
cursor: pointer;
width: 50px;
height: 35px;
display: flex;
justify-content: center;
align-items: center;
"
@click="select1"
>
<i class="el-icon-search"></i> <i class="el-icon-search"></i>
</div> </div>
</template> </template>
...@@ -14,8 +30,19 @@ ...@@ -14,8 +30,19 @@
</div> </div>
<div class="search_menu_item"> <div class="search_menu_item">
<span class="search_title">架构版本:</span> <span class="search_title">架构版本:</span>
<el-select v-model="query_item2" clearable placeholder="请选择" style="width: 300px;" @change="select2"> <el-select
<el-option v-for="item in archiList" :key="item.versionId" :label="item.versionName" :value="item.versionId"></el-option> v-model="query_item2"
clearable
placeholder="请选择"
style="width: 300px"
@change="select2"
>
<el-option
v-for="item in archiList"
:key="item.versionId"
:label="item.versionName"
:value="item.versionId"
></el-option>
</el-select> </el-select>
</div> </div>
<el-tree <el-tree
...@@ -28,11 +55,12 @@ ...@@ -28,11 +55,12 @@
node-key="id" node-key="id"
:check-strictly="true" :check-strictly="true"
@check="treeCheckChange" @check="treeCheckChange"
ref="tree"> ref="tree"
>
</el-tree> </el-tree>
</div> </div>
<div class="right_container"> <div class="right_container">
<div id="echartsContainer" style="width: 100%;height: 100%;"></div> <div id="echartsContainer" style="width: 100%; height: 100%"></div>
</div> </div>
</div> </div>
</template> </template>
...@@ -40,10 +68,10 @@ ...@@ -40,10 +68,10 @@
<script> <script>
import { import {
archiIntelligenceSearchTree, archiIntelligenceSearchTree,
archiIntelligenceSearchVersionList archiIntelligenceSearchVersionList,
} from '@/api/index.js'; } from '@/api/index.js'
import { MessageBox, Message } from 'element-ui'; import { MessageBox, Message } from 'element-ui'
import $ from 'jquery'; import $ from 'jquery'
export default { export default {
name: 'ArchiIntelligenceSearch', name: 'ArchiIntelligenceSearch',
...@@ -53,96 +81,100 @@ export default { ...@@ -53,96 +81,100 @@ export default {
myChart: null, myChart: null,
query_item1: null, query_item1: null,
query_item2: null, query_item2: null,
archiList: [] archiList: [],
}; }
}, },
mounted(){ mounted() {
this.getTreeData(); this.getTreeData()
this.getVisionList(); this.getVisionList()
}, },
methods: { methods: {
select1() { select1() {
this.getTreeData(); this.getTreeData()
}, },
select2(data) { select2(data) {
if(this.myChart) { if (this.myChart) {
this.myChart.dispose(); this.myChart.dispose()
} }
this.getTreeData(); this.getTreeData()
}, },
echarts1(seriesData, linkData) { echarts1(seriesData, linkData) {
this.myChart = echarts.init(document.getElementById('echartsContainer')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer'),
)
var option = { var option = {
tooltip: { tooltip: {
formatter: function (x) { formatter: function (x) {
return x.data.name; return x.data.name
} },
}, },
series: [ series: [
{ {
type: 'graph', type: 'graph',
layout: 'force', layout: 'force',
roam: true, roam: true,
symbolSize: [ 120, 60 ], symbolSize: [120, 60],
label: { label: {
normal: { normal: {
show: true, show: true,
width: 80, width: 80,
overflow: 'truncate', overflow: 'truncate',
textStyle: { textStyle: {
fontSize: 12 fontSize: 12,
},
}, },
}
}, },
lineStyle: { lineStyle: {
normal: { normal: {
opacity: 0.9, opacity: 0.9,
width: 5, width: 5,
curveness: 0 curveness: 0,
} },
}, },
force: { force: {
// repulsion: 500, // repulsion: 500,
repulsion: 1000, //节点之间的斥力因子。 repulsion: 1000, //节点之间的斥力因子。
edgeLength: 100 //边的两个节点之间的距离，这个距离也会受 repulsion。 edgeLength: 100, //边的两个节点之间的距离，这个距离也会受 repulsion。
}, },
// edgeSymbol: ['circle', 'arrow'], // edgeSymbol: ['circle', 'arrow'],
data: seriesData, data: seriesData,
links: linkData links: linkData,
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
getVisionList() {//查询架构版本 getVisionList() {
archiIntelligenceSearchVersionList({}).then(res => { //查询架构版本
if(res.code == 200) { archiIntelligenceSearchVersionList({}).then((res) => {
this.archiList = res.data; if (res.code == 200) {
this.archiList = res.data
} }
}); })
}, },
getTreeData() {//查询左侧树 getTreeData() {
//查询左侧树
const params = { const params = {
"assetName": this.query_item1, assetName: this.query_item1,
"versionId": this.query_item2, versionId: this.query_item2,
} }
archiIntelligenceSearchTree(params).then(res => { archiIntelligenceSearchTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.treeData = res.data; this.treeData = res.data
} }
}); })
}, },
treeCheckChange(data, tree) {//左侧树勾选 treeCheckChange(data, tree) {
let seriesData = [], linkData = []; //左侧树勾选
let seriesData = [],
linkData = []
if(tree.checkedNodes.length > 0) { if (tree.checkedNodes.length > 0) {
tree.checkedNodes.forEach((item) => {
tree.checkedNodes.forEach(item => { if (!item.targetList) {
if(!item.targetList){ return
return;
} }
seriesData.push({ seriesData.push({
name: item.assetName, name: item.assetName,
...@@ -151,12 +183,12 @@ export default { ...@@ -151,12 +183,12 @@ export default {
draggable: true, draggable: true,
itemStyle: { itemStyle: {
normal: { normal: {
color: item.color color: item.color,
}, },
} },
}); })
if(item.targetList.length > 0) { if (item.targetList.length > 0) {
item.targetList.forEach(item2 => { item.targetList.forEach((item2) => {
seriesData.push({ seriesData.push({
name: item2.assetName, name: item2.assetName,
id: item2.assetCode, id: item2.assetCode,
...@@ -164,9 +196,9 @@ export default { ...@@ -164,9 +196,9 @@ export default {
draggable: true, draggable: true,
itemStyle: { itemStyle: {
normal: { normal: {
color: item2.color color: item2.color,
},
}, },
}
}) })
linkData.push({ linkData.push({
source: item.assetCode, source: item.assetCode,
...@@ -188,60 +220,57 @@ export default { ...@@ -188,60 +220,57 @@ export default {
new_arr2.push(seriesData[i]) new_arr2.push(seriesData[i])
} }
} }
seriesData = new_arr2; seriesData = new_arr2
this.echarts1(seriesData, linkData);
}else { this.echarts1(seriesData, linkData)
this.myChart.dispose(); } else {
this.myChart.dispose()
} }
}, },
} },
} }
</script> </script>
<style> <style></style>
</style>
<style scoped> <style scoped>
.filter-tree{ .filter-tree {
width: 300px; width: 300px;
height: calc(100% - 120px); height: calc(100% - 120px);
overflow-y: auto; overflow-y: auto;
display: inline-block; display: inline-block;
} }
/deep/ .is-leaf { /deep/ .is-leaf {
background-color: #fff !important; background-color: #fff !important;
} }
.search_menu_item{ .search_menu_item {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-bottom: 10px; margin-bottom: 10px;
} }
.search_title{ .search_title {
font-size: 14px; font-size: 14px;
color: #606291; color: #606291;
flex-shrink: 0; flex-shrink: 0;
margin-right: 10px; margin-right: 10px;
} }
.archiIntelligenceSearch{ .archiIntelligenceSearch {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: flex; display: flex;
} }
.left_container{ .left_container {
width: 25%; width: 25%;
margin-right: 20px; margin-right: 20px;
height: 100%; height: 100%;
border: 1px solid #ccc; border: 1px solid #ccc;
text-align: center; text-align: center;
} }
.right_container{ .right_container {
width: 75%; width: 75%;
height: 100%; height: 100%;
pornhub: hidden; pornhub: hidden;
} }
/deep/ .el-input-group__append{ /deep/ .el-input-group__append {
padding: 0; padding: 0;
} }
</style> </style>
src/views/archiAssetVisualShow/index(旧).vue
<template> <template>
...@@ -8,26 +8,23 @@ ...@@ -8,26 +8,23 @@
default-expand-all default-expand-all
node-key="assetId" node-key="assetId"
@node-click="treeClick" @node-click="treeClick"
ref="tree"> ref="tree"
>
</el-tree> </el-tree>
<div class="right_container"> <div class="right_container">
<div id="echartsContainer" style="width: 800px;height: 500px;"></div> <div id="echartsContainer" style="width: 800px; height: 500px"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { archiAssetShowTree } from '@/api/index.js'
archiAssetShowTree, import { MessageBox, Message } from 'element-ui'
} from '@/api/index.js'; import $ from 'jquery'
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
export default { export default {
name: 'ArchiAssetVisualShow', name: 'ArchiAssetVisualShow',
components: { components: {},
},
data() { data() {
return { return {
treeData: [ treeData: [
...@@ -35,88 +32,92 @@ export default { ...@@ -35,88 +32,92 @@ export default {
{ id: 'APP', name: '应用架构', children: [] }, { id: 'APP', name: '应用架构', children: [] },
{ id: 'DATA', name: '数据架构', children: [] }, { id: 'DATA', name: '数据架构', children: [] },
{ id: 'TECH', name: '技术架构', children: [] }, { id: 'TECH', name: '技术架构', children: [] },
{ id: 'SAFE', name: '安全架构', children: [] } { id: 'SAFE', name: '安全架构', children: [] },
], ],
myChart: null myChart: null,
}; }
}, },
mounted(){ mounted() {
this.getTreeData('BUSI'); this.getTreeData('BUSI')
this.echarts1(); this.echarts1()
}, },
methods: { methods: {
echarts1(seriesData, linkData) { echarts1(seriesData, linkData) {
this.myChart = echarts.init(document.getElementById('echartsContainer')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer'),
)
var option = { var option = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar' type: 'bar',
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
getTreeData(type) {//查询左侧树 getTreeData(type) {
//查询左侧树
const params = { const params = {
"assetEnum": type assetEnum: type,
} }
archiAssetShowTree(params).then(res => { archiAssetShowTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.treeData.forEach(item => { this.treeData.forEach((item) => {
if(item.id == type) { if (item.id == type) {
item.children = res.data; item.children = res.data
} }
}) })
} }
}); })
}, },
treeClick(data, node, e) {//树点击的时候 treeClick(data, node, e) {
//树点击的时候
// console.log(data.assetId); // console.log(data.assetId);
const type = [ 'BUSI', 'APP', 'DATA', 'TECH', 'SAFE' ]; const type = ['BUSI', 'APP', 'DATA', 'TECH', 'SAFE']
if(type.includes(data.id)) { if (type.includes(data.id)) {
this.getTreeData(data.id); this.getTreeData(data.id)
}
}
} }
},
},
} }
</script> </script>
<style scoped> <style scoped>
.archiAssetVisualShow{ .archiAssetVisualShow {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.filter-tree{ .filter-tree {
width: 300px; width: 300px;
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
border-right: 1px solid #ccc; border-right: 1px solid #ccc;
} }
.right_container{ .right_container {
width: calc(100% - 300px); width: calc(100% - 300px);
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
/deep/ .is-leaf { /deep/ .is-leaf {
background-color: #fff !important; background-color: #fff !important;
} }
</style> </style>
src/views/archiAssetVisualShow/tab1.vue
<template> <template>
<div class="tab1"> <div class="tab1">
<div class="containerLeft"> <div class="containerLeft">
<p style="text-align: left;margin-left: 20px;">业务域</p> <p style="text-align: left; margin-left: 20px">业务域</p>
<el-divider></el-divider> <el-divider></el-divider>
<div class="buttonContainer"> <div class="buttonContainer">
<span v-for="item in leftData" :key="item.assetId"> <span v-for="item in leftData" :key="item.assetId">
<el-button style="margin: 10px 20px;" @click="showCurrent(item)">{{ item.assetName }}</el-button> <el-button style="margin: 10px 20px" @click="showCurrent(item)">{{
item.assetName
}}</el-button>
</span> </span>
</div> </div>
</div> </div>
<div class="containerCenter"> <div class="containerCenter">
<el-collapse accordion v-for="item in centerData" :key="item.assetId" style="margin-bottom: 20px;"> <el-collapse
accordion
v-for="item in centerData"
:key="item.assetId"
style="margin-bottom: 20px"
>
<el-collapse-item> <el-collapse-item>
<template slot="title"> <template slot="title">
<div style="width: 100%;display: flex;align-items: center;padding-left: 20px;"> <div
style="
width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
"
>
<el-button size="medium">{{ item.assetName }}</el-button> <el-button size="medium">{{ item.assetName }}</el-button>
<p style="width: 76%;margin-left: 20px;border-top: 1px dotted #000;"></p> <p
style="
width: 76%;
margin-left: 20px;
border-top: 1px dotted #000;
"
></p>
</div> </div>
</template> </template>
<span v-for="item2 in item.children" :key="item2.assetId"> <span v-for="item2 in item.children" :key="item2.assetId">
<el-button style="margin: 10px 20px;">{{ item2.assetName }}</el-button> <el-button style="margin: 10px 20px">{{
item2.assetName
}}</el-button>
</span> </span>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
<div class="containerRight"> <div class="containerRight">
<div id="echartsContainer" style="width: 800px;height: 500px;"></div> <div id="echartsContainer" style="width: 800px; height: 500px"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { archiAssetShowTree } from '@/api/index.js'
archiAssetShowTree import { MessageBox, Message } from 'element-ui'
} from '@/api/index.js'; export default {
import { MessageBox, Message } from 'element-ui';
export default {
name: 'tab1', name: 'tab1',
components: { components: {},
},
data() { data() {
return { return {
leftData: [], leftData: [],
centerData: [] centerData: [],
}; }
}, },
mounted(){ mounted() {
this.echarts1(); this.echarts1()
this.getLeftData(); this.getLeftData()
}, },
methods: { methods: {
showCurrent(data) { showCurrent(data) {
this.centerData = data.children; this.centerData = data.children
}, },
getLeftData() { getLeftData() {
const params = { const params = {
"assertType": "ARCHI_BUSINESS" assertType: 'ARCHI_BUSINESS',
} }
archiAssetShowTree(params).then(res => { archiAssetShowTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.leftData = res.data; this.leftData = res.data
}else { } else {
Message({ Message({
type: 'error', type: 'error',
message: res.msg message: res.msg,
}); })
} }
}) })
}, },
echarts1() { echarts1() {
this.myChart = echarts.init(document.getElementById('echartsContainer')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer'),
)
var option = { var option = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar' type: 'bar',
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
} },
} }
</script> </script>
<style> <style>
.el-tabs__nav{ .el-tabs__nav {
margin-left: 20px; margin-left: 20px;
} }
</style> </style>
<style scoped> <style scoped>
.tab1{ .tab1 {
height: calc(100% - 20px); height: calc(100% - 20px);
display: flex; display: flex;
} }
.buttonContainer{ .buttonContainer {
height: calc(100% - 90px); height: calc(100% - 90px);
overflow-y: auto; overflow-y: auto;
text-align: left; text-align: left;
} }
/deep/ .el-collapse-item__content{ /deep/ .el-collapse-item__content {
text-align: left; text-align: left;
} }
.containerLeft{ .containerLeft {
width: 20%; width: 20%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
} }
.containerCenter{ .containerCenter {
width: 35%; width: 35%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
overflow-y: auto; overflow-y: auto;
} }
.containerRight{ .containerRight {
width: 45%; width: 45%;
height: 100%; height: 100%;
} }
.el-button--primary{ .el-button--primary {
background: rgba(13,134,127,1); background: rgba(13, 134, 127, 1);
color: #fff; color: #fff;
border: 0; border: 0;
} }
</style> </style>
src/views/archiAssetVisualShow/tab2.vue
<template> <template>
<div class="tab2"> <div class="tab2">
<div class="containerLeft"> <div class="containerLeft">
<p style="text-align: left;margin-left: 20px;">业务域</p> <p style="text-align: left; margin-left: 20px">业务域</p>
<el-divider></el-divider> <el-divider></el-divider>
<div class="buttonContainer"> <div class="buttonContainer">
<span v-for="item in leftData" :key="item.assetId"> <span v-for="item in leftData" :key="item.assetId">
<el-button style="margin: 10px 20px;" @click="showCurrent(item)">{{ item.assetName }}</el-button> <el-button style="margin: 10px 20px" @click="showCurrent(item)">{{
item.assetName
}}</el-button>
</span> </span>
</div> </div>
</div> </div>
<div class="containerCenter"> <div class="containerCenter">
<el-collapse accordion v-for="item in centerData" :key="item.assetId" style="margin-bottom: 20px;"> <el-collapse
accordion
v-for="item in centerData"
:key="item.assetId"
style="margin-bottom: 20px"
>
<el-collapse-item> <el-collapse-item>
<template slot="title"> <template slot="title">
<div style="width: 100%;display: flex;align-items: center;padding-left: 20px;"> <div
style="
width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
"
>
<el-button size="medium">{{ item.assetName }}</el-button> <el-button size="medium">{{ item.assetName }}</el-button>
<p style="width: 76%;margin-left: 20px;border-top: 1px dotted #000;"></p> <p
style="
width: 76%;
margin-left: 20px;
border-top: 1px dotted #000;
"
></p>
</div> </div>
</template> </template>
<span v-for="item2 in item.children" :key="item2.assetId"> <span v-for="item2 in item.children" :key="item2.assetId">
<el-button style="margin: 10px 20px;">{{ item2.assetName }}</el-button> <el-button style="margin: 10px 20px">{{
item2.assetName
}}</el-button>
</span> </span>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
<div class="containerRight"> <div class="containerRight">
<div id="echartsContainer2" style="width: 800px;height: 500px;"></div> <div id="echartsContainer2" style="width: 800px; height: 500px"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { archiAssetShowTree } from '@/api/index.js'
archiAssetShowTree import { MessageBox, Message } from 'element-ui'
} from '@/api/index.js'; export default {
import { MessageBox, Message } from 'element-ui';
export default {
name: 'tab2', name: 'tab2',
components: { components: {},
},
data() { data() {
return { return {
leftData: [], leftData: [],
centerData: [] centerData: [],
}; }
}, },
mounted(){ mounted() {
this.echarts1(); this.echarts1()
this.getLeftData(); this.getLeftData()
}, },
methods: { methods: {
showCurrent(data) { showCurrent(data) {
this.centerData = data.children; this.centerData = data.children
}, },
getLeftData() { getLeftData() {
const params = { const params = {
"assertType": "ARCHI_APPLICATION" assertType: 'ARCHI_APPLICATION',
} }
archiAssetShowTree(params).then(res => { archiAssetShowTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.leftData = res.data; this.leftData = res.data
}else { } else {
Message({ Message({
type: 'error', type: 'error',
message: res.msg message: res.msg,
}); })
} }
}) })
}, },
echarts1() { echarts1() {
this.myChart = echarts.init(document.getElementById('echartsContainer2')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer2'),
)
var option = { var option = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar' type: 'bar',
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
} },
} }
</script> </script>
<style> <style>
.el-tabs__nav{ .el-tabs__nav {
margin-left: 20px; margin-left: 20px;
} }
</style> </style>
<style scoped> <style scoped>
.tab2{ .tab2 {
height: calc(100% - 20px); height: calc(100% - 20px);
display: flex; display: flex;
} }
/deep/ .el-collapse-item__content{ /deep/ .el-collapse-item__content {
text-align: left; text-align: left;
} }
.buttonContainer{ .buttonContainer {
height: calc(100% - 90px); height: calc(100% - 90px);
overflow-y: auto; overflow-y: auto;
text-align: left; text-align: left;
} }
.containerLeft{ .containerLeft {
width: 20%; width: 20%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
} }
.containerCenter{ .containerCenter {
width: 35%; width: 35%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
overflow-y: auto; overflow-y: auto;
} }
.containerRight{ .containerRight {
width: 45%; width: 45%;
height: 100%; height: 100%;
} }
.el-button--primary{ .el-button--primary {
background: rgba(13,134,127,1); background: rgba(13, 134, 127, 1);
color: #fff; color: #fff;
border: 0; border: 0;
} }
</style> </style>
src/views/archiAssetVisualShow/tab3.vue
<template> <template>
<div class="tab3"> <div class="tab3">
<div class="containerLeft"> <div class="containerLeft">
<p style="text-align: left;margin-left: 20px;">业务域</p> <p style="text-align: left; margin-left: 20px">业务域</p>
<el-divider></el-divider> <el-divider></el-divider>
<div class="buttonContainer"> <div class="buttonContainer">
<span v-for="item in leftData" :key="item.assetId"> <span v-for="item in leftData" :key="item.assetId">
<el-button style="margin: 10px 20px;" @click="showCurrent(item)">{{ item.assetName }}</el-button> <el-button style="margin: 10px 20px" @click="showCurrent(item)">{{
item.assetName
}}</el-button>
</span> </span>
</div> </div>
</div> </div>
<div class="containerCenter"> <div class="containerCenter">
<el-collapse accordion v-for="item in centerData" :key="item.assetId" style="margin-bottom: 20px;"> <el-collapse
accordion
v-for="item in centerData"
:key="item.assetId"
style="margin-bottom: 20px"
>
<el-collapse-item> <el-collapse-item>
<template slot="title"> <template slot="title">
<div style="width: 100%;display: flex;align-items: center;padding-left: 20px;"> <div
style="
width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
"
>
<el-button size="medium">{{ item.assetName }}</el-button> <el-button size="medium">{{ item.assetName }}</el-button>
<p style="width: 76%;margin-left: 20px;border-top: 1px dotted #000;"></p> <p
style="
width: 76%;
margin-left: 20px;
border-top: 1px dotted #000;
"
></p>
</div> </div>
</template> </template>
<span v-for="item2 in item.children" :key="item2.assetId"> <span v-for="item2 in item.children" :key="item2.assetId">
<el-button style="margin: 10px 20px;">{{ item2.assetName }}</el-button> <el-button style="margin: 10px 20px">{{
item2.assetName
}}</el-button>
</span> </span>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
<div class="containerRight"> <div class="containerRight">
<div id="echartsContainer3" style="width: 800px;height: 500px;"></div> <div id="echartsContainer3" style="width: 800px; height: 500px"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { archiAssetShowTree } from '@/api/index.js'
archiAssetShowTree import { MessageBox, Message } from 'element-ui'
} from '@/api/index.js'; export default {
import { MessageBox, Message } from 'element-ui';
export default {
name: 'tab3', name: 'tab3',
components: { components: {},
},
data() { data() {
return { return {
leftData: [], leftData: [],
centerData: [] centerData: [],
}; }
}, },
mounted(){ mounted() {
this.echarts1(); this.echarts1()
this.getLeftData(); this.getLeftData()
}, },
methods: { methods: {
showCurrent(data) { showCurrent(data) {
this.centerData = data.children; this.centerData = data.children
}, },
getLeftData() { getLeftData() {
const params = { const params = {
"assertType": "ARCHI_DATA" assertType: 'ARCHI_DATA',
} }
archiAssetShowTree(params).then(res => { archiAssetShowTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.leftData = res.data; this.leftData = res.data
}else { } else {
Message({ Message({
type: 'error', type: 'error',
message: res.msg message: res.msg,
}); })
} }
}) })
}, },
echarts1() { echarts1() {
this.myChart = echarts.init(document.getElementById('echartsContainer3')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer3'),
)
var option = { var option = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar' type: 'bar',
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
} },
} }
</script> </script>
<style> <style>
.el-tabs__nav{ .el-tabs__nav {
margin-left: 20px; margin-left: 20px;
} }
</style> </style>
<style scoped> <style scoped>
.tab3{ .tab3 {
height: calc(100% - 20px); height: calc(100% - 20px);
display: flex; display: flex;
} }
/deep/ .el-collapse-item__content{ /deep/ .el-collapse-item__content {
text-align: left; text-align: left;
} }
.buttonContainer{ .buttonContainer {
height: calc(100% - 90px); height: calc(100% - 90px);
overflow-y: auto; overflow-y: auto;
text-align: left; text-align: left;
} }
.containerLeft{ .containerLeft {
width: 20%; width: 20%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
} }
.containerCenter{ .containerCenter {
width: 35%; width: 35%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
overflow-y: auto; overflow-y: auto;
} }
.containerRight{ .containerRight {
width: 45%; width: 45%;
height: 100%; height: 100%;
} }
.el-button--primary{ .el-button--primary {
background: rgba(13,134,127,1); background: rgba(13, 134, 127, 1);
color: #fff; color: #fff;
border: 0; border: 0;
} }
</style> </style>
src/views/archiAssetVisualShow/tab4.vue
<template> <template>
<div class="tab4"> <div class="tab4">
<div class="containerLeft"> <div class="containerLeft">
<p style="text-align: left;margin-left: 20px;">业务域</p> <p style="text-align: left; margin-left: 20px">业务域</p>
<el-divider></el-divider> <el-divider></el-divider>
<div class="buttonContainer"> <div class="buttonContainer">
<span v-for="item in leftData" :key="item.assetId"> <span v-for="item in leftData" :key="item.assetId">
<el-button style="margin: 10px 20px;" @click="showCurrent(item)">{{ item.assetName }}</el-button> <el-button style="margin: 10px 20px" @click="showCurrent(item)">{{
item.assetName
}}</el-button>
</span> </span>
</div> </div>
</div> </div>
<div class="containerCenter"> <div class="containerCenter">
<el-collapse accordion v-for="item in centerData" :key="item.assetId" style="margin-bottom: 20px;"> <el-collapse
accordion
v-for="item in centerData"
:key="item.assetId"
style="margin-bottom: 20px"
>
<el-collapse-item> <el-collapse-item>
<template slot="title"> <template slot="title">
<div style="width: 100%;display: flex;align-items: center;padding-left: 20px;"> <div
style="
width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
"
>
<el-button size="medium">{{ item.assetName }}</el-button> <el-button size="medium">{{ item.assetName }}</el-button>
<p style="width: 76%;margin-left: 20px;border-top: 1px dotted #000;"></p> <p
style="
width: 76%;
margin-left: 20px;
border-top: 1px dotted #000;
"
></p>
</div> </div>
</template> </template>
<span v-for="item2 in item.children" :key="item2.assetId"> <span v-for="item2 in item.children" :key="item2.assetId">
<el-button style="margin: 10px 20px;">{{ item2.assetName }}</el-button> <el-button style="margin: 10px 20px">{{
item2.assetName
}}</el-button>
</span> </span>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
<div class="containerRight"> <div class="containerRight">
<div id="echartsContainer4" style="width: 800px;height: 500px;"></div> <div id="echartsContainer4" style="width: 800px; height: 500px"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { archiAssetShowTree } from '@/api/index.js'
archiAssetShowTree import { MessageBox, Message } from 'element-ui'
} from '@/api/index.js'; export default {
import { MessageBox, Message } from 'element-ui';
export default {
name: 'tab4', name: 'tab4',
components: { components: {},
},
data() { data() {
return { return {
leftData: [], leftData: [],
centerData: [] centerData: [],
}; }
}, },
mounted(){ mounted() {
this.echarts1(); this.echarts1()
this.getLeftData(); this.getLeftData()
}, },
methods: { methods: {
showCurrent(data) { showCurrent(data) {
this.centerData = data.children; this.centerData = data.children
}, },
getLeftData() { getLeftData() {
const params = { const params = {
"assertType": "ARCHI_TECHNOLOGY" assertType: 'ARCHI_TECHNOLOGY',
} }
archiAssetShowTree(params).then(res => { archiAssetShowTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.leftData = res.data; this.leftData = res.data
}else { } else {
Message({ Message({
type: 'error', type: 'error',
message: res.msg message: res.msg,
}); })
} }
}) })
}, },
echarts1() { echarts1() {
this.myChart = echarts.init(document.getElementById('echartsContainer4')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer4'),
)
var option = { var option = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar' type: 'bar',
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
} },
} }
</script> </script>
<style> <style>
.el-tabs__nav{ .el-tabs__nav {
margin-left: 20px; margin-left: 20px;
} }
</style> </style>
<style scoped> <style scoped>
.tab4{ .tab4 {
height: calc(100% - 20px); height: calc(100% - 20px);
display: flex; display: flex;
} }
/deep/ .el-collapse-item__content{ /deep/ .el-collapse-item__content {
text-align: left; text-align: left;
} }
.buttonContainer{ .buttonContainer {
height: calc(100% - 90px); height: calc(100% - 90px);
overflow-y: auto; overflow-y: auto;
text-align: left; text-align: left;
} }
.containerLeft{ .containerLeft {
width: 20%; width: 20%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
} }
.containerCenter{ .containerCenter {
width: 35%; width: 35%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
overflow-y: auto; overflow-y: auto;
} }
.containerRight{ .containerRight {
width: 45%; width: 45%;
height: 100%; height: 100%;
} }
.el-button--primary{ .el-button--primary {
background: rgba(13,134,127,1); background: rgba(13, 134, 127, 1);
color: #fff; color: #fff;
border: 0; border: 0;
} }
</style> </style>
src/views/archiAssetVisualShow/tab5.vue
<template> <template>
<div class="tab5"> <div class="tab5">
<div class="containerLeft"> <div class="containerLeft">
<p style="text-align: left;margin-left: 20px;">业务域</p> <p style="text-align: left; margin-left: 20px">业务域</p>
<el-divider></el-divider> <el-divider></el-divider>
<div class="buttonContainer"> <div class="buttonContainer">
<span v-for="item in leftData" :key="item.assetId"> <span v-for="item in leftData" :key="item.assetId">
<el-button style="margin: 10px 20px;" @click="showCurrent(item)">{{ item.assetName }}</el-button> <el-button style="margin: 10px 20px" @click="showCurrent(item)">{{
item.assetName
}}</el-button>
</span> </span>
</div> </div>
</div> </div>
<div class="containerCenter"> <div class="containerCenter">
<el-collapse accordion v-for="item in centerData" :key="item.assetId" style="margin-bottom: 20px;"> <el-collapse
accordion
v-for="item in centerData"
:key="item.assetId"
style="margin-bottom: 20px"
>
<el-collapse-item> <el-collapse-item>
<template slot="title"> <template slot="title">
<div style="width: 100%;display: flex;align-items: center;padding-left: 20px;"> <div
style="
width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
"
>
<el-button size="medium">{{ item.assetName }}</el-button> <el-button size="medium">{{ item.assetName }}</el-button>
<p style="width: 76%;margin-left: 20px;border-top: 1px dotted #000;"></p> <p
style="
width: 76%;
margin-left: 20px;
border-top: 1px dotted #000;
"
></p>
</div> </div>
</template> </template>
<span v-for="item2 in item.children" :key="item2.assetId"> <span v-for="item2 in item.children" :key="item2.assetId">
<el-button style="margin: 10px 20px;">{{ item2.assetName }}</el-button> <el-button style="margin: 10px 20px">{{
item2.assetName
}}</el-button>
</span> </span>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
<div class="containerRight"> <div class="containerRight">
<div id="echartsContainer5" style="width: 800px;height: 500px;"></div> <div id="echartsContainer5" style="width: 800px; height: 500px"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { archiAssetShowTree } from '@/api/index.js'
archiAssetShowTree import { MessageBox, Message } from 'element-ui'
} from '@/api/index.js'; export default {
import { MessageBox, Message } from 'element-ui';
export default {
name: 'tab5', name: 'tab5',
components: { components: {},
},
data() { data() {
return { return {
leftData: [], leftData: [],
centerData: [] centerData: [],
}; }
}, },
mounted(){ mounted() {
this.echarts1(); this.echarts1()
this.getLeftData(); this.getLeftData()
}, },
methods: { methods: {
showCurrent(data) { showCurrent(data) {
this.centerData = data.children; this.centerData = data.children
}, },
getLeftData() { getLeftData() {
const params = { const params = {
"assertType": "ARCHI_SAFE" assertType: 'ARCHI_SAFE',
} }
archiAssetShowTree(params).then(res => { archiAssetShowTree(params).then((res) => {
if(res.code == 200) { if (res.code == 200) {
this.leftData = res.data; this.leftData = res.data
}else { } else {
Message({ Message({
type: 'error', type: 'error',
message: res.msg message: res.msg,
}); })
} }
}) })
}, },
echarts1() { echarts1() {
this.myChart = echarts.init(document.getElementById('echartsContainer5')); this.myChart = this.$echarts.init(
document.getElementById('echartsContainer5'),
)
var option = { var option = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar' type: 'bar',
},
],
} }
]
};
this.myChart.setOption(option); this.myChart.setOption(option)
}, },
} },
} }
</script> </script>
<style> <style>
.el-tabs__nav{ .el-tabs__nav {
margin-left: 20px; margin-left: 20px;
} }
</style> </style>
<style scoped> <style scoped>
.tab5{ .tab5 {
height: calc(100% - 20px); height: calc(100% - 20px);
display: flex; display: flex;
} }
.buttonContainer{ .buttonContainer {
height: calc(100% - 90px); height: calc(100% - 90px);
overflow-y: auto; overflow-y: auto;
text-align: left; text-align: left;
} }
/deep/ .el-collapse-item__content{ /deep/ .el-collapse-item__content {
text-align: left; text-align: left;
} }
.containerLeft{ .containerLeft {
width: 20%; width: 20%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
} }
.containerCenter{ .containerCenter {
width: 35%; width: 35%;
height: 100%; height: 100%;
border-right: 2px solid #ccc; border-right: 2px solid #ccc;
overflow-y: auto; overflow-y: auto;
} }
.containerRight{ .containerRight {
width: 45%; width: 45%;
height: 100%; height: 100%;
} }
.el-button--primary{ .el-button--primary {
background: rgba(13,134,127,1); background: rgba(13, 134, 127, 1);
color: #fff; color: #fff;
border: 0; border: 0;
} }
</style> </style>
src/views/architectureFollowExamine/index.vue 0 → 100644
<!--
* @Description: 架构督查-架构遵从检查
* @Version: 2.0
* @Autor: pan
* @Date: 2024-03-26 18:27:18
* @LastEditors: pan
* @LastEditTime: 2024-03-26 19:08:43
-->
<template>
<div class="architectureFollowExamine">
<el-tabs class="m-lr-10" v-model="activeName" @tab-click="handleClick">
<el-tab-pane
:label="item.label"
:name="item.name"
v-for="item in tabOptions"
:key="item.name"
lazy
>
<keep-alive>
<component :is="item.componentTag"></component>
</keep-alive>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import Tab1 from './tab1.vue'
import Tab2 from './tab2.vue'
import Tab3 from './tab3.vue'
import Tab4 from './tab4.vue'
import Tab5 from './tab5.vue'
export default {
name: 'architectureFollowExamine',
data() {
return {
activeName: '1',
tabOptions: [
{ label: '业务架构遵从', name: '1', componentTag: 'Tab1' },
{ label: '应用架构遵从', name: '2', componentTag: 'Tab2' },
{ label: '数据架构遵从', name: '3', componentTag: 'Tab3' },
{ label: '技术架构遵从', name: '4', componentTag: 'Tab4' },
{ label: '安全数据架构遵从', name: '5', componentTag: 'Tab5' },
],
componentTag: '',
}
},
components: {
Tab1,
Tab2,
Tab3,
Tab4,
Tab5,
},
mounted() {},
methods: {},
}
</script>
<style scoped lang="scss">
@import '@/styles/common.scss';
.architectureFollowExamine {
width: 100%;
& > div {
height: 100%;
}
::v-deep .el-tabs__content {
height: calc(100% - 55px);
.el-tab-pane {
height: 100%;
}
}
}
</style>
src/views/architectureFollowExamine/tab1.vue 0 → 100644
<template>
<div class="tab-component flex-column h-100">
<div class="content flex">
<div class="left_container m-r-10 flex-column">
<div class="left_container_title">
<i class="el-icon-caret-right icon"></i>
<span>系统业务架构视图</span>
</div>
<div class="left_container_content flex-1">
<img
v-for="(item, idx) in leftBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
<div class="right_container flex-column">
<div class="right_container_title flex-b-c">
<div class="flex">
<i class="el-icon-caret-right icon"></i>
<span>概设阶段业务架构视图</span>
</div>
</div>
<div class="right_container_content flex-1">
<img
v-for="(item, idx) in rightBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
</div>
<div class="bottom_container">
<div class="flex-b-c p-r-20 m-tb-15">
<div class="flex-c">
<span class="m-r-50 p-l-20 bottom_container_title">备注</span>
</div>
<el-button type="primary" size="medium" @click="handleSave"
>保存结果</el-button
>
</div>
<el-input
type="textarea"
:rows="4"
v-model="resultContent"
v-no-backslash
class="w-100"
placeholder="请输入"
></el-input>
</div>
</div>
</template>
<script>
import {
saveReviewArchiFollowCheckRightSuggestion,
queryReviewArchiFollowCheckRightSuggestionDetails,
} from '@/api/index.js'
export default {
name: 'tab1',
components: {},
data() {
return {
resultContent: '',
leftBaseOptions: [],
rightBaseOptions: [],
}
},
created() {
this.getDetail()
},
methods: {
getDetail() {
const params = {
reviewEnum: 'OPERATIONAL_SAFETY_COMPLIANCE_REVIEW',
prjId: this.$route.query.prjId,
}
queryReviewArchiFollowCheckRightSuggestionDetails(params).then((res) => {
if (res.code === 200) {
this.resultContent = res.data.reviewSuggestion
this.isMeet = res.data.reviewState
}
})
},
handleSave() {
const params = {
reviewEnum: 'OPERATIONAL_SAFETY_COMPLIANCE_REVIEW',
prjId: this.$route.query.prjId,
reviewState: this.isMeet,
reviewSuggestion: this.resultContent,
}
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
saveReviewArchiFollowCheckRightSuggestion(params).then((res) => {
loading.close()
if (res.code == 200) {
this.$message.success('保存成功')
} else {
this.$message.error(res.msg)
}
})
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/common.scss';
@import '@/views/reviewArchiPoliticeCheck/index.scss';
</style>
src/views/architectureFollowExamine/tab2.vue 0 → 100644
<template>
<div class="tab-component flex-column h-100">
<div class="content flex">
<div class="left_container m-r-10 flex-column">
<div class="left_container_title">
<i class="el-icon-caret-right icon"></i>
<span>系统应用架构视图</span>
</div>
<div class="left_container_content flex-1">
<img
v-for="(item, idx) in leftBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
<div class="right_container flex-column">
<div class="right_container_title flex-b-c">
<div class="flex">
<i class="el-icon-caret-right icon"></i>
<span>概设阶段应用架构视图</span>
</div>
</div>
<div class="right_container_content flex-1">
<img
v-for="(item, idx) in rightBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
</div>
<div class="bottom_container">
<div class="flex-b-c p-r-20 m-tb-15">
<div class="flex-c">
<span class="m-r-50 p-l-20 bottom_container_title">备注</span>
</div>
<el-button type="primary" size="medium" @click="handleSave"
>保存结果</el-button
>
</div>
<el-input
type="textarea"
:rows="4"
v-model="resultContent"
v-no-backslash
class="w-100"
placeholder="请输入"
></el-input>
</div>
</div>
</template>
<script>
import {
saveReviewArchiFollowCheckRightSuggestion,
queryReviewArchiFollowCheckRightSuggestionDetails,
} from '@/api/index.js'
export default {
name: 'tab2',
components: {},
data() {
return {
resultContent: '',
leftBaseOptions: [],
rightBaseOptions: [],
}
},
created() {
this.getDetail()
},
methods: {
getDetail() {
const params = {
reviewEnum: 'FUNCTIONAL_SATISFACTION_REVIEW',
prjId: this.$route.query.prjId,
}
queryReviewArchiFollowCheckRightSuggestionDetails(params).then((res) => {
if (res.code === 200) {
this.resultContent = res.data.reviewSuggestion
this.isMeet = res.data.reviewState
}
})
},
handleSave() {
const params = {
reviewEnum: 'FUNCTIONAL_SATISFACTION_REVIEW',
prjId: this.$route.query.prjId,
reviewState: '0',
reviewSuggestion: this.resultContent,
}
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
saveReviewArchiFollowCheckRightSuggestion(params).then((res) => {
loading.close()
if (res.code == 200) {
this.$message.success('保存成功')
} else {
this.$message.error(res.msg)
}
})
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/common.scss';
@import '@/views/reviewArchiPoliticeCheck/index.scss';
</style>
src/views/architectureFollowExamine/tab3.vue 0 → 100644
<template>
<div class="tab-component flex-column h-100">
<div class="content flex">
<div class="left_container m-r-10 flex-column">
<div class="left_container_title">
<i class="el-icon-caret-right icon"></i>
<span>系统数据架构视图</span>
</div>
<div class="left_container_content flex-1">
<img
v-for="(item, idx) in leftBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
<div class="right_container flex-column">
<div class="right_container_title flex-b-c">
<div class="flex">
<i class="el-icon-caret-right icon"></i>
<span>概设阶段数据架构视图</span>
</div>
</div>
<div class="right_container_content flex-1">
<img
v-for="(item, idx) in rightBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
</div>
<div class="bottom_container">
<div class="flex-b-c p-r-20 m-tb-15">
<div class="flex-c">
<span class="m-r-50 p-l-20 bottom_container_title">备注</span>
</div>
<el-button type="primary" size="medium" @click="handleSave"
>保存结果</el-button
>
</div>
<el-input
type="textarea"
:rows="4"
v-model="resultContent"
v-no-backslash
class="w-100"
placeholder="请输入"
></el-input>
</div>
</div>
</template>
<script>
import {
saveReviewArchiFollowCheckRightSuggestion,
queryReviewArchiFollowCheckRightSuggestionDetails,
} from '@/api/index.js'
export default {
name: 'tab3',
components: {},
data() {
return {
resultContent: '',
leftBaseOptions: [],
rightBaseOptions: [],
}
},
created() {
this.getDetail()
},
methods: {
getDetail() {
const params = {
reviewEnum: 'OPERATIONAL_RELIABILITY_REVIEW',
prjId: this.$route.query.prjId,
}
queryReviewArchiFollowCheckRightSuggestionDetails(params).then((res) => {
if (res.code === 200) {
this.resultContent = res.data.reviewSuggestion
this.isMeet = res.data.reviewState
}
})
},
handleSave() {
const params = {
reviewEnum: 'OPERATIONAL_RELIABILITY_REVIEW',
prjId: this.$route.query.prjId,
reviewState: '0',
reviewSuggestion: this.resultContent,
}
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
saveReviewArchiFollowCheckRightSuggestion(params).then((res) => {
loading.close()
if (res.code == 200) {
this.$message.success('保存成功')
} else {
this.$message.error(res.msg)
}
})
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/common.scss';
@import '@/views/reviewArchiPoliticeCheck/index.scss';
</style>
src/views/architectureFollowExamine/tab4.vue 0 → 100644
<template>
<div class="tab-component flex-column h-100">
<div class="content flex">
<div class="left_container m-r-10 flex-column">
<div class="left_container_title">
<i class="el-icon-caret-right icon"></i>
<span>系统技术架构视图</span>
</div>
<div class="left_container_content flex-1">
<img
v-for="(item, idx) in leftBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
<div class="right_container flex-column">
<div class="right_container_title flex-b-c">
<div class="flex">
<i class="el-icon-caret-right icon"></i>
<span>概设阶段技术架构视图</span>
</div>
</div>
<div class="right_container_content flex-1">
<img
v-for="(item, idx) in rightBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
</div>
<div class="bottom_container">
<div class="flex-b-c p-r-20 m-tb-15">
<div class="flex-c">
<span class="m-r-50 p-l-20 bottom_container_title">备注</span>
</div>
<el-button type="primary" size="medium" @click="handleSave"
>保存结果</el-button
>
</div>
<el-input
type="textarea"
:rows="4"
v-model="resultContent"
v-no-backslash
class="w-100"
placeholder="请输入"
></el-input>
</div>
</div>
</template>
<script>
import {
saveReviewArchiFollowCheckRightSuggestion,
queryReviewArchiFollowCheckRightSuggestionDetails,
} from '@/api/index.js'
export default {
name: 'tab4',
components: {},
data() {
return {
resultContent: '',
leftBaseOptions: [],
rightBaseOptions: [],
}
},
created() {
this.getDetail()
},
methods: {
getDetail() {
const params = {
reviewEnum: 'SYSTEM_PRACTICALITY_REVIEW',
prjId: this.$route.query.prjId,
}
queryReviewArchiFollowCheckRightSuggestionDetails(params).then((res) => {
if (res.code === 200) {
this.resultContent = res.data.reviewSuggestion
this.isMeet = res.data.reviewState
}
})
},
handleSave() {
const params = {
reviewEnum: 'SYSTEM_PRACTICALITY_REVIEW',
prjId: this.$route.query.prjId,
reviewState: '0',
reviewSuggestion: this.resultContent,
}
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
saveReviewArchiFollowCheckRightSuggestion(params).then((res) => {
loading.close()
if (res.code == 200) {
this.$message.success('保存成功')
} else {
this.$message.error(res.msg)
}
})
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/common.scss';
@import '@/views/reviewArchiPoliticeCheck/index.scss';
</style>
src/views/architectureFollowExamine/tab5.vue 0 → 100644
<template>
<div class="tab-component flex-column h-100">
<div class="content flex">
<div class="left_container m-r-10 flex-column">
<div class="left_container_title">
<i class="el-icon-caret-right icon"></i>
<span>系统安全架构视图</span>
</div>
<div class="left_container_content flex-1">
<img
v-for="(item, idx) in leftBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
<div class="right_container flex-column">
<div class="right_container_title flex-b-c">
<div class="flex">
<i class="el-icon-caret-right icon"></i>
<span>概设阶段安全架构视图</span>
</div>
</div>
<div class="right_container_content flex-1">
<img
v-for="(item, idx) in rightBaseOptions"
:key="idx"
:src="item"
alt=""
/>
</div>
</div>
</div>
<div class="bottom_container">
<div class="flex-b-c p-r-20 m-tb-15">
<div class="flex-c">
<span class="m-r-50 p-l-20 bottom_container_title">备注</span>
</div>
<el-button type="primary" size="medium" @click="handleSave"
>保存结果</el-button
>
</div>
<el-input
type="textarea"
:rows="4"
v-model="resultContent"
v-no-backslash
class="w-100"
placeholder="请输入"
></el-input>
</div>
</div>
</template>
<script>
import {
saveReviewArchiFollowCheckRightSuggestion,
queryReviewArchiFollowCheckRightSuggestionDetails,
} from '@/api/index.js'
export default {
name: 'tab5',
components: {},
data() {
return {
resultContent: '',
leftBaseOptions: [],
rightBaseOptions: [],
}
},
created() {
this.getDetail()
},
methods: {
getDetail() {
const params = {
reviewEnum: 'SYSTEM_SECURITY_REVIEW',
prjId: this.$route.query.prjId,
}
queryReviewArchiFollowCheckRightSuggestionDetails(params).then((res) => {
if (res.code === 200) {
this.resultContent = res.data.reviewSuggestion
this.isMeet = res.data.reviewState
}
})
},
handleSave() {
const params = {
reviewEnum: 'SYSTEM_SECURITY_REVIEW',
prjId: this.$route.query.prjId,
reviewState: '0',
reviewSuggestion: this.resultContent,
}
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
saveReviewArchiFollowCheckRightSuggestion(params).then((res) => {
loading.close()
if (res.code == 200) {
this.$message.success('保存成功')
} else {
this.$message.error(res.msg)
}
})
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/common.scss';
@import '@/views/reviewArchiPoliticeCheck/index.scss';
</style>
src/views/artPolicyExamine/index.vue 0 → 100644
<!--
* @Description: 架构督查-技术政策审查
* @Version: 2.0
* @Autor: pan
* @Date: 2024-03-26 18:27:18
* @LastEditors: pan
* @LastEditTime: 2024-03-26 19:26:03
-->
<template>
<div class="searchTable">
<list-page>
<!-- 查询表单插槽 -->
<template #formWrap>
<SearchForm @onSearch="querySearch" :form-options="formOptions" />
</template>
<!-- 表格插槽 -->
<template #tableWrap>
<table-config
ref="searchTable"
:query="query"
:columns="columns"
id-key="elementId"
>
</table-config>
</template>
</list-page>
</div>
</template>
<script>
import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue'
import { updReportManage, delReportManage } from '@/api/index.js'
import { querySupervisionNotifyManagement } from '@/api/interface'
import { buildType } from '@/utils/dictionary'
export default {
name: 'supervisionNotifyManagement',
components: {
ListPage,
SearchForm,
TableConfig,
},
data() {
return {
selectRows: [],
query: {
url: querySupervisionNotifyManagement,
method: 'post',
queryParam: {},
},
visible: false,
rowData: {},
dialogTitle: '',
approvalVisible: false,
}
},
computed: {
formOptions() {
return [
{
label: '年度', // label文字
prop: 'year', // 字段名
type: 'year',
valueFormat: 'yyyy',
element: 'el-date-picker', // 指定elementui组件
placeholder: '请选择', // elementui组件属性
},
{
label: '建设类型',
width: '100px',
prop: 'buildType',
element: 'el-select', // 指定elementui组件
dictType: 'build_type',
placeholder: '请选择', // elementui组件属性
},
{
label: '项目名称', // label文字
prop: 'prjName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
},
]
},
columns() {
return [
// { label: '序号', type: 'index', width: '80px' },
{ label: '年份', prop: 'year', width: '100px' },
{
label: '建设类型', // label文字
prop: 'buildType', // 字段名
options: buildType,
collectionType: true,
width: '120px',
},
{
label: '项目名称',
prop: 'prjName',
},
{
label: '操作',
type: 'operation',
width: '240px',
actionButtons: [
{
title: '审查',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-edit',
},
{
title: '查看结果',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-view',
},
],
callback: (row, title) => {
this.fnOperation(row, title)
},
},
]
},
},
created() {},
methods: {
querySearch(data) {
this.query.queryParam = {
...this.query.queryParam,
...data,
}
this.$refs.searchTable.queryData()
},
/**
* @description: 操作按钮
* @param {Object} row 当前操作行数据
* @param {String} title 当前操作按钮名称
* @author: pan
*/
fnOperation(row, title) {
switch (title) {
case '审查':
// this.fnEdit(row)
break
case '查看结果':
// this.fnEdit(row)
break
default:
break
}
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/common.scss';
</style>
src/views/batchPlanManagement/Add.vue
...@@ -4,17 +4,19 @@ ...@@ -4,17 +4,19 @@
:visible.sync="showDialog" :visible.sync="showDialog"
:close-on-click-modal="false" :close-on-click-modal="false"
width="60%" width="60%"
@close="handleClose()"
@open="handleOpen"
> >
<div> <div>
<Form <Form
@getData="getFormData" ref="addForm"
:form-options="formOptions" :form-options="formOptions"
label-width="120px" label-width="120px"
></Form> ></Form>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="showDialog = false" size="mini">取 消</el-button> <el-button @click="handleClose()" size="mini">取 消</el-button>
<el-button type="primary" @click="handleImport" size="mini" <el-button type="primary" @click="handleSubmit" size="mini"
>提 交</el-button >提 交</el-button
> >
</span></el-dialog </span></el-dialog
...@@ -23,6 +25,8 @@ ...@@ -23,6 +25,8 @@
<script> <script>
import Form from '@/components/Form.vue' import Form from '@/components/Form.vue'
import { addBatchPlan, editBatchPlan } from '@/api'
export default { export default {
props: { props: {
title: { title: {
...@@ -33,6 +37,10 @@ export default { ...@@ -33,6 +37,10 @@ export default {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
rowData: {
type: Object,
default: () => {},
},
}, },
data() { data() {
return {} return {}
...@@ -48,11 +56,11 @@ export default { ...@@ -48,11 +56,11 @@ export default {
prop: 'batName', // 字段名 prop: 'batName', // 字段名
element: 'el-input', // 指定elementui组件 element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性 placeholder: '请输入内容', // elementui组件属性
rules: [], rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
}, },
{ {
label: '创建人', // label文字 label: '创建人', // label文字
prop: 'batName', // 字段名 prop: 'createMan', // 字段名
element: 'el-input', // 指定elementui组件 element: 'el-input', // 指定elementui组件
initValue: '', // 字段初始值 initValue: '', // 字段初始值
placeholder: '请输入内容', // elementui组件属性 placeholder: '请输入内容', // elementui组件属性
...@@ -60,20 +68,20 @@ export default { ...@@ -60,20 +68,20 @@ export default {
}, },
{ {
label: '创建时间', // label文字 label: '创建时间', // label文字
prop: 'planReviewDate', // 字段名 prop: 'createTime', // 字段名
type: 'date', type: 'date',
valueFormat: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd',
element: 'el-date-picker', // 指定elementui组件 element: 'el-date-picker', // 指定elementui组件
initValue: '', // 字段初始值 initValue: new Date().format('yyyy-MM-dd'), // 字段初始值
placeholder: '请选择', // elementui组件属性 placeholder: '请选择', // elementui组件属性
}, },
{ {
label: '年度', // label文字 label: '年度', // label文字
prop: 'planReviewDate', // 字段名 prop: 'year', // 字段名
type: 'year', type: 'year',
valueFormat: 'yyyy', valueFormat: 'yyyy',
element: 'el-date-picker', // 指定elementui组件 element: 'el-date-picker', // 指定elementui组件
initValue: '', // 字段初始值 initValue: new Date().format('yyyy'), // 字段初始值
placeholder: '请选择', // elementui组件属性 placeholder: '请选择', // elementui组件属性
}, },
{ {
...@@ -87,10 +95,12 @@ export default { ...@@ -87,10 +95,12 @@ export default {
}, },
{ {
label: '备注', // label文字 label: '备注', // label文字
prop: 'planReviewDate', // 字段名 prop: 'remark', // 字段名
type: 'textarea', type: 'textarea',
element: 'el-input', // 指定elementui组件 element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性 placeholder: '请输入内容', // elementui组件属性
span: 24,
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
}, },
] ]
}, },
...@@ -102,10 +112,70 @@ export default { ...@@ -102,10 +112,70 @@ export default {
this.$emit('update:visible', value) this.$emit('update:visible', value)
}, },
}, },
isEdit() {
if (this.title === '修改批次计划') {
return true
} else {
return false
}
},
}, },
mounted() {}, mounted() {},
methods: { methods: {
getFormData(formData) {}, handleSubmit() {
this.$refs['addForm'].onValidate(() => {
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
const formInfo = this.$refs['addForm'].getData()
const typeApi = this.isEdit ? editBatchPlan : addBatchPlan
const params = {
...this.rowData,
...formInfo,
state: 1,
}
typeApi(params).then((res) => {
if (res.code === 200) {
loading.close()
this.$message.success('保存成功')
this.showDialog = false
this.handleClose()
this.$emit('querySearch')
}
})
})
},
handleClose() {
this.showDialog = false
this.formOptions.forEach((v) => {
if (v.prop === 'createTime') {
v.initValue = new Date().format('yyyy-MM-dd')
} else if (v.prop === 'year') {
v.initValue = new Date().format('yyyy')
} else {
v.initValue = ''
}
})
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
},
handleOpen() {
if (Object.keys(this.rowData).length) {
this.formOptions.forEach((v) => {
v.initValue = this.rowData[v.prop]
})
this.$nextTick(() => {
this.$refs['addForm'].addInitValue()
})
} else {
this.$nextTick(() => {
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
})
}
},
}, },
} }
</script> </script>
......
src/views/batchPlanManagement/ApprovalDialog.vue 0 → 100644
<template>
<el-dialog
:title="title"
:visible.sync="showDialog"
:close-on-click-modal="false"
width="30%"
@close="handleClose()"
@open="handleOpen"
>
<div>
<template>
<el-radio v-model="radio" :label="3">同意</el-radio>
<el-radio v-model="radio" :label="4">不同意</el-radio>
</template>
<Form
ref="addForm"
:form-options="formOptions"
label-width="120px"
></Form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()" size="mini">取 消</el-button>
<el-button type="primary" @click="handleSubmit" size="mini"
>提 交</el-button
>
</span></el-dialog
>
</template>
<script>
import Form from '@/components/Form.vue'
import { editBatchPlan } from '@/api/index.js'
export default {
props: {
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
rowData: {
type: Object,
default: () => {},
},
},
data() {
return {
radio: 3,
}
},
components: {
Form,
},
computed: {
formOptions() {
return [
{
label: '意见描述', // label文字
prop: 'remark', // 字段名
type: 'textarea',
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
span: 24,
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
},
]
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
},
mounted() {},
methods: {
handleSubmit() {
this.$refs['addForm'].onValidate(() => {
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
const formInfo = this.$refs['addForm'].getData()
const params = {
...this.rowData,
...formInfo,
state: this.radio,
}
editBatchPlan(params).then((res) => {
if (res.code === 200) {
loading.close()
this.$message.success('保存成功')
this.showDialog = false
this.handleClose()
this.$emit('querySearch')
} else {
this.$message.error(res.msg)
}
})
})
},
handleClose() {
this.showDialog = false
this.formOptions.forEach((v) => {
v.initValue = ''
})
this.radio = 3
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
},
handleOpen() {
this.$refs['addForm'].onReset()
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/elementui.scss';
</style>
src/views/batchPlanManagement/index.vue
...@@ -30,7 +30,18 @@ ...@@ -30,7 +30,18 @@
</list-page> </list-page>
<!-- 新增弹窗 --> <!-- 新增弹窗 -->
<Add :visible.sync="visible" title="新增批次计划"></Add> <Add
@querySearch="querySearch"
:visible.sync="visible"
:row-data="rowData"
:title="dialogTitle"
></Add>
<ApprovalDialog
:row-data="rowData"
@querySearch="querySearch"
title="审批"
:visible.sync="approvalVisible"
/>
</div> </div>
</template> </template>
...@@ -39,8 +50,9 @@ import ListPage from '@/components/ListPage.vue' ...@@ -39,8 +50,9 @@ import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue' import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue' import TableConfig from '@/components/TableConfig.vue'
import Add from './Add.vue' import Add from './Add.vue'
import ApprovalDialog from './ApprovalDialog.vue'
import { getDianXingAnLiSelectData } from '@/api/index.js' import { editBatchPlan } from '@/api/index.js'
import { batchPlanManagement } from '@/api/interface' import { batchPlanManagement } from '@/api/interface'
import { approvalStatusOptions } from '@/utils/dictionary' import { approvalStatusOptions } from '@/utils/dictionary'
export default { export default {
...@@ -49,10 +61,10 @@ export default { ...@@ -49,10 +61,10 @@ export default {
SearchForm, SearchForm,
TableConfig, TableConfig,
Add, Add,
ApprovalDialog,
}, },
data() { data() {
return { return {
constructionTypeOptions: [],
selectRows: [], selectRows: [],
query: { query: {
url: batchPlanManagement, url: batchPlanManagement,
...@@ -60,6 +72,9 @@ export default { ...@@ -60,6 +72,9 @@ export default {
queryParam: {}, queryParam: {},
}, },
visible: false, visible: false,
rowData: {},
dialogTitle: '',
approvalVisible: false,
} }
}, },
computed: { computed: {
...@@ -138,23 +153,13 @@ export default { ...@@ -138,23 +153,13 @@ export default {
}, },
], ],
callback: (row, title) => { callback: (row, title) => {
this.fnToDetailsTab('1') this.fnOperation(row, title)
}, },
}, },
] ]
}, },
}, },
created() { created() {},
console.log('batchPlanManagement', batchPlanManagement)
const params = {
key: 'build_type',
}
getDianXingAnLiSelectData(params).then((res) => {
if (res.code == 200) {
this.constructionTypeOptions = res.data
}
})
},
methods: { methods: {
// 表格勾选的数据 // 表格勾选的数据
selectionChange(data) { selectionChange(data) {
...@@ -168,6 +173,85 @@ export default { ...@@ -168,6 +173,85 @@ export default {
this.$refs.searchTable.queryData() this.$refs.searchTable.queryData()
}, },
fnAdd() { fnAdd() {
this.rowData = {}
this.dialogTitle = '新增批次计划'
this.visible = true
},
/**
* @description: 操作按钮
* @param {Object} row 当前操作行数据
* @param {String} title 当前操作按钮名称
* @author: pan
*/
fnOperation(row, title) {
switch (title) {
case '修改':
this.fnEdit(row)
break
case '删除':
this.fnDel(row)
break
case '提交':
this.fnSubmit(row)
break
case '审批':
this.fnApproval(row)
break
default:
break
}
},
fnApproval(row) {
this.rowData = row
this.approvalVisible = true
},
fnSubmit(row) {
this.$confirm('是否确认提交?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
...row,
state: 2,
}
editBatchPlan(params).then((res) => {
if (res.code === 200) {
this.$message.success('提交成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error(res.msg)
}
})
})
.catch(() => {})
},
fnDel(row) {
this.$confirm('是否确认删除?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
...row,
delFlag: 1,
}
editBatchPlan(params).then((res) => {
if (res.code === 200) {
this.$message.success('删除成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error('删除失败')
}
})
})
.catch(() => {})
},
fnEdit(row) {
this.dialogTitle = '修改批次计划'
this.rowData = row
this.visible = true this.visible = true
}, },
}, },
......
src/views/conceptualBaseManagement/index.vue 0 → 100644
<!--
* @Description: 概设评审基础管理 integration-info-controller
* @Version: 2.0
* @Autor: pan
* @Date: 2024-03-21 20:58:31
* @LastEditors: pan
* @LastEditTime: 2024-03-26 17:31:29
-->
<template>
<div class="searchTable">
<list-page>
<template #tabWrap>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane
:label="item.label"
:name="item.name"
v-for="item in tabOptions"
:key="item.name"
>
</el-tab-pane>
</el-tabs>
</template>
<!-- 查询表单插槽 -->
<template #formWrap>
<SearchForm @onSearch="querySearch" :form-options="formOptions" />
</template>
<!-- 中部操作按钮 -->
<template #operationWrap>
<template>
<el-button
type="primary"
icon="el-icon-document-add"
size="medium"
plain
>新建</el-button
>
<el-button
type="primary"
icon="el-icon-download"
size="medium"
plain
v-if="activeName === '1'"
>导出</el-button
>
</template>
</template>
<!-- 表格插槽 -->
<template #tableWrap>
<table-config
ref="searchTable"
@selection-change="selectionChange"
:query="query"
:columns="columns"
:key="activeName"
>
<template #filesValue="{ data }">
<span>{{ handleFileName(data) }}</span>
</template>
</table-config>
</template>
</list-page>
</div>
</template>
<script>
import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue'
import { queryConceptualBaseManagement } from '@/api/interface'
import { editNeedInfo } from '@/api'
import { buildType, approvalStatusOptions } from '@/utils/dictionary'
export default {
name: 'conceptualBaseManagement',
data() {
return {
query: {
url: queryConceptualBaseManagement,
method: 'post',
queryParam: {},
},
activeName: '1',
tabOptions: [
{ label: '组织机构管理', name: '1' },
{ label: '集成管理', name: '2' },
],
selectRows: {},
visible: false,
rowData: {},
dialogTitle: '',
approvalVisible: false,
}
},
components: { ListPage, SearchForm, TableConfig },
computed: {
formOptions() {
let arr = []
if (this.activeName === '1') {
arr = [
{
label: '机构名称', // label文字
prop: 'orgName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
},
{
label: '主体类型', // label文字
prop: 'type', // 字段名
element: 'el-select', // 指定elementui组件
placeholder: '请选择', // elementui组件属性
},
]
} else {
arr = [
{
label: '事项名称', // label文字
prop: 'orgName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
},
{
label: '状态', // label文字
prop: 'type', // 字段名
element: 'el-select', // 指定elementui组件
placeholder: '请选择', // elementui组件属性
},
]
}
return arr
},
columns() {
let arr = [
{ type: 'selection', width: '55px' },
{ label: '序号', type: 'index', width: '80px' },
]
if (this.activeName === '1') {
arr = [
...arr,
{
label: '机构名称',
prop: 'orgName',
width: '300px',
},
{
label: '主体类型',
prop: 'createTime',
},
{
label: '上级单位',
// width: '120px',
prop: 'state2',
},
]
} else {
arr = [
...arr,
{
label: '事项名称',
prop: 'orgName',
width: '200px',
},
{
label: '创建人',
prop: 'createMan',
},
{
label: '创建时间',
prop: 'createTime',
},
{
label: '事项描述',
prop: 'des',
},
{
label: '状态',
prop: 'state',
},
]
}
arr = [
...arr,
{
label: '备注',
prop: 'remark',
},
{
label: '操作',
type: 'operation',
width: '200px',
actionButtons: [
{
title: '编辑',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-edit',
},
{
title: '删除',
type: 'danger',
size: 'mini',
plain: true,
icon: 'el-icon-delete',
},
],
callback: (row, title) => {
// this.fnOperation(row, title)
},
},
]
return arr
},
},
mounted() {},
methods: {
fnAdd() {
this.dialogTitle = '新增需求'
this.rowData = {}
this.visible = true
},
// 处理所需材料名称显示
handleFileName(scope) {
const filesValue = JSON.parse(scope.row.filesValue)
if (!filesValue) return
const str = filesValue.map((v) => v.name)
return str.join('，')
},
// 表格勾选的数据
selectionChange(data) {
this.selectRows = data
},
querySearch(data) {
this.query.queryParam = {
...this.query.queryParam,
...data,
}
this.$refs.searchTable.queryData()
},
handleClick(tab, event) {
// console.log(tab, event)
},
/**
* @description: 操作按钮
* @param {Object} row 当前操作行数据
* @param {String} title 当前操作按钮名称
* @author: pan
*/
fnOperation(row, title) {
switch (title) {
case '编辑':
this.fnEdit(row)
break
case '删除':
this.fnDel(row)
break
case '提交':
this.fnSubmit(row)
break
case '审批':
this.fnApproval(row)
break
case '发布':
this.fnRelease(row)
break
default:
break
}
},
fnRelease(row) {
this.$confirm('是否确认发布?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
...row,
state: 1,
filesValue: JSON.parse(row.filesValue),
}
editNeedInfo(params).then((res) => {
if (res.code === 200) {
this.$message.success('发布成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error(res.msg)
}
})
})
.catch(() => {})
},
fnApproval(row) {
this.rowData = row
this.approvalVisible = true
},
fnSubmit(row) {
this.$confirm('是否确认提交?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
...row,
approveState: 2,
filesValue: JSON.parse(row.filesValue),
}
editNeedInfo(params).then((res) => {
if (res.code === 200) {
this.$message.success('提交成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error(res.msg)
}
})
})
.catch(() => {})
},
fnEdit(row) {
this.dialogTitle = '修改需求'
this.rowData = row
this.visible = true
},
fnDel(row) {
this.$confirm('是否确认删除?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
...row,
filesValue: JSON.parse(row.filesValue),
delFlag: 1,
}
editNeedInfo(params).then((res) => {
if (res.code === 200) {
this.$message.success('删除成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error('删除失败')
}
})
})
.catch(() => {})
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/common.scss';
</style>
src/views/conceptualRelated/index.vue 0 → 100644
<!--
* @Description: tab1查/online-rev-wr/qyNeedReviewCount tab2系统架构资产 isExtend传0 同步更新调用继承接口isExtend传0
* @Version: 2.0
* @Autor: pan
* @Date: 2024-03-21 20:58:31
* @LastEditors: pan
* @LastEditTime: 2024-03-25 14:16:37
-->
<template>
<div class="searchTable">
<list-page>
<template #tabWrap>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane
:label="item.label"
:name="item.name"
v-for="item in tabOptions"
:key="item.name"
>
</el-tab-pane>
</el-tabs>
</template>
<template #subTabWrap>
<el-tabs
v-if="activeName === '1'"
v-model="activeName2_1"
@tab-click="handleSubClick"
>
<el-tab-pane
:label="item.label"
:name="item.name"
v-for="item in subTabOptions"
:key="item.name"
>
</el-tab-pane>
</el-tabs>
<el-tabs v-else v-model="activeName2_2" @tab-click="handleSubClick">
<el-tab-pane
:label="item.label"
:name="item.name"
v-for="item in subTabOptions"
:key="item.name"
>
</el-tab-pane>
</el-tabs>
</template>
<!-- 查询表单插槽 -->
<template #formWrap>
<SearchForm @onSearch="querySearch" :form-options="formOptions" />
</template>
<!-- 中部操作按钮 -->
<!-- <template #operationWrap>
<el-button
v-if="activeName === '2'"
icon="el-icon-document-add"
type="primary"
size="medium"
plain
>同步更新</el-button
>
</template> -->
<!-- 表格插槽 -->
<template #tableWrap>
<table-config
ref="searchTable"
@selection-change="selectionChange"
:query="query"
:columns="columns"
>
<template #percent="{ data }">
<span> {{ handlePercent(data) }}</span>
</template>
</table-config>
</template>
</list-page>
</div>
</template>
<script>
// import { getWordImg } from '@/api/index'
import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue'
import { queryQyNeedReviewCount, queryArcAstSys } from '@/api/interface'
import { exportRiskReport } from '@/api/index'
import { archiPrjReviewEnum, buildType } from '@/utils/dictionary'
// import { str } from './base64'
export default {
name: 'conceptualReview',
data() {
return {
src: '',
selectRows: [],
query: {
url: queryQyNeedReviewCount,
method: 'post',
queryParam: {
countType: 1,
},
},
activeName: '1',
tabOptions: [
{ label: '概设统计分析', name: '1' },
{ label: '总体架构维护', name: '2' },
],
activeName2_1: '1',
subTabOptions1: [
{ label: '各单位概设统计', name: '1' },
{ label: '各批次系统统计', name: '2' },
],
activeName2_2: '1',
subTabOptions2: [
{ label: '业务架构', name: '1' },
{ label: '应用架构', name: '2' },
{ label: '数据架构', name: '3' },
{ label: '技术架构', name: '4' },
{ label: '安全架构', name: '5' },
],
archiTypeList: [
'ARCHI_BUSINESS',
'ARCHI_APPLICATION',
'ARCHI_DATA',
'ARCHI_TECHNOLOGY',
'ARCHI_SAFE',
],
}
},
components: {
ListPage,
SearchForm,
TableConfig,
},
computed: {
getCountType() {
if (this.activeName === '1') {
if (this.activeName2_1 === '1') {
return 1
} else {
return 2
}
} else {
return undefined
}
},
subTabOptions() {
if (this.activeName === '1') {
return this.subTabOptions1
} else {
return this.subTabOptions2
}
},
formOptions() {
return [
{
label: '统计时间', // label文字
prop: 'year', // 字段名
type: 'year',
valueFormat: 'yyyy',
element: 'el-date-picker', // 指定elementui组件
initValue: undefined, // 字段初始值
placeholder: '请选择', // elementui组件属性
},
]
},
columns() {
let arr = []
if (this.activeName === '1') {
if (this.activeName2_1 === '1') {
arr = [
{ label: '序号', type: 'index', width: '80px' },
{ label: '单位名称', prop: 'manageOrgName' },
{ label: '概设需求数(个)', prop: 'needCount' },
{ label: '概设材料通过数(个)', prop: 'reviewPassCount' },
{ label: '概设通过比(%)', __slotName: 'percent' },
]
} else {
arr = [
{ label: '序号', type: 'index', width: '80px' },
{ label: '批次', prop: 'batName' },
{ label: '项目需求数(个)', prop: 'needCount' },
{ label: '项目通过数(个)', prop: 'reviewPassCount' },
{ label: '项目通过比(%)', __slotName: 'percent' },
]
}
} else {
arr = [
{ type: 'selection', width: '55px' },
{ label: '序号', type: 'index', width: '80px' },
{ label: '资产名称', prop: 'assetName' },
{ label: '资产类型(所属元素)', prop: 'eleName' },
{
label: '来源',
prop: 'isExtend',
options: [],
collectionType: true,
},
{ label: '创建人', prop: 'createMan' },
{ label: '创建时间', prop: 'createTime' },
{
label: '操作',
type: 'operation',
width: '200px',
actionButtons: [
{
title: '同步更新',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-edit',
},
],
callback: (row, title) => {},
},
]
}
return arr
},
},
mounted() {},
methods: {
handlePercent(scope) {
const item = scope.row
if (item.reviewPassCount && item.needCount) {
return (item.reviewPassCount / item.needCount).toFixed(2) * 100 + '%'
}
},
// 材料解析
fnMaterialAnalysis() {
if (this.selectRows.length == 0) {
return this.$message.warning('请选择一条数据')
}
// xxx
},
// 导出重复建设风险报告
handlExportRiskReport() {
const params = {
title: '功能重复风险',
comment: '',
}
exportRiskReport(params).then((res) => {
const url = window.URL.createObjectURL(
new Blob([res], { type: 'application/octet-stream' }),
)
const link = document.createElement('a')
link.href = url
link.setAttribute('download', `重复建设风险报告.doc`)
document.body.appendChild(link)
link.click()
window.URL.revokeObjectURL(url) // 释放内存
})
},
// 表格勾选的数据
selectionChange(data) {
this.selectRows = data
},
querySearch(data) {
this.query.queryParam = {
...this.query.queryParam,
...data,
}
this.$refs.searchTable.queryData()
},
getArchiType() {},
handleClick(tab, event) {
if (this.activeName === '2') {
this.query.url = queryArcAstSys
this.query.queryParam.isExtend = 0
this.query.queryParam.countType = undefined
this.query.queryParam.archiAssetState = 2
this.query.queryParam.archiStage = 2
if (!this.query.queryParam.archiType) {
this.query.queryParam.archiType = this.archiTypeList[0]
}
} else {
this.query.queryParam.archiType = undefined
this.query.url = queryQyNeedReviewCount
this.query.queryParam.isExtend = undefined
this.query.queryParam.archiAssetState = undefined
this.query.queryParam.archiStage = undefined
this.query.queryParam.countType = this.getCountType
}
console.log('refs', this.$refs.searchTable)
this.$refs.searchTable.queryData()
},
handleSubClick(tab, event) {
this.query.queryParam.countType = this.getCountType
if (this.activeName === '2') {
this.query.queryParam.archiType =
this.archiTypeList[+this.activeName2_2 - 1]
}
this.$refs.searchTable.queryData()
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/common.scss';
</style>
src/views/conceptualReview/Tab8Left.vue 0 → 100644
<template>
<div class="Tab8Left p-10">
<el-card class="box-card m-b-20" shadow="never">
<div slot="header" class="clearfix">
<span>检测范围</span>
</div>
<div class="item" v-for="item in checkList" :key="item.value">
<span>- {{ item.label }}</span>
</div>
</el-card>
<el-input
v-debounce:input="getByKeword"
v-model="keyWord"
class="m-b-10"
placeholder="在相关台账搜索关键字，出结果"
></el-input>
<el-card
class="box-card"
shadow="never"
v-loading="keyWordLoading"
element-loading-text="加载中"
>
<div slot="header" class="clearfix">
<span>检测结果</span>
</div>
<div class="item" v-show="showResult">
<el-alert :closable="false" :title="resultTitle" type="warning" />
<div>其中：</div>
<div v-for="(item, index) in checkList" :key="item.value">
{{ item.label + ':【' + repeatList[index + 1] + '】' }}
</div>
<el-button class="m-t-10" type="primary" @click="toRemark()"
>带入到备注</el-button
>
</div>
</el-card>
</div>
</template>
<script>
import { getDianXingAnLiSelectData, getByKeword } from '@/api/index.js'
export default {
prop: {
tab: {
type: String,
default: '',
},
},
data() {
return {
checkList: [],
repeatList: {
// 0: 50,
// 1: 1,
// 2: 2,
// 3: 3,
},
// once: false,
keyWord: '',
keyWordLoading: false,
}
},
components: {},
computed: {
showResult() {
if (Object.keys(this.repeatList).length) {
return true
}
return false
},
tipsText() {
if (this.tab === '8') {
return `经检测，关键字：${this.keyWord}，在系统历史功能、组件台账，功能类别中，总计重复数`
} else {
return `经检测，关键字：${this.keyWord}，在数据中台数据台账、主数据台账，数据实体类别中，总计重复数`
}
},
totalNum() {
let num = 0
for (const key in this.repeatList) {
if (Object.hasOwnProperty.call(this.repeatList, key)) {
const val = this.repeatList[key]
num += val
}
}
return num
},
resultTitle() {
return `${this.tipsText}：【${this.totalNum}】`
},
strCancat() {
let str = `关键字：${this.keyWord}，总计重复数：【${this.totalNum}】 \n`
this.checkList.forEach((v, i) => {
str += `${v.label}:【${v.num}】 ${
i != this.checkList.length ? '\n' : ''
}`
})
return str
},
},
async mounted() {
this.getDictTypeOptions('check_range', (list) => {
this.checkList = list
})
},
methods: {
getByKeword() {
this.keyWordLoading = true
const checkRange = this.checkList.map((v) => v.value).join(',')
const params = {
keyWord: this.keyWord,
checkRange,
}
getByKeword(params).then((res) => {
this.keyWordLoading = false
if (res.code === 200) {
this.repeatList = res.data
this.checkList = this.checkList.map((v, i) => {
return { ...v, num: res.data[i + 1] }
})
}
})
},
toRemark() {
// if (this.once) {
// return this.$message.warning('已带入到备注，请勿重复操作')
// }
// this.once = true
this.$emit('toRemark', this.strCancat)
},
async getDictTypeOptions(key, callback) {
var dictTypeOptions = []
var storedDic = localStorage.getItem('dic_' + key)
if (storedDic) {
dictTypeOptions = JSON.parse(storedDic)
} else {
const params = { key }
const res = await getDianXingAnLiSelectData(params)
dictTypeOptions = res.data
const jsonStr = JSON.stringify(res.data)
if (jsonStr) {
localStorage.setItem('dic_' + key, jsonStr)
}
}
callback(dictTypeOptions)
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/common.scss';
.clearfix {
text-align: left;
}
.item {
display: flex;
align-items: flex-start;
flex-direction: column;
}
</style>
src/views/conceptualViewOrg/MaterialFeedback.vue 0 → 100644
<!--
* @Description: 修改材料反馈
* @Version: 2.0
* @Autor: pan
* @Date: 2024-03-21 14:29:32
* @LastEditors: pan
* @LastEditTime: 2024-03-24 19:05:44
-->
<template>
<div>
<el-dialog
:title="title"
:visible.sync="showDialog"
:close-on-click-modal="false"
width="60%"
@close="handleClose()"
@open="fnQueryPrjNeedFile()"
>
<div>
<div style="text-align: left; margin-left: 10px">资料上传:</div>
<el-table :data="tableData" stripe border>
<el-table-column
type="index"
label="序号"
width="80"
align="center"
></el-table-column>
<el-table-column
prop="name"
label="资料类型"
align="center"
></el-table-column>
<el-table-column label="资料名称" align="center">
<template slot-scope="scope">
<el-upload
class="upload-demo"
action="/eadc-shared-ability/oss/upload"
ref="upload"
:on-remove="
(file, fileList) => handleRemove(file, fileList, scope.row)
"
:on-success="
(res, file, fileList) =>
handleFileUploadSuccess(res, file, fileList, scope.row)
"
:limit="1"
:file-list="scope.row.fileList"
>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</template>
</el-table-column>
</el-table>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()" size="mini">取 消</el-button>
<el-button @click="fnOperation()" type="primary" size="mini"
>反馈</el-button
>
</span></el-dialog
>
</div>
</template>
<script>
import { editFeedback } from '@/api'
import { materialOptions } from '@/utils/dictionary'
export default {
props: {
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
rowData: {
type: Object,
default: () => {},
},
},
data() {
return {
tableData: [],
}
},
components: {},
computed: {
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
},
mounted() {},
methods: {
fnOperation() {
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
let params = {
...this.rowData,
busiId: this.rowData.prjId,
busiIdType: 1,
busiFileName: '概要设计说明书',
onlineReviewState: 2,
ideaType: 1,
}
editFeedback(params).then((res) => {
loading.close()
if (res.code === 200) {
this.$message.success('保存成功')
this.showDialog = false
this.handleClose()
this.$emit('querySearch')
} else {
this.$message.error(res.msg)
}
})
},
handleClose() {
this.showDialog = false
},
// 文件上传逻辑
handleRemove(file, fileList, row) {
//文件移出
row = []
},
handleFileUploadSuccess(res, file, fileList, row) {
//文件上传
row.fileList = [
{
fileName: file.name,
fileId: file.response.data.fileId,
fileUrl: file.response.data.viewUrl,
},
]
console.log('file', row)
},
fnQueryPrjNeedFile() {
const list = this.rowData.fileList?.split(',')
this.tableData = list.map((v) => {
if (v === '概要设计说明书') {
return {
name: v,
fileList: [],
}
}
})
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/elementui.scss';
</style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!