布局知识库

jero-web/src/common/lang/en-us.js

@@ -1225,4 +1225,5 @@ module.exports = {
   personCharge:'Person in charge',
   addLabel:'Add Label',
   editLabel:'Edit Label',
+  applicableMarket:'Applicable market',
 }

jero-web/src/common/lang/zh-cn.js

@@ -1328,4 +1328,5 @@ module.exports = {
   personCharge:'负责人',
   addLabel:'新增标签',
   editLabel:'编辑标签',
+  applicableMarket:'适用市场',
 }

jero-web/src/components/layouts/TabLayout.vue

@@ -92,6 +92,8 @@
           this.$route.path == '/virtualListDetails' ||
           this.$route.path == '/taskListProcess' ||
           this.$route.path == '/ProjectDetails' ||
+          this.$route.path == '/countryCardRelease' ||
+          this.$route.path == '/countryCardView' ||
           this.$route.path == '/problemKnowledgeBaseAdd' ||
           this.$route.path == '/problemKnowledgeBaseRelease' ||
           this.$route.path == '/problemKnowledgeBaseView' ||

jero-web/src/config/router.config.js

@@ -367,6 +367,16 @@ export const constantRouterMap = [
     name: 'problemKnowledgeBaseRelease',
     component: () => import(/* webpackChunkName: "user" */ '@/views/businessSupport/problemKnowledgeBase/components/problemKnowledgeBaseRelease')
   },
+  {
+    path: '/countryCardView',
+    name: 'countryCardView',
+    component: () => import(/* webpackChunkName: "user" */ '@/views/businessSupport/problemKnowledgeBase/components/countryCardView')
+  },
+  {
+    path: '/countryCardRelease',
+    name: 'countryCardRelease',
+    component: () => import(/* webpackChunkName: "user" */ '@/views/businessSupport/problemKnowledgeBase/components/countryCardRelease')
+  },
   {
     path: '/problemKnowledgeBaseView',
     name: 'problemKnowledgeBaseView',

jero-web/src/views/businessSupport/problemKnowledgeBase/components/countryCardList.vue

@@ -1,13 +1,243 @@
 <template>
-
+  <div class="box">
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :md="6" :sm="8">
+            <div class="box-title-text">
+              <div class="title-text" :title="$t('applicableMarket')">
+                <span>{{$t('applicableMarket')}}</span>
+              </div>
+              <a-input class="box-input" :placeholder="$t('PleaseEnter')+$t('applicableMarket')"
+                       v-model="queryParam.applicableMarket"></a-input>
+            </div>
+          </a-col>
+          <span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
+               <a-col :md="6" :sm="24">
+                  <a-button class="box-button" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
+                  <a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
+               </a-col>
+      </span>
+        </a-row>
+      </a-form>
+    </div>
+    <div class="box-content-right">
+      <div @click="managePublishingClick" class="operator-text">
+        <a-icon type="carry-out"/>
+        {{$t('managePublishing')}}
+      </div>
+    </div>
+    <div class="content-box">
+      <div class="content-box-box" @click="contentClick()">
+        <img src="../../../../assets/mobileHome.png" class="content-box-box-img" alt="">
+        <span class="content-box-box-text">
+             中国
+        </span>
+      </div>
+      <div class="content-box-box">
+        <img src="../../../../assets/mobileHome.png" class="content-box-box-img" alt="">
+        <span class="content-box-box-text">
+             中国
+        </span>
+      </div>
+      <div class="content-box-box">
+        <img src="../../../../assets/mobileHome.png" class="content-box-box-img" alt="">
+        <span class="content-box-box-text">
+             中国
+        </span>
+      </div>
+      <div class="content-box-box">
+        <img src="../../../../assets/mobileHome.png" class="content-box-box-img" alt="">
+        <span class="content-box-box-text">
+             中国
+        </span>
+      </div>
+      <div class="content-box-box">
+        <img src="../../../../assets/mobileHome.png" class="content-box-box-img" alt="">
+        <span class="content-box-box-text">
+             中国
+        </span>
+      </div>
+      <div class="content-box-box">
+        <img src="../../../../assets/mobileHome.png" class="content-box-box-img" alt="">
+        <span class="content-box-box-text">
+             中国
+        </span>
+      </div>
+      <div class="page">
+        <a-pagination
+          :show-total="total => $t('total')+` ${total} `+$t('strip')"
+          show-quick-jumper
+          show-size-changer
+          :page-size.sync="pageSize"
+          :total="total"
+          :current="pageNo"
+          @change="pageOnChange"
+          @showSizeChange="SizeChange"
+        />
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
+  import { getAction, postAction, downloadFile } from '@/api/manage'
+
   export default {
-    name: 'countryCardList'
+    name: 'countryCardList',
+    data() {
+      return {
+        queryParam: {},
+        conList: [],
+        pageSize: 10,
+        total: 0,
+        pageNo: 1
+      }
+    },
+    mounted() {
+
+    },
+    methods: {
+      searchQuery() {
+
+      },
+      searchReset() {
+
+      },
+      pageOnChange(page, pageSize) {
+        this.pageNo = page
+        this.getList()
+      },
+      SizeChange(page, pageSize) {
+        this.pageNo = 1
+        this.pageSize = pageSize
+        this.getList()
+      },
+      getList() {
+        let query = {
+          pageNo: this.pageNo,
+          pageSize: this.pageSize
+        }
+        postAction(this.url.getInfoList, query).then((res) => {
+          if (res.success) {
+            this.conList = res.result.records
+            this.total = res.result.total
+          } else {
+            this.conList = []
+          }
+        })
+      },
+      managePublishingClick() {
+        let newUrl = this.$router.resolve({
+          path: '/countryCardRelease',
+          query: {}
+        })
+        window.open(newUrl.href, '_blank')
+      },
+      contentClick() {
+        let newUrl = this.$router.resolve({
+          path: '/countryCardView',
+          query: {}
+        })
+        window.open(newUrl.href, '_blank')
+      }
+    }
   }
 </script>
 
 <style scoped>
+  @import '~@assets/less/common.less';
+
+  .page {
+    text-align: right;
+    margin-top: 20px;
+  }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+  }
+
+  .title-text {
+    width: 20%;
+    min-width: 110px;
+    color: #000F16;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    margin-top: 3px;
+    text-align: right;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .box-input {
+    display: inline-block;
+    width: 70%;
+    height: 38px;
+    margin-top: 2px;
+  }
+
+  .box-button {
+    height: 38px;
+    /*margin-top: 2px;*/
+  }
+
+  .content-box {
+    width: 100%;
+  }
+
+  .content-box-box {
+    width: calc(33.3% - 20px);
+    height: 160px;
+    border: 1px #d9d9d9 solid;
+    cursor: pointer;
+    border-radius: 4px;
+    float: left;
+    margin-right: 30px;
+    margin-bottom: 30px;
+  }
+
+  .content-box-box:nth-child(3n+3) {
+    margin-right: 0;
+  }
+
+  .content-box-box-img {
+    width: 70%;
+    height: 100%;
+    border-right: 1px #d9d9d9 solid;
+  }
+
+  .content-box-box-text {
+    display: inline-block;
+    width: 30%;
+    text-align: center;
+    font-size: 18px;
+    font-weight: 500;
+    color: #040B29;
+  }
+
+  .box-content-right {
+    width: 100%;
+    text-align: right;
+    margin-top: 20px;
+  }
+
+  .operator-text {
+    cursor: pointer;
+    margin-right: 53px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #040B29;
+    display: inline-block;
+  }
+
+  .operator-text:last-child {
+    margin-right: 13px;
+  }
 
 </style>

jero-web/src/views/businessSupport/problemKnowledgeBase/components/countryCardRelease.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="doc-detail">
+    <div class="doc-detail-wrap">
+      <div class="doc-detail-header" style="position: fixed;top: 0">
+        <div class="doc-detail-title">
+           <span style="line-height: 66px;display: inline-block;float: left">
+             <a-icon type="arrow-left" style="margin-right: 6px;"/>
+           </span>
+          {{$t('applicableInstructionsMarketList')}}
+        </div>
+      </div>
+      <div style="padding-top: 68px;background: #fff">
+        <div class="detail-content" style="padding: 24px">
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'countryCardRelease'
+  }
+</script>
+
+<style scoped lang="less">
+  @import '~@assets/less/common.less';
+
+  .doc-detail {
+    background: #fff;
+    height: 100%;
+
+    .doc-detail-wrap {
+      .doc-detail-header {
+        width: 100%;
+        height: 68px;
+        line-height: 68px;
+        padding: 0 0 0 32px;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        border-bottom: 2px #eff1f3 solid;
+        z-index: 1000;
+        background: #fff;
+
+        .doc-detail-title {
+          display: inline-block;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+          font-size: 20px;
+          font-weight: 400;
+          color: #040B29;
+          line-height: 68px;
+        }
+
+        .doc-detail-right {
+          width: 800px;
+          line-height: 68px;
+          display: flex;
+
+          .doc-detail-btn {
+            margin-left: 10px;
+          }
+        }
+      }
+
+      .content-box {
+        padding: 0 32px;
+        box-sizing: border-box;
+      }
+
+      .header-text {
+        font-size: 16px;
+        font-weight: 400;
+        height: 80px;
+        color: #000F16;
+        line-height: 80px;
+      }
+
+      .processBackground-text {
+        font-size: 16px;
+        color: #000F16;
+      }
+    }
+  }
+</style>

