Commit aa349cdd authored by 张俊's avatar 张俊

Merge branch 'dev' of https://cloud.wodcloud.com/git/apaas/apaas-v3-ui into dev

parents d1856441 900aa82f
[v-cloak]{ [v-cloak] {
display: none display: none;
} }
/* 新增按钮颜色 */ /* 新增按钮颜色 */
.form-group .el-button--primary{ .form-group .el-button--primary {
background-color: #264dd9!important; background-color: #264dd9 !important;
border-color: #264dd9!important; border-color: #264dd9 !important;
} }
/* 返回按钮颜色 */ /* 返回按钮颜色 */
.from_return>.el-button--primary{ .from_return > .el-button--primary {
background-color: #edf0ff!important; background-color: #edf0ff !important;
border-color: #edf0ff!important; border-color: #edf0ff !important;
color:#264dd9!important; color: #264dd9 !important;
} }
/* 取消按钮颜色 */ /* 取消按钮颜色 */
.form_c{ .form_c {
background-color: #dde4ff!important; background-color: #dde4ff !important;
border-color: #dde4ff!important; border-color: #dde4ff !important;
color:#264dd9!important ; color: #264dd9 !important ;
} }
/* 确定按钮颜色 */ /* 确定按钮颜色 */
.form_t{ .form_t {
background-color: #264dd9!important; background-color: #264dd9 !important;
border-color: #264dd9!important; border-color: #264dd9 !important;
color:#f4f7fc!important ; color: #f4f7fc !important ;
} }
/* 搜索框颜色 */ /* 搜索框颜色 */
.form-group .el-input__inner{ .form-group .el-input__inner {
border-radius: 28px!important; border-radius: 28px !important;
border: 1px solid #bcc1d0!important; border: 1px solid #bcc1d0 !important;
background: #f4f7fc!important; background: #f4f7fc !important;
color: #8890a7!important; color: #8890a7 !important;
} }
.drawer_return .el-input__inner{ .drawer_return .el-input__inner {
border-radius: 28px!important; border-radius: 28px !important;
border: 1px solid #bcc1d0!important; border: 1px solid #bcc1d0 !important;
background: #f4f7fc!important; background: #f4f7fc !important;
color: #8890a7!important; color: #8890a7 !important;
} }
/* 多行文本框样式 */ /* 多行文本框样式 */
.jbxx_desc textarea{ .jbxx_desc textarea {
height: 150px!important; height: 150px !important;
border-radius: 8px!important; border-radius: 8px !important;
border-color: #bcc1d0!important; border-color: #bcc1d0 !important;
outline: none!important; outline: none !important;
resize: none!important; resize: none !important;
} }
/* 面包屑文字大小 */ /* 面包屑文字大小 */
.el-breadcrumb{ .el-breadcrumb {
font-size: 14px; font-size: 14px;
color: #898d9e; color: #898d9e;
} }
/* 编辑颜色*/ /* 编辑颜色*/
.primary-edit{ .primary-edit {
color: #264dd9; color: #264dd9;
cursor: pointer; cursor: pointer;
} }
/* 删除颜色 */ /* 删除颜色 */
.primary-del{ .primary-del {
color: #264dd9; color: #264dd9;
cursor: pointer; cursor: pointer;
} }
.space_bet{} .space_bet {
}
/* reset */ /* reset */
html { html {
} }
body { body {
margin: 0; margin: 0;
...@@ -87,7 +87,7 @@ h5 { ...@@ -87,7 +87,7 @@ h5 {
font-weight: normal; font-weight: normal;
} }
div{ div {
box-sizing: border-box; box-sizing: border-box;
} }
/* reset end */ /* reset end */
...@@ -141,7 +141,7 @@ div{ ...@@ -141,7 +141,7 @@ div{
} }
.ss_card > .sc_right_container > .sc_info { .ss_card > .sc_right_container > .sc_info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.form-group { .form-group {
padding: 20px 20px 15px; padding: 20px 20px 15px;
...@@ -152,56 +152,56 @@ div{ ...@@ -152,56 +152,56 @@ div{
padding: 0 20px; padding: 0 20px;
} }
/* 设置抽屉的样式 */ /* 设置抽屉的样式 */
.el-drawer__header{ .el-drawer__header {
display: none; display: none;
} }
.from_return{ .from_return {
text-align: center; text-align: center;
padding: 18px 20px 10px; padding: 18px 20px 10px;
border-bottom: 1px solid #edf0ff; border-bottom: 1px solid #edf0ff;
position: relative; position: relative;
} }
.from_return>.el-button--primary{ .from_return > .el-button--primary {
position: absolute; position: absolute;
top: 15px; top: 15px;
left: 20px; left: 20px;
} }
.from_return>span{ .from_return > span {
color:#1a2236; color: #1a2236;
font-size: 16px; font-size: 16px;
} }
.demo-drawer__content .el-form-item__label{ .demo-drawer__content .el-form-item__label {
color: #242c43; color: #242c43;
} }
.demo-drawer__content .el-input__inner{ .demo-drawer__content .el-input__inner {
border: 1px solid #bcc1d0; border: 1px solid #bcc1d0;
border-radius: 17px; border-radius: 17px;
color: #58617a; color: #58617a;
background: #fff; background: #fff;
} }
.demo-drawer__footer{ .demo-drawer__footer {
text-align: right; text-align: right;
padding-right: 40px; padding-right: 40px;
margin-top: 40px; margin-top: 40px;
} }
.el-form-item__error{ .el-form-item__error {
font-size:11px; font-size: 11px;
} }
/* 设置提示弹窗的样式 */ /* 设置提示弹窗的样式 */
.el-dialog{ .el-dialog {
border-radius: 10px; border-radius: 10px;
} }
.el-dialog__header { .el-dialog__header {
border-bottom: 1px solid #edf0ff; border-bottom: 1px solid #edf0ff;
} }
.el-dialog__title{ .el-dialog__title {
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: #1d1e20; color: #1d1e20;
border-left: 4px solid #0367f6; border-left: 4px solid #0367f6;
padding-left: 8px; padding-left: 8px;
} }
.el-dialog__body{ .el-dialog__body {
font-size: 18px; font-size: 18px;
color: #242c43; color: #242c43;
text-align: center; text-align: center;
...@@ -213,23 +213,22 @@ div{ ...@@ -213,23 +213,22 @@ div{
.el-tabs__item { .el-tabs__item {
font-size: 16px; font-size: 16px;
color: #8890a7; color: #8890a7;
line-height: 24px!important; line-height: 24px !important;
} }
.el-tabs__nav-scroll .el-tabs__item { .el-tabs__nav-scroll .el-tabs__item {
line-height: 40px!important; line-height: 40px !important;
} }
.el-tabs__item:hover { .el-tabs__item:hover {
color: #687087; color: #687087;
} }
.el-tabs__item.is-active { .el-tabs__item.is-active {
color: #e56600 !important; color: #e56600 !important;
} }
.el-tabs__active-bar{ .el-tabs__active-bar {
height: 3px; height: 3px;
background-color:#e56600 !important; background-color: #e56600 !important;
} }
.el-tabs__nav-wrap::after{ .el-tabs__nav-wrap::after {
height: 1px; height: 1px;
background-color: #edf0ff; background-color: #edf0ff;
} }
...@@ -277,51 +276,54 @@ border-radius:8px; ...@@ -277,51 +276,54 @@ border-radius:8px;
} */ } */
/* 左右布局 */ /* 左右布局 */
.flex { .flex {
height: 100%; height: 100%;
display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
display: -moz-box; /* Firefox 17- */ display: -moz-box; /* Firefox 17- */
display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
display: -moz-flex; /* Firefox 18+ */ display: -moz-flex; /* Firefox 18+ */
display: -ms-flexbox; /* IE 10 */ display: -ms-flexbox; /* IE 10 */
display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */ display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
} }
.flex-left { .flex-left {
width: 178px; width: 178px;
background-color: #1a2236; background-color: #1a2236;
height: 100%; height: 100%;
} }
.flex-right { .flex-right {
padding: 0 20px 20px; padding: 0 20px 20px;
box-sizing: border-box; box-sizing: border-box;
-webkit-box-flex: auto; -webkit-box-flex: auto;
-ms-flex: auto; -ms-flex: auto;
-webkit-flex: auto; -webkit-flex: auto;
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
} }
.flex-right-box{ .flex-right-box {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
.ces-main{ .ces-main {
position: absolute; position: absolute;
width: 100%; width: 100%;
} }
.v-modal{ .v-modal {
background: #000a2b!important; background: #000a2b !important;
} }
.drawer600{ .drawer600 {
width: 600px!important; width: 600px !important;
} }
.drawer620{ .drawer620 {
width: 620px!important; width: 620px !important;
} }
.drawer1202{ .drawer1202 {
width: 1202px!important; width: 1202px !important;
} }
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before{ .el-form-item.is-required:not(.is-no-asterisk)
content:"" .el-form-item__label-wrap
> .el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before {
content: "";
} }
/* 设置switch的样式 */ /* 设置switch的样式 */
.switchStyle1 .el-switch__label { .switchStyle1 .el-switch__label {
...@@ -338,7 +340,7 @@ width: 620px!important; ...@@ -338,7 +340,7 @@ width: 620px!important;
/*关闭时文字位置设置*/ /*关闭时文字位置设置*/
.switchStyle1 .el-switch__label--left { .switchStyle1 .el-switch__label--left {
z-index: 1; z-index: 1;
left: 28px; left: 28px;
top: 1px; top: 1px;
} }
.switchStyle1 .el-switch__label.is-active { .switchStyle1 .el-switch__label.is-active {
...@@ -347,8 +349,8 @@ width: 620px!important; ...@@ -347,8 +349,8 @@ width: 620px!important;
.switchStyle1.el-switch .el-switch__core, .switchStyle1.el-switch .el-switch__core,
.switchStyle1.el-switch .el-switch__label { .switchStyle1.el-switch .el-switch__label {
width: 62px !important; width: 62px !important;
height: 28px!important; height: 28px !important;
border-radius: 28px!important; border-radius: 28px !important;
} }
.switchStyle1 .el-switch__core { .switchStyle1 .el-switch__core {
background: #f8f9fd !important; background: #f8f9fd !important;
...@@ -372,7 +374,7 @@ width: 620px!important; ...@@ -372,7 +374,7 @@ width: 620px!important;
right: 0; right: 0;
top: 2.1px; top: 2.1px;
} }
.switchStyle1.el-switch.is-checked .el-switch__core::after{ .switchStyle1.el-switch.is-checked .el-switch__core::after {
margin-left: -25px; margin-left: -25px;
} }
.switchStyle1 .el-switch__label * { .switchStyle1 .el-switch__label * {
...@@ -412,7 +414,8 @@ width: 620px!important; ...@@ -412,7 +414,8 @@ width: 620px!important;
.el-input__inner { .el-input__inner {
border-radius: 8px; border-radius: 8px;
} }
.el-input-group__append, .el-input-group__prepend { .el-input-group__append,
.el-input-group__prepend {
border-radius: 8px; border-radius: 8px;
} }
.el-button { .el-button {
...@@ -454,10 +457,10 @@ width: 620px!important; ...@@ -454,10 +457,10 @@ width: 620px!important;
.el-scrollbar { .el-scrollbar {
border-radius: 8px; border-radius: 8px;
} }
.el-popper[x-placement^=bottom] .popper__arrow::after { .el-popper[x-placement^="bottom"] .popper__arrow::after {
border-bottom-color: transparent; border-bottom-color: transparent;
} }
.el-popper[x-placement^=top] .popper__arrow::after { .el-popper[x-placement^="top"] .popper__arrow::after {
border-top-color: transparent; border-top-color: transparent;
} }
/* 单选激活样式 */ /* 单选激活样式 */
...@@ -465,13 +468,13 @@ width: 620px!important; ...@@ -465,13 +468,13 @@ width: 620px!important;
border-color: #838383; border-color: #838383;
background-color: #fff; background-color: #fff;
} }
.el-radio__input.is-checked+.el-radio__label { .el-radio__input.is-checked + .el-radio__label {
color: #1a2236; color: #1a2236;
font-weight: 700; font-weight: 700;
} }
.el-radio__inner::after { .el-radio__inner::after {
width: 8px; width: 8px;
height: 8px; height: 8px;
} }
.el-radio__input.is-checked .el-radio__inner::after { .el-radio__input.is-checked .el-radio__inner::after {
background-color: #e56600; background-color: #e56600;
...@@ -508,7 +511,6 @@ width: 620px!important; ...@@ -508,7 +511,6 @@ width: 620px!important;
margin: 0 auto; margin: 0 auto;
} }
/* common */ /* common */
.apass_breadcrumb > .el-breadcrumb { .apass_breadcrumb > .el-breadcrumb {
padding: 15px 0; padding: 15px 0;
...@@ -519,7 +521,10 @@ width: 620px!important; ...@@ -519,7 +521,10 @@ width: 620px!important;
color: #898d9e; color: #898d9e;
line-height: 23px; line-height: 23px;
} }
.apass_breadcrumb > .el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner { .apass_breadcrumb
> .el-breadcrumb
.el-breadcrumb__item:last-child
.el-breadcrumb__inner {
color: #242c43; color: #242c43;
font-weight: normal; font-weight: normal;
} }
...@@ -527,7 +532,7 @@ width: 620px!important; ...@@ -527,7 +532,7 @@ width: 620px!important;
min-width: 90px; min-width: 90px;
color: #0f2683; color: #0f2683;
} }
.apaas_button .el-button--mini, .apaas_button .el-button--mini,
.apaas_button .el-button--mini.is-round { .apaas_button .el-button--mini.is-round {
padding: 10px 15px; padding: 10px 15px;
} }
...@@ -546,8 +551,8 @@ width: 620px!important; ...@@ -546,8 +551,8 @@ width: 620px!important;
background-color: #e15260; background-color: #e15260;
border-color: #e15260; border-color: #e15260;
} }
.apaas_button .el-button.is-disabled, .apaas_button .el-button.is-disabled,
.apaas_button .el-button.is-disabled:focus, .apaas_button .el-button.is-disabled:focus,
.apaas_button .el-button.is-disabled:hover { .apaas_button .el-button.is-disabled:hover {
cursor: not-allowed; cursor: not-allowed;
} }
...@@ -564,11 +569,11 @@ width: 620px!important; ...@@ -564,11 +569,11 @@ width: 620px!important;
.apaas_button .el-button.is-disabled, .apaas_button .el-button.is-disabled,
.apaas_button .el-button.is-disabled:focus, .apaas_button .el-button.is-disabled:focus,
.apaas_button .el-button.is-disabled:hover { .apaas_button .el-button.is-disabled:hover {
color: #C0C4CC; color: #c0c4cc;
cursor: not-allowed; cursor: not-allowed;
background-image: none; background-image: none;
background-color: #FFF; background-color: #fff;
border-color: #EBEEF5; border-color: #ebeef5;
} }
.apass_table .el-table th > .cell { .apass_table .el-table th > .cell {
...@@ -831,4 +836,10 @@ width: 620px!important; ...@@ -831,4 +836,10 @@ width: 620px!important;
.meassage_detail_dialog .detail_item .full_content .item_content { .meassage_detail_dialog .detail_item .full_content .item_content {
margin: 0; margin: 0;
} }
/* 详情页公共样式 by xuyiming ~~~end */ .no_wrap .apass_table td .cell {
\ No newline at end of file overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
}
/* 详情页公共样式 by xuyiming ~~~end */
...@@ -22,9 +22,9 @@ export const lang = { ...@@ -22,9 +22,9 @@ export const lang = {
cloud_resources_detail: "云资源详情", cloud_resources_detail: "云资源详情",
// data analysis // data analysis
data_analysis: "数据分析中心", data_analysis: "运营管控中心",
my_service_data_analysis: "我的服务数据分析", my_service_data_analysis: "服务分析",
my_application_data_analysis: "我的应用数据分析", my_application_data_analysis: "应用分析",
// message // message
message: "消息与推送管理", message: "消息与推送管理",
...@@ -33,4 +33,10 @@ export const lang = { ...@@ -33,4 +33,10 @@ export const lang = {
message_alert: "消息提醒管理", message_alert: "消息提醒管理",
banner: "banner管理", banner: "banner管理",
message_template: "消息模板管理", message_template: "消息模板管理",
//online component tool
online_component_tool: "在线组件中心",
process_design: "流程设计",
process_management: "流程管理",
new: "新建"
} }
\ No newline at end of file
...@@ -20,6 +20,10 @@ export default { ...@@ -20,6 +20,10 @@ export default {
type: String, type: String,
default: () => "", default: () => "",
}, },
stepTitle: {
type: String,
default: "",
},
}, },
data: () => ({}), data: () => ({}),
computed: { computed: {
......
...@@ -25,7 +25,12 @@ ...@@ -25,7 +25,12 @@
</div> </div>
<div class="step_icon" v-else></div> <div class="step_icon" v-else></div>
<div class="step_info"> <div class="step_info">
<p class="step_state"> <p v-if="item.stepTitle != ''" class="step_state">
<span>
{{ item.stepTitle }}
</span>
</p>
<p v-else class="step_state">
<span v-if="item.step < activeStep || done"> <span v-if="item.step < activeStep || done">
已完成 已完成
</span> </span>
......
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
:readOnly="readOnly" :readOnly="readOnly"
:data="anotherData" :data="anotherData"
:drag="drag" :drag="drag"
:disabled="disabled"
> >
<div v-if="drag"> <div v-if="drag">
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
...@@ -92,6 +93,10 @@ export default { ...@@ -92,6 +93,10 @@ export default {
type: Boolean, type: Boolean,
default: true, default: true,
}, },
disabled: {
type: Boolean,
default: false,
},
}, },
watch: { watch: {
list(value) { list(value) {
......
...@@ -22,6 +22,7 @@ ...@@ -22,6 +22,7 @@
</template> </template>
<script> <script>
import helper from "@/services/helper.js";
import screenType from "@/components/recommen/screen-type"; import screenType from "@/components/recommen/screen-type";
import recommenBox from "@/components/recommen/recommen-box"; import recommenBox from "@/components/recommen/recommen-box";
...@@ -119,7 +120,14 @@ export default { ...@@ -119,7 +120,14 @@ export default {
}) })
.then(({ data }) => { .then(({ data }) => {
if (data.success == 1) { if (data.success == 1) {
this.serviceList = data.data || []; let datas = data.data || [];
datas.forEach((item) => {
let update_date = item.update_date || "";
item.update_date = helper.dateStringTransform(update_date);
});
this.serviceList = datas;
} }
}); });
}, },
......
...@@ -336,6 +336,10 @@ export default { ...@@ -336,6 +336,10 @@ export default {
this.keyword = ""; this.keyword = "";
this.updateTime = ""; this.updateTime = "";
if (this.tpl_types.length > 0) {
this.type = this.tpl_types[0].value;
}
this.getTemplateList(); this.getTemplateList();
}, },
selectTemplate(item) { selectTemplate(item) {
......
...@@ -10,14 +10,12 @@ ...@@ -10,14 +10,12 @@
</el-tabs> </el-tabs>
<div class="list_options"> <div class="list_options">
<div class="button_group"> <div class="button_group">
<el-button <span
size="mini"
v-for="(item, index) in buttonList" v-for="(item, index) in buttonList"
:key="'btn' + index" :key="'btn' + index"
:class="item.state ? 'btn_actice':''" :class="item.state ? 'btn_default btn_actice':'btn_default'"
round
@click="btnClick(index)" @click="btnClick(index)"
>{{ item.name }}</el-button> >{{ item.name }}</span>
</div> </div>
<div class="input_right"> <div class="input_right">
<el-input <el-input
...@@ -224,6 +222,22 @@ export default { ...@@ -224,6 +222,22 @@ export default {
.button_group { .button_group {
padding: 17px 10px; padding: 17px 10px;
} }
.btn_default {
display: inline-block;
padding: 6px 15px;
border-radius: 14px;
font-size: 12px;
margin-right: 6px;
cursor: pointer;
}
.btn_default:hover {
background-color: #515fe7;
color: #fff;
}
.btn_default:focus {
background-color: #fff;
color: #606266;
}
.btn_actice { .btn_actice {
background-color: #515fe7; background-color: #515fe7;
color: #fff; color: #fff;
......
...@@ -170,6 +170,7 @@ export default { ...@@ -170,6 +170,7 @@ export default {
background-color: #f9fafc; background-color: #f9fafc;
padding: 18px; padding: 18px;
margin-top: 15px; margin-top: 15px;
border-radius: 8px;
} }
.application_base_info:not(:last-child) { .application_base_info:not(:last-child) {
margin-right: 50px; margin-right: 50px;
...@@ -222,17 +223,12 @@ export default { ...@@ -222,17 +223,12 @@ export default {
width: 220px; width: 220px;
margin-left: 20px; margin-left: 20px;
} }
.application_info .el-button--primary { </style>
<style>
.application_info.apaas_button .el-button--primary {
color: #fff;
background-color: #515fe7; background-color: #515fe7;
border-color: #515fe7; border-color: #515fe7;
} }
.application_info .el-button--warning.is-plain {
background-color: #fcefd6;
border-color: #fac266;
color: #e56600;
}
.application_info .el-button--warning {
background-color: #e56600;
border-color: #e56600;
}
</style> </style>
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<img :src="data.cover" width="100%" /> <img :src="data.cover" width="100%" />
<map-view <map-view
v-if="data.type === 'Map Service'" v-if="data.type === 'Map Service'"
:id="data.portal_id" :id="data.portal_id"
></map-view> ></map-view>
</div> </div>
<div class="main_container-right"> <div class="main_container-right">
...@@ -98,7 +98,7 @@ ...@@ -98,7 +98,7 @@
></el-input-number> ></el-input-number>
</div> </div>
</div> </div>
<div class="apaas_button commodity_action"> <div class=" commodity_action">
<el-button <el-button
type="warning" type="warning"
plain plain
...@@ -339,12 +339,13 @@ export default { ...@@ -339,12 +339,13 @@ export default {
vertical-align: middle; vertical-align: middle;
} }
.service_title > .service_access_info > img { .service_title > .service_access_info > img {
width: 15px; width: 19px;
margin-right: 5px; margin-right: 5px;
} }
.service_base_info { .service_base_info {
padding: 18px; padding: 18px;
background-color: #f9fafc; background-color: #f9fafc;
border-radius: 8px;
} }
.service_base_info > li, .service_base_info > li,
.commodity_information { .commodity_information {
...@@ -398,3 +399,11 @@ export default { ...@@ -398,3 +399,11 @@ export default {
margin-left: 20px; margin-left: 20px;
} }
</style> </style>
<style>
.service_info.apaas_button .el-button--primary {
color: #fff;
background-color: #515fe7;
border-color: #515fe7;
}
</style>
...@@ -33,6 +33,7 @@ ...@@ -33,6 +33,7 @@
:data="item.value.datas" :data="item.value.datas"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
> >
<el-table-column width="30"></el-table-column>
<el-table-column <el-table-column
v-for="(v, i) in item.value.columns" v-for="(v, i) in item.value.columns"
:key="'table_column_' + index + '_' + i" :key="'table_column_' + index + '_' + i"
......
...@@ -160,6 +160,7 @@ export default { ...@@ -160,6 +160,7 @@ export default {
} }
.service_info_tab .el-table { .service_info_tab .el-table {
width: 100%; width: 100%;
text-align: left;
} }
.service_info_tab .el-table__row:nth-child(odd) td { .service_info_tab .el-table__row:nth-child(odd) td {
background-color: #f8f9fd; background-color: #f8f9fd;
......
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
<div class="shopping_cell_specification_edit"> <div class="shopping_cell_specification_edit">
<el-popover <el-popover
placement="right-start" placement="right-start"
width="280" width="300"
v-model="visible" v-model="visible"
@show="setSpecificationPop" @show="setSpecificationPop"
> >
...@@ -70,7 +70,14 @@ ...@@ -70,7 +70,14 @@
:class="specificationPop == item.id ? 'shopping_cell_specification_btn active' : 'shopping_cell_specification_btn'" :class="specificationPop == item.id ? 'shopping_cell_specification_btn active' : 'shopping_cell_specification_btn'"
size="mini" size="mini"
@click="changeSpecification(item.id)" @click="changeSpecification(item.id)"
>{{ index + 1 + ". " + item.des }}</el-button> >
{{ index + 1 + ". " + "访问次数:" +
item.pv +
"/日," +
"访问量:" +
item.count +
"/日" }}
</el-button>
</div> </div>
<div class="no_option" v-else>暂无规格</div> <div class="no_option" v-else>暂无规格</div>
</div> </div>
...@@ -151,25 +158,26 @@ export default { ...@@ -151,25 +158,26 @@ export default {
cellIndex: { type: Number, default: null }, cellIndex: { type: Number, default: null },
cellCheck: { cellCheck: {
type: Boolean, type: Boolean,
default: false default: false,
}, },
readOnly: { readOnly: {
type: Boolean, type: Boolean,
default: false default: false,
}, },
cellIsService: { cellIsService: {
type: Boolean type: Boolean,
} },
}, },
watch: { watch: {
cellCheck: function(val) { cellCheck: function (val) {
this.checkedItem = val; this.checkedItem = val;
}, },
cellItem: { cellItem: {
immediate: true, // 这句重要 immediate: true, // 这句重要
handler(val) { handler(val) {
this.cellItems = val; this.cellItems = val;
this.cellItems.is_subscribe = this.cellItems.is_subscribe == 1 ? true : false; this.cellItems.is_subscribe =
this.cellItems.is_subscribe == 1 ? true : false;
if (this.cellIsService) { if (this.cellIsService) {
if (this.cellItems.service.buy_method == 1) { if (this.cellItems.service.buy_method == 1) {
this.specificationApplicationBtns = [{ id: 1, value: "按月" }]; this.specificationApplicationBtns = [{ id: 1, value: "按月" }];
...@@ -178,12 +186,12 @@ export default { ...@@ -178,12 +186,12 @@ export default {
} else { } else {
this.specificationApplicationBtns = [ this.specificationApplicationBtns = [
{ id: 1, value: "按月" }, { id: 1, value: "按月" },
{ id: 2, value: "按年" } { id: 2, value: "按年" },
]; ];
} }
} }
} },
} },
}, },
data: () => ({ data: () => ({
cellItems: {}, cellItems: {},
...@@ -195,12 +203,12 @@ export default { ...@@ -195,12 +203,12 @@ export default {
specificationApplicationPop: 1, specificationApplicationPop: 1,
appSpecificationBtns: [ appSpecificationBtns: [
{ id: 1, value: "部署" }, { id: 1, value: "部署" },
{ id: 2, value: "开发" } { id: 2, value: "开发" },
], ],
specificationApplicationBtns: [ specificationApplicationBtns: [
{ id: 1, value: "按月" }, { id: 1, value: "按月" },
{ id: 2, value: "按年" } { id: 2, value: "按年" },
] ],
}), }),
computed: { computed: {
getSpecification() { getSpecification() {
...@@ -211,14 +219,20 @@ export default { ...@@ -211,14 +219,20 @@ export default {
this.cellItems.service.request_spcs_info.length != 0 this.cellItems.service.request_spcs_info.length != 0
) { ) {
let requestArr = this.cellItems.service.request_spcs_info; let requestArr = this.cellItems.service.request_spcs_info;
requestArr.forEach(item => { requestArr.forEach((item) => {
arr.push(item.id); arr.push(item.id);
}); });
} }
let num = arr.indexOf(this.cellItems.spec_id); let num = arr.indexOf(this.cellItems.spec_id);
let specification = ""; let specification = "";
if (num != -1) { if (num != -1) {
specification = this.cellItems.service.request_spcs_info[num].des; specification =
"访问次数:" +
this.cellItems.service.request_spcs_info[num].pv +
"/日," +
"访问量:" +
this.cellItems.service.request_spcs_info[num].count +
"/日";
} }
return specification; return specification;
} else { } else {
...@@ -228,7 +242,7 @@ export default { ...@@ -228,7 +242,7 @@ export default {
return "开发"; return "开发";
} }
} }
} },
}, },
mounted() {}, mounted() {},
methods: { methods: {
...@@ -263,23 +277,23 @@ export default { ...@@ -263,23 +277,23 @@ export default {
changeCellItem() { changeCellItem() {
this.$emit("changeCellMsg", { this.$emit("changeCellMsg", {
index: this.cellIndex, index: this.cellIndex,
data: this.cellItems data: this.cellItems,
}); });
}, },
delCellItem() { delCellItem() {
this.$api.serviceShop this.$api.serviceShop
.delShoppingCart([this.cellItems.id]) .delShoppingCart([this.cellItems.id])
.then(response => { .then((response) => {
if (response.data.success == 1) { if (response.data.success == 1) {
this.$message({ this.$message({
message: this.cellIsService ? "删除该服务成功" : "删除该应用成功", message: this.cellIsService ? "删除该服务成功" : "删除该应用成功",
type: "success" type: "success",
}); });
this.$emit("updateList"); this.$emit("updateList");
} else { } else {
this.$message({ this.$message({
message: this.cellIsService ? "删除该服务失败" : "删除该应用失败", message: this.cellIsService ? "删除该服务失败" : "删除该应用失败",
type: "error" type: "error",
}); });
} }
}); });
...@@ -290,16 +304,16 @@ export default { ...@@ -290,16 +304,16 @@ export default {
duration: this.cellItems.duration, duration: this.cellItems.duration,
spec_id: this.cellItems.spec_id, spec_id: this.cellItems.spec_id,
duration_method: this.cellItems.duration_method, duration_method: this.cellItems.duration_method,
is_subscribe: Number(this.cellItems.is_subscribe) is_subscribe: Number(this.cellItems.is_subscribe),
}; };
this.$api.serviceShop.updateShoppingCart(query).then(response => { this.$api.serviceShop.updateShoppingCart(query).then((response) => {
if (response.data.success == 1) { if (response.data.success == 1) {
} else { } else {
console.log(response.data.errMsg); console.log(response.data.errMsg);
} }
}); });
} },
} },
}; };
</script> </script>
...@@ -437,6 +451,14 @@ export default { ...@@ -437,6 +451,14 @@ export default {
} }
.shopping_cell_specification_btn { .shopping_cell_specification_btn {
margin: 0 10px 10px; margin: 0 10px 10px;
max-width: calc(100% - 20px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.shopping_cell_specification_btn:hover {
background-color: #b2baf5;
color: #f4f7fc;
} }
.shopping_cell_specification_btn.active { .shopping_cell_specification_btn.active {
background-color: #515fe7; background-color: #515fe7;
......
...@@ -5,9 +5,9 @@ ...@@ -5,9 +5,9 @@
<div class="legend_title">拓扑图图例</div> <div class="legend_title">拓扑图图例</div>
<div class="legend_inner"> <div class="legend_inner">
<div class="legend_in_tit">服务类型</div> <div class="legend_in_tit">服务类型</div>
<div id="nodes" ref="lengedNodes" class="legend_nodes"></div> <div id="nodes" ref="legendNodes" class="legend_nodes"></div>
<div class="legend_in_tit">调用状态</div> <div class="legend_in_tit">调用状态</div>
<div id="edges" ref="lengedEdges" class="legend_edges"></div> <div id="edges" ref="legendEdges" class="legend_edges"></div>
</div> </div>
</div> </div>
</div> </div>
...@@ -22,11 +22,18 @@ export default { ...@@ -22,11 +22,18 @@ export default {
default: () => { default: () => {
return { return {
nodes: [], nodes: [],
edges: [] edges: [],
}; };
} },
}, },
namespace: String namespace: String,
},
data: () => {
return {
graph: null,
legendNodes: null,
legendEdges: null,
};
}, },
mounted() {}, mounted() {},
watch: { watch: {
...@@ -34,13 +41,13 @@ export default { ...@@ -34,13 +41,13 @@ export default {
this.getCavData(); this.getCavData();
this.getLegendNodes(); this.getLegendNodes();
this.getLegendEdges(); this.getLegendEdges();
} },
}, },
methods: { methods: {
// shu ju chu li // shu ju chu li
getCavData() { getCavData() {
let self = this; let self = this;
self.datas.nodes.map(node => { self.datas.nodes.map((node) => {
node.id = node.data.id; node.id = node.data.id;
switch (node.data.svcType) { switch (node.data.svcType) {
case "数据服务": case "数据服务":
...@@ -87,12 +94,12 @@ export default { ...@@ -87,12 +94,12 @@ export default {
fontSize: 12, fontSize: 12,
stroke: "#fffef9", stroke: "#fffef9",
lineWidth: 4, lineWidth: 4,
cursor: "pointer" cursor: "pointer",
}, },
position: "bottom" position: "bottom",
}; };
}); });
self.datas.edges.map(edge => { self.datas.edges.map((edge) => {
edge.id = edge.data.id; edge.id = edge.data.id;
edge.source = edge.data.source; edge.source = edge.data.source;
edge.target = edge.data.target; edge.target = edge.data.target;
...@@ -107,10 +114,10 @@ export default { ...@@ -107,10 +114,10 @@ export default {
lineAppendWidth: 5, lineAppendWidth: 5,
endArrow: { endArrow: {
path: "M -3,0 L 4,2 L 4,-2 Z", // 自定义箭头路径 path: "M -3,0 L 4,2 L 4,-2 Z", // 自定义箭头路径
d: -2 // 偏移量 d: -2, // 偏移量
}, },
strokeOpacity: 1, strokeOpacity: 1,
cursor: "pointer" cursor: "pointer",
}; };
if (edge.data.traffic.protocol == "tcp") { if (edge.data.traffic.protocol == "tcp") {
// tcp // tcp
...@@ -151,11 +158,12 @@ export default { ...@@ -151,11 +158,12 @@ export default {
self.getCav(); self.getCav();
}, },
getCav() { getCav() {
if (this.graph) this.graph.destroy();
const width = this.$refs.conCav.scrollWidth; const width = this.$refs.conCav.scrollWidth;
const height = this.$refs.conCav.scrollHeight || 500; const height = this.$refs.conCav.scrollHeight || 500;
let self = this; let self = this;
// console.log(self.datas); // console.log(self.datas);
const graph = new G6.Graph({ this.graph = new G6.Graph({
container: "container", container: "container",
width, width,
height, height,
...@@ -165,78 +173,79 @@ export default { ...@@ -165,78 +173,79 @@ export default {
// 流程图布局 // 流程图布局
type: "dagre", type: "dagre",
rankdir: "LR", rankdir: "LR",
nodesep: 12 nodesep: 12,
}, },
modes: { modes: {
default: ["zoom-canvas", "drag-canvas", "drag-node"] default: ["zoom-canvas", "drag-canvas", "drag-node"],
}, },
defaultNode: { defaultNode: {
color: "#5B8FF9", color: "#5B8FF9",
style: { style: {
lineWidth: 2, lineWidth: 2,
fill: "#C6E5FF", fill: "#C6E5FF",
cursor: "pointer" cursor: "pointer",
}, },
labelCfg: { labelCfg: {
style: { style: {
fill: "#f36c21", fill: "#f36c21",
fontSize: 10 fontSize: 10,
}, },
position: "bottom" position: "bottom",
} },
}, },
defaultEdge: { defaultEdge: {
style: { style: {
stroke: "#e2e2e2", stroke: "#e2e2e2",
lineWidth: 1, lineWidth: 1,
lineAppendWidth: 6, lineAppendWidth: 6,
opacity: 1 opacity: 1,
}, },
labelCfg: { labelCfg: {
style: { style: {
fontSize: 10, fontSize: 10,
stroke: "#fffef9", stroke: "#fffef9",
fill: "#595959", fill: "#595959",
lineWidth: 4 lineWidth: 4,
} },
} },
}, },
nodeStateStyles: { nodeStateStyles: {
highlight: { highlight: {
opacity: 1 opacity: 1,
}, },
dark: { dark: {
opacity: 0.2 opacity: 0.2,
} },
}, },
edgeStateStyles: { edgeStateStyles: {
highlight: { highlight: {
opacity: 1 opacity: 1,
}, },
dark: { dark: {
opacity: 0.2 opacity: 0.2,
}, },
click: { click: {
lineWidth: 3 lineWidth: 3,
} },
}, },
plugins: [] plugins: [],
}); });
// 节点点击 // 节点点击
graph.on("node:click", function(e) {}); this.graph.on("node:click", function (e) {});
// 路径点击 // 路径点击
graph.on("edge:click", function(e) {}); this.graph.on("edge:click", function (e) {});
graph.on("node:dblclick", function(e) {}); this.graph.on("node:dblclick", function (e) {});
// 点击画布 // 点击画布
graph.on("canvas:click", function(e) {}); this.graph.on("canvas:click", function (e) {});
graph.data(self.datas); this.graph.data(self.datas);
graph.render(); this.graph.render();
}, },
getLegendNodes() { getLegendNodes() {
if (this.legendNodes) this.legendNodes.destroy();
// legend. maybe you want use parames to reset it, but i did not do the extension // legend. maybe you want use parames to reset it, but i did not do the extension
const width = this.$refs.lengedNodes.scrollWidth; const width = this.$refs.legendNodes.scrollWidth;
const height = this.$refs.lengedNodes.scrollHeight; const height = this.$refs.legendNodes.scrollHeight;
const legendGraph = new G6.Graph({ this.legendNodes = new G6.Graph({
container: "nodes", container: "nodes",
width: width, width: width,
height: height, height: height,
...@@ -244,16 +253,16 @@ export default { ...@@ -244,16 +253,16 @@ export default {
style: { style: {
fill: "transparent", // 节点填充色 fill: "transparent", // 节点填充色
stroke: "transparent", // 节点描边色 stroke: "transparent", // 节点描边色
lineWidth: 1 // 节点描边粗细 lineWidth: 1, // 节点描边粗细
}, },
labelCfg: { labelCfg: {
position: "right", position: "right",
offset: 10, offset: 10,
style: { style: {
fill: "#333" fill: "#333",
} },
} },
} },
}); });
const legendX = 20; const legendX = 20;
const legendBeginY = 20; const legendBeginY = 20;
...@@ -268,7 +277,7 @@ export default { ...@@ -268,7 +277,7 @@ export default {
type: "image", type: "image",
img: require("@/assets/svg/topology_ic_shujufw.svg"), img: require("@/assets/svg/topology_ic_shujufw.svg"),
size: [15, 15], size: [15, 15],
label: "数据服务" label: "数据服务",
}, },
{ {
id: "level2", id: "level2",
...@@ -277,7 +286,7 @@ export default { ...@@ -277,7 +286,7 @@ export default {
type: "image", type: "image",
img: require("@/assets/svg/topology_ic_shikongfw.svg"), img: require("@/assets/svg/topology_ic_shikongfw.svg"),
size: [15, 15], size: [15, 15],
label: "时空服务" label: "时空服务",
}, },
{ {
id: "level3", id: "level3",
...@@ -286,7 +295,7 @@ export default { ...@@ -286,7 +295,7 @@ export default {
type: "image", type: "image",
img: require("@/assets/svg/topology_ic_shipinfw.svg"), img: require("@/assets/svg/topology_ic_shipinfw.svg"),
size: [15, 15], size: [15, 15],
label: "视频服务" label: "视频服务",
}, },
{ {
id: "level4", id: "level4",
...@@ -295,7 +304,7 @@ export default { ...@@ -295,7 +304,7 @@ export default {
type: "image", type: "image",
img: require("@/assets/svg/topology_ic_ganzhifw.svg"), img: require("@/assets/svg/topology_ic_ganzhifw.svg"),
size: [15, 15], size: [15, 15],
label: "感知服务" label: "感知服务",
}, },
{ {
id: "level5", id: "level5",
...@@ -304,18 +313,19 @@ export default { ...@@ -304,18 +313,19 @@ export default {
type: "image", type: "image",
img: require("@/assets/svg/topology_ic_zonghefw.svg"), img: require("@/assets/svg/topology_ic_zonghefw.svg"),
size: [15, 15], size: [15, 15],
label: "综合应用" label: "综合应用",
} },
] ],
}; };
legendGraph.data(legendData); this.legendNodes.data(legendData);
legendGraph.render(); this.legendNodes.render();
}, },
getLegendEdges() { getLegendEdges() {
if (this.legendEdges) this.legendEdges.destroy();
// legend. maybe you want use parames to reset it, but i did not do the extension // legend. maybe you want use parames to reset it, but i did not do the extension
const width = this.$refs.lengedEdges.scrollWidth; const width = this.$refs.legendEdges.scrollWidth;
const height = this.$refs.lengedEdges.scrollHeight; const height = this.$refs.legendEdges.scrollHeight;
const legendGraph = new G6.Graph({ this.legendEdges = new G6.Graph({
container: "edges", container: "edges",
width: width, width: width,
height: height, height: height,
...@@ -323,16 +333,16 @@ export default { ...@@ -323,16 +333,16 @@ export default {
style: { style: {
fill: "transparent", // 节点填充色 fill: "transparent", // 节点填充色
stroke: "transparent", // 节点描边色 stroke: "transparent", // 节点描边色
lineWidth: 1 // 节点描边粗细 lineWidth: 1, // 节点描边粗细
}, },
labelCfg: { labelCfg: {
position: "right", position: "right",
offset: 10, offset: 10,
style: { style: {
fill: "#333" fill: "#333",
} },
} },
} },
}); });
const legendX = 10; const legendX = 10;
const legendBeginY = 20; const legendBeginY = 20;
...@@ -345,7 +355,7 @@ export default { ...@@ -345,7 +355,7 @@ export default {
x: legendX, x: legendX,
y: legendBeginY, y: legendBeginY,
type: "circle", type: "circle",
size: 1 size: 1,
}, },
// line1 point 1 // line1 point 1
{ {
...@@ -354,7 +364,7 @@ export default { ...@@ -354,7 +364,7 @@ export default {
y: legendBeginY, y: legendBeginY,
label: "正常", label: "正常",
type: "circle", type: "circle",
size: 1 size: 1,
}, },
// line2 point 0 // line2 point 0
{ {
...@@ -362,7 +372,7 @@ export default { ...@@ -362,7 +372,7 @@ export default {
x: legendX, x: legendX,
y: legendBeginY + legendYPadding, y: legendBeginY + legendYPadding,
type: "circle", type: "circle",
size: 1 size: 1,
}, },
// line2 point 1 // line2 point 1
{ {
...@@ -371,8 +381,8 @@ export default { ...@@ -371,8 +381,8 @@ export default {
y: legendBeginY + legendYPadding, y: legendBeginY + legendYPadding,
label: "错误", label: "错误",
type: "circle", type: "circle",
size: 1 size: 1,
} },
], ],
edges: [ edges: [
{ {
...@@ -385,10 +395,10 @@ export default { ...@@ -385,10 +395,10 @@ export default {
lineAppendWidth: 5, lineAppendWidth: 5,
endArrow: { endArrow: {
path: "M -3,0 L 4,2 L 4,-2 Z", // 自定义箭头路径 path: "M -3,0 L 4,2 L 4,-2 Z", // 自定义箭头路径
d: -2 // 偏移量 d: -2, // 偏移量
}, },
cursor: "pointer" cursor: "pointer",
} },
}, },
{ {
id: "line1", id: "line1",
...@@ -400,17 +410,17 @@ export default { ...@@ -400,17 +410,17 @@ export default {
lineAppendWidth: 5, lineAppendWidth: 5,
endArrow: { endArrow: {
path: "M -3,0 L 4,2 L 4,-2 Z", // 自定义箭头路径 path: "M -3,0 L 4,2 L 4,-2 Z", // 自定义箭头路径
d: -2 // 偏移量 d: -2, // 偏移量
}, },
cursor: "pointer" cursor: "pointer",
} },
} },
] ],
}; };
legendGraph.data(legendData); this.legendEdges.data(legendData);
legendGraph.render(); this.legendEdges.render();
} },
} },
}; };
</script> </script>
......
<template> <template>
<div> <div class="super-flow-demo1">
<div class="super-flow-demo1"> <div class="scale_block">
<div class="scale_control">
<div class="less">
<i class="el-icon-minus"></i>
</div>
<div class="num">{{ scale_num }}%</div>
<div class="add">
<i class="el-icon-plus"></i>
</div>
</div>
<div class="node-container"> <div class="node-container">
<p class="label_head">节点类型</p> <p class="label_head">节点类型</p>
<p class="label_explanation">请拖拽添加到流程中</p> <p class="label_explanation">请拖拽添加到流程中</p>
<el-input-number v-model="scale_num" @change="handleChange" :step="10" :step-strictly="true" :min="50" :max="150" label="描述文字"></el-input-number> <div
<span class="node-item" v-for="(item, index) in nodeItemList" :key="index" @mousedown="evt => nodeItemMouseDown(evt, item.value)">{{item.label}}</span> class="node-item"
:class="{'node-item-begin': item.value.meta.type == 0, 'node-item-end': item.value.meta.type == 1, 'node-item-default': item.value.meta.type == 2}"
v-for="(item, index) in nodeItemList"
:key="index"
@mousedown="evt => nodeItemMouseDown(evt, item.value)"
>
<span>{{item.label}}</span>
</div>
</div>
</div>
<div class="flow-container" ref="flowContainer">
<super-flow
ref="superFlow"
:node-list="nodeList"
:link-list="linkList"
:link-menu="linkMenu"
line-color="#c4d8f8"
onLineColor="#94a8c8"
:origin="origin"
>
<template v-slot:node="{meta}">
<div
:class="{'flow-node-begin': meta.type == 0, 'flow-node-end': meta.type == 1, 'flow-node-default': meta.type == 2}"
:id="meta.id"
>
<div class="node_span" @click="clickItem(meta)">{{meta.name}}</div>
</div>
</template>
</super-flow>
</div>
<div class="flow_options">
<p class="options_head">操作</p>
<div class="options_item">
<img :src="require('@/assets/imgs/lcsj_ic_set.png')" class="options_img" />
<p class="options_text">常规设置</p>
</div> </div>
<div class="flow-container" :class="`scale${scale_num}`" ref="flowContainer"> <div class="options_item">
<super-flow ref="superFlow" :node-list="nodeList" :link-list="linkList" :link-menu="linkMenu" :link-base-style="linkBaseStyle" :link-style="linkStyle" :link-desc="linkDesc" :origin="origin"> <img :src="require('@/assets/imgs/lcsj_ic_chajian.png')" class="options_img" />
<template v-slot:node="{meta}"> <p class="options_text">插件设置</p>
<div :class="{'flow-node-begin': meta.type == 0, 'flow-node-end': meta.type == 1, 'flow-node-default': meta.type == 2}" :id="meta.id">
<div @click="clickItem(meta)">
{{meta.name}}
</div>
</div>
</template>
</super-flow>
</div> </div>
</div> </div>
</div> </div>
...@@ -26,7 +62,7 @@ ...@@ -26,7 +62,7 @@
<script> <script>
const drawerType = { const drawerType = {
node: 0, node: 0,
link: 1 link: 1,
}; };
export default { export default {
data() { data() {
...@@ -68,14 +104,14 @@ export default { ...@@ -68,14 +104,14 @@ export default {
} else { } else {
this.$refs.linkSetting.clearValidate(); this.$refs.linkSetting.clearValidate();
} }
} },
}, },
linkSetting: { linkSetting: {
desc: "" desc: "",
}, },
nodeSetting: { nodeSetting: {
name: "", name: "",
desc: "" desc: "",
}, },
dragConf: { dragConf: {
isDown: false, isDown: false,
...@@ -85,73 +121,57 @@ export default { ...@@ -85,73 +121,57 @@ export default {
clientX: 0, clientX: 0,
clientY: 0, clientY: 0,
ele: null, ele: null,
info: null info: null,
}, },
nodeItemList: [ nodeItemList: [
{ {
label: "开始", label: "普通节点",
value: { value: {
width: 120, width: 120,
height: 40, height: 48,
meta: { meta: {
label: "开始开始开始开始开始", label: "普通节点",
name: "开始开始开始开始开始", name: "普通节点",
type: 0 type: 2,
} },
} },
}, },
{ {
label: "结束", label: "开始",
value: { value: {
width: 120, width: 120,
height: 40, height: 48,
meta: { meta: {
label: "结束", label: "开始",
name: "结束", name: "开始",
type: 1 type: 0,
} },
} },
}, },
{ {
label: "普通节点", label: "结束",
value: { value: {
width: 120, width: 120,
height: 40, height: 48,
meta: { meta: {
label: "普通节点", label: "结束",
name: "普通节点", name: "结束",
type: 2 type: 1,
} },
} },
} },
], ],
linkMenu: [ linkMenu: [
[ [
{ {
label: "删除", label: "删除",
selected: link => { selected: (link) => {
console.log(link); console.log(link);
link.remove(); link.remove();
} },
}, },
{ ],
label: "编辑",
selected: link => {
this.drawerConf.open(drawerType.link, link);
}
}
]
], ],
linkBaseStyle: {
color: "#666666", // line 颜色
hover: "#FF0000", // line hover 的颜色
textColor: "#666666", // line 描述文字颜色
textHover: "#FF0000", // line 描述文字 hover 颜色
font: "14px Arial", // line 描述文字 字体设置 参考 canvas font
dotted: false, // 是否是虚线
lineDash: [4, 4], // 虚线时生效
background: "rgba(255,255,255,0.6)" // 描述文字背景色
}
}; };
}, },
mounted() { mounted() {
...@@ -164,12 +184,7 @@ export default { ...@@ -164,12 +184,7 @@ export default {
}, },
methods: { methods: {
linkStyle(link) { linkStyle(link) {
return { return {};
// hover: '#FF00FF'
};
},
linkDesc(link) {
return link.meta ? link.meta.desc : "";
}, },
docMousemove({ clientX, clientY }) { docMousemove({ clientX, clientY }) {
const conf = this.dragConf; const conf = this.dragConf;
...@@ -191,7 +206,7 @@ export default { ...@@ -191,7 +206,7 @@ export default {
top, top,
right, right,
bottom, bottom,
left left,
} = this.$refs.flowContainer.getBoundingClientRect(); } = this.$refs.flowContainer.getBoundingClientRect();
// 判断鼠标是否进入 flow container // 判断鼠标是否进入 flow container
if ( if (
...@@ -217,7 +232,7 @@ export default { ...@@ -217,7 +232,7 @@ export default {
// 添加节点 // 添加节点
this.$refs.superFlow.addNode({ this.$refs.superFlow.addNode({
coordinate, coordinate,
...conf.info ...conf.info,
}); });
conf.isMove = false; conf.isMove = false;
} }
...@@ -239,7 +254,7 @@ export default { ...@@ -239,7 +254,7 @@ export default {
clientY: clientY, clientY: clientY,
info, info,
ele, ele,
isDown: true isDown: true,
}); });
ele.style.position = "fixed"; ele.style.position = "fixed";
ele.style.margin = "0"; ele.style.margin = "0";
...@@ -253,12 +268,12 @@ export default { ...@@ -253,12 +268,12 @@ export default {
getData() { getData() {
return this.$refs.superFlow.toJSON(); return this.$refs.superFlow.toJSON();
}, },
handleChange() {} handleChange() {},
} },
}; };
</script> </script>
<style lang="less"> <style lang="less" scoped>
.link-base-style-form { .link-base-style-form {
.el-form-item { .el-form-item {
margin-bottom: 12px; margin-bottom: 12px;
...@@ -269,117 +284,173 @@ export default { ...@@ -269,117 +284,173 @@ export default {
.super-flow-demo1 { .super-flow-demo1 {
margin-top: 20px; margin-top: 20px;
width: 100%; width: 100%;
height: 800px; height: 100%;
background-color: #f5f5f5; background-color: #fff;
@list-width: 200px; @list-width: 160px;
position: relative; position: relative;
> .node-container { > .flow-container {
width: @list-width; width: 100%;
float: left;
height: 100%;
overflow: hidden;
}
.flow_options {
width: 84px;
height: 244px;
background-color: #f8f9fd;
border-radius: 42px;
position: absolute; position: absolute;
z-index: 2; top: 10px;
left: 0; right: 0;
height: 400px;
text-align: center; text-align: center;
background-color: #ffffff; .options_head {
color: #242c43;
font-size: 14px;
font-weight: bold;
margin-top: 30px;
}
.options_item {
margin-top: 20px;
cursor: pointer;
color: #242c43;
&:hover {
color: #515fe7;
}
.options_img {
width: 40px;
height: 40px;
}
}
}
}
.node-item {
@node-item-height: 42px;
font-size: 16px;
display: inline-block;
height: @node-item-height + 6;
width: 120px;
margin-top: 18px;
background-color: #ffffff;
border-radius: 10px;
line-height: @node-item-height;
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
cursor: pointer;
user-select: none;
text-align: center;
z-index: 6;
&:hover {
box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.4);
}
&.node-item-begin {
border: solid 3px #25bdb1;
}
&.node-item-end {
border: solid 3px #f78181;
}
&.node-item-default {
border: solid 3px #b4c6f5;
}
}
.scale_block {
position: absolute;
left: 0;
z-index: 2;
top: 5px;
width: 160px;
.scale_control {
width: 130px;
display: flex;
justify-content: space-around;
border-radius: 8px;
border: solid 2px #e3e5ef;
height: 40px;
font-size: 16px;
line-height: 36px;
margin: 0 auto;
color: #8390ee;
.less {
padding: 0 10px;
border-right: solid 2px #e3e5ef;
}
.add {
padding: 0 10px;
border-left: solid 2px #e3e5ef;
}
.num {
color: #58617a;
}
}
.node-container {
width: 160px;
height: 300px;
text-align: center;
background-color: #f8f9fd;
border-radius: 8px;
margin-top: 20px;
.label_head { .label_head {
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 14px;
text-align: center; text-align: center;
padding: 20px 0; padding: 20px 0 15px;
color: #242c43;
} }
.label_explanation { .label_explanation {
font-size: 16px; font-size: 14px;
text-align: center; text-align: center;
padding-bottom: 5px; color: #8890a7;
} }
} }
> .flow-container { }
width: 100%; </style>
float: left; <style lang="less">
height: 100%; .super-flow {
overflow: hidden;
}
.super-flow__node { .super-flow__node {
box-shadow: none;
border: none; border: none;
background-color: transparent; background-color: transparent;
border-radius: 8px; border-radius: 8px;
font-size: 16px;
&:focus { &:focus {
box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8); box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8);
background-color: #515fe7;
color: #fff;
} }
.flow-node-begin { /deep/ .node_span {
width: 100%;
height: 100%;
line-height: 36px;
padding: 0 6px;
font-size: 12px;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
}
.flow-node-begin {
width: 100%;
height: 100%;
line-height: 42px;
padding: 0 6px;
border-radius: 8px; border-radius: 8px;
border: 2px solid #444; border: solid 3px #109e93;
background-color: #25bdb1;
color: #ffffff;
} }
.flow-node-end { .flow-node-end {
width: 100%; width: 100%;
line-height: 36px; height: 100%;
line-height: 42px;
padding: 0 6px; padding: 0 6px;
font-size: 12px;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
border-radius: 8px; border-radius: 8px;
border: 2px solid #f80; background-color: #f78181;
border: solid 3px #e86262;
color: #ffffff;
} }
.flow-node-default { .flow-node-default {
width: 100%; width: 100%;
line-height: 36px; height: 100%;
line-height: 42px;
padding: 0 6px; padding: 0 6px;
font-size: 12px;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
border-radius: 8px; border-radius: 8px;
border: 2px solid #3a9; border: solid 3px #b4c6f5;
} }
} }
} }
.node-item { .super-flow__menu-container .super-flow__menu {
@node-item-height: 30px;
font-size: 14px;
display: inline-block;
height: @node-item-height;
width: 120px; width: 120px;
margin-top: 20px;
background-color: #ffffff;
line-height: @node-item-height;
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
cursor: pointer;
user-select: none;
text-align: center;
z-index: 6;
&:hover {
box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.4);
}
}
</style>
<style scoped>
.scale60 {
transform: scale(0.6, 0.6);
}
.scale70 {
transform: scale(0.7, 0.7);
}
.scale80 {
transform: scale(0.8, 0.8);
}
.scale90 {
transform: scale(0.9, 0.9);
}
.scale100 {
transform: scale(1, 1);
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="fwgl_container"> <div class="fwgl_container">
<side-nav-bar <side-nav-bar
title="数据分析中心" title="运营管控中心"
imgSrc="tool_fuwu" imgSrc="tool_fuwu"
:nav-list="navList" :nav-list="navList"
:title-path="navList[0] && navList[0].path" :title-path="navList[0] && navList[0].path"
...@@ -17,50 +17,62 @@ import sideNavBar from "@/components/side-nav-bar"; ...@@ -17,50 +17,62 @@ import sideNavBar from "@/components/side-nav-bar";
export default { export default {
components: { components: {
sideNavBar sideNavBar,
}, },
data: () => ({ data: () => ({
userNav: [ userNav: [
{ {
name: "我的服务数据分析", name: "服务分析",
path: `/data_analysis/my_service` path: `/data_analysis/my_service`,
}, },
{ {
name: "我的应用数据分析", name: "应用分析",
path: `/data_analysis/my_application` path: `/data_analysis/my_application`,
}, },
],
userNav1: [
{ {
name: "组织服务数据分析", name: "组织服务数据分析",
path: `/data_analysis/org_service` path: `/data_analysis/org_service`,
}, },
{ {
name: "组织应用数据分析", name: "组织应用数据分析",
path: `/data_analysis/org_application` path: `/data_analysis/org_application`,
}, },
{ {
name: "运行概况-组织", name: "运行概况-组织",
path: `/data_analysis/operation_overview` path: `/data_analysis/operation_overview`,
}, },
{ {
name: "服务管控-组织", name: "服务管控-组织",
path: `/data_analysis/service_control` path: `/data_analysis/service_control`,
} },
], ],
navList: [] userNav1: [],
navList: [],
}), }),
watch: { watch: {
"$route.fullPath"(path) { "$route.fullPath"(path) {
this.initNavList(); this.initNavList();
} },
}, },
methods: { methods: {
initNavList() { initNavList() {
this.navList = this.userNav; if (
} this.$store.state.userInfo.is_admin == 3 ||
this.$store.state.userInfo.is_admin == 4
) {
this.navList = this.userNav;
} else if (this.$store.state.userInfo.is_admin == 2) {
this.navList = this.userNav1;
} else if (this.$store.state.userInfo.is_admin == 1) {
this.navList = this.userNav2;
}
},
}, },
mounted() { mounted() {
this.initNavList(); this.initNavList();
} },
}; };
</script> </script>
......
...@@ -93,6 +93,7 @@ ...@@ -93,6 +93,7 @@
@getNewList="getNewList" @getNewList="getNewList"
ref="servicepic" ref="servicepic"
directory="manage" directory="manage"
:disabled="disabled"
></upload-file> ></upload-file>
</el-form-item> </el-form-item>
</el-form> </el-form>
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
<div class="list_container"> <div class="list_container">
<apass-list <apass-list
ref="list" ref="list"
class="no_wrap"
:list-header="listHeader" :list-header="listHeader"
:list-data="listData" :list-data="listData"
:list-total="listTotal" :list-total="listTotal"
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
<div class="list_container"> <div class="list_container">
<apass-list <apass-list
ref="list" ref="list"
class="no_wrap"
:list-header="listHeader" :list-header="listHeader"
:list-data="listData" :list-data="listData"
:list-total="listTotal" :list-total="listTotal"
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
<div class="list_container"> <div class="list_container">
<apass-list <apass-list
ref="list" ref="list"
class="no_wrap"
:list-header="listHeader" :list-header="listHeader"
:list-data="listData" :list-data="listData"
:list-total="listTotal" :list-total="listTotal"
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
<div class="list_container"> <div class="list_container">
<apass-list <apass-list
ref="list" ref="list"
class="no_wrap"
:list-header="listHeader" :list-header="listHeader"
:list-data="listData" :list-data="listData"
:list-total="listTotal" :list-total="listTotal"
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
<div class="list_container"> <div class="list_container">
<apass-list <apass-list
ref="list" ref="list"
class="no_wrap"
:list-header="listHeader" :list-header="listHeader"
:list-data="listData" :list-data="listData"
:list-total="listTotal" :list-total="listTotal"
......
...@@ -120,7 +120,6 @@ export default { ...@@ -120,7 +120,6 @@ export default {
{ {
prop: "name", prop: "name",
label: "字段编码", label: "字段编码",
align: "center",
width: 240, width: 240,
}, },
{ {
...@@ -163,7 +162,6 @@ export default { ...@@ -163,7 +162,6 @@ export default {
{ {
prop: "name", prop: "name",
label: "字段编码", label: "字段编码",
align: "center",
width: 240, width: 240,
}, },
{ {
......
...@@ -264,10 +264,10 @@ export default { ...@@ -264,10 +264,10 @@ export default {
this.copyTempItem = null; this.copyTempItem = null;
}, },
addNewProcess() { addNewProcess() {
this.$router.push("/progress/designs"); this.$router.push("/progress/designer/design");
}, // FIXME: 新建流程 }, // FIXME: 新建流程
editItem(item) { editItem(item) {
this.$router.push("/progress/designs"); this.$router.push("/progress/designer/design");
}, // FIXME: 编辑流程 }, // FIXME: 编辑流程
detailItem(item) { detailItem(item) {
this.$router.push(`/progress/designer/detail/${item.workflows_id}`); this.$router.push(`/progress/designer/detail/${item.workflows_id}`);
......
...@@ -29,10 +29,6 @@ export default { ...@@ -29,10 +29,6 @@ export default {
name: "流程监控", name: "流程监控",
path: `/progress/monitoring`, path: `/progress/monitoring`,
}, },
{
name: "流程设计",
path: `/progress/designs`,
}
], ],
navList: [], navList: [],
}), }),
......
<template> <template>
<div class="design_contain"> <div class="design_contain">
<el-button @click="getData">获取参数</el-button> <el-breadcrumb separator="/" class="bread_crumb1">
<WorkFlow ref="workFlow" /> <el-breadcrumb-item :to="{ path: '/workplace' }">{{ $t("lang.online_component_tool") }}</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/progress/designer' }">{{ $t("lang.process_design") }}</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/progress/designer' }">{{ $t("lang.process_management") }}</el-breadcrumb-item>
<el-breadcrumb-item>{{ $t("lang.new") }}</el-breadcrumb-item>
</el-breadcrumb>
<BlockRadius class="block_item">
<steps
:active-step="step"
:done="done"
:show-done="true"
done-title="保存成功"
done-sub-title="可返回流程管理列表查看该流程,并进行流程的部署和发布。"
class="apaas_steps"
>
<step
title="基本信息"
:step="0"
:active-icon="require('@/assets/imgs/progress_ic_xinxitx.png')"
class="apaas_step"
>
<div class="step_in">
<el-form :model="basic_form" :rules="rules" ref="basicInformation" class="form_left">
<el-form-item>
<p class="formname">流程名称:</p>
<el-input v-model="basic_form.name" placeholder="请输入流程名称"></el-input>
</el-form-item>
<el-form-item prop="preson">
<p class="formname">工作区域:</p>
<el-select
v-model="basic_form.workplace"
@change="changeWorkPlace"
placeholder="请选择工作区域"
>
<el-option v-for="item in workplace_list" :label="item" :value="item" :key="item"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="phone">
<p class="formname">流程描述:</p>
<el-input
type="textarea"
:autosize="{ minRows: 6, maxRows: 10}"
v-model="basic_form.desc"
placeholder="请输入流程描述"
></el-input>
</el-form-item>
</el-form>
<div class="btn_footer">
<el-button class="cancel" @click="cancel">取消</el-button>
<el-button class="next" @click="next">下一步</el-button>
</div>
</div>
</step>
<step
title="流程设计"
:step="1"
:active-icon="require('@/assets/imgs/progress_ic_liucheng.png')"
class="apaas_step"
>
<div class="step_in">
<WorkFlow ref="workFlow" class="work_flow" />
<div class="btn_footer">
<el-button class="cancel" @click="cancel">取消</el-button>
<div>
<el-button class="cancel" @click="back">上一步</el-button>
<el-button class="next" @click="complete">完成</el-button>
</div>
</div>
</div>
</step>
<step
title
step-title="完成"
:step="2"
:active-icon="require('@/assets/imgs/progress_ic_wancheng.png')"
class="apaas_step"
></step>
<template slot="action">
<el-button type="primary" @click="backToList">返回列表</el-button>
</template>
</steps>
</BlockRadius>
</div> </div>
</template> </template>
<script> <script>
import WorkFlow from "@/components/work-flow/super-flow"; import WorkFlow from "@/components/work-flow/super-flow";
import BlockRadius from "@/components/general/block-radius";
import Steps from "@/components/app-build-steps/app-build-steps";
import Step from "@/components/app-build-steps/app-build-step";
export default { export default {
components: { components: {
WorkFlow WorkFlow,
BlockRadius,
Steps,
Step,
},
data: () => {
return {
step: 0,
done: false,
basic_form: {
name: "",
workplace: "",
desc: "",
},
rules: {
name: [
{ required: true, message: "请输入流程名称", trigger: "blur" },
{ max: 16, message: "不能超过16个字符", trigger: "blur" },
],
workplace: [
{ required: true, message: "请选择工作区域", trigger: "blur" },
],
desc: [
{ required: true, message: "请输入流程描述", trigger: "blur" },
{ max: 400, message: "不能超过400个字符", trigger: "blur" },
],
},
workplace_list: [],
};
}, },
methods: { methods: {
getData() { verification() {
let self = this; let self = this;
let data = self.$refs.workFlow.getData(); let data = self.$refs.workFlow.getData();
console.log(data); console.log(data);
...@@ -23,7 +135,9 @@ export default { ...@@ -23,7 +135,9 @@ export default {
let end_id = ""; let end_id = "";
let start_before = 0; let start_before = 0;
let end_after = 0; let end_after = 0;
data.nodeList.forEach(item => { let in_edge = 0;
let out_edge = 0;
data.nodeList.forEach((item) => {
if (item.meta.type == 0) { if (item.meta.type == 0) {
start_num++; start_num++;
start_id = item.id; start_id = item.id;
...@@ -32,41 +146,118 @@ export default { ...@@ -32,41 +146,118 @@ export default {
end_num++; end_num++;
end_id = item.id; end_id = item.id;
} }
if (
data.linkList.findIndex((el) => {
return el.startId == item.id;
}) == -1 &&
item.id != end_id
) {
in_edge++;
} else if (
data.linkList.findIndex((el) => {
return el.endId == item.id;
}) == -1 &&
item.id != start_id
) {
out_edge++;
}
}); });
data.linkList.forEach(item => { data.linkList.forEach((item) => {
if (start_id == item.endId) { if (start_id == item.endId) {
start_before++; start_before++;
} }
if (end_id == item.startId) { if (end_id == item.startId) {
end_after++; end_after++;
} }
}); });
if (start_num != 1 || end_num != 1) { if (start_num != 1 || end_num != 1) {
this.$message({ this.$message({
message: "开始节点与结束节点均应有且只有一个", message: "开始节点与结束节点均应有且只有一个",
type: "warning" type: "warning",
}); });
} else if (start_before != 0) { } else if (start_before != 0) {
this.$message({ this.$message({
message: "开始节点前面不应连接其它节点", message: "开始节点前面不应连接其它节点",
type: "warning" type: "warning",
}); });
} else if (end_after != 0) { } else if (end_after != 0) {
this.$message({ this.$message({
message: "结束节点后面不应连接其它节点", message: "结束节点后面不应连接其它节点",
type: "warning" type: "warning",
});
} else if (in_edge != 0 || out_edge != 0) {
this.$message({
message: "请保证每个节点都被连接",
type: "warning",
}); });
} }
} },
} backToList() {
this.$router.push("/message/directed_push");
},
changeWorkPlace() {},
cancel() {
this.$router.go(-1);
},
next() {
this.step++;
},
back() {
this.step--;
},
complete() {
this.verification();
},
},
}; };
</script> </script>
<style scoped> <style scoped>
.design_contain { .design_contain {
width: 100%; width: 100%;
height: calc(100% - 20px);
padding: 0 20px; padding: 0 20px;
margin-bottom: 20px; }
.block_item {
height: calc(100% - 56px);
}
.step_in {
height: 100%;
}
.form_left {
width: 55%;
height: calc(100% - 70px);
}
.btn_footer {
width: calc(100% - 20px);
height: 40px;
padding: 0 10px;
display: flex;
justify-content: space-between;
}
.cancel {
background-color: #e3e5ef;
color: #0f2683;
}
.next {
background-color: #0f2683;
color: #f8f9fd;
}
.work_flow {
height: calc(100% - 70px);
}
</style>
<style>
.block_item .el-textarea__inner {
border-radius: 8px;
background-color: #e3e5ef;
border: solid 1px #e3e5ef;
}
.block_item .el-input__inner {
background-color: #e3e5ef;
border: solid 1px #e3e5ef;
}
.block_item .el-select {
width: 100%;
} }
</style> </style>
...@@ -231,15 +231,15 @@ export default { ...@@ -231,15 +231,15 @@ export default {
info: "" info: ""
}, },
{ {
title: "场景描述", title: "业务系统名称",
info: "" info: ""
}, },
{ {
title: "调用业务系统", title: "业务系统访问地址",
info: "" info: ""
}, },
{ {
title: "业务系统域名", title: "场景描述",
info: "" info: ""
}, },
{ {
...@@ -354,9 +354,9 @@ export default { ...@@ -354,9 +354,9 @@ export default {
this.$set(this.list_arr[0], "info", data.service_apply_info.apply_user_info.department_name); this.$set(this.list_arr[0], "info", data.service_apply_info.apply_user_info.department_name);
this.$set(this.list_arr[1], "info", data.service_apply_info.apply_user_info.user_name); this.$set(this.list_arr[1], "info", data.service_apply_info.apply_user_info.user_name);
this.$set(this.list_arr[2], "info", data.service_apply_info.apply_user_info.phone); this.$set(this.list_arr[2], "info", data.service_apply_info.apply_user_info.phone);
this.$set(this.list_arr[3], "info", data.descript); this.$set(this.list_arr[3], "info", data.service_apply_info.business_name);
this.$set(this.list_arr[4], "info", data.service_apply_info.business_name); this.$set(this.list_arr[4], "info", data.service_apply_info.business_url);
this.$set(this.list_arr[5], "info", data.service_apply_info.business_url); this.$set(this.list_arr[5], "info", data.descript);
this.$set(this.list_arr[6], "info", data.service_apply_info.apply_file.split('/')[data.service_apply_info.apply_file.split('/').length - 1]); this.$set(this.list_arr[6], "info", data.service_apply_info.apply_file.split('/')[data.service_apply_info.apply_file.split('/').length - 1]);
this.$set(this.list_arr[6], "url", data.service_apply_info.apply_file); this.$set(this.list_arr[6], "url", data.service_apply_info.apply_file);
this.$set(this.list_arr[8], "info", data.service_apply_info.duration+(data.service_apply_info.duration_unit==1?'':'')); this.$set(this.list_arr[8], "info", data.service_apply_info.duration+(data.service_apply_info.duration_unit==1?'':''));
......
<template> <template>
<div class="detail_contain"> <div class="detail_contain">
<p class="now_page_title"> <p class="now_page_title">
我的服务 / {{now_user==0||now_user==4?'注册发布的服务':now_user==1?'组织服务管理':'平台服务管理'}} / 我的服务 /
{{
now_user == 0 || now_user == 4
? "注册发布的服务"
: now_user == 1
? "组织服务管理"
: "平台服务管理"
}}
/
<span>服务详情</span> <span>服务详情</span>
</p> </p>
<div class="info_contain"> <div class="info_contain">
...@@ -16,28 +24,45 @@ ...@@ -16,28 +24,45 @@
:style=" :style="
now_service == index ? { borderBottom: '4px solid #f5ab4c' } : {} now_service == index ? { borderBottom: '4px solid #f5ab4c' } : {}
" "
>{{ item }}</div> >
{{ item }}
</div>
</div> </div>
<div class="type_box_select"> <div class="type_box_select">
<info-list <info-list
:list_arr="now_service == 0 ? list_arr : servicead_arr" :list_arr="now_service == 0 ? list_arr : servicead_arr"
v-if="now_service == 0 || now_service == 1" v-if="now_service == 0 || now_service == 1"
> >
<table-um :headers="header_arr" :datas="res_data" :stripe="true" slot="zd_table"></table-um> <table-um
<v-apaas-code :datas="code_arr" slot="zd_code"></v-apaas-code> :headers="req_header_arr"
:datas="req_data"
:stripe="true"
slot="req_table"
></table-um>
<v-apaas-code :datas="req_code_arr" slot="req_code"></v-apaas-code>
<table-um
:headers="res_header_arr"
:datas="res_data"
:stripe="true"
slot="res_table"
></table-um>
<v-apaas-code :datas="res_code_arr" slot="res_code"></v-apaas-code>
</info-list> </info-list>
<div v-show="now_service == 2"> <div v-show="now_service == 2">
<p class="service_title"> <p class="service_title"><span></span>服务运行概况</p>
<span></span>服务运行概况
</p>
<div class="service_title_card"> <div class="service_title_card">
<nor-card title="服务状态" class="service_card"> <nor-card title="服务状态" class="service_card">
<template> <template>
<div style="height:115px;padding-top:10px;"> <div style="height:115px;padding-top:10px;">
<waveIcon :state="yx_state.state" style="margin:10px auto;"></waveIcon> <waveIcon
:state="yx_state.state"
style="margin:10px auto;"
></waveIcon>
<p <p
style="color: #58617a;font-size: 16px;text-align:center;" style="color: #58617a;font-size: 16px;text-align:center;"
>{{ yx_state.state }}</p> >
{{ yx_state.state }}
</p>
</div> </div>
</template> </template>
</nor-card> </nor-card>
...@@ -59,7 +84,10 @@ ...@@ -59,7 +84,10 @@
</nor-card> </nor-card>
<nor-card title="资源使用" class="service_card"> <nor-card title="资源使用" class="service_card">
<template> <template>
<div style="height:115px;padding-top:30px;" class="service_num"> <div
style="height:115px;padding-top:30px;"
class="service_num"
>
<p>{{ yx_state.memory }}</p> <p>{{ yx_state.memory }}</p>
</div> </div>
</template> </template>
...@@ -68,10 +96,11 @@ ...@@ -68,10 +96,11 @@
<nor-card title="服务调用拓扑图" class="service_card_charts"> <nor-card title="服务调用拓扑图" class="service_card_charts">
<Topology :datas="datas" /> <Topology :datas="datas" />
</nor-card> </nor-card>
<p class="service_title"> <p class="service_title"><span></span>服务调用列表</p>
<span></span>服务调用列表 <table-um
</p> :headers="header_use_arr"
<table-um :headers="header_use_arr" :datas="service_use_arr"></table-um> :datas="service_use_arr"
></table-um>
<list-pagination <list-pagination
:total="listTotal" :total="listTotal"
:page-sizes="pageSizes" :page-sizes="pageSizes"
...@@ -83,19 +112,34 @@ ...@@ -83,19 +112,34 @@
</div> </div>
<div v-show="now_service == 3"> <div v-show="now_service == 3">
<p style="color: #8890a7;">服务规格:</p> <p style="color: #8890a7;">服务规格:</p>
<table-um :stripe="true" :headers="service_size_arr" :datas="service_size_data"></table-um> <table-um
:stripe="true"
:headers="service_size_arr"
:datas="service_size_data"
></table-um>
<p style="color: #8890a7;">购买方式:</p> <p style="color: #8890a7;">购买方式:</p>
<p style="color: #242c43;margin:10px 0px;"> <p style="color: #242c43;margin:10px 0px;">
{{ {{
buy_type == 1 buy_type == 1
? "按月购买" ? "按月购买"
: buy_type == 2 : buy_type == 2
? "按年购买" ? "按年购买"
: "按月购买&按年购买" : "按月购买&按年购买"
}} }}
</p> </p>
<div class="editbtn" v-if="now_user == 1" @click="sizeset_flag = true">编辑</div> <div
<p v-if="now_user == 1 && sizeset_flag" style="color: #8890a7;margin-bottom:10px;">规格设置:</p> class="editbtn"
v-if="now_user == 1"
@click="sizeset_flag = true"
>
编辑
</div>
<p
v-if="now_user == 1 && sizeset_flag"
style="color: #8890a7;margin-bottom:10px;"
>
规格设置:
</p>
<table-um <table-um
v-if="now_user == 1 && sizeset_flag" v-if="now_user == 1 && sizeset_flag"
:headers="edit_size_arr" :headers="edit_size_arr"
...@@ -108,17 +152,24 @@ ...@@ -108,17 +152,24 @@
:datas="service_size_data" :datas="service_size_data"
@changeTable="now_size_data" @changeTable="now_size_data"
></table-um> ></table-um>
<p v-if="now_user == 1 && sizeset_flag" style="color: #8890a7;margin:10px 0;">购买方式:</p> <p
v-if="now_user == 1 && sizeset_flag"
style="color: #8890a7;margin:10px 0;"
>
购买方式:
</p>
<el-button <el-button
v-if="now_user == 1 && sizeset_flag" v-if="now_user == 1 && sizeset_flag"
:type="buy_style.indexOf(1) !== -1 ? 'primary' : ''" :type="buy_style.indexOf(1) !== -1 ? 'primary' : ''"
@click="change_buy(1)" @click="change_buy(1)"
>按月购买</el-button> >按月购买</el-button
>
<el-button <el-button
v-if="now_user == 1 && sizeset_flag" v-if="now_user == 1 && sizeset_flag"
:type="buy_style.indexOf(2) !== -1 ? 'primary' : ''" :type="buy_style.indexOf(2) !== -1 ? 'primary' : ''"
@click="change_buy(2)" @click="change_buy(2)"
>按年购买</el-button> >按年购买</el-button
>
<div class="savebtn" v-if="now_user == 1 && sizeset_flag"> <div class="savebtn" v-if="now_user == 1 && sizeset_flag">
<el-button @click="change_service_size">保存</el-button> <el-button @click="change_service_size">保存</el-button>
<el-button @click="sizeset_flag = false">取消</el-button> <el-button @click="sizeset_flag = false">取消</el-button>
...@@ -153,7 +204,7 @@ export default { ...@@ -153,7 +204,7 @@ export default {
Topology, Topology,
serviceHeader, serviceHeader,
dialogAction, dialogAction,
ListPagination ListPagination,
}, },
data() { data() {
return { return {
...@@ -171,17 +222,83 @@ export default { ...@@ -171,17 +222,83 @@ export default {
maxTime: "", maxTime: "",
averageTraffic: "", averageTraffic: "",
maxTraffic: "", maxTraffic: "",
memory: "" memory: "",
}, },
service_use_arr: [], service_use_arr: [],
res_data: [], //响应参数 req_header_arr: [
{
prop: "name",
label: "字段编码",
minWidth: "20%",
align: "left",
},
{
prop: "label",
label: "字段名称",
minWidth: "20%",
align: "center",
},
{
prop: "show_type",
label: "字段类型",
width: "100px",
align: "center",
},
{
prop: "descript",
label: "字段说明",
minWidth: "30%",
align: "left",
},
{
prop: "is_must",
label: "是否必须",
width: "120px",
align: "center",
},
], // 请求参数-header
req_data: [], // 请求参数
req_code_arr: "", // 请求示例
res_header_arr: [
{
prop: "name",
label: "字段编码",
minWidth: "20%",
align: "left",
},
{
prop: "label",
label: "字段名称",
minWidth: "20%",
align: "center",
},
{
prop: "show_type",
label: "字段类型",
width: "100px",
align: "center",
},
{
prop: "descript",
label: "字段说明",
minWidth: "30%",
align: "left",
},
{
prop: "example",
label: "字段示例数值",
width: "120px",
align: "center",
},
], // 响应参数-header
res_data: [], // 响应参数
res_code_arr: "", // 响应示例
buy_type: "", buy_type: "",
sizeset_flag: false, //规格设置是否显示 sizeset_flag: false, //规格设置是否显示
code_arr: "",
service_arr: [ service_arr: [
["服务基本信息", "接口详细信息", "服务运行状态"], ["服务基本信息", "接口详细信息", "服务运行状态"],
["服务基本信息", "接口详细信息", "服务运行状态", "服务计费规则"], ["服务基本信息", "接口详细信息", "服务运行状态", "服务计费规则"],
["服务基本信息", "接口详细信息", "服务运行状态", "服务规格"] ["服务基本信息", "接口详细信息", "服务运行状态", "服务规格"],
], ],
service_size_data: [], //服务规格数组 service_size_data: [], //服务规格数组
service_header_arr: { service_header_arr: {
...@@ -192,121 +309,101 @@ export default { ...@@ -192,121 +309,101 @@ export default {
first: [ first: [
{ {
name: "服务类型", name: "服务类型",
text: "" text: "",
}, },
{ {
name: "申请次数", name: "申请次数",
text: "" text: "",
}, },
{ {
name: "调用次数", name: "调用次数",
text: "" text: "",
}, },
{ {
name: "服务状态", name: "服务状态",
text: "" text: "",
} },
], ],
second: [ second: [
{ {
name: "服务接口地址", name: "服务接口地址",
text: "" text: "",
} },
], ],
fixed: true, fixed: true,
fixedurl: this.$route.path.replace("servicedetail", "serviceedit") fixedurl: this.$route.path.replace("servicedetail", "serviceedit"),
}, },
now_service: 0, now_service: 0,
datas: {}, datas: {},
header_arr: [
{
prop: "name",
label: "字段编码",
minWidth: "20%",
align: "left"
},
{
prop: "label",
label: "字段名称",
minWidth: "20%",
align: "center"
},
{
prop: "show_type",
label: "字段类型",
width: "100px",
align: "center"
},
{
prop: "descript",
label: "字段说明",
minWidth: "30%",
align: "left"
},
{
prop: "example",
label: "字段示例数值",
width: "120px",
align: "left"
}
],
header_use_arr: [ header_use_arr: [
{ {
prop: "dydw", prop: "dydw",
label: "调用单位", label: "调用单位",
minWidth: "20%", minWidth: "20%",
align: "left" align: "left",
}, },
{ {
prop: "dyr", prop: "dyr",
label: "调用人", label: "调用人",
width: "100px", width: "100px",
align: "center" align: "center",
}, },
{ {
prop: "dyyw", prop: "dyyw",
label: "调用业务系统", label: "调用业务系统",
minWidth: "20%", minWidth: "20%",
align: "left" align: "left",
}, },
{ {
prop: "ywxt", prop: "ywxt",
label: "业务系统网址", label: "业务系统网址",
minWidth: "20%", minWidth: "20%",
align: "left" align: "left",
}, },
{ {
prop: "cjms", prop: "cjms",
label: "场景描述", label: "场景描述",
minWidth: "40%", minWidth: "40%",
align: "left" align: "left",
},
{
prop: "sqgg",
label: "申请规格",
minWidth: "40%",
align: "center",
},
{
prop: "sqsc",
label: "申请时长",
minWidth: "40%",
align: "center",
}, },
{ {
prop: "sqsj", prop: "sqsj",
label: "申请调用时间", label: "申请调用时间",
width: "160px", width: "160px",
align: "right" align: "right",
} },
], ],
service_size_arr: [ service_size_arr: [
{ {
prop: "count", prop: "count",
label: "访问次数(次/日)", label: "访问次数(次/日)",
minWidth: "33.33%", minWidth: "33.33%",
align: "center" align: "center",
}, },
{ {
prop: "pv", prop: "pv",
label: "访问量(PV/日)", label: "访问量(PV/日)",
minWidth: "33.33%", minWidth: "33.33%",
align: "center" align: "center",
}, },
{ {
prop: "des", prop: "des",
label: "规格说明", label: "规格说明",
minWidth: "33.33%", minWidth: "33.33%",
align: "left" align: "left",
} },
], ],
edit_size_arr: [ edit_size_arr: [
{ {
...@@ -314,21 +411,21 @@ export default { ...@@ -314,21 +411,21 @@ export default {
label: "访问次数(次/日)", label: "访问次数(次/日)",
minWidth: "33.33%", minWidth: "33.33%",
align: "center", align: "center",
type: "inputNumber" type: "inputNumber",
}, },
{ {
prop: "pv", prop: "pv",
label: "访问量(PV/日)", label: "访问量(PV/日)",
minWidth: "33.33%", minWidth: "33.33%",
align: "center", align: "center",
type: "inputNumber" type: "inputNumber",
}, },
{ {
prop: "des", prop: "des",
label: "规格说明", label: "规格说明",
minWidth: "33.33%", minWidth: "33.33%",
align: "left", align: "left",
type: "input" type: "input",
}, },
{ {
label: "操作", label: "操作",
...@@ -339,48 +436,52 @@ export default { ...@@ -339,48 +436,52 @@ export default {
{ {
type: "action-delete", type: "action-delete",
label: "删除", label: "删除",
local: true local: true,
} },
] ],
} },
], ],
size_arr_down: [], size_arr_down: [],
servicead_arr: [ servicead_arr: [
{ {
title: "请求方式:", title: "请求方式:",
info: "" info: "",
}, },
{ {
title: "请求参数:", title: "请求参数:",
info: "" info: "",
type: "solt",
solt_name: "req_table",
}, },
{ {
title: "请求示例:", title: "请求示例:",
info: "" info: "",
type: "solt",
solt_name: "req_code",
}, },
{ {
title: "编码格式:", title: "编码格式:",
info: "" info: "",
}, },
{ {
title: "响应参数:", title: "响应参数:",
info: "", info: "",
type: "solt", type: "solt",
solt_name: "zd_table" solt_name: "res_table",
}, },
{ {
title: "响应示例:", title: "响应示例:",
info: "", info: "",
type: "solt", type: "solt",
solt_name: "zd_code" solt_name: "res_code",
} },
], ],
service_type_arr: [ service_type_arr: [
"数据服务", "数据服务",
"时空服务", "时空服务",
"视频服务", "视频服务",
"感知服务", "感知服务",
"综合应用" "综合应用",
], ],
scrvice_area_arr: [ scrvice_area_arr: [
"经济建设", "经济建设",
...@@ -392,49 +493,49 @@ export default { ...@@ -392,49 +493,49 @@ export default {
"文化休闲", "文化休闲",
"社会团体", "社会团体",
"教育机构", "教育机构",
"其他" "其他",
], ],
open_arr: ["共享", "受限", "敏感"], open_arr: ["共享", "受限", "敏感"],
service_state_arr: ["已下架", "已上架", "审核中","审核中"], service_state_arr: ["已下架", "已上架", "审核中", "审核中"],
request_arr: ["GET", "POST", "PUT", "DELETE"], request_arr: ["GET", "POST", "PUT", "DELETE"],
list_arr: [ list_arr: [
{ {
title: "服务描述:", title: "服务描述:",
info: "" info: "",
}, },
{ {
title: "服务领域:", title: "服务领域:",
info: "" info: "",
}, },
{ {
title: "所属组织:", title: "所属组织:",
info: "" info: "",
}, },
{ {
title: "开放程度:", title: "开放程度:",
info: "" info: "",
}, },
{ {
title: "接口编码:", title: "接口编码:",
info: "" info: "",
}, },
{ {
title: "注册发布时间:", title: "注册发布时间:",
info: "" info: "",
} },
] ],
}; };
}, },
computed: { computed: {
...mapGetters(["level"]), ...mapGetters(["level"]),
...mapState(["userInfo"]) ...mapState(["userInfo"]),
}, },
watch: { watch: {
now_service(n, o) { now_service(n, o) {
if (n == 2) { if (n == 2) {
this.getData(); this.getData();
} }
} },
}, },
created() { created() {
if (this.userInfo) { if (this.userInfo) {
...@@ -463,18 +564,24 @@ export default { ...@@ -463,18 +564,24 @@ export default {
.get( .get(
`/apaas/service/v3/service/manager/service/applys?service_id=${this.$route.params.id}&page=${this.currentPage}&size=${this.pageSize}` `/apaas/service/v3/service/manager/service/applys?service_id=${this.$route.params.id}&page=${this.currentPage}&size=${this.pageSize}`
) )
.then(response => { .then((response) => {
console.log(response); console.log(response);
if (response.data.success) { if (response.data.success) {
this.listTotal = response.data.data.total; this.listTotal = response.data.data.total;
response.data.data.data.forEach(e => { let data = response.data.data.data || [];
data.forEach((e) => {
this.service_use_arr.push({ this.service_use_arr.push({
dydw: e.apply_org_name, dydw: e.apply_org_name,
dyr: e.apply_user_info.user_name, dyr: e.apply_user_info.user_name,
dyyw: e.business_name, dyyw: e.business_name,
ywxt: e.business_url, ywxt: e.business_url,
cjms: e.scene, cjms: e.scene,
sqsj: e.apply_time.split('+')[0].replace('T',' ') sqsj: e.apply_time.split("+")[0].replace("T", " "),
sqgg: e.request_spcs
? `访问次数:${e.request_spcs.count}/日 访问量:${e.request_spcs.pv}/日`
: "",
sqsc: e.duration + ["", "个月", ""][e.duration_unit || 0],
}); });
}); });
} }
...@@ -503,7 +610,7 @@ export default { ...@@ -503,7 +610,7 @@ export default {
}); });
}, },
getData() { getData() {
this.$api.workbench.getServiceTopology().then(response => { this.$api.workbench.getServiceTopology().then((response) => {
this.datas = response.data.elements; this.datas = response.data.elements;
}); });
}, },
...@@ -513,11 +620,15 @@ export default { ...@@ -513,11 +620,15 @@ export default {
"/apaas/service/v3/service/manager?service_id=" + "/apaas/service/v3/service/manager?service_id=" +
this.$route.params.id this.$route.params.id
) )
.then(response => { .then((response) => {
if (response.data.success === 1) { if (response.data.success === 1) {
let data = response.data.data; let data = response.data.data;
this.$set(this.service_header_arr, "portal_id", data.portal_id); // 时空服务id this.$set(this.service_header_arr, "portal_id", data.portal_id); // 时空服务id
this.$set(this.service_header_arr, "isMap", data.data_service_type1 === 6); this.$set(
this.service_header_arr,
"isMap",
data.data_service_type1 === 6
);
this.$set(this.service_header_arr, "name", data.name); this.$set(this.service_header_arr, "name", data.name);
this.$set( this.$set(
this.service_header_arr["first"][0], this.service_header_arr["first"][0],
...@@ -545,12 +656,8 @@ export default { ...@@ -545,12 +656,8 @@ export default {
data.req_url data.req_url
); );
this.$set(this.service_header_arr, "url", data.cover); this.$set(this.service_header_arr, "url", data.cover);
if(this.now_user==1){ if (this.now_user == 1) {
this.$set( this.$set(this.service_header_arr, "fixed", false);
this.service_header_arr,
"fixed",
false
);
} }
this.$set( this.$set(
this.service_header_arr, this.service_header_arr,
...@@ -567,20 +674,37 @@ export default { ...@@ -567,20 +674,37 @@ export default {
"info", "info",
data.create_time.replace("T", " ").split("+")[0] data.create_time.replace("T", " ").split("+")[0]
); );
// 接口详情信息
this.$set( this.$set(
this.servicead_arr[0], this.servicead_arr[0],
"info", "info",
this.request_arr[data.req_type - 1] this.request_arr[data.req_type - 1]
); ); // 请求方式
this.$set( this.req_data = JSON.parse(data.req_fields || data.req_query || "[]"); // 请求参数
this.servicead_arr[1], if (this.req_data.length === 0) {
"info", this.$set(this.servicead_arr[1], "type", "");
data.req_query ? data.req_query : "" this.$set(this.servicead_arr[1], "info", "无请求参数");
); }
this.$set(this.servicead_arr[2], "info", data.req_fields); this.req_code_arr = data.req_fields_example || data.req_query_example || ""; // 请求示例
this.$set(this.servicead_arr[3], "info", data.encode_method); if (!this.req_code_arr) {
this.code_arr = data.res_fields_example; this.$set(this.servicead_arr[2], "type", "");
this.res_data = JSON.parse(data.res_fields); this.$set(this.servicead_arr[2], "info", "无请求示例");
}
this.$set(this.servicead_arr[3], "info", data.encode_method); // 编码格式
this.res_data = JSON.parse(data.res_fields || "[]"); // 响应参数
if (this.res_data.length === 0) {
this.$set(this.servicead_arr[4], "type", "");
this.$set(this.servicead_arr[4], "info", "无响应参数");
}
this.res_code_arr = data.res_fields_example || ""; // 响应示例
if (!this.res_code_arr) {
this.$set(this.servicead_arr[5], "type", "");
this.$set(this.servicead_arr[5], "info", "无响应示例");
}
// 接口详情信息 end
this.service_size_data = data.request_spcs_info; this.service_size_data = data.request_spcs_info;
this.size_arr_down = data.request_spcs_info; this.size_arr_down = data.request_spcs_info;
this.buy_type = data.request_spcs_info[0].type; this.buy_type = data.request_spcs_info[0].type;
...@@ -592,7 +716,7 @@ export default { ...@@ -592,7 +716,7 @@ export default {
} else { } else {
this.$message({ this.$message({
message: response.data.errMsg, message: response.data.errMsg,
type: "warning" type: "warning",
}); });
} }
}) })
...@@ -608,7 +732,7 @@ export default { ...@@ -608,7 +732,7 @@ export default {
"/apaas/service/v3/service/manager/request/spcs/list?service_id=" + "/apaas/service/v3/service/manager/request/spcs/list?service_id=" +
this.$route.params.id this.$route.params.id
) )
.then(response => { .then((response) => {
let data = response.data.data; let data = response.data.data;
console.log(data); console.log(data);
this.service_size_data = data.data; this.service_size_data = data.data;
...@@ -623,7 +747,7 @@ export default { ...@@ -623,7 +747,7 @@ export default {
}, },
change_service_size() { change_service_size() {
let temp = []; let temp = [];
this.size_arr_down.forEach(e => { this.size_arr_down.forEach((e) => {
if (e.pv && e.count) { if (e.pv && e.count) {
if (e.flag) { if (e.flag) {
e.id = 0; e.id = 0;
...@@ -646,9 +770,9 @@ export default { ...@@ -646,9 +770,9 @@ export default {
this.$http this.$http
.post("/apaas/service/v3/service/manager/request/spcs/save", { .post("/apaas/service/v3/service/manager/request/spcs/save", {
service_id: parseInt(this.$route.params.id), service_id: parseInt(this.$route.params.id),
data: temp data: temp,
}) })
.then(response => { .then((response) => {
console.log(response); console.log(response);
if (response.data.success) { if (response.data.success) {
this.$message.success("保存成功"); this.$message.success("保存成功");
...@@ -665,7 +789,7 @@ export default { ...@@ -665,7 +789,7 @@ export default {
.get( .get(
`/apaas/istio/service/apaas-proxy/overview/apaas-proxy-${this.$route.params.id}` `/apaas/istio/service/apaas-proxy/overview/apaas-proxy-${this.$route.params.id}`
) )
.then(response => { .then((response) => {
if (response.data.success) { if (response.data.success) {
let data = response.data.data; let data = response.data.data;
this.yx_state = { this.yx_state = {
...@@ -674,22 +798,22 @@ export default { ...@@ -674,22 +798,22 @@ export default {
maxTime: data.respTime.max + "ms", maxTime: data.respTime.max + "ms",
averageTraffic: data.throughput.avg + "dps", averageTraffic: data.throughput.avg + "dps",
maxTraffic: data.throughput.max + "dps", maxTraffic: data.throughput.max + "dps",
memory: data.resource.memory + "MB" memory: data.resource.memory + "MB",
}; };
} }
}) })
.catch(response => { .catch((response) => {
this.yx_state = { this.yx_state = {
state: "停止", state: "停止",
averageTime: "0ms", averageTime: "0ms",
maxTime: "0ms", maxTime: "0ms",
averageTraffic: "0dps", averageTraffic: "0dps",
maxTraffic: "0dps", maxTraffic: "0dps",
memory: "0MB" memory: "0MB",
}; };
}); });
} },
} },
}; };
</script> </script>
...@@ -750,8 +874,8 @@ export default { ...@@ -750,8 +874,8 @@ export default {
padding: 30px 10px 10px 10px; padding: 30px 10px 10px 10px;
width: 100%; width: 100%;
} }
.type_box_select >>> .outlist .list p{ .type_box_select >>> .outlist .list p {
word-wrap:break-word; word-wrap: break-word;
} }
.service_title { .service_title {
font-size: 16px; font-size: 16px;
...@@ -801,6 +925,7 @@ export default { ...@@ -801,6 +925,7 @@ export default {
.service_card_charts { .service_card_charts {
width: 100%; width: 100%;
margin-top: 30px; margin-top: 30px;
margin-bottom: 30px;
} }
.editbtn { .editbtn {
width: 124px; width: 124px;
......
...@@ -355,10 +355,7 @@ ...@@ -355,10 +355,7 @@
</block-radius> </block-radius>
</div> </div>
<div style="display: none"> <div style="display: none">
<iframe <iframe id="listener" :src="addPortalItemUrl"></iframe>
id="listener"
:src="addPortalItemUrl"
></iframe>
</div> </div>
<apass-dialog <apass-dialog
ref="alertChange" ref="alertChange"
...@@ -388,7 +385,8 @@ export default { ...@@ -388,7 +385,8 @@ export default {
}, },
data() { data() {
return { return {
addPortalItemUrl: gisServiceUrl + '/portal/apaasplat/viewer/addPortalItem.html', addPortalItemUrl:
gisServiceUrl + "/portal/apaasplat/viewer/addPortalItem.html",
btnList: [], btnList: [],
activeBtn: null, activeBtn: null,
serviceUrl: "", serviceUrl: "",
...@@ -552,6 +550,7 @@ export default { ...@@ -552,6 +550,7 @@ export default {
}, },
is_portal: false, is_portal: false,
portal_id: "", portal_id: "",
dataType: "",
}; };
}, },
computed: {}, computed: {},
...@@ -687,12 +686,14 @@ export default { ...@@ -687,12 +686,14 @@ export default {
this.$api.workbench.fwzcFwcs(query).then((response) => { this.$api.workbench.fwzcFwcs(query).then((response) => {
if (response.data.success == 1) { if (response.data.success == 1) {
let data = response.data.data; let data = response.data.data;
this.body_fields = data.body_fields;
this.param_fields = data.param_fields;
if (data.body_fields && data.body_fields.length != 0) { if (data.body_fields && data.body_fields.length != 0) {
this.datasQqcs = data.body_fields; this.datasQqcs = data.body_fields;
this.param_fields = data.param_fields; this.dataType = "body";
} else { } else {
this.datasQqcs = data.param_fields; this.datasQqcs = data.param_fields;
this.body_fields = []; this.dataType = "param";
} }
this.datasFhcs = data.response_fields; this.datasFhcs = data.response_fields;
this.resSuccess = true; this.resSuccess = true;
...@@ -886,9 +887,13 @@ export default { ...@@ -886,9 +887,13 @@ export default {
method: this.select, method: this.select,
url: this.serviceUrl, url: this.serviceUrl,
request_fields: request_fields:
this.body_fields.length == 0 ? [] : this.request_fields, this.dataType == "body"
? this.request_fields
: this.body_fields,
request_query_fields: request_query_fields:
this.param_fields.length == 0 ? [] : this.request_fields, this.dataType == "param"
? this.request_fields
: this.param_fields,
response_fields: this.response_fields, response_fields: this.response_fields,
content_type: contentType, content_type: contentType,
portal_id: this.portal_id, portal_id: this.portal_id,
......
...@@ -998,7 +998,7 @@ export default { ...@@ -998,7 +998,7 @@ export default {
pic: require("@/assets/imgs/home_tool_ic_kshbb.png"), pic: require("@/assets/imgs/home_tool_ic_kshbb.png"),
bg: "#fff2e2", bg: "#fff2e2",
color: "#ea7d19", color: "#ea7d19",
url: "/bi", url: "/bi/",
target: 1 target: 1
}, },
{ {
......
...@@ -274,8 +274,8 @@ export default new Router({ ...@@ -274,8 +274,8 @@ export default new Router({
component: () => import("@/pages/workbench/component-center/process-management/monitoring/index"), component: () => import("@/pages/workbench/component-center/process-management/monitoring/index"),
}, // 流程监控 }, // 流程监控
{ {
path: "/progress/designs", path: "/progress/designer/design",
name: "process_designs", name: "process_design",
component: () => import("@/pages/workbench/component-center/process-management/process-design/index"), component: () => import("@/pages/workbench/component-center/process-management/process-design/index"),
}, // 流程设计 }, // 流程设计
], ],
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment