diff --git a/src/components/servive-info.vue b/src/components/servive-info.vue
index be7454e0e8cac307ad660345dfdfdd96dc51b631..9ddbfd486da05db23fa8ce23cd36c78663c52168 100644
--- a/src/components/servive-info.vue
+++ b/src/components/servive-info.vue
@@ -1,8 +1,8 @@
 <template>
   <el-tabs
+    class="service_info_tab"
+    type="border-card"
     v-model="serviceTabsActiveName"
-    type="card"
-    @tab-click="handleClick"
     :stretch="true"
     style="margin-top: 20px;"
   >
@@ -545,22 +545,21 @@ export default {
       ],
     }, // 服务评价信息
   }),
-  methods: {
-    handleClick(tab, event) {
-      console.log(tab, event);
-    },
-  },
+  methods: {},
   mounted() {},
 };
 </script>
 
 <style scoped>
+.service_info_tab {
+  width: 70%;
+  margin: 0 auto;
+}
 .service_info {
-  width: 80%;
+  min-height: 500px;
   padding: 10px 20px;
-  margin: 0 auto;
   box-sizing: border-box;
-  background-color: #eee;
+  /* background-color: #eee; */
 }
 .service_info .fwxqxx_item {
   margin-bottom: 20px;
diff --git a/src/pages/fwgl.vue b/src/pages/fwgl.vue
index 7d72508ef57f4efffda28a9ac784a1733c92b3dd..bd9d0434598a7a45f0b8bb2e5e8032f12a93a5a6 100644
--- a/src/pages/fwgl.vue
+++ b/src/pages/fwgl.vue
@@ -1,6 +1,9 @@
 <template>
   <div class="fwgl_container">
-    <side-nav-bar :nav-list="navList" :title-path="navList[0].path"></side-nav-bar>
+    <side-nav-bar
+      :nav-list="navList"
+      :title-path="navList[0] && navList[0].path"
+    ></side-nav-bar>
     <div class="main_container">
       <router-view
         :key="'type_' + $route.params && $route.params.type"
@@ -18,66 +21,75 @@ export default {
   },
   data: () => ({
     navList: [],
-    userLevel: 0,
   }),
-  mounted() {
-    this.navList = [
+  watch: {
+    "$route.fullPath"(path) {
+      this.initNavList();
+    },
+  },
+  methods: {
+    initNavList() {
+      let level = parseInt(this.$route.params.level);
+
       // 普通用户
-      {
-        level: 0,
-        name: "注册发布的服务",
-        path: "/fwgl/list/0/注册发布的服务",
-      },
-      {
-        level: 0,
-        name: "申请的服务",
-        path: "/fwgl/list/1/申请的服务",
-      },
-      {
-        level: 0,
-        name: "审批的服务",
-        path: "/fwgl/list/2/审批的服务",
-      },
-      {
-        level: 0,
-        name: "云资源服务",
-        path: "/fwgl/list/3/云资源服务",
-      },
+      if (level == 0) {
+        this.navList = [
+          {
+            name: "注册发布的服务",
+            path: `/fwgl/list/${level}/0`,
+          },
+          {
+            name: "申请的服务",
+            path: `/fwgl/list/${level}/1`,
+          },
+          {
+            name: "审批的服务",
+            path: `/fwgl/list/${level}/2`,
+          },
+          {
+            name: "云资源服务",
+            path: `/fwgl/list/${level}/3`,
+          },
+        ];
+      }
       // 组织管理员
-      {
-        level: 1,
-        name: "组织服务管理",
-        path: "/fwgl/list/4/组织服务管理",
-      },
-      {
-        level: 1,
-        name: "服务审批管理",
-        path: "/fwgl/list/5/服务审批管理",
-      },
-      {
-        level: 1,
-        name: "云资源管理",
-        path: "/fwgl/list/6/云资源管理",
-      },
+      else if (level == 1) {
+        this.navList = [
+          {
+            name: "组织服务管理",
+            path: `/fwgl/list/${level}/0`,
+          },
+          {
+            name: "服务审批管理",
+            path: `/fwgl/list/${level}/1`,
+          },
+          {
+            name: "云资源管理",
+            path: `/fwgl/list/${level}/2`,
+          },
+        ];
+      }
       // 超级管理员
-      {
-        level: 2,
-        name: "平台服务管理",
-        path: "/fwgl/list/7/平台服务管理",
-      },
-      {
-        level: 2,
-        name: "服务审批管理",
-        path: "/fwgl/list/8/服务审批管理",
-      },
-      {
-        level: 2,
-        name: "云资源管理",
-        path: "/fwgl/list/9/云资源管理",
-      },
-    ].filter((nav) => nav.level === this.userLevel);
-
-    this.$router.push(this.navList[0].path);
+      else if (level == 2) {
+        this.navList = [
+          {
+            name: "平台服务管理",
+            path: `/fwgl/list/${level}/0`,
+          },
+          {
+            name: "服务审批管理",
+            path: `/fwgl/list/${level}/1`,
+          },
+          {
+            name: "云资源管理",
+            path: `/fwgl/list/${level}/2`,
+          },
+        ];
+      }
+    },
+  },
+  mounted() {
+    this.initNavList();
   },
 };
 </script>
diff --git a/src/pages/fwglList.vue b/src/pages/fwglList.vue
index fe95a6baaf18ab7d2a8c567c885e7c89059a9939..b15ccbe62700720fc952669abcd2f697ad2558a2 100644
--- a/src/pages/fwglList.vue
+++ b/src/pages/fwglList.vue
@@ -9,7 +9,7 @@
         class="r_yhgl_table"
         size="mini"
         url="tableData"
-        detailsUrl="/fwgl/servicedetail/"
+        :detailsUrl="`/fwgl/servicedetail/${$route.params.level}/`"
         :border="false"
         :headers="headers"
         :searchShow="true"
@@ -104,7 +104,7 @@ export default {
       this.$refs.myConfirm.showModel();
     },
     editItem(item) {
-      this.$router.push("/fwgl/serviceedit/" + item.id);
+      this.$router.push(`/fwgl/serviceedit/${this.$route.params.level}/${item.id}`);
     },
     soldOutItem(item) {
       this.confirmOptions.title = "是否删除该条服务？";
@@ -132,161 +132,158 @@ export default {
     },
   },
   mounted() {
-    switch (parseInt(this.$route.params.type)) {
-      case 0:
-        this.headers = [
-          { label: "服务名称", prop: "name", type: "href", align: "left" },
-          { label: "服务url", prop: "date", type: "", align: "center" },
-          { label: "开放程度", prop: "address", type: "", align: "center" },
-          { label: "服务描述", prop: "address", type: "", align: "left" },
-          {
-            label: "注册发布时间",
-            prop: "address",
-            type: "",
-            align: "center",
-          },
-          { label: "服务类型", prop: "address", type: "", align: "center" },
-          {
-            label: "操作",
-            type: "Button",
-            align: "center",
-            width: 240,
-            btnList: [
-              {
-                type: "action-edit",
-                label: "编辑",
-                line: "|",
-              },
-              {
-                type: "action-sold-out",
-                label: "申请下架",
-                line: "|",
-              },
-              {
-                type: "action-delete",
-                label: "删除",
-              },
-            ],
-          },
-        ];
-        break;
-      case 1:
-        this.headers = [
-          { label: "服务名称", prop: "name", type: "href", align: "left" },
-          { label: "服务领域", prop: "date", type: "", align: "center" },
-          { label: "开放程度", prop: "address", type: "", align: "center" },
-          { label: "服务描述", prop: "address", type: "", align: "left" },
-          { label: "申请时间", prop: "address", type: "", align: "left" },
-          { label: "服务类型", prop: "address", type: "", align: "center" },
-          {
-            label: "操作",
-            type: "Button",
-            align: "center",
-            width: 160,
-            btnList: [
-              {
-                type: "action-cancel",
-                label: "取消",
-                line: "|",
-              },
-              {
-                type: "action-delete",
-                label: "删除",
-              },
-            ],
-          },
-        ];
-        break;
-      case 2:
-        this.headers = [
-          { label: "服务名称", prop: "name", type: "href", align: "left" },
-          { label: "服务领域", prop: "address", type: "", align: "center" },
-          { label: "开放程度", prop: "address", type: "", align: "center" },
-          { label: "请求方式", prop: "address", type: "", align: "center" },
-          { label: "服务描述", prop: "address", type: "", align: "left" },
-          { label: "审批时间", prop: "address", type: "", align: "center" },
-          { label: "服务类型", prop: "address", type: "", align: "center" },
-          { label: "审批状态", prop: "address", type: "", align: "center" },
-          {
-            label: "操作",
-            type: "Button",
-            align: "center",
-            width: 160,
-            btnList: [
-              {
-                type: "action-examine",
-                label: "审批",
-                line: "|",
-              },
-              {
-                type: "action-delete",
-                label: "删除",
-              },
-            ],
-          },
-        ];
-        break;
-      case 3:
-        this.headers = [
-          { label: "工作区域", prop: "name", type: "href", align: "left" },
-          { label: "网络环境", prop: "name", type: "", align: "center" },
-          { label: "CPU（核）", prop: "name", type: "", align: "center" },
-          { label: "内存（GB）", prop: "name", type: "", align: "center" },
-          { label: "资源总量（GB）", prop: "name", type: "", align: "center" },
-          { label: "实例数（个）", prop: "name", type: "", align: "center" },
-          { label: "申请时间", prop: "name", type: "", align: "center" },
-          { label: "申请状态", prop: "name", type: "", align: "center" },
-          {
-            label: "操作",
-            type: "Button",
-            align: "center",
-            width: 160,
-            btnList: [
-              {
-                type: "action-detail",
-                label: "查看详情",
-              },
-            ],
-          },
-        ];
-        break;
-      default:
-        this.headers = [
-          { label: "服务名称", prop: "name", type: "href", align: "left" },
-          { label: "服务url", prop: "date", type: "", align: "center" },
-          { label: "开放程度", prop: "address", type: "", align: "center" },
-          { label: "服务描述", prop: "address", type: "", align: "left" },
-          {
-            label: "注册发布时间",
-            prop: "address",
-            type: "",
-            align: "center",
-          },
-          { label: "服务类型", prop: "address", type: "", align: "center" },
-          {
-            label: "操作",
-            type: "Button",
-            align: "center",
-            width: 160,
-            btnList: [
-              {
-                type: "action-edit",
-                label: "编辑",
-                line: "|",
-              },
-              {
-                type: "action-sold-out",
-                label: "申请下架",
-                line: "|",
-              },
-              {
-                type: "action-delete",
-                label: "删除",
-              },
-            ],
-          },
-        ];
-        break;
+    let level = parseInt(this.$route.params.level);
+    let type = parseInt(this.$route.params.type);
+
+    if (level == 0 && type == 0) {
+      this.headers = [
+        { label: "服务名称", prop: "name", type: "href", align: "left" },
+        { label: "服务url", prop: "date", type: "", align: "center" },
+        { label: "开放程度", prop: "address", type: "", align: "center" },
+        { label: "服务描述", prop: "address", type: "", align: "left" },
+        {
+          label: "注册发布时间",
+          prop: "address",
+          type: "",
+          align: "center",
+        },
+        { label: "服务类型", prop: "address", type: "", align: "center" },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          width: 240,
+          btnList: [
+            {
+              type: "action-edit",
+              label: "编辑",
+              line: "|",
+            },
+            {
+              type: "action-sold-out",
+              label: "申请下架",
+              line: "|",
+            },
+            {
+              type: "action-delete",
+              label: "删除",
+            },
+          ],
+        },
+      ];
+    } else if (level == 0 && type == 1) {
+      this.headers = [
+        { label: "服务名称", prop: "name", type: "href", align: "left" },
+        { label: "服务领域", prop: "date", type: "", align: "center" },
+        { label: "开放程度", prop: "address", type: "", align: "center" },
+        { label: "服务描述", prop: "address", type: "", align: "left" },
+        { label: "申请时间", prop: "address", type: "", align: "left" },
+        { label: "服务类型", prop: "address", type: "", align: "center" },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          width: 160,
+          btnList: [
+            {
+              type: "action-cancel",
+              label: "取消",
+              line: "|",
+            },
+            {
+              type: "action-delete",
+              label: "删除",
+            },
+          ],
+        },
+      ];
+    } else if (level == 0 && type == 2) {
+      this.headers = [
+        { label: "服务名称", prop: "name", type: "href", align: "left" },
+        { label: "服务领域", prop: "address", type: "", align: "center" },
+        { label: "开放程度", prop: "address", type: "", align: "center" },
+        { label: "请求方式", prop: "address", type: "", align: "center" },
+        { label: "服务描述", prop: "address", type: "", align: "left" },
+        { label: "审批时间", prop: "address", type: "", align: "center" },
+        { label: "服务类型", prop: "address", type: "", align: "center" },
+        { label: "审批状态", prop: "address", type: "", align: "center" },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          width: 160,
+          btnList: [
+            {
+              type: "action-examine",
+              label: "审批",
+              line: "|",
+            },
+            {
+              type: "action-delete",
+              label: "删除",
+            },
+          ],
+        },
+      ];
+    } else if (level == 0 && type == 2) {
+      this.headers = [
+        { label: "工作区域", prop: "name", type: "href", align: "left" },
+        { label: "网络环境", prop: "name", type: "", align: "center" },
+        { label: "CPU（核）", prop: "name", type: "", align: "center" },
+        { label: "内存（GB）", prop: "name", type: "", align: "center" },
+        { label: "资源总量（GB）", prop: "name", type: "", align: "center" },
+        { label: "实例数（个）", prop: "name", type: "", align: "center" },
+        { label: "申请时间", prop: "name", type: "", align: "center" },
+        { label: "申请状态", prop: "name", type: "", align: "center" },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          width: 160,
+          btnList: [
+            {
+              type: "action-detail",
+              label: "查看详情",
+            },
+          ],
+        },
+      ];
+    } else {
+      this.headers = [
+        { label: "服务名称", prop: "name", type: "href", align: "left" },
+        { label: "服务url", prop: "date", type: "", align: "center" },
+        { label: "开放程度", prop: "address", type: "", align: "center" },
+        { label: "服务描述", prop: "address", type: "", align: "left" },
+        {
+          label: "注册发布时间",
+          prop: "address",
+          type: "",
+          align: "center",
+        },
+        { label: "服务类型", prop: "address", type: "", align: "center" },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          width: 240,
+          btnList: [
+            {
+              type: "action-edit",
+              label: "编辑",
+              line: "|",
+            },
+            {
+              type: "action-sold-out",
+              label: "申请下架",
+              line: "|",
+            },
+            {
+              type: "action-delete",
+              label: "删除",
+            },
+          ],
+        },
+      ];
     }
   },
 };
