Commit ac438a4d authored by 张俊's avatar 张俊

流程服务感知服务

parent 45763fa1
......@@ -35,12 +35,27 @@ module.exports = {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
use:[
{
loader: 'thread-loader'
},
{
loader: 'vue-loader',
options: vueLoaderConfig
},
],
},
{
test: /\.js$/,
loader: 'babel-loader',
use:[
{
loader: 'thread-loader'
},
{
loader: 'babel-loader',
}
],
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
},
{
......
<template>
<div class="info_logo">
<div class="logo">
<img :src="data.url" alt="" style="width:100%;" />
<img :src="data.url" alt="" style="width:100%;" v-if="!data.isProcess" />
<workflows-view :zoom="0.4" :id="data.workflows_id" :hideDetail="true" v-if="data.isProcess"></workflows-view>
<map-view v-if="data.isMap" :id="data.portal_id"></map-view>
<process-view v-if="data.isProcess" :id="data.workflows_id"></process-view>
</div>
<div class="info">
<p class="info_title">
......@@ -122,10 +124,12 @@
<script>
import MapView from "./service-info/map-view";
import processView from '@/components/service-info/process-view'
import workflowsView from '@/components/work-flow/workflows-view'
export default {
props: ["data"],
components: { MapView },
components: { MapView,processView,workflowsView },
data() {
return {};
},
......
<template>
<div class="map_view">
<a class="map_view_action" href="#" @click.prevent.stop="viewAction">
<img :src="require('../../assets/imgs/ic_yulan.png')" />
</a>
<transition name="mask-bg-fade">
<el-dialog
class="map_view_dialog"
title="预览"
width="1200px"
:visible.sync="showDialog"
:before-close="beforeClose"
>
<div class="map_view_container">
<workflows-view :zoom="0.8" :id="id" :hideDetail="true"></workflows-view>
</div>
</el-dialog>
</transition>
</div>
</template>
<script>
import workflowsView from '@/components/work-flow/workflows-view'
export default {
name: "map-view",
components:{
workflowsView
},
data: () => ({
showDialog: false,
}),
props: {
id: {
type: Number,
required: true,
}
},
methods: {
viewAction() {
this.showDialog = true;
},
beforeClose(done) {
done();
},
},
};
</script>
<style scoped>
.map_view_action {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
padding: 10px 0 0 10px;
box-sizing: border-box;
border-top-left-radius: 40px;
background-color: #8f93a1;
}
.map_view_container {
height: 666px;
}
.map_view_container > iframe {
display: block;
width: 100%;
height: 100%;
}
</style>
<style>
.map_view_dialog .el-dialog {
overflow: hidden;
}
.map_view_dialog .el-dialog__header {
padding: 18px 20px 17px;
border-bottom: 1px solid #edf0ff;
text-align: left;
}
.map_view_dialog .el-dialog__body {
padding: 0;
}
</style>
......@@ -18,11 +18,13 @@
</div>
<div class="main_container">
<div class="main_container-left" v-if="data.cover">
<img :src="data.cover" width="100%" />
<img :src="data.cover" width="100%" v-if="data.type!=='workflow'" />
<workflows-view :zoom="0.6" :id="parseInt(data.workflows_id)" :hideDetail="true" v-if="data.type=='workflow'"></workflows-view>
<map-view
v-if="data.type === 'Map Service'"
:id="data.portal_id"
></map-view>
<process-view :id="parseInt(data.workflows_id)" v-if="data.type=='workflow'"></process-view>
</div>
<div class="main_container-right">
<ul class="service_base_info">
......@@ -123,10 +125,14 @@
<script>
import helper from "@/services/helper.js";
import MapView from "./map-view";
import workflowsView from '@/components/work-flow/workflows-view'
import processView from '@/components/service-info/process-view'
export default {
components: {
MapView,
workflowsView,
processView
},
props: {
data: {
......
<template>
<div class="workflows-view" ref="flowContainer">
<div class="workflows-view" ref="flowContainer" :style="{zoom:zoom,}">
<super-flow
ref="superFlow"
:node-list="nodeList"
......@@ -60,6 +60,10 @@ export default {
type: Boolean,
default: false,
},
zoom:{
type:Number,
default:1,
}
},
data() {
return {
......@@ -87,8 +91,8 @@ export default {
])
.then((response) => {
let data = response[0].data.data;
let nodeList = data.nodeList;
let linkList = data.linkList;
let nodeList = data.nodeList||[];
let linkList = data.linkList||[];
let nodes = response[1].data.data;
nodes.forEach((node) => {
......
<template>
<div class="sevice_detail">
<div class="apass_breadcrumb">
<el-breadcrumb separator="/">
<el-breadcrumb-item to="/shop">服务超市</el-breadcrumb-item>
<el-breadcrumb-item to="/shop/data_service_list/5">
数据服务
</el-breadcrumb-item>
<el-breadcrumb-item>服务详情信息</el-breadcrumb-item>
</el-breadcrumb>
</div>
<service-info :data="baseInfo" v-if="baseInfo"></service-info>
<service-tabs
:detail-data="detailData"
:specification-data="specificationData"
:provider-data="providerData"
:comments-data="commentsData"
:comments-url="commentsUrl"
></service-tabs>
</div>
</template>
<script>
import serviceInfo from "@/components/service-info/service-info";
import serviceTabs from "@/components/service-tabs/service-tabs";
export default {
components: {
serviceInfo,
serviceTabs,
},
data: () => ({
baseInfo: null,
detailData: null,
specificationData: null,
providerData: null,
commentsData: null,
}),
computed: {
id() {
return this.$route.params.id;
},
commentsUrl() {
return `/apaas/serviceapp/v3/servicemarket/estimates?serviceId=${this.id}`;
},
},
methods: {
init() {
this.$http
.get("/apaas/serviceapp/v3/servicemarket/detail", {
params: {
serviceId: this.id,
},
})
.then(({ data }) => {
let datas = data.data;
let specificationData =
(datas.serviceRequestSpcs &&
datas.serviceRequestSpcs.map((item) => ({
id: item.id,
type: item.type,
pv: item.pv,
count: item.count,
name: `访问次数:${item.pv}次/日 访问量:${item.count}次/日`,
descript: item.des,
}))) ||
[];
this.baseInfo = {
service_id: this.id,
app_id: 0,
name: datas.name,
// type: "",
openness: datas.openness,
view_count: datas.view_count,
apply_count: datas.apply_count,
cover: datas.cover,
organization_name: datas.organization_name,
create_time: datas.create_time,
update_date: datas.update_date,
sectors_name: datas.sectors_name,
data_service_type: [
datas.data_service_type1_name,
datas.data_service_type2_name,
datas.data_service_type3_name,
],
descript: datas.descript,
serviceRequestSpcs: specificationData,
};
this.detailData = [
{
name: "获取流程",
type: "step",
value: ["服务申请", "信息填写", "审核确认", "服务获取"],
},
{
name: "服务描述",
type: "text",
value: datas.descript,
},
{
name: "请求方式",
type: "text",
value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
},
{
name: "编码格式",
type: "text",
value: datas.encode_method,
},
{
name: "请求参数",
type: "table",
value: {
datas: this.getTableData(datas.req_fields),
columns: [
{
prop: "name",
label: "字段编码",
width: 240,
},
{
prop: "label",
label: "字段名称",
align: "center",
width: 180,
},
{
prop: "field_type",
label: "字段类型",
align: "center",
width: 180,
},
{
prop: "descript",
label: "字段说明",
},
{
prop: "is_must",
label: "是否必须",
align: "center",
width: 180,
},
{
prop: "example",
label: "示例值",
align: "center",
width: 180,
},
],
},
},
{
name: "响应参数",
type: "table",
value: {
datas: this.getTableData(datas.res_fields),
columns: [
{
prop: "name",
label: "字段编码",
width: 240,
},
{
prop: "label",
label: "字段名称",
align: "center",
width: 180,
},
{
prop: "field_type",
label: "字段类型",
align: "center",
width: 180,
},
{
prop: "descript",
label: "字段说明",
},
],
},
},
];
this.specificationData = specificationData;
this.providerData = {
organization_name: datas.organization_name,
picture_path: datas.organization_picture,
user_name: datas.register_user_info.user_name,
phone: datas.register_user_info.phone,
};
this.commentsData = datas.scoreDetail;
})
.catch(function(error) {
console.log(error);
});
},
getTableData(tableStr) {
let tabledata = (tableStr && JSON.parse(tableStr)) || [];
let addRowId = (data, baseId = "") => {
data.forEach((item, index) => {
let rowId = baseId + (index + 1) + "";
item.rowId = rowId;
if (item.children && item.children.length) {
addRowId(item.children, rowId);
}
});
};
addRowId(tabledata);
return tabledata;
},
},
mounted() {
this.init();
},
};
</script>
......@@ -72,6 +72,8 @@ export default {
service_id: this.id,
app_id: 0,
name: datas.name,
type:datas.data_service_type2_name=="流程类"?"workflow":"",
workflows_id:datas.data_service_type2_name=="流程类"?datas.workflows_id:"",
openness: datas.openness,
view_count: datas.view_count,
apply_count: datas.apply_count,
......
......@@ -122,6 +122,8 @@ export default {
service_header_arr:{
id: "",
isMap: false,
isProcess: true,
workflows_id:parseInt(this.$route.params.id),
name:'',
first:[],
second:[],
......
......@@ -19,7 +19,54 @@
>{{ item }}</div>
</div>
<div class="type_box_select">
<info-list :list_arr="process_in_up_arr" v-if="now_service == 1&&process_in_up">
<div slot="service_port" class="service_port">
<el-select v-model="port_select" placeholder="">
<el-option
v-for="item in port_options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<div class="port_bg_box" style="padding:20px;background-color:#f8f9fd;margin-top:10px;">
<info-list :list_arr="port_solt_arr">
<table-um
:headers="req_solt_header_arr"
:datas="req_solt_data"
:stripe="true"
slot="request_table"
></table-um>
<v-apaas-code :datas="req_solt_code_arr" slot="request_code" :readOnly="true"></v-apaas-code>
<table-um
:headers="res_solt_header_arr"
:datas="res_solt_data"
:stripe="true"
slot="response_table"
></table-um>
<v-apaas-code :datas="res_solt_code_arr" slot="response_code" :readOnly="true"></v-apaas-code>
</info-list>
</div>
</div>
</info-list>
<info-list :list_arr="perception_solt_arr" v-if="now_service == 1&&perception_in">
<table-um
:headers="perception_req_solt_header_arr"
:datas="perception_req_solt_data"
:stripe="true"
slot="request_table"
></table-um>
<v-apaas-code :datas="perception_req_solt_code_arr" slot="request_code" :readOnly="true"></v-apaas-code>
<table-um
:headers="perception_res_solt_header_arr"
:datas="perception_res_solt_data"
:stripe="true"
slot="response_table"
></table-um>
<v-apaas-code :datas="perception_res_solt_code_arr" slot="response_code" :readOnly="true"></v-apaas-code>
</info-list>
<info-list
v-else
:list_arr="
now_service == 0
? list_arr
......@@ -43,6 +90,8 @@
<v-apaas-code :datas="res_code_arr" slot="res_code" :readOnly="true"></v-apaas-code>
<process-card :data="use_approval_arr" slot="approval"></process-card>
</info-list>
</div>
</div>
</div>
......@@ -67,6 +116,256 @@ export default {
data() {
return {
use_approval_arr: [],
process_in_up:false,//是否是服务注册产生的
perception_in:false,//是否是感知服务
port_select:'',
req_solt_code_arr:'',
res_solt_code_arr:'',
perception_req_solt_code_arr:'',
perception_res_solt_code_arr:'',
req_solt_data:[],
res_solt_data:[],
perception_req_solt_data:[],
perception_res_solt_data:[],
req_solt_header_arr: [
{
prop: "name",
label: "字段编码",
align: "left",
width: 200,
},
{
prop: "label",
label: "字段名称",
align: "center",
width: 200,
},
{
prop: "show_type",
label: "字段类型",
align: "center",
width: 240,
},
{
prop: "descript",
label: "字段说明",
align: "left",
},
{
prop: "is_must",
label: "字段示例数值",
align: "center",
width: 240,
},
], // 请求参数-header
res_solt_header_arr: [
{
prop: "name",
label: "字段编码",
align: "left",
width: 200,
},
{
prop: "label",
label: "字段名称",
align: "center",
width: 200,
},
{
prop: "show_type",
label: "字段类型",
align: "center",
width: 240,
},
{
prop: "descript",
label: "字段说明",
align: "left",
},
{
prop: "is_must",
label: "字段示例数值",
align: "center",
width: 240,
},
],
perception_req_solt_header_arr: [
{
prop: "name",
label: "字段编码",
align: "left",
width: 200,
},
{
prop: "label",
label: "字段名称",
align: "center",
width: 200,
},
{
prop: "show_type",
label: "字段类型",
align: "center",
width: 240,
},
{
prop: "descript",
label: "字段说明",
align: "left",
},
{
prop: "is_must",
label: "是否必须",
align: "center",
},
{
prop: "is_must",
label: "字段示例数值",
align: "center",
width: 240,
},
],
perception_res_solt_header_arr: [
{
prop: "name",
label: "字段编码",
align: "left",
width: 200,
},
{
prop: "label",
label: "字段名称",
align: "center",
width: 200,
},
{
prop: "show_type",
label: "字段类型",
align: "center",
width: 240,
},
{
prop: "descript",
label: "字段说明",
align: "left",
},
{
prop: "is_must",
label: "是否必须",
align: "center",
},
{
prop: "is_must",
label: "字段示例数值",
align: "center",
width: 240,
},
],
port_options:[
{
label:'接口1',
value:'qweqweqsdfsdf',
able:true,
},
{
label:'接口2',
value:'qweqweqsdfsdfwer2w23',
able:false,
},
],
port_solt_arr:[
{
title: "服务地址:",
info: "12312312",
},
{
title: "请求方式:",
info: "12123",
},
{
title: "编码格式:",
info: "get",
},
{
title: "请求参数:",
info: "",
type: "solt",
solt_name: "request_table",
},
{
title: "请求示例:",
info: "",
type: "solt",
solt_name: "request_code",
},
{
title: "响应参数:",
info: "",
type: "solt",
solt_name: "response_table",
},
{
title: "响应示例:",
info: "",
type: "solt",
solt_name: "response_code",
},
],
perception_solt_arr:[
{
title: "接口文档:",
info: "接口文档示例.docx",
url: "11111",
type: "down",
},
{
title: "请求方式:",
info: "12123",
},
{
title: "编码格式:",
info: "get",
},
{
title: "请求参数:",
info: "",
type: "solt",
solt_name: "request_table",
},
{
title: "请求示例:",
info: "",
type: "solt",
solt_name: "request_code",
},
{
title: "响应参数:",
info: "",
type: "solt",
solt_name: "response_table",
},
{
title: "响应示例:",
info: "",
type: "solt",
solt_name: "response_code",
}
],
process_in_up_arr:[
{
title: "接口文档:",
info: "接口文档示例.docx",
url: "11111",
type: "down",
},
{
title: "服务接口:",
info: "",
type: "solt",
solt_name: "service_port",
}
],
approval_arr: [
{
title: "一级审批",
......@@ -189,6 +488,7 @@ export default {
service_header_arr: {
id: "",
isMap: false,
isProcess:false,
name: "",
first: [
{
......@@ -381,11 +681,17 @@ export default {
}
let data = response.data.data;
this.$set(this.service_header_arr, "portal_id", data.portal_id); // 时空服务id
this.$set(this.service_header_arr, "workflows_id", data.workflows_id); // 时空服务id
this.$set(
this.service_header_arr,
"isMap",
data.data_service_type1 === 6
);
this.$set(
this.service_header_arr,
"isProcess",
data.data_service_type2 === 24
);
this.$set(this.service_header_arr, "name", data.name);
this.$set(
this.service_header_arr["first"][0],
......@@ -425,6 +731,12 @@ export default {
);
this.$set(this.service_header_arr["second"][0], "text", data.req_url);
this.$set(this.service_header_arr, "url", data.cover);
if(this.process_in_up){
var temp_sj = this.service_header_arr.first.pop()
this.service_header_arr.second = []
this.service_header_arr.second.push(temp_sj)
}
this.$set(this.list_arr[0], "info", data.descript);
this.$set(this.list_arr[1], "info", data.data_service_type2_name);
this.$set(
......
......@@ -160,6 +160,7 @@ export default {
service_header_arr: {
id: "",
isMap: false,
isProcess: false,
name: "",
first: [
{
......@@ -340,7 +341,9 @@ export default {
}
let data = response.data.data;
this.$set(this.service_header_arr, "portal_id", data.portal_id); // 时空服务id
this.$set(this.service_header_arr, "workflows_id", data.workflows_id); // 时空服务id
this.$set(this.service_header_arr, "isMap", data.data_service_type1 === 6);
this.$set(this.service_header_arr, "isProcess", data.data_service_type2 === 24);
this.$set(this.service_header_arr, "name", data.name);
this.$set(this.service_header_arr['first'][0], 'text', data.data_service_type1_name);
this.$set(this.service_header_arr['first'][1], 'text', data.sectors_name);
......
This diff is collapsed.
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