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

src/assets/css/index.css

@@ -201,6 +201,9 @@ div{
   color: #8890a7;
   line-height: 24px!important;
 }
+.el-tabs__nav-scroll .el-tabs__item {
+  line-height: 40px!important;
+}
 .el-tabs__item:hover {
   color: #687087;
 

src/components/commodity.vue

@@ -119,7 +119,9 @@ export default {
   }),
   computed: {},
   watch: {},
-  methods: {},
+  methods: {
+    handleChange() {}
+  },
   mounted() {}
 };
 </script>

src/components/dialog-action.vue

+<template>
+  <transition name="mask-bg-fade">
+    <el-dialog
+      :visible.sync="show"
+      width="400px"
+      top="25vh"
+      class="user-dialog"
+    >
+      <span slot="title">
+        <b class="iconLeft"></b>
+        <span style=" display: inline-block;vertical-align: middle;">
+          {{ confirmOptions.title || "提示" }}
+        </span>
+      </span>
+      <span>{{ confirmOptions.message || "" }}</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button
+          class="form_c"
+          type="defalut"
+          size="mini"
+          @click="hideModel"
+          >{{ confirmOptions.btnCancelText || "取消" }}</el-button
+        >
+        <el-button
+          class="form_t"
+          type="primary"
+          size="mini"
+          @click="confirmSubmit"
+          >{{ confirmOptions.btnSubmitText || "确定" }}</el-button
+        >
+      </span>
+    </el-dialog>
+  </transition>
+</template>
+
+<script>
+export default {
+  name: "dialogAction",
+  props: {
+    confirmOptions: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      show: false,
+    };
+  },
+  methods: {
+    showModel() {
+      this.show = true;
+    },
+    hideModel() {
+      this.show = false;
+    },
+    confirmSubmit() {
+      typeof this.confirmOptions.confirmSubmit === "function" &&
+        this.confirmOptions.confirmSubmit();
+    },
+  },
+};
+</script>
+<style>
+.el-dialog__header {
+  border-bottom: 1px solid #edf0ff;
+  padding: 20px 20px 16px !important;
+  font-family: "MicrosoftYaHei";
+  font-size: 16px;
+  color: #1d1e20;
+  font-weight: 800;
+}
+.el-dialog__header .iconLeft {
+  width: 4px;
+  height: 16px;
+  background-color: #0367f6;
+  border-radius: 2px;
+  display: inline-block;
+  vertical-align: middle;
+  margin-right: 3px;
+}
+.el-icon-close:before {
+  font-weight: 800 !important;
+}
+.el-dialog__body {
+  padding: 49px 20px !important;
+}
+</style>
+<style scoped>
+.group-dialog.el-dialog__wrapper {
+  width: 100% !important;
+  left: 0 !important;
+  overflow: hidden;
+}
+.user-dialog {
+  overflow: hidden;
+}
+</style>

src/components/servive-step.vue

+<template>
+  <div class="service_step">
+    <div class="step_bg"></div>
+    <ul class="step_items">
+      <li class="step_item">
+        <div class="step_icon">
+            <span>1</span>
+        </div>
+        <p class="step_title">服务申请</p>
+      </li>
+      <li class="step_item">
+        <div class="step_icon">
+            <span>2</span>
+        </div>
+        <p class="step_title">审核确认</p>
+      </li>
+      <li class="step_item">
+        <div class="step_icon">
+            <span>3</span>
+        </div>
+        <p class="step_title">费用支付</p>
+      </li>
+      <li class="step_item">
+        <div class="step_icon">
+            <span>4</span>
+        </div>
+        <p class="step_title">服务获取</p>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<style scoped>
+.service_step {
+  position: relative;
+  min-height: 48px;
+}
+.service_step > .step_bg {
+  position: absolute;
+  top: 23px;
+  right: 24px;
+  left: 24px;
+  border: 1px solid #1abc9c;
+}
+.service_step > .step_items {
+  position: relative;
+  z-index: 2;
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  text-align: center;
+}
+.service_step .step_item > .step_icon {
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background-color: #1abc9c;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 28px;
+  font-weight: bold;
+  color: #fff;
+}
+.service_step .step_item > .step_title {
+  font-size: 12px;
+  line-height: 24px;
+  color: #1abc9c;
+}
+</style>