diff --git a/src/pages/sjfwDetail.vue b/src/pages/sjfwDetail.vue
new file mode 100644
index 0000000000000000000000000000000000000000..ef98da6a55a5b9efc368d286e0769eea6ba8c797
--- /dev/null
+++ b/src/pages/sjfwDetail.vue
@@ -0,0 +1,55 @@
+<template>
+  <div class="com_ex">
+    <block-radius>
+      <el-breadcrumb separator="/" class="bread_crumb">
+        <el-breadcrumb-item>服务超市</el-breadcrumb-item>
+        <el-breadcrumb-item>数据服务</el-breadcrumb-item>
+        <el-breadcrumb-item>服务详情信息</el-breadcrumb-item>
+      </el-breadcrumb>
+
+      <Commodity :datas="datas" />
+
+      <servive-info></servive-info>
+    </block-radius>
+  </div>
+</template>
+
+<script>
+// @ is an alias to /src
+import Commodity from "@/components/commodity.vue";
+import BlockRadius from "@/components/block-radius";
+import serviveInfo from "@/components/servive-info";
+export default {
+  components: {
+    Commodity,
+    BlockRadius,
+    serviveInfo,
+  },
+  data: () => ({
+    datas: {
+      productName: "地图视频融合服务",
+      providedBy: "北京比格数据",
+      releaseTime: "2020-03-12 18:31:12",
+      updated: "2020-03-12 18:31:12",
+      dataField: "经济建设",
+      serviceType: "综合应用服务",
+      resourceSummary:
+        "提供视频监控的空间分布展示和视频监控直播的服务提供视频监控的空间分布展示和视频监控直播的服务",
+      openLevel: "共享",
+      views: "99999",
+      numberOfAcquisitions: "99999",
+      specifications:
+        "用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问",
+    },
+  }),
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style scoped>
+.com_ex {
+  margin-top: 100px;
+  padding: 20px;
+}
+</style>
diff --git a/src/pages/skfwDetail.vue b/src/pages/skfwDetail.vue
new file mode 100644
index 0000000000000000000000000000000000000000..ef98da6a55a5b9efc368d286e0769eea6ba8c797
--- /dev/null
+++ b/src/pages/skfwDetail.vue
@@ -0,0 +1,55 @@
+<template>
+  <div class="com_ex">
+    <block-radius>
+      <el-breadcrumb separator="/" class="bread_crumb">
+        <el-breadcrumb-item>服务超市</el-breadcrumb-item>
+        <el-breadcrumb-item>数据服务</el-breadcrumb-item>
+        <el-breadcrumb-item>服务详情信息</el-breadcrumb-item>
+      </el-breadcrumb>
+
+      <Commodity :datas="datas" />
+
+      <servive-info></servive-info>
+    </block-radius>
+  </div>
+</template>
+
+<script>
+// @ is an alias to /src
+import Commodity from "@/components/commodity.vue";
+import BlockRadius from "@/components/block-radius";
+import serviveInfo from "@/components/servive-info";
+export default {
+  components: {
+    Commodity,
+    BlockRadius,
+    serviveInfo,
+  },
+  data: () => ({
+    datas: {
+      productName: "地图视频融合服务",
+      providedBy: "北京比格数据",
+      releaseTime: "2020-03-12 18:31:12",
+      updated: "2020-03-12 18:31:12",
+      dataField: "经济建设",
+      serviceType: "综合应用服务",
+      resourceSummary:
+        "提供视频监控的空间分布展示和视频监控直播的服务提供视频监控的空间分布展示和视频监控直播的服务",
+      openLevel: "共享",
+      views: "99999",
+      numberOfAcquisitions: "99999",
+      specifications:
+        "用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问",
+    },
+  }),
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style scoped>
+.com_ex {
+  margin-top: 100px;
+  padding: 20px;
+}
+</style>
diff --git a/src/pages/zhyyfwDetail.vue b/src/pages/zhyyfwDetail.vue
new file mode 100644
index 0000000000000000000000000000000000000000..ef98da6a55a5b9efc368d286e0769eea6ba8c797
--- /dev/null
+++ b/src/pages/zhyyfwDetail.vue
@@ -0,0 +1,55 @@
+<template>
+  <div class="com_ex">
+    <block-radius>
+      <el-breadcrumb separator="/" class="bread_crumb">
+        <el-breadcrumb-item>服务超市</el-breadcrumb-item>
+        <el-breadcrumb-item>数据服务</el-breadcrumb-item>
+        <el-breadcrumb-item>服务详情信息</el-breadcrumb-item>
+      </el-breadcrumb>
+
+      <Commodity :datas="datas" />
+
+      <servive-info></servive-info>
+    </block-radius>
+  </div>
+</template>
+
+<script>
+// @ is an alias to /src
+import Commodity from "@/components/commodity.vue";
+import BlockRadius from "@/components/block-radius";
+import serviveInfo from "@/components/servive-info";
+export default {
+  components: {
+    Commodity,
+    BlockRadius,
+    serviveInfo,
+  },
+  data: () => ({
+    datas: {
+      productName: "地图视频融合服务",
+      providedBy: "北京比格数据",
+      releaseTime: "2020-03-12 18:31:12",
+      updated: "2020-03-12 18:31:12",
+      dataField: "经济建设",
+      serviceType: "综合应用服务",
+      resourceSummary:
+        "提供视频监控的空间分布展示和视频监控直播的服务提供视频监控的空间分布展示和视频监控直播的服务",
+      openLevel: "共享",
+      views: "99999",
+      numberOfAcquisitions: "99999",
+      specifications:
+        "用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问",
+    },
+  }),
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style scoped>
+.com_ex {
+  margin-top: 100px;
+  padding: 20px;
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index cb01fa5de53718c48a51f0a4c617d608d7e381d0..72f97f845c265e8b2b605fe7e8bbfe0517e41bd2 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -24,6 +24,21 @@ export default new Router({
       component: () => import("@/pages/index"),
       redirect: "/workplace",
       children: [
+        {
+          path: "/sjfwDetail",
+          name: "sjfwDetail",
+          component: () => import("@/pages/sjfwDetail"),
+        }, // 数据服务详情
+        {
+          path: "/skfwDetail",
+          name: "skfwDetail",
+          component: () => import("@/pages/skfwDetail"),
+        }, // 时空服务详情
+        {
+          path: "/zhyyfwDetail",
+          name: "zhyyfwDetail",
+          component: () => import("@/pages/zhyyfwDetail"),
+        }, // 综合应用服务详情
         {
           path: "/workplace",
           name: "workPlace",
@@ -43,23 +58,23 @@ export default new Router({
           ],
         },
         {
-          path: "/fwgl", // 服务管理
+          path: "/fwgl/:level", // 服务管理 level：用户等级
           name: "fwgl",
-          // redirect: "/fwgl/list",
+          redirect: "/fwgl/list/:level/0",
           component: () => import("@/pages/fwgl"),
           children: [
             {
-              path: "/fwgl/list/:type/:name", // 服务管理/我的服务
+              path: "/fwgl/list/:level/:type", // 服务管理/我的服务
               name: "fwglList",
               component: () => import("@/pages/fwglList"),
             },
             {
-              path: "/fwgl/servicedetail/:id",
+              path: "/fwgl/servicedetail/:level/:id",
               name: "servicedetail",
               component: () => import("@/pages/serviceDetail"),
             },
             {
-              path: "/fwgl/serviceedit/:id",
+              path: "/fwgl/serviceedit/:level/:id",
               name: "serviceedit",
               component: () => import("@/pages/serviceEdit"),
             },
@@ -100,17 +115,17 @@ export default new Router({
     {
       path: "/example_topology", // 拓扑图实例
       name: "example_topology",
-      component: () => import("@/pages/example_topology")
+      component: () => import("@/pages/example_topology"),
     },
     {
       path: "/example_commodity", // 商品详情实例
       name: "example_commodity",
-      component: () => import("@/pages/example_commodity")
+      component: () => import("@/pages/example_commodity"),
     },
     {
       path: "/example_com_list", // 商品列表实例
       name: "example_com_list",
-      component: () => import("@/pages/example_com_list")
-    }
-  ]
+      component: () => import("@/pages/example_com_list"),
+    },
+  ],
 });