Skip to content

A
apaas-ui
Commit 07975c81 authored by 张俊's avatar 张俊
Browse files
Options

新增表单验证

parent 3578680f
Show whitespace changes
Inline Side-by-side
Showing with 606 additions and 529 deletions
src/pages/serviceDetail.vue
View file @ 07975c81
<template> <template>
<div class="detail_contain"> <div class="detail_contain">
<p class="now_page_title">我的服务 / 注册发布的服务 / <span>服务详情</span></p> <p class="now_page_title">
我的服务 / 注册发布的服务 / <span>服务详情</span>
</p>
<div class="info_contain"> <div class="info_contain">
<service-header :data="service_header_arr"></service-header> <service-header :data="service_header_arr"></service-header>
<div class="type_box"> <div class="type_box">
<div class="type_title"> <div class="type_title">
<div v-for="(item,index) in service_arr[now_user]" :key="index+1000" class="type_select" @click="now_service=index" :style="now_service==index?{borderBottom: '4px solid #f5ab4c'}:{}">{{item}}</div> <div
v-for="(item, index) in service_arr[now_user]"
:key="index + 1000"
class="type_select"
@click="now_service = index"
:style="
now_service == index ? { borderBottom: '4px solid #f5ab4c' } : {}
"
>
{{ item }}
</div>
</div> </div>
<div class="type_box_select"> <div class="type_box_select">
<info-list :list_arr="now_service==0?list_arr:servicead_arr" v-if="now_service == 0||now_service == 1"> <info-list
<table-um :headers="header_arr" :url="responseParamUrl" :paginationShow="true" slot="zd_table"></table-um> :list_arr="now_service == 0 ? list_arr : servicead_arr"
v-if="now_service == 0 || now_service == 1"
>
<table-um
:headers="header_arr"
:url="responseParamUrl"
:paginationShow="true"
slot="zd_table"
></table-um>
<v-apaas-code :url="codeExampleUrl" slot="zd_code"></v-apaas-code> <v-apaas-code :url="codeExampleUrl" slot="zd_code"></v-apaas-code>
</info-list> </info-list>
<div v-show="now_service == 2"> <div v-show="now_service == 2">
...@@ -19,30 +39,37 @@ ...@@ -19,30 +39,37 @@
<template> <template>
<div style="height:115px;padding-top:10px;"> <div style="height:115px;padding-top:10px;">
<example-icon style="margin:10px auto;"></example-icon> <example-icon style="margin:10px auto;"></example-icon>
<p style="color: #58617a;font-size: 16px;text-align:center;">{{yx_state.state}}</p> <p
style="color: #58617a;font-size: 16px;text-align:center;"
>
{{ yx_state.state }}
</p>
</div> </div>
</template> </template>
</nor-card> </nor-card>
<nor-card title="平均响应时间" class="service_card"> <nor-card title="平均响应时间" class="service_card">
<template> <template>
<div style="height:115px;" class="service_num"> <div style="height:115px;" class="service_num">
<p>{{yx_state.averageTime}}</p> <p>{{ yx_state.averageTime }}</p>
<p>最大响应时间：{{yx_state.maxTime}}</p> <p>最大响应时间：{{ yx_state.maxTime }}</p>
</div> </div>
</template> </template>
</nor-card> </nor-card>
<nor-card title="吞吐率" class="service_card"> <nor-card title="吞吐率" class="service_card">
<template> <template>
<div style="height:115px;" class="service_num"> <div style="height:115px;" class="service_num">
<p>{{yx_state.averageTraffic}}</p> <p>{{ yx_state.averageTraffic }}</p>
<p>最大吞吐率：{{yx_state.maxTraffic}}</p> <p>最大吞吐率：{{ yx_state.maxTraffic }}</p>
</div> </div>
</template> </template>
</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
<p>{{yx_state.memory}}</p> style="height:115px;padding-top:30px;"
class="service_num"
>
<p>{{ yx_state.memory }}</p>
</div> </div>
</template> </template>
</nor-card> </nor-card>
...@@ -51,17 +78,27 @@ ...@@ -51,17 +78,27 @@
<Topology :datas="datas" /> <Topology :datas="datas" />
</nor-card> </nor-card>
<p class="service_title"><span></span>服务调用列表</p> <p class="service_title"><span></span>服务调用列表</p>
<table-um :headers="header_use_arr" url="params_use_arr" :paginationShow="true"></table-um> <table-um
:headers="header_use_arr"
url="params_use_arr"
:paginationShow="true"
></table-um>
</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" url="service_size_arr"></table-um> <table-um
:stripe="true"
:headers="service_size_arr"
url="service_size_arr"
></table-um>
<p style="color: #8890a7;">购买方式：</p> <p style="color: #8890a7;">购买方式：</p>
<p style="color: #242c43;margin:10px 0px;">按月购买&按年购买</p> <p style="color: #242c43;margin:10px 0px;">按月购买&按年购买</p>
<div class="editbtn" v-if="now_user==1">编辑</div> <div class="editbtn" v-if="now_user == 1">编辑</div>
<p v-if="now_user==1" style="color: #8890a7;margin-bottom:10px;">规格设置：</p> <p v-if="now_user == 1" style="color: #8890a7;margin-bottom:10px;">
规格设置：
</p>
<table-um <table-um
v-if="now_user==1" v-if="now_user == 1"
:headers="edit_size_arr" :headers="edit_size_arr"
headerCellClassName="th_pink" headerCellClassName="th_pink"
:border="true" :border="true"
...@@ -69,37 +106,48 @@ ...@@ -69,37 +106,48 @@
:couldNotEdit="false" :couldNotEdit="false"
:radius="true" :radius="true"
:isIndex="true" :isIndex="true"
url="service_size_arr"> url="service_size_arr"
>
</table-um> </table-um>
<p v-if="now_user==1" style="color: #8890a7;margin:10px 0;">购买方式：</p> <p v-if="now_user == 1" style="color: #8890a7;margin:10px 0;">
<el-button v-if="now_user==1" :type="buy_style==0?'primary':''" @click="buy_style=0">按月购买</el-button> 购买方式：
<el-button v-if="now_user==1" :type="buy_style==1?'primary':''" @click="buy_style=1">按年购买</el-button> </p>
<div class="savebtn" v-if="now_user==1"> <el-button
<el-button >保存</el-button> v-if="now_user == 1"
<el-button >取消</el-button> :type="buy_style == 0 ? 'primary' : ''"
@click="buy_style = 0"
>按月购买</el-button
>
<el-button
v-if="now_user == 1"
:type="buy_style == 1 ? 'primary' : ''"
@click="buy_style = 1"
>按年购买</el-button
>
<div class="savebtn" v-if="now_user == 1">
<el-button>保存</el-button>
<el-button>取消</el-button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<dialog-action <dialog-action ref="myConfirm"></dialog-action>
ref="myConfirm"
></dialog-action>
</div> </div>
</template> </template>
<script> <script>
import infoList from '../components/infoList' import infoList from "../components/infoList";
import tableUm from '../components/table-um' import tableUm from "../components/table-um";
import codes from "@/components/codes"; import codes from "@/components/codes";
import norCard from "@/components/card" import norCard from "@/components/card";
import exampleIcon from "@/pages/example_icon" import exampleIcon from "@/pages/example_icon";
import Topology from "@/components/topology.vue"; import Topology from "@/components/topology.vue";
import serviceHeader from '../components/service-header' import serviceHeader from "../components/service-header";
import dialogAction from "@/components/dialog-action"; import dialogAction from "@/components/dialog-action";
import { getRole } from "../utils/common"; import { getRole } from "../utils/common";
export default { export default {
components:{ components: {
infoList, infoList,
tableUm, tableUm,
"v-apaas-code": codes, "v-apaas-code": codes,
...@@ -112,257 +160,257 @@ export default { ...@@ -112,257 +160,257 @@ export default {
data() { data() {
return { return {
now_user: 0, //0：普通用户，1：组织管理员，2：超级管理员 now_user: 0, //0：普通用户，1：组织管理员，2：超级管理员
buy_style:0, buy_style: 0,
responseParamUrl:'', responseParamUrl: "",
codeExampleUrl:'', codeExampleUrl: "",
yx_state:{ yx_state: {
"state":"", state: "",
"averageTime":"", averageTime: "",
"maxTime":"", maxTime: "",
"averageTraffic":"", averageTraffic: "",
"maxTraffic":"", maxTraffic: "",
"memory":"" memory: "",
}, },
service_arr:[ service_arr: [
['服务基本信息','接口详细信息','服务运行状态'], ["服务基本信息", "接口详细信息", "服务运行状态"],
['服务基本信息','接口详细信息','服务运行状态','服务计费规则'], ["服务基本信息", "接口详细信息", "服务运行状态", "服务计费规则"],
['服务基本信息','接口详细信息','服务运行状态','服务规格'], ["服务基本信息", "接口详细信息", "服务运行状态", "服务规格"],
], ],
service_header_arr:{ service_header_arr: {
name:'', name: "",
first:[], first: [],
second:[], second: [],
fixed:true, fixed: true,
}, },
now_service:0, now_service: 0,
datas:{}, datas: {},
header_arr:[ header_arr: [
{ {
prop:'zdmc', prop: "zdmc",
label:'字段名称', label: "字段名称",
minWidth:'20%', minWidth: "20%",
align:'left', align: "left",
}, },
{ {
prop:'zdbm', prop: "zdbm",
label:'字段编码', label: "字段编码",
width:'100px', width: "100px",
align:'center', align: "center",
}, },
{ {
prop:'zdlx', prop: "zdlx",
label:'字段类型', label: "字段类型",
width:'100px', width: "100px",
align:'center', align: "center",
}, },
{ {
prop:'zdsm', prop: "zdsm",
label:'字段说明', label: "字段说明",
minWidth:'30%', minWidth: "30%",
align:'left', align: "left",
}, },
{ {
prop:'zdsl', prop: "zdsl",
label:'字段示例数值', label: "字段示例数值",
width:'120px', width: "120px",
align:'left', 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:'sqsj', prop: "sqsj",
label:'申请调用时间', label: "申请调用时间",
width:'160px', width: "160px",
align:'right', align: "right",
}, },
], ],
service_size_arr:[ service_size_arr: [
{ {
prop:'fwcs', prop: "fwcs",
label:'访问次数（次/日）', label: "访问次数（次/日）",
minWidth:'33.33%', minWidth: "33.33%",
align:'center', align: "center",
}, },
{ {
prop:'fwl', prop: "fwl",
label:'访问量（PV/日）', label: "访问量（PV/日）",
minWidth:'33.33%', minWidth: "33.33%",
align:'center', align: "center",
}, },
{ {
prop:'ggsm', prop: "ggsm",
label:'规格说明', label: "规格说明",
minWidth:'33.33%', minWidth: "33.33%",
align:'left', align: "left",
}, },
], ],
edit_size_arr:[ edit_size_arr: [
{ {
prop:'fwcs', prop: "fwcs",
label:'访问次数（次/日）', label: "访问次数（次/日）",
minWidth:'33.33%', minWidth: "33.33%",
align:'center', align: "center",
type:'select', type: "select",
selectArr:[ selectArr: [
{ {
label:10, label: 10,
value:10 value: 10,
}, },
{ {
label:20, label: 20,
value:20 value: 20,
}, },
{ {
label:30, label: 30,
value:30 value: 30,
}, },
{ {
label:40, label: 40,
value:40 value: 40,
}, },
{ {
label:50, label: 50,
value:50 value: 50,
}, },
{ {
label:60, label: 60,
value:60 value: 60,
}, },
{ {
label:70, label: 70,
value:70 value: 70,
}, },
{ {
label:80, label: 80,
value:80 value: 80,
}, },
{ {
label:90, label: 90,
value:90 value: 90,
}, },
{ {
label:100, label: 100,
value:100 value: 100,
}, },
{ {
label:200, label: 200,
value:200 value: 200,
}, },
{ {
label:300, label: 300,
value:300 value: 300,
}, },
{ {
label:400, label: 400,
value:400 value: 400,
}, },
{ {
label:500, label: 500,
value:500 value: 500,
}, },
] ],
}, },
{ {
prop:'fwl', prop: "fwl",
label:'访问量（PV/日）', label: "访问量（PV/日）",
minWidth:'33.33%', minWidth: "33.33%",
align:'center', align: "center",
type:'select', type: "select",
selectArr:[ selectArr: [
{ {
label:100, label: 100,
value:100 value: 100,
}, },
{ {
label:200, label: 200,
value:200 value: 200,
}, },
{ {
label:300, label: 300,
value:300 value: 300,
}, },
{ {
label:400, label: 400,
value:400 value: 400,
}, },
{ {
label:500, label: 500,
value:500 value: 500,
}, },
{ {
label:600, label: 600,
value:600 value: 600,
}, },
{ {
label:700, label: 700,
value:700 value: 700,
}, },
{ {
label:800, label: 800,
value:800 value: 800,
}, },
{ {
label:900, label: 900,
value:900 value: 900,
}, },
{ {
label:1000, label: 1000,
value:1000 value: 1000,
}, },
{ {
label:2000, label: 2000,
value:2000 value: 2000,
}, },
{ {
label:3000, label: 3000,
value:3000 value: 3000,
}, },
{ {
label:4000, label: 4000,
value:4000 value: 4000,
}, },
{ {
label:5000, label: 5000,
value:5000 value: 5000,
}, },
] ],
}, },
{ {
prop:'ggsm', prop: "ggsm",
label:'规格说明', label: "规格说明",
minWidth:'33.33%', minWidth: "33.33%",
align:'left', align: "left",
type: "input" type: "input",
}, },
{ {
label: "操作", label: "操作",
...@@ -373,196 +421,195 @@ export default { ...@@ -373,196 +421,195 @@ export default {
{ {
type: "action-delete", type: "action-delete",
label: "删除", label: "删除",
local:true local: true,
}, },
], ],
}, },
], ],
servicead_arr:[ servicead_arr: [
{ {
title:'请求方式：', title: "请求方式：",
info:'' info: "",
}, },
{ {
title:'请求参数：', title: "请求参数：",
info:'' info: "",
}, },
{ {
title:'请求示例：', title: "请求示例：",
info:'' info: "",
}, },
{ {
title:'编码格式：', title: "编码格式：",
info:'' info: "",
}, },
{ {
title:'响应参数：', title: "响应参数：",
info:'', info: "",
type:'solt', type: "solt",
solt_name:'zd_table' solt_name: "zd_table",
}, },
{ {
title:'响应示例：', title: "响应示例：",
info:'', info: "",
type:'solt', type: "solt",
solt_name:'zd_code' solt_name: "zd_code",
}, },
], ],
list_arr:[], list_arr: [],
} };
}, },
watch:{ watch: {
now_service(n,o){ now_service(n, o) {
if(n == 2){ if (n == 2) {
this.getData() this.getData();
}
} }
}, },
created(){ },
this.now_user = this.$store.state.role created() {
getRole().then(data => { this.now_user = this.$store.state.role;
getRole().then((data) => {
this.now_user = data; this.now_user = data;
this.$store.commit('rolefun',data) this.$store.commit("rolefun", data);
this.getServiceInfo() this.getServiceInfo();
this.getInterfaceInfo() this.getInterfaceInfo();
this.getServiceBaseInfo() this.getServiceBaseInfo();
this.getServiceyxztInfo() this.getServiceyxztInfo();
}); });
}, },
mounted(){ mounted() {},
methods: {
},
methods:{
getData() { getData() {
let url = "/static/antv.json"; let url = "/static/antv.json";
this.$http this.$http
.get(url) .get(url)
.then(response => { .then((response) => {
this.datas = response.data.elements; this.datas = response.data.elements;
}) })
.catch(function(response) { .catch(function(response) {});
});
}, },
getServiceInfo(){ getServiceInfo() {
this.$http this.$http
.get('/static/servicedetail1.json') .get("/static/servicedetail1.json")
.then(response => { .then((response) => {
let data = response.data.data let data = response.data.data;
this.$set(this.service_header_arr,'name',data.serviceInfo.name) this.$set(this.service_header_arr, "name", data.serviceInfo.name);
this.$set(this.service_header_arr,'first',data.serviceInfo.first) this.$set(this.service_header_arr, "first", data.serviceInfo.first);
this.$set(this.service_header_arr,'second',data.serviceInfo.second) this.$set(this.service_header_arr, "second", data.serviceInfo.second);
}) })
.catch(function(response) { .catch(function(response) {});
});
}, },
getInterfaceInfo(){ getInterfaceInfo() {
this.$http this.$http
.get('/static/servicedetail1.json') .get("/static/servicedetail1.json")
.then(response => { .then((response) => {
let data = response.data.data let data = response.data.data;
this.$set(this.servicead_arr[0],'info',data.serviceinterfaceinfo.type) this.$set(
this.$set(this.servicead_arr[1],'info',data.serviceinterfaceinfo.requestParam) this.servicead_arr[0],
this.$set(this.servicead_arr[2],'info',data.serviceinterfaceinfo.example) "info",
this.$set(this.servicead_arr[3],'info',data.serviceinterfaceinfo.format) data.serviceinterfaceinfo.type
this.responseParamUrl = data.serviceinterfaceinfo.responseParamUrl );
this.codeExampleUrl = data.serviceinterfaceinfo.codeExampleUrl this.$set(
this.servicead_arr[1],
"info",
data.serviceinterfaceinfo.requestParam
);
this.$set(
this.servicead_arr[2],
"info",
data.serviceinterfaceinfo.example
);
this.$set(
this.servicead_arr[3],
"info",
data.serviceinterfaceinfo.format
);
this.responseParamUrl = data.serviceinterfaceinfo.responseParamUrl;
this.codeExampleUrl = data.serviceinterfaceinfo.codeExampleUrl;
}) })
.catch(function(response) { .catch(function(response) {});
});
}, },
getServiceBaseInfo(){ getServiceBaseInfo() {
this.$http this.$http
.get('/static/servicedetail1.json') .get("/static/servicedetail1.json")
.then(response => { .then((response) => {
let data = response.data.data let data = response.data.data;
this.list_arr = data.servicebaseinfo this.list_arr = data.servicebaseinfo;
}) })
.catch(function(response) { .catch(function(response) {});
});
}, },
getServiceyxztInfo(){ getServiceyxztInfo() {
this.$http this.$http
.get('/static/servicedetail1.json') .get("/static/servicedetail1.json")
.then(response => { .then((response) => {
console.log(response); console.log(response);
let data = response.data.data let data = response.data.data;
this.yx_state = data.serviceyxzt this.yx_state = data.serviceyxzt;
}) })
.catch(function(response) { .catch(function(response) {});
},
});
}, },
}
}; };
</script> </script>
<style> <style>
.savebtn .el-button{ .savebtn .el-button {
float: right; float: right;
margin-left: 20px; margin-left: 20px;
letter-spacing: 2px; letter-spacing: 2px;
} }
.savebtn .el-button:nth-of-type(1){ .savebtn .el-button:nth-of-type(1) {
background-color: #0f2683; background-color: #0f2683;
color: #f8f9fd; color: #f8f9fd;
} }
.savebtn .el-button:nth-of-type(2){ .savebtn .el-button:nth-of-type(2) {
background-color: #c3caf8; background-color: #c3caf8;
color: #0f2683; color: #0f2683;
} }
</style> </style>
<style scoped> <style scoped>
.detail_contain{ .detail_contain {
width: 100%; width: 100%;
padding: 0 20px; padding: 0 20px;
height: calc(100% - 55px); height: calc(100% - 55px);
} }
.info_contain{ .info_contain {
padding: 25px 20px; padding: 25px 20px;
background-color: #fff; background-color: #fff;
width: 100%; width: 100%;
box-shadow: 0px 3px 6px 0px box-shadow: 0px 3px 6px 0px #f4f7fc;
#f4f7fc;
border-radius: 12px; border-radius: 12px;
min-height: calc(100% - 20px); min-height: calc(100% - 20px);
margin-bottom: 20px; margin-bottom: 20px;
} }
.now_page_title{ .now_page_title {
margin: 15px 0; margin: 15px 0;
color: #898d9e; color: #898d9e;
} }
.now_page_title span{ .now_page_title span {
color: #242c43; color: #242c43;
} }
.type_box{ .type_box {
width: 100%; width: 100%;
} }
.type_title{ .type_title {
width: 100%; width: 100%;
height: 65px; height: 65px;
line-height: 65px; line-height: 65px;
border-bottom: 2px solid #f4f7fc; border-bottom: 2px solid #f4f7fc;
} }
.type_select{ .type_select {
float: left; float: left;
width: auto; width: auto;
margin-right: 40px; margin-right: 40px;
height: 65px; height: 65px;
cursor: pointer; cursor: pointer;
} }
.type_box_select{ .type_box_select {
padding: 30px 10px 10px 10px; padding: 30px 10px 10px 10px;
width: 100%; width: 100%;
} }
.service_title{ .service_title {
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
color: #58617a; color: #58617a;
...@@ -572,7 +619,7 @@ export default { ...@@ -572,7 +619,7 @@ export default {
margin-top: -10px; margin-top: -10px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.service_title span{ .service_title span {
display: inline-block; display: inline-block;
width: 4px; width: 4px;
height: 16px; height: 16px;
...@@ -582,36 +629,36 @@ export default { ...@@ -582,36 +629,36 @@ export default {
margin-top: 13px; margin-top: 13px;
margin-right: 15px; margin-right: 15px;
} }
.service_title_card{ .service_title_card {
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
} }
.service_card{ .service_card {
width: calc((100% - 120px)/4); width: calc((100% - 120px) / 4);
margin-right: 40px; margin-right: 40px;
float: left; float: left;
} }
.service_title_card .service_card:nth-last-of-type(1){ .service_title_card .service_card:nth-last-of-type(1) {
margin-right: 0px; margin-right: 0px;
} }
.service_num{ .service_num {
text-align: center; text-align: center;
padding-top: 10px; padding-top: 10px;
} }
.service_num p:nth-of-type(1){ .service_num p:nth-of-type(1) {
font-size: 36px; font-size: 36px;
color: #3f4f9c; color: #3f4f9c;
margin-bottom: 10px; margin-bottom: 10px;
} }
.service_num p:nth-of-type(2){ .service_num p:nth-of-type(2) {
font-size: 16px; font-size: 16px;
color: #58617a; color: #58617a;
} }
.service_card_charts{ .service_card_charts {
width: 100%; width: 100%;
margin-top: 30px; margin-top: 30px;
} }
.editbtn{ .editbtn {
width: 124px; width: 124px;
height: 44px; height: 44px;
line-height: 44px; line-height: 44px;
...@@ -623,9 +670,8 @@ export default { ...@@ -623,9 +670,8 @@ export default {
cursor: pointer; cursor: pointer;
margin-bottom: 30px; margin-bottom: 30px;
} }
.savebtn{ .savebtn {
margin-top: 50px; margin-top: 50px;
overflow: hidden; overflow: hidden;
} }
</style> </style>
src/pages/serviceEdit.vue
View file @ 07975c81
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<img v-if="now_edit!==1" src="../assets/imgs/nav_ic_anquan_nor.png" alt=""> 服务安全设置</div> <img v-if="now_edit!==1" src="../assets/imgs/nav_ic_anquan_nor.png" alt=""> 服务安全设置</div>
</div> </div>
<el-form ref="form" :rules="rules" :model="form" label-width="0px" v-if="now_edit==0"> <el-form ref="form" :rules="rules" :model="form" label-width="0px" v-if="now_edit==0">
<el-form-item> <el-form-item prop="name">
<p class="formname">服务名称：</p> <p class="formname">服务名称：</p>
<el-input v-model="form.name"></el-input> <el-input v-model="form.name"></el-input>
</el-form-item> </el-form-item>
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<p class="formname">服务描述：</p> <p class="formname">服务描述：</p>
<el-input type="textarea" v-model="form.desc"></el-input> <el-input type="textarea" v-model="form.desc"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item prop="area">
<p class="formname">服务领域：</p> <p class="formname">服务领域：</p>
<el-select v-model="form.area" placeholder="请选择"> <el-select v-model="form.area" placeholder="请选择">
<el-option <el-option
...@@ -33,7 +33,12 @@ ...@@ -33,7 +33,12 @@
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="now_user==0"> <el-form-item v-if="now_user==0"
prop="origin"
:rules="[
{ required: true, message: '请选择所属组织', trigger: 'change' },
]"
>
<p class="formname">所属组织：</p> <p class="formname">所属组织：</p>
<el-select v-model="form.origin" placeholder="请选择"> <el-select v-model="form.origin" placeholder="请选择">
<el-option <el-option
...@@ -58,19 +63,25 @@ ...@@ -58,19 +63,25 @@
></upload-file> ></upload-file>
<span class="removepic" v-if="now_user==2" @click="removepic">更换封面</span> <span class="removepic" v-if="now_user==2" @click="removepic">更换封面</span>
</el-form-item> </el-form-item>
<el-form-item v-if="now_user==0"> <el-form-item v-if="now_user==0" prop="code" :rules="[
{ required: true, message: '请输入接口编码', trigger: 'blur' },
]">
<p class="formname">接口编码：</p> <p class="formname">接口编码：</p>
<el-input v-model="form.code"></el-input> <el-input v-model="form.code"></el-input>
</el-form-item> </el-form-item>
<el-form-item v-if="now_user==2"> <el-form-item v-if="now_user==2" prop="people" :rules="[
{ required: true, message: '请输入发布人', trigger: 'blur' },
]">
<p class="formname">发布人：</p> <p class="formname">发布人：</p>
<el-input v-model="form.people"></el-input> <el-input v-model="form.people"></el-input>
</el-form-item> </el-form-item>
<el-form-item v-if="now_user==2"> <el-form-item v-if="now_user==2" prop="phone" :rules="[
{ required: true, message: '请输入联系方式', trigger: 'blur' },
]">
<p class="formname">联系方式：</p> <p class="formname">联系方式：</p>
<el-input v-model="form.phone"></el-input> <el-input v-model="form.phone"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item prop="resource">
<p class="formname">开放程度：</p> <p class="formname">开放程度：</p>
<el-radio-group v-model="form.resource"> <el-radio-group v-model="form.resource">
<el-radio label="共享"></el-radio> <el-radio label="共享"></el-radio>
...@@ -80,7 +91,7 @@ ...@@ -80,7 +91,7 @@
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit" class="right">保存</el-button> <el-button type="primary" @click="onSubmit('form')" class="right">保存</el-button>
<el-button class="right">取消</el-button> <el-button class="right">取消</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -233,9 +244,20 @@ export default { ...@@ -233,9 +244,20 @@ export default {
], ],
origin_arr:[], origin_arr:[],
rules:{ rules:{
name:[
{ required: true, message: '请输入服务名称', trigger: 'blur' },
],
desc:[ desc:[
{ required: true, message: '请输入服务描述', trigger: 'blur' },
{ max: 200, message: '长度小于200个字符', trigger: 'blur' } { max: 200, message: '长度小于200个字符', trigger: 'blur' }
] ],
area:[
{ required: true, message: '请选择服务领域', trigger: 'change' },
],
resource:[
{ required: true, message: '请选择开放程度', trigger: 'change' },
],
} }
}; };
}, },
...@@ -267,6 +289,7 @@ export default { ...@@ -267,6 +289,7 @@ export default {
}, },
saveInfo(){ saveInfo(){
console.log('2222'); console.log('2222');
}, },
openstart(){ openstart(){
this.open = !this.open this.open = !this.open
...@@ -280,8 +303,16 @@ export default { ...@@ -280,8 +303,16 @@ export default {
removepic(){ removepic(){
this.$refs.servicepic.handleRemove() this.$refs.servicepic.handleRemove()
}, },
onSubmit() { onSubmit(formName) {
console.log('submit!'); console.log('submit!');
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
}, },
getNewList(val) { getNewList(val) {
console.log(val); console.log(val);
......
src/pages/workPlace.vue
View file @ 07975c81
...@@ -168,7 +168,7 @@ ...@@ -168,7 +168,7 @@
> >
{{now_user == 0?'我的服务':'服务管理'}} {{now_user == 0?'我的服务':'服务管理'}}
<img <img
style="vertical-align:-9px;" style="vertical-align:-9px;cursor: pointer;"
src="../assets/imgs/home_btn_enter.png" src="../assets/imgs/home_btn_enter.png"
@click="gotofw()" @click="gotofw()"
alt alt
......
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