Browse Source

Merge branch 'feature/yc-selfProduct-0111'

wangdy 7 years ago
parent
commit
758f3c2be5

+ 1 - 1
app.html

@@ -5,7 +5,7 @@
   <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
   <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/element-ui/1.3.7/theme-default/index.css"/>
   <!--<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_0d1jjt5tukcblnmi.css"/>-->
-  <link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_452262_1eqwgrq76p2xzuxr.css">
+  <link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_452262_crpyz8n3b4qxs9k9.css">
   <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/Swiper/3.4.2/css/swiper.css"/>
   {{ HEAD }}
   <script>

+ 2 - 0
assets/scss/app.scss

@@ -11,3 +11,5 @@
 
 // Common style
 @import "common.scss";
+
+@import "commonComponent.css";

+ 8 - 0
assets/scss/common.scss

@@ -654,3 +654,11 @@ a {
   display: block;
   margin: 10px auto;
 }
+
+.fl {
+  float: left;
+}
+
+.fr {
+  float: right;
+}

+ 639 - 0
assets/scss/commonComponent.css

@@ -0,0 +1,639 @@
+/*---------------------提示框样式 start---------------------*/
+/*示例:
+<div class="com-del-box">
+    <div class="title">
+        <i></i>
+    </div>
+    <div class="content">
+        <p><i class="fa fa-exclamation-circle"></i>是否要删除此发票?</p>
+        <div>
+            <a>取消</a>
+            <a>确认</a>
+        </div>
+    </div>
+</div>
+*/
+.com-del-box{
+    position: fixed;
+    z-index: 10;
+    min-height: 152px;
+    opacity: 1;
+    background-color: white;
+    width: 310px;
+    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
+    box-shadow: 0 5px 15px rgba(0,0,0,.5);
+    margin: -155px 0 0 -75px;
+    top: 55%;
+    left: 50%;
+}
+.com-del-box .title{
+    height: 30px;
+    background-color: #5078cb;
+    text-align: right;
+    padding-right: 15px;
+    line-height: 30px;
+}
+.com-del-box .title i{
+    background: url(/images/icon/close.png) no-repeat;
+    display: inline-block;
+    width: 9px;
+    height: 9px;
+    cursor: pointer;
+    margin: 0;
+}
+.com-del-box .content{
+    width: 100%;
+    text-align: center;
+    margin: 0 auto;
+}
+.com-del-box .content p{
+    line-height: 50px;
+    font-size: 14px;
+    padding-top: 10px;
+}
+.com-del-box .content p i{
+    color: #5078cb;
+    font-size: 16px;
+    margin-right: 10px;
+}
+.com-del-box .content div{
+    width: 100%;
+    text-align: center;
+    margin: 0 auto;
+}
+.com-del-box .content div a{
+    width: 55px;
+    height: 26px;
+    line-height: 26px;
+    display: inline-block;
+    text-align: center;
+    font-size: 14px;
+    cursor: pointer;
+}
+.com-del-box .content div a:first-child{
+    background: #b4b5b9;
+    color: #333;
+    margin-right: 10px;
+}
+.com-del-box .content div a:last-child{
+    background: #5078cb;
+    color: #fff;
+}
+/*.com-del-box .content div a:hover{
+    background: #3f7ae3;
+    color: #fff;
+}*/
+/*---------------------提示框样式 end---------------------*/
+
+/*---------------------btn样式 start---------------------*/
+/*示例(size+type):
+<span class="com-btn-level1 com-btn-submit"></span>
+*/
+/*btnSize*/
+.com-btn-level1 {
+    display: inline-block;
+    height: 25px;
+    width:64px;
+    text-align: center;
+    line-height: 23px;
+    font-size: 14px;
+    cursor: pointer;
+    vertical-align: middle;
+}
+.com-btn-level1[disabled] {
+    cursor: not-allowed;
+}
+.com-btn-level2 {
+    display: inline-block;
+    padding: 0 11px;
+    height: 25px;
+    line-height: 23px;
+    border-radius: 2px;
+    font-size: 12px;
+    cursor: pointer;
+    vertical-align: middle;
+}
+.com-btn-level2[disabled] {
+    cursor: not-allowed;
+}
+/*btnType*/
+.com-btn-submit {
+    color: #fff;
+    background: #5078cb;
+    border: 1px solid #5078cb;
+}
+.com-btn-cancel {
+    background: #c8c6c6;
+    color: #fff;
+    border: 1px solid #c8c6c6;
+}
+.com-btn-detail {
+    color: #fff;
+    background: #ff8522;
+    border: 1px solid #ff8522;
+}
+.com-btn-detail-border {
+    color: #ff8522;
+    background: #fff;
+    border: 1px solid #ff8522;
+}
+.com-btn-red {
+    background: #f15601;
+    color: #fff;
+    border: 1px solid #f15601;
+}
+.com-btn-green {
+    background: #33b401;
+    color: #fff;
+    border: 1px solid #33b401;
+}
+.com-btn-submit-border {
+    border: 1px solid #5078cb;
+    background: #fff;
+    color: #5078cb;
+}
+/*---------------------btn样式 end-----------------------*/
+
+/*---------------------标准控件-新增start---------------------*/
+i.fa-plus-circle{
+    font-size: 16px!important;
+    color: #33b401!important;
+    cursor: pointer;
+}
+/*---------------------标准控件-新增end---------------------*/
+
+/*---------------------标准控件-删除start---------------------*/
+i.fa-minus-circle{
+    font-size: 16px!important;
+    color: #f51c24!important;
+    cursor: pointer;
+}
+/*---------------------标准控件-删除end---------------------*/
+
+/*---------------------标准控件-单选框start---------------------*/
+/** html代码
+    <label class="com-check-radio">
+        <input type="radio" id="effect" name="radio">
+        <label for="effect"></label>
+        生效
+    </label>
+    <label class="com-check-radio">
+        <input type="radio" id="no-effect" name="radio" checked="checked">
+        <label for="no-effect"></label>
+        暂不生效
+    </label>
+**/
+.com-check-radio input[type='radio']{
+    display: none!important;
+    margin: 7px 8px 0!important;
+}
+.com-check-radio input[type='radio'] + label{
+    position: relative!important;
+    top: 7px!important;
+    margin-right: 5px!important;
+    display: inline-block!important;
+    width: 12px!important;
+    height: 12px!important;
+    font-weight: normal!important;
+    background: url(/images/icon/check-rule.png) no-repeat;
+}
+.com-check-radio label{
+    background-position: 0 0!important;
+}
+.com-check-radio input:checked + label{
+    background-position: -15px 0!important;
+}
+/*---------------------标准控件-单选框end---------------------*/
+
+/*---------------------标准控件-复选框start---------------------*/
+/** html代码
+    <label class="com-check-box">
+        <input type="checkbox" id="1">
+        <label for="1"></label>
+    </label>
+**/
+.com-check-box,
+.com-check-box label {
+    margin-bottom: 0;
+}
+.com-check-box input {
+    display: none!important;
+}
+.com-check-box input[type="checkbox"] + label{
+    display: inline-block!important ;
+    position: relative!important ;
+    top: 2px!important ;
+    width: 12px!important ;
+    height: 12px!important ;
+    background: url(/images/icon/check-rule.png) no-repeat ;
+    background-position: -48px 0;
+}
+.com-check-box input:checked + label {
+    background-position: -31px 0;
+}
+/*---------------------标准控件-复选框end---------------------*/
+
+/*---------------------标准控件-开关(蓝色)start---------------------*/
+/** html代码
+    <div class="com-switch-blue">
+        <span class="checkbox">
+            <span><em></em></span>
+        </span>
+        <span class="checkbox active">
+            <span><em></em></span>
+        </span>
+	</div>
+**/
+div.com-switch-blue .checkbox {
+    margin: 0 auto;
+    text-align: center;
+    position: relative;
+    display: block;
+}
+div.com-switch-blue .checkbox span {
+    width: 46px;
+    height: 12px;
+    display: inline-block;
+    border-radius: 18px;
+    border: #e4e4e4 1px solid;
+    cursor: pointer;
+    position: relative;
+    box-shadow: 1px 1px 5px #eee;
+    background: -webkit-gradient(linear,0% 0%, 0% 100%, from(#E0E0E0), to(#E8E8E8), color-stop(0.5,#F2F2F2));
+    transition: background-color .1s ease-out;
+}
+div.com-switch-blue .checkbox.active span{
+    background: #b9cffa;
+}
+div.com-switch-blue .checkbox.active span em{
+    left: 34px;
+}
+div.com-switch-blue .checkbox span em{
+    position: absolute;
+    width: 16px;
+    top: -5px;
+    left: 0;
+    height: 16px;
+    line-height: 16px;
+    background-color: #fff;
+    border: #eee 1px solid;
+    border-radius: 50%;
+    box-shadow: -1px 2px 1px #999;
+    transition: background-color .1s ease-out;
+    color: #666;
+    font-size: 12px;
+}
+div.com-switch-blue .checkbox span em:after{
+    content: '';
+    width: 6px;
+    height: 6px;
+    display: inline-block;
+    background: #dedcdc;
+    border-radius: 100%;
+    position: absolute;
+    top: 4px;
+    left: 4px;
+}
+/*---------------------标准控件-开关(蓝色)end---------------------*/
+
+/*---------------------标准控件-开关(绿色)start---------------------*/
+/** html代码
+    <div class="com-switch-green">
+        <span class="checkbox">
+            <span><em></em></span>
+        </span>
+        <span class="checkbox active">
+            <span><em></em></span>
+        </span>
+	</div>
+**/
+div.com-switch-green .checkbox {
+    margin: 0 auto;
+    text-align: center;
+    position: relative;
+    display: block;
+}
+div.com-switch-green .checkbox span {
+    width: 34px;
+    height: 18px;
+    display: inline-block;
+    border-radius: 18px;
+    border: #e4e4e4 1px solid;
+    cursor: pointer;
+    position: relative;
+    box-shadow: 1px 1px 5px #eee;
+    background: -webkit-gradient(linear,0% 0%, 0% 100%, from(#bbbcba), to(#bfc1be), color-stop(0.5,#c5c7c4));
+    transition: background-color .1s ease-out;
+}
+div.com-switch-green .checkbox.active span{
+    background: #3acb14;
+}
+div.com-switch-green .checkbox.active span em{
+    left: 18px;
+}
+div.com-switch-green .checkbox span em{
+    position: absolute;
+    top: -2px;
+    left: -3px;
+    width: 18px;
+    height: 18px;
+    line-height: 18px;
+    background-color: #fff;
+    border: #eee 1px solid;
+    border-radius: 50%;
+    box-shadow: -1px 2px 1px #999;
+    transition: background-color .1s ease-out;
+    color: #666;
+    font-size: 12px;
+}
+div.com-switch-green .checkbox span em:after{
+    content: '';
+    width: 6px;
+    height: 6px;
+    display: inline-block;
+    background: #dedcdc;
+    border-radius: 100%;
+    position: absolute;
+    top: 5px;
+    left: 5px;
+}
+/*---------------------标准控件-开关(绿色)end---------------------*/
+
+/*---------------------信息提示框 start---------------------*/
+/** html代码
+    <div class="tip">
+        XXXX
+	</div>
+**/
+div.tip{
+    display: none;
+    padding: 13px 10px;
+    font-size: 12px;
+    color: #333;
+    background-color: #fff;
+    border: 1px solid #89aefa;
+    border-radius: 2px;
+    box-shadow: 2px 2px 5px #dedede;
+    -webkit-box-shadow: 2px 2px 5px #dedede;
+    -moz-box-shadow: 2px 2px 5px #dedede;
+    -o-box-shadow: 2px 2px 5px #dedede;
+}
+/*---------------------信息提示框 end---------------------*/
+
+
+/*---------------------提示浮层 start---------------------*/
+.com-supernatant-box{
+    max-width:360px;
+    opacity:.6;
+    border-radius:5px;
+}
+.com-supernatant-box div{
+    position:fixed;
+    top:59%;
+    left:50%;
+    width:100%;
+    transform:translate(-50%,-50%);
+    color: #333;
+}
+.com-supernatant-box .success{
+    background: #f00000;
+}
+.com-supernatant-box .defeat{
+    background: #5078cb;
+}
+/*-------------------------提示浮层 end--------------------*/
+
+/*------下拉选框的使用样式方法------------------------------*/
+/*
+<div class='com-select-option'>
+    <input id="classesType" ng-blur="onBlur()"  ng-click="changeShowLogistics()" type="text" class="form-control" ng-model="message.classes"  placeholder="请选择消息类型" readonly="true" >
+    <ul id="ulContent" ng-if="matchData && showContent" class="dropdown-menu">
+     <li ng-click="showText(classes)" ng-repeat="classes in resultList" ng-class="{'active': $index==selectIndex}" ng-bind="classes" ng-bind="message.classes"></li>
+    </ul>
+ </div>
+*/
+/*-------------------------下拉选框 start-------------- --*/
+.com-select-option {
+    position: relative;
+}
+.com-select-option>input {
+    vertical-align: middle;
+    width: 190px;
+    margin-top: -2px;
+    background-color: white !important;
+    height: 30px;
+    background: url(/images/icon/icon-xiala.png) no-repeat 167px 11px;
+    cursor: pointer;
+}
+.com-select-option .dropdown-menu{
+    top: 90%;
+    left: unset;
+    line-height: 30px;
+    max-height: 300px;
+    overflow-y: auto;
+    width: 190px;
+    display: block;
+    overflow-x: hidden;
+    border-radius: 2px;
+}
+.com-select-option .dropdown-menu li{
+    font-size: 14px;
+    cursor: pointer;
+    padding-left:10px;
+    height: 30px;
+}
+.com-select-option .dropdown-menu li:hover, .dropdown-menu li.active{
+    color: #fff;
+    background: #5078cb;
+}
+/*-------------------------下拉选框 end--------------------*/
+/*-------------------------分页 start--------------------*/
+/*主要分页table(使用tableParams即可)*/
+
+/*主要分页非table代码示例*/
+/*
+<div class="ng-cloak ng-table-pager com-sup-pager">
+    <ul class="pagination ng-table-pagination">
+        <li ng-class="{'disabled': !page.active && !page.current, 'active': page.current}" ng-repeat="page in pages" ng-switch="page.type">
+            <a ng-switch-when="prev" ng-click="setPage(page.type, -1)" href="">&laquo;</a>
+            <a ng-switch-when="first" ng-click="setPage(page.type, page.number)" href=""><span ng-bind="page.number"></span></a>
+            <a ng-switch-when="page" ng-click="setPage(page.type, page.number)" href=""><span ng-bind="page.number"></span></a>
+            <a ng-switch-when="more" ng-click="setPage(page.type, -1)" href="">&#8230;</a>
+            <a ng-switch-when="last" ng-click="setPage(page.type, page.number)" href=""><span ng-bind="page.number"></span></a>
+            <a ng-switch-when="next" ng-click="setPage(page.type, -1)" href="">&raquo;</a>
+        </li>
+    </ul>
+    <div class="page-go-block">
+        <input class="page-number" type="text" ng-model="param.currentPage" ng-keydown="listenEnter()"/>
+        <a class="page-a" ng-click="setPage('page', param.currentPage)">GO</a>
+    </div>
+</div>
+*/
+.com-sup-pager .pagination{
+    margin-bottom: 0;
+}
+.com-sup-pager .pagination.ng-table-pagination > li > a > span {
+    height: 17px;
+    line-height: 17px;
+}
+.com-sup-pager .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{
+    z-index: 2;
+    color: #fff;
+    cursor: default;
+    background-color: #5078cb;
+    border-color: #5078cb;
+}
+.com-sup-pager .pagination.ng-table-pagination > li > a{
+    font-size: 12px;
+}
+.com-sup-pager.ng-table-pager  input.page-number {
+    vertical-align: inherit;
+    display: inline-block;
+    width: 40px;
+    height: 31px;
+    padding: 6px 6px;
+    font-size: 14px;
+    line-height: 1.42857143;
+    color: #9B9792;
+    text-align: center;
+    background-color: #F6F5F4;
+    background-image: none;
+    border: 1px solid #ccc;
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+}
+.com-sup-pager.ng-table-pager{
+    margin-right: 0 !important;
+    background: #fff;
+}
+.com-sup-pager.ng-table-pager a.page-a {
+    color: #fff;
+    cursor: pointer;
+    background-color: #5078cb;
+    border-color: #5078cb;
+    padding: 7px 6px;
+    font-size: 14px;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+    text-decoration: none;
+    height: 31px;
+}
+
+.com-sup-pager.ng-table-pager div.page-go-block {
+    float: right;
+    margin-left: 20px;
+    font-size: 0px;
+    height: 31px;
+    line-height: 31px;
+}
+
+/*次要分页代码示例*/
+/*
+ <div class="ng-cloak ng-table-pager com-sub-pager text-center">
+        <ul class="pagination ng-table-pagination">
+            <li ng-class="{'disabled': !page.active && !page.current, 'active': params.page == page.number}" ng-repeat="page in pages" ng-switch="page.type">
+                <a ng-switch-when="prev" ng-click="setPage(page.type, -1)">&laquo;</a>
+                <a ng-switch-when="first" ng-click="setPage(page.type, page.number)"><span ng-bind="page.number"></span></a>
+                <a ng-switch-when="page" ng-click="setPage(page.type, page.number)"><span ng-bind="page.number"></span></a>
+                <a ng-switch-when="more" ng-click="setPage(page.type, -1)">&#8230;</a>
+                <a ng-switch-when="last" ng-click="setPage(page.type, page.number)"><span ng-bind="page.number"></span></a>
+                <a ng-switch-when="next" ng-click="setPage(page.type, -1)">&raquo;</a>
+            </li>
+        </ul>
+        <div class="page-go-block" ng-if="rolesData.length>6">
+            <input class="page-number" type="text" ng-model="params.currentPage" ng-keydown="listenEnter()"/>
+            <a class="page-a" ng-click="setPage('page', params.currentPage)">GO</a>
+        </div>
+    </div>
+*/
+.com-sub-pager .ng-table-pagination a {
+    border: none;
+    font-size: 12px;
+    cursor: pointer;
+}
+.com-sub-pager .pagination li:first-child a, .com-sub-pager .pagination li:last-child a{
+    font-size: 20px;
+}
+.com-sub-pager ul.pagination.ng-table-pagination > li > a > span {
+    height: 17px;
+    line-height: 17px;
+    color: #666;
+}
+.com-sub-pager.ng-table-pager {
+    background: #f4f4f4;
+    margin: 0!important;
+    padding-right: 29px;
+}
+.com-sub-pager.ng-table-pager  input.page-number {
+    vertical-align: inherit;
+    display: inline-block;
+    width: 37px;
+    height: 28px;
+    padding: 6px 6px;
+    font-size: 12px;
+    line-height: 1.42857143;
+    color: #9B9792;
+    text-align: center;
+    background-color: #F6F5F4;
+    background-image: none;
+    border: 1px solid #ccc;
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+}
+
+.com-sub-pager.ng-table-pager a.page-a {
+    color: #fff;
+    cursor: pointer;
+    padding: 5.55px 6px;
+    font-size: 12px;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+    text-decoration: none;
+    height: 31px;
+}
+
+.com-sub-pager.ng-table-pager .page-go-block {
+    float: right;
+    font-size: 0px;
+    height: 31px;
+    margin-top: 20px;
+    line-height: 31px;
+}
+.com-sub-pager.ng-table-pager .ng-table-pagination{
+    text-align: center;
+    max-width: 460px;
+    margin: 0;
+}
+.com-sub-pager.ng-table-pager .ng-table-pagination a{
+    height: 29px;
+    line-height: 13px;
+}
+.com-sub-pager .pagination li.active a span{
+    color: white !important;
+}
+.com-sub-pager.ng-table-pager .ng-table-pagination li.active a {
+    background: none!important;
+}
+.com-sub-pager.ng-table-pager .ng-table-pagination li a {
+    background: none!important;
+}
+.com-sub-pager.ng-table-pager .ng-table-pagination li.active a span {
+    color: #5078cb!important;
+}
+/*-------------------------分页 end--------------------*/
+
+/*----------遮罩层 start-------------*/
+.modal-wrap {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: rgba(0, 0, 0, .3);
+  z-index: 1;
+}
+/*----------遮罩层 end-------------*/

+ 1 - 1
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'

+ 508 - 0
components/personalMaterial/PersonalMaterial.vue

@@ -0,0 +1,508 @@
+<template>
+  <div class="personal-material">
+    <a @click="goLastPage">&lt;返回上一层</a>
+    <div class="personal-material-header">
+      <p><i class="fa fa-exclamation-circle"></i>抱歉,您的账户未绑定企业,暂无卖家权限!</p>
+      <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" v-model="keyword" placeholder="请输入企业全称" @keyup.13="onSearchEnterprise"><span @click="onSearchEnterprise">检测</span></div>
+          <div class="result-content" v-if="showSearchResultStatus == 1">
+            <p v-text="enInfo.name"></p>
+            <div class="result-text">
+              <span>管理员</span>
+              <span v-text="enInfo.adminName"></span>
+            </div>
+            <div class="result-text">
+              <span>营业执照号</span>
+              <span v-text="enInfo.businessCode"></span>
+            </div>
+            <a href="javascript:void(0)" @click="bindEnterprise">申请绑定</a>
+            <div class="result-remind">管理员审核通过后成功绑定</div>
+          </div>
+          <p class="no-result-content" v-if="showSearchResultStatus == 2">
+            {{enName}} <span>(未开店)</span>
+          </p>
+        </div>
+      </div>
+      <div class="not-open-store">
+        <p><img src="/images/material/arrow-right-yellow.png" alt="">所属企业未开店</p>
+        <div>
+          <div class="fl">
+            <img src="/images/material/car.png" alt="">
+            <ul>
+              <li>免费入驻 不赚差价</li>
+              <li>库存寄售 极速上架</li>
+              <li>定量广告 限时免费</li>
+            </ul>
+          </div>
+          <div class="fr">
+            <img src="/images/material/house.png" alt="">
+            <div>
+              <p>请点击下方按钮开设新的店铺</p>
+              <a href="/register-saler">开设新店铺</a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="modal-wrap" v-show="showRemindBox || showApplyRecord"></div>
+    <div class="com-del-box" v-if="showRemindBox">
+      <div class="title">
+        <i @click="goLastPage"></i>
+      </div>
+      <p><img src="/images/material/check.png" alt="">绑定申请提交成功!</p>
+      <div class="result">审批结果将以短信通知,请保持手机通畅。</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="" @click="setShowApplyRecord(false)"></div>
+      <div class="record-wrap">
+        <div class="record-title">
+          <span>企业名称</span>
+          <span>管理员</span>
+          <span>申请时间</span>
+          <span>状态</span>
+        </div>
+        <ul>
+          <li v-for="item in applyList">
+            <span>{{item.enName}}</span>
+            <span>{{item.adminName}}</span>
+            <span>{{item.date | date}}</span>
+            <span :class="{'green-text': item.status == 311, 'red-text': item.status == 317}">{{item.status | status}}</span>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    data () {
+      return {
+        showApplyRecord: false,
+        showRemindBox: false,
+        // 0=>初始状态,1=>有搜索结果,2=>搜索结果为空
+        showSearchResultStatus: 0,
+        keyword: '',
+        enName: '',
+        enInfo: {},
+        timer: 5,
+        applyList: []
+      }
+    },
+    computed: {
+      user () {
+        return this.$store.state.option.user
+      }
+    },
+    filters: {
+      date: function (input) {
+        const d = new Date(input)
+        const year = d.getFullYear()
+        const monthTemp = d.getMonth() + 1
+        const month = monthTemp < 10 ? '0' + monthTemp : '' + monthTemp
+        const hour = d.getHours() < 10 ? '0' + d.getHours() : '' + d.getHours()
+        const minutes = d.getMinutes() < 10 ? '0' + d.getMinutes() : '' + d.getMinutes()
+        const seconds = d.getSeconds() < 10 ? '0' + d.getSeconds() : d.getSeconds()
+        const day = d.getDate() < 10 ? '0' + d.getDate() : '' + d.getDate()
+        return year + '-' + month + '-' + day + ' ' + hour + ':' + minutes + ':' + seconds
+      },
+      status: function (status) {
+        switch (status) {
+          case 311:
+            return '待审核'
+          case 316:
+            return '已通过'
+          case 317:
+            return '未通过'
+          default:
+            break
+        }
+      }
+    },
+    methods: {
+      goLastPage: function () {
+        window.history.back(-1)
+      },
+      onSearchEnterprise: function () {
+        if (this.keyword) {
+          this.$http.get('/basic/enterprise/findByName/' + encodeURIComponent(this.keyword)).then(response => {
+            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.user.data.userTel, enName: this.enInfo.name, businessCode: this.enInfo.businessCode}})
+          .then(response => {
+            if (response.data.data === 'success') {
+              this.showSearchResultStatus = 0
+              this.keyword = ''
+              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
+            this.goLastPage()
+          }
+        }, 1000)
+      },
+      setShowApplyRecord: function (flag) {
+        if (flag) {
+          this.$http.get('/basic/enterprise/findApplyInfo', {params: {phone: this.user.data.userTel}})
+            .then(responses => {
+              this.applyList = responses.data
+              this.showApplyRecord = flag
+            }, err => {
+              console.log(err)
+              this.$message.error('系统错误')
+            })
+        } else {
+          this.showApplyRecord = flag
+        }
+      }
+    }
+  }
+</script>
+<style lang="scss" scoped>
+  .personal-material {
+    width: 1190px;
+    margin: 0 auto;
+    p {
+      margin: 0;
+    }
+    a {
+      color: #5078cb;
+    }
+    > a {
+      line-height: 71px;
+      position: relative;
+      right: 105px;
+    }
+    .personal-material-header {
+      height: 111px;
+      line-height: 111px;
+      border: 1px solid #ebeaea;
+      position: relative;
+      margin-bottom: 19px;
+      p {
+        color: #5078cb;
+        font-size: 22px;
+        text-align: center;
+        i {
+          margin-right: 20px;
+        }
+      }
+      a {
+        position: absolute;
+        right: 11px;
+        bottom: 14px;
+        display: inline-block;
+        line-height: normal;
+      }
+    }
+    .personal-material-content {
+      border: 1px solid #ebeaea;
+      margin-bottom: 147px;
+      padding: 0 95px;
+      > div {
+        padding: 0 50px;
+        border-radius: 3px;
+        > p {
+          height: 81px;
+          line-height: 81px;
+          font-size: 16px;
+          font-weight: bold;
+          img {
+            margin-right: 4px;
+          }
+        }
+      }
+      .is-open-store {
+        padding-bottom: 29px;
+        border-bottom: 1px solid #d5d5d5;
+        > div {
+          min-height: 140px;
+          border: 1px solid #5078cb;
+          > p {
+            font-weight: bold;
+            font-size: 18px;
+            margin: 26px 0;
+            text-align: center;
+          }
+          .search-content {
+            text-align: center;
+            input {
+              width: 290px;
+              display: inline-block;
+              height: 30px;
+              border: {
+                top-left-radius: 3px;
+                bottom-left-radius: 3px;
+                top-right-radius: 0;
+                bottom-right-radius: 0;
+              }
+              border-top-left-radius: 3px;
+              border-bottom-left-radius: 3px;
+              border: 1px solid #cdcdcd;
+              margin-left: 10px;
+            }
+            span {
+              display: inline-block;
+              width: 87px;
+              height: 30px;
+              line-height: 31px;
+              text-align: center;
+              color: #fff;
+              background: #5078cb;
+              margin-left: -1px;
+              border-top-right-radius: 3px;
+              border-bottom-right-radius: 3px;
+              cursor: pointer;
+            }
+          }
+          .result-content {
+            padding: 0 0 0 221px;
+            p {
+              height: 41px;
+              line-height: 41px;
+              font-size: 16px;
+              font-weight: bold;
+              margin: 24px 0 0 0;
+              width: 376px;
+              border-bottom: 1px solid #e6e5e4;
+              padding-left: 8px;
+            }
+            .result-text {
+              padding-left: 8px;
+              span {
+                &:first-child {
+                  display: inline-block;
+                  width: 111px;
+                  color: #666;
+                }
+              }
+              &:first-of-type {
+                margin: 15px 0 21px 0;
+              }
+            }
+            > a {
+              display: inline-block;
+              width: 201px;
+              height: 40px;
+              line-height: 40px;
+              text-align: center;
+              border-radius: 3px;
+              background: #5078cb;
+              color: #fff;
+              margin: 37px 0 16px 130px;
+            }
+            .result-remind {
+              margin: 0 0 18px 146px;
+              color: #666;
+            }
+          }
+          .no-result-content {
+            font-size: 16px;
+            margin: 26px 0 38px 220px;
+            text-align: left;
+            span {
+              color: #f00707;
+              font-weight: normal;
+            }
+          }
+        }
+      }
+      .not-open-store {
+        margin-bottom: 62px;
+        > div {
+          height: 171px;
+          border: 1px solid #ff8522;
+          .fl {
+            list-style: inside;
+            color: #ff8522;
+            height: 130px;
+            width: 391px;
+            margin-top: 25px;
+            border-right: 1px dashed #fce3cf;
+            img {
+              margin: 11px 0 0 16px;
+            }
+            ul {
+              list-style: inside;
+              color: #ff8522;
+              float: right;
+              margin: 19px 61px 0 0;
+              li {
+                margin-bottom: 20px;
+                white-space: nowrap;
+                &:nth-child(2) {
+                  margin-left: 10px;
+                }
+                &:nth-child(3) {
+                  margin-left: 29px;
+                }
+              }
+            }
+          }
+          .fr {
+            width: 504px;
+            img {
+              margin: 45px 0 0 62px;
+            }
+            div {
+              float: right;
+              margin-right: 140px;
+              margin-top: 44px;
+              text-align: center;
+              p {
+                margin-bottom: 29px;
+              }
+              a {
+                display: inline-block;
+                width: 124px;
+                height: 32px;
+                color: #fff;
+                font-size: 14px;
+                text-align: center;
+                line-height: 32px;
+                background: #ff8522;
+                border-radius: 3px;
+                cursor: pointer;
+              }
+            }
+          }
+        }
+      }
+    }
+    .com-del-box {
+      text-align: center;
+      -webkit-box-shadow: none;
+      -moz-box-shadow: none;
+      box-shadow: none;
+      border-radius: 3px;
+      > p {
+        margin-top: 20px;
+        margin-bottom: 10px;
+        color: #5078cb;
+        img {
+          position: relative;
+          bottom: 2px;
+          margin-right: 8px;
+        }
+      }
+      .result {
+        color: #333;
+        margin-bottom: 24px;
+      }
+      .remind {
+        font-size: 12px;
+        color: #666;
+        span {
+          color: #f40d0d;
+        }
+      }
+    }
+    .apply-record {
+      position: fixed;
+      top: 23%;
+      left: 31%;
+      z-index: 10;
+      width: 577px;
+      height: 239px;
+      background: #fff;
+      .title {
+        height: 40px;
+        line-height: 40px;
+        text-align: center;
+        font-size: 16px;
+        color: #333;
+        img {
+          float: right;
+          margin: 10px 11px 0 0;
+          cursor: pointer;
+
+        }
+      }
+    }
+    .record-wrap {
+      padding: 0 18px;
+      .record-title {
+        height: 28px;
+        line-height: 28px;
+        background: #8eb0f5;
+        border: 1px solid #e8e8e8;
+        color: #fff;
+      }
+      ul {
+        max-height: 150px;
+        overflow-y: auto;
+        overflow-x: hidden;
+        li {
+          border-bottom: 1px solid #e8e8e8;
+          height: 30px;
+          &:nth-child(even) {
+            background: #edf2fd;
+          }
+          &:nth-child(odd) {
+            background: #f7f9fe;
+          }
+          span {
+            line-height: 26px;
+            position: relative;
+            top: 2px;
+            &.green-text {
+              color: #379b1d;
+            }
+            &.red-text {
+              color: #f51c24;
+            }
+          }
+        }
+      }
+      span {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        display: inline-block;
+        text-align: center;
+        &:nth-child(1) {
+          width: 220px;
+          padding: 0 10px 0 22px;
+        }
+        &:nth-child(2) {
+          width: 68px;
+        }
+        &:nth-child(3) {
+          width: 165px;
+        }
+        &:nth-child(4) {
+          width: 82px;
+        }
+      }
+    }
+  }
+</style>

+ 3 - 0
components/personalMaterial/index.js

@@ -0,0 +1,3 @@
+import PersonalMaterial from './PersonalMaterial.vue'
+
+export { PersonalMaterial }

+ 1 - 1
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://10.1.51.95:8080/platform-b2c/')
 
 module.exports = {
   router: {

+ 14 - 0
pages/personalMaterial/index.vue

@@ -0,0 +1,14 @@
+<template>
+  <div>
+    <personal-material></personal-material>
+  </div>
+</template>
+<script>
+  import {PersonalMaterial} from '~components/PersonalMaterial'
+  export default {
+    middleware: 'authenticated',
+    components: {
+      PersonalMaterial
+    }
+  }
+</script>

BIN
static/images/icon/check-rule.png


BIN
static/images/icon/close.png


BIN
static/images/icon/icon-xiala.png


BIN
static/images/material/apply-close.png


BIN
static/images/material/arrow-right-blue.png


BIN
static/images/material/arrow-right-yellow.png


BIN
static/images/material/car.png


BIN
static/images/material/check.png


BIN
static/images/material/house.png