jero-web/src/views/businessSupport/problemKnowledgeBase/components/countryCardView.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="doc-detail">
+    <div class="doc-detail-wrap">
+      <div class="doc-detail-header" style="position: fixed;top: 0">
+        <div class="doc-detail-title">
+           <span style="line-height: 66px;display: inline-block;float: left">
+             <a-icon type="arrow-left" style="margin-right: 6px;"/>
+           </span>
+          {{$t('applicableInstructionsMarketList')}}
+        </div>
+      </div>
+      <div style="padding-top: 68px;background: #fff">
+        <div class="detail-content" style="padding: 24px">
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'countryCardView'
+  }
+</script>
+
+<style scoped lang="less">
+  @import '~@assets/less/common.less';
+
+  .doc-detail {
+    background: #fff;
+    height: 100%;
+
+    .doc-detail-wrap {
+      .doc-detail-header {
+        width: 100%;
+        height: 68px;
+        line-height: 68px;
+        padding: 0 0 0 32px;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        border-bottom: 2px #eff1f3 solid;
+        z-index: 1000;
+        background: #fff;
+
+        .doc-detail-title {
+          display: inline-block;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+          font-size: 20px;
+          font-weight: 400;
+          color: #040B29;
+          line-height: 68px;
+        }
+
+        .doc-detail-right {
+          width: 800px;
+          line-height: 68px;
+          display: flex;
+
+          .doc-detail-btn {
+            margin-left: 10px;
+          }
+        }
+      }
+
+      .content-box {
+        padding: 0 32px;
+        box-sizing: border-box;
+      }
+
+      .header-text {
+        font-size: 16px;
+        font-weight: 400;
+        height: 80px;
+        color: #000F16;
+        line-height: 80px;
+      }
+
+      .processBackground-text {
+        font-size: 16px;
+        color: #000F16;
+      }
+    }
+  }
+</style>