src/components/side-nav-bar.vue

@@ -9,14 +9,16 @@
       <span v-text="title"></span>
     </h3>
     <ul class="side_nav_bar_list">
-      <li
+      <router-link
+        tag="li"
+        active-class="current"
         v-for="(nav, index) in navList"
         :class="{ current: $route.path.indexOf(nav.path) > -1 }"
         :key="'nav' + index"
-        @click="navAction(nav)"
+        :to="nav.path"
       >
         <span v-text="nav.name"></span>
-      </li>
+      </router-link>
     </ul>
   </div>
 </template>
@@ -39,9 +41,6 @@ export default {
     },
   },
   methods: {
-    navAction(nav) {
-      this.$router.push(nav.path);
-    },
     titleAction() {
       if (this.titlePath) {
         this.$router.push(this.titlePath);

src/components/table-um.vue

@@ -115,15 +115,17 @@
             <span v-if="item.type === 'Button'">
               <b v-for="(btn, key) in item.btnList" :key="key">
                 <em
+                  class="action"
                   v-if="btn.label == '分配'||btn.label == '已分配'"
                 >
                   <em v-if="btn.label == '分配'&&scope.row.state == 0"  style="color: #0f2683" @click="handleClick(btn.type, scope.row)">{{ btn.label }}</em>
                   <em v-if="btn.label == '已分配'&&scope.row.state == 1">{{ btn.label }}</em>
                 </em>
                 <em
+                  class="action"
                   v-else
                   :class="btn.type"
-                  style="color: #0f2683"
+                  :style="{color: btn.label=='删除' ? '#830f53' : '#0f2683'}"
                   @click="handleClick(btn.type, scope.row)"
                 >{{ btn.label }}</em>
                 <em v-if="btn.line" style="padding:0 20px;color:#edf0ff">{{ btn.line }}</em>
@@ -601,6 +603,10 @@ export default {
 }
 em {
   font-style: normal;
+  user-select: none;
+}
+em.action {
+  cursor: pointer;
 }
 .ces-table .el-table--mini td,
 .ces-table .el-table--mini th {

src/pages/example_commodity.vue

@@ -2,7 +2,10 @@
   <div class="com_ex">
     <block-radius>
       <h3>按原型大致做了一下，调优等后续</h3>
+
       <Commodity :datas="datas" />
+  
+      <servive-info></servive-info>
     </block-radius>
   </div>
 </template>
@@ -11,10 +14,12 @@
 // @ 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
+    BlockRadius,
+    serviveInfo,
   },
   data: () => ({
     datas: {
@@ -24,22 +29,21 @@ export default {
       updated: "2020-03-12 18:31:12",
       dataField: "经济建设",
       serviceType: "综合应用服务",
-      resourceSummary:
-        "提供视频监控的空间分布展示和视频监控直播的服务提供视频监控的空间分布展示和视频监控直播的服务",
+      resourceSummary: "提供视频监控的空间分布展示和视频监控直播的服务提供视频监控的空间分布展示和视频监控直播的服务",
       openLevel: "共享",
       views: "99999",
       numberOfAcquisitions: "99999",
-      specifications:
-        "用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问"
-    }
+      specifications: "用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问用户服务申请通过审核确认后，每日可对应急资源地图进行20次免费访问",
+    },
   }),
   mounted() {},
-  methods: {}
+  methods: {},
 };
 </script>
+
 <style scoped>
 .com_ex {
   margin-top: 100px;
   padding: 20px;
 }
-</style>
+</style>
\ No newline at end of file

src/pages/fwgl.vue

 <template>
   <div class="fwgl_container">
-    <side-nav-bar :nav-list="navList" title-path="/fwgl"></side-nav-bar>
+    <side-nav-bar :nav-list="navList" :title-path="navList[0].path"></side-nav-bar>
     <div class="main_container">
       <router-view
         :key="'type_' + $route.params && $route.params.type"