企业搜索及申请绑定功能交互

components/default/Header.vue

@@ -149,7 +149,7 @@
           isSelf = true
         }
         if (isSelf) {
-          window.location.href = '/register-saler'
+          window.location.href = '/personalMaterial'
         } else {
           if (tempEnterprise.isVendor === 313) {
             window.location.href = '/vendor#/index'

components/personalMaterial/PersonalMaterial.vue

@@ -3,29 +3,29 @@
     <a @click="goLastPage">&lt;返回上一层</a>
     <div class="personal-material-header">
       <p><i class="fa fa-exclamation-circle"></i>抱歉，您的账户未绑定企业，暂无卖家权限！</p>
-      <a href="">查看申请记录</a>
+      <a @click="setShowApplyRecord(true)">查看申请记录</a>
     </div>
     <div class="personal-material-content">
       <div class="is-open-store">
         <p><img src="/images/material/arrow-right-blue.png" alt="">所属企业已开店</p>
         <div>
           <p>绑定企业</p>
-          <div class="search-content">企业全称：<input type="text" class="form-control" placeholder="请输入企业全称"><span>检测</span></div>
+          <div class="search-content">企业全称：<input type="text" class="form-control" v-model="keyword" placeholder="请输入企业全称" @keyup.13="onSearchEnterprise"><span @click="onSearchEnterprise">检测</span></div>
           <div class="result-content" v-if="showSearchResultStatus == 1">
-            <p>深圳市又软科技有限公司</p>
+            <p v-text="enInfo.name"></p>
             <div class="result-text">
               <span>管理员</span>
-              <span>李天线</span>
+              <span v-text="enInfo.adminName"></span>
             </div>
             <div class="result-text">
               <span>营业执照号</span>
-              <span>214124123123</span>
+              <span v-text="enInfo.businessCode"></span>
             </div>
-            <a href="">申请绑定</a>
+            <a href="javascript:void(0)" @click="bindEnterprise">申请绑定</a>
             <div class="result-remind">管理员审核通过后成功绑定</div>
           </div>
           <p class="no-result-content" v-if="showSearchResultStatus == 2">
-            深圳市优软科技有限公司 <span>(未开店)</span>
+            {{enName}} <span>(未开店)</span>
           </p>
         </div>
       </div>
@@ -44,7 +44,7 @@
             <img src="/images/material/house.png" alt="">
             <div>
               <p>请点击下方按钮开设新的店铺</p>
-              <span>开设新店铺</span>
+              <a href="/register-saler">开设新店铺</a>
             </div>
           </div>
         </div>
@@ -53,14 +53,14 @@
     <div class="modal-wrap" v-show="showRemindBox || showApplyRecord"></div>
     <div class="com-del-box" v-if="showRemindBox">
       <div class="title">
-        <i></i>
+        <i @click="showRemindBox = false"></i>
       </div>
       <p><img src="/images/material/check.png" alt="">绑定申请提交成功！</p>
       <div class="result">审批结果将以短信通知，请保持手机通畅。</div>
-      <div class="remind">弹窗将在 <span>5秒</span> 后自动关闭</div>
+      <div class="remind">弹窗将在 <span v-text="timer + '秒'"></span> 后自动关闭</div>
     </div>
     <div class="apply-record" v-if="showApplyRecord">
-      <div class="title">申请记录 <img src="/images/material/apply-close.png" alt=""></div>
+      <div class="title">申请记录 <img src="/images/material/apply-close.png" alt="" @click="setShowApplyRecord(false)"></div>
       <div class="record-wrap">
         <div class="record-title">
           <span>企业名称</span>
@@ -87,6 +87,18 @@
             <span>2018-12-12 11:11:11</span>
             <span>已通过</span>
           </li>
+          <li>
+            <span>深圳市哟软商城科技有限公司</span>
+            <span>哈哈哈</span>
+            <span>2018-12-12 11:11:11</span>
+            <span>已通过</span>
+          </li>
+          <li>
+            <span>深圳市哟软商城科技有限公司</span>
+            <span>哈哈哈</span>
+            <span>2018-12-12 11:11:11</span>
+            <span>已通过</span>
+          </li>
         </ul>
       </div>
     </div>
@@ -98,12 +110,61 @@
       return {
         showApplyRecord: false,
         showRemindBox: false,
-        showSearchResultStatus: 0
+        // 0=>初始状态，1=>有搜索结果，2=>搜索结果为空
+        showSearchResultStatus: 0,
+        keyword: '',
+        enName: '',
+        enInfo: {},
+        timer: 5
       }
     },
     methods: {
       goLastPage: function () {
         window.history.back(-1)
+      },
+      onSearchEnterprise: function () {
+        if (this.keyword) {
+          this.$http.get('/basic/enterprise/findByName/' + encodeURIComponent(this.keyword)).then(response => {
+            console.log(response.data)
+            if (response.data) {
+              this.enInfo = response.data
+              this.showSearchResultStatus = 1
+            } else {
+              this.enName = this.keyword
+              this.showSearchResultStatus = 2
+            }
+          })
+        }
+      },
+      bindEnterprise: function () {
+        this.$http.get('/basic/enterprise/applyUserSpace', {params: {phone: this.enInfo.contactTel, enName: this.enInfo.name, businessCode: this.enInfo.businessCode}})
+          .then(response => {
+            if (response.data.data === 'success') {
+              this.showRemindBox = true
+              this.startInterval()
+            } else {
+              this.$message.error(response.data.data)
+            }
+          }, err => {
+            console.log(err)
+            this.$message.error('系统错误')
+          })
+      },
+      startInterval: function () {
+        this.timer = 5
+        let _this = this
+        let interval = setInterval(() => {
+          _this.timer --
+          if (_this.timer === 0) {
+            clearInterval(interval)
+            this.showRemindBox = false
+          }
+        }, 1000)
+      },
+      setShowApplyRecord: function (flag) {
+        if (flag) {
+        }
+        this.showApplyRecord = flag
       }
     }
   }
@@ -203,6 +264,7 @@
               margin-left: -1px;
               border-top-right-radius: 3px;
               border-bottom-right-radius: 3px;
+              cursor: pointer;
             }
           }
           .result-content {
@@ -248,7 +310,8 @@
           }
           .no-result-content {
             font-size: 16px;
-            margin: 26px 218px 38px 0;
+            margin: 26px 0 38px 220px;
+            text-align: left;
             span {
               color: #f00707;
               font-weight: normal;
@@ -299,7 +362,7 @@
               p {
                 margin-bottom: 29px;
               }
-              span {
+              a {
                 display: inline-block;
                 width: 124px;
                 height: 32px;
@@ -389,7 +452,7 @@
             background: #f7f9fe;
           }
           span {
-            line-height: 27px;
+            line-height: 26px;
             position: relative;
             top: 2px;
             &.green-text {

nuxt.config.js

@@ -1,6 +1,6 @@
 const path = require('path')
 const isProdMode = Object.is(process.env.NODE_ENV, 'production')
-const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://10.10.100.107:8081/platform-b2c/' : 'http://192.168.253.60:9090/platform-b2c/')
+const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://10.10.100.107:8081/platform-b2c/' : 'http://192.168.253.121:8080/platform-b2c/')
 
 module.exports = {
   router: {