出口退税

src/api/myApplication/exportTax.js

@@ -21,3 +21,11 @@ export function taxRebate() {
     method: 'get'
   })
 }
+// 出口退税详情
+export function taxDetail(params) {
+  return request({
+    url: '/taxRebate/details',
+    method: 'get',
+    params
+  })
+}

src/router/index.js

@@ -103,8 +103,8 @@ export const constantRoutes = [
   },
   businessManage,
   myTrade,
-  myAccounts
-  // myApplication
+  myAccounts,
+  myApplication
   // 404 page must be placed at the end !!!
   // { path: '*', redirect: '/404', hidden: true }
 ]

src/router/moudules/myApplication.js

@@ -54,7 +54,18 @@ export default {
       component: () => import('@/views/myApplication/tax/index'),
       meta: {
         title: '出口退税申请' // 出口退税申请
-      }
+      },
+      children: [
+        {
+          path: 'exportTaxView',
+          name: 'ExportTaxView',
+          component: () => import('@/views/myApplication/tax/view'),
+          hidden: true,
+          meta: {
+            title: '出口退税详情', activeMenu: '/exportTax'
+          }
+        }
+      ]
     }
   ]
 }

src/views/businessManage/tradeRelations/importer/components/BasicInfo.vue

@@ -101,7 +101,7 @@
         </div>
       </el-form-item>
       <el-form-item label="结算账期" prop="settlementPeriod">
-        <el-input v-model="ruleForm.settlementPeriod" placeholder="请输入有效的邮箱地址" :disabled="disabled">
+        <el-input v-model="ruleForm.settlementPeriod" placeholder="请输入结算账期" :disabled="disabled">
           <template slot="suffix">Days</template>
         </el-input>
       </el-form-item>
@@ -115,7 +115,7 @@
               :value="item.dictValue"
             />
           </el-select>
-          <el-input v-model="ruleForm.tradingAmountPastYear" placeholder="请输入交易年限" :disabled="disabled" @change="setParams($event, 'tradeForOneYear', 'tradingAmountPastYearCurrency')" />
+          <el-input v-model="ruleForm.tradingAmountPastYear" placeholder="请输入金额" :disabled="disabled" @change="setParams($event, 'tradeForOneYear', 'tradingAmountPastYearCurrency')" />
         </div>
       </el-form-item>
       <el-form-item label="拟申请额度金额" prop="applyMoney">

src/views/login/component/pageFooter.vue

@@ -0,0 +1,59 @@
+<template>
+  <div class="page-foot">
+    <div>
+      
+    </div>
+    <div></div>
+    <div></div>
+    <div v-if="notHomepagePath.includes($route.path)" class="bottom-cont">
+      <div class="bt-l">
+        <div class="bt-l-orange" @click="handleJumpFiling">© 陕ICP备2024033180号-1</div>
+        <template v-if="!isMobileTerminal">
+          <div class="bt-l-orange" @click="handleClickProtocol">用户协议</div>
+          <div
+            class="bt-l-orange"
+            @click="handleJumpInkasso"
+          >长安银科官网：www.changan-inkasso.com</div>
+        </template>
+        <div v-if="isMobileTerminal">服务邮箱：citp@changan-inkasso.com</div>
+        <div v-if="isMobileTerminal">服务电话：029-86689192</div>
+      </div>
+      <div v-if="!isMobileTerminal" class="bt-m">
+        <div class="case-cont" @click="handleJumpCase">陕公网安备61019102000586号</div>
+        <div>服务邮箱：citp@changan-inkasso.com</div>
+        <div>服务电话：029-86689192</div>
+      </div>
+      <div class="bt-r">
+        <div class="qrocde" />
+        <div class="qrcode-desc">关注长银</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Login',
+  components: {},
+  data() {
+    return {
+      menuList: ['服务商入驻', '入驻教程', '关于我们', '服务条款', '隐私条款', '常见问题']
+    }
+  },
+  methods: {}
+}
+</script>
+
+<style lang="scss" scoped>
+.page-foot {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  height: 190px;
+  background-color: #32373E;
+  color: #FFFFFF;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+}
+</style>

src/views/login/component/pageHead.vue

@@ -0,0 +1,86 @@
+<template>
+  <div class="page-head">
+    <div>
+      <el-image :src="require('../../../assets/login1/comLogo.svg')" style="width: 136px; height: 42px;" @click="toNet" />
+      <div v-for="(item, index) in bannerList" :key="index" style="display: inline-block;" :class="activeIndex === index ? 'active-menu' : ''" @click="toPage(index)">
+        <span v-if="index !== 1">{{ item }}</span>
+        <el-dropdown v-else trigger="click" @command="toProduct">
+          <span class="el-dropdown-link">
+            产品服务<i class="el-icon-arrow-down el-icon--right" />
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item command="1">长银e融</el-dropdown-item>
+            <el-dropdown-item command="2">长银e贸</el-dropdown-item>
+            <el-dropdown-item command="3">长银钱包</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+    </div>
+    <div>
+      <el-button type="primary" @click="$emit('btnClick', 'login')">登 录</el-button>
+      <el-button type="primary" @click="$emit('btnClick', 'register')">注册</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'PageHeader',
+  data() {
+    return {
+      bannerList: ['首页', '产品服务', '外贸工具', '关于我们'],
+      activeIndex: 0
+    }
+  },
+  watch: {
+    activeIndex: {
+      handler: function(val) {
+        this.$emit('changeMenu', val)
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    toPage(info) {
+      this.activeIndex = info
+    },
+    toProduct(info) {},
+    toNet() {
+      this.$router.push('/login')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.page-head {
+  width: 100vw;
+  height: 70px;
+  position: fixed;
+  left: 0;
+  top: 0;
+  border-bottom: 1px solid #E5E7EB;
+  padding: 0 100px;
+  background-color: #ffffff;
+  display: flex;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  flex-direction: row;
+  line-height: 70px;
+  .el-image {
+    vertical-align: middle;
+    cursor: pointer;
+  }
+  span {
+    display: inline-block;
+    margin-left: 70px;
+    color: #131820;
+    font-size: 14px;
+    font-weight: 400;
+    cursor: pointer;
+  }
+  .active-menu span {
+    color: #FE7D0B
+  }
+}
+</style>

src/views/login/index.vue

@@ -1,55 +1,9 @@
 <template>
   <div class="login-container">
-    <!-- <div v-if="!isMobileTerminal" class="top-banner">
-      <div class="banner-cont">
-        <img src="@/assets/login/top-mail.png">
-        <span>邮箱  sales@changan-inkasso.com</span>
-      </div>
-      <div class="banner-cont">
-        <img src="@/assets/login/top-phone.png">
-        <span>电话 +86（755）3633 9382</span>
-      </div>
-    </div> -->
-    <div class="login-nav">
-      <div class="logo-cont" @click="clickLogo">
-        <svg-icon icon-class="logo" style="width: 136px; height: 42px;" />
-      </div>
-      <template v-if="!isMobileTerminal">
-        <div class="nav-desc">
-          <div v-for="item in bannerList" :key="item.order" :style="item.isActice ? 'color: #FE7D0B': ''" @click="clickNav(item.order)">
-            {{ item.name }}
-          </div>
-        </div>
-      </template>
-      <div v-if="isMobileTerminal" class="mobile-btn">
-        <img
-          v-if="!showCloseIcon"
-          src="@/assets/login/mobile_1.png"
-          :style="iconAnimate1"
-          @click="mobileIconClick"
-        >
-        <img
-          v-if="showCloseIcon"
-          src="@/assets/login/mobile_2.png"
-          :style="iconAnimate2"
-          @click="mobileIconClick"
-        >
-      </div>
-      <div v-if="!isMobileTerminal && $route.path !== '/login/register'">
-        <el-button type="primary" round @click="loginClick('login')">登 录</el-button>
-        <el-button type="text" @click="loginClick('register')">注册</el-button>
-      </div>
-    </div>
+    <page-head @changeMenu="toOtherPage" @btnClick="loginClick" />
     <div v-if="showBackToTop && !isMobileTerminal" class="back-to-top" @click="backTotop">
       <i class="el-icon-top" />
     </div>
-    <template v-if="isMobileTerminal">
-      <div v-if="showCloseIcon" class="nav-desc-mobile">
-        <div v-for="item in bannerMobileList" :key="item.order" :style="item.isActice ? 'color: #FE7D0B': ''" @click="clickNav(item.order)">
-          {{ item.name }}
-        </div>
-      </div>
-    </template>
     <router-view :key="key" />
     <div v-if="loginStatus" class="login-modal" />
     <transition mode="out-in">
@@ -141,7 +95,8 @@ export default {
     RegisterProtocal: () => import('./components/RegisterProtocal'),
     PrivacyProtocal: () => import('./components/PrivacyProtocal'),
     HomeBottom: () => import('./components/HomeBottom'),
-    ChangePassword: () => import('./components/ChangePassword')
+    ChangePassword: () => import('./components/ChangePassword'),
+    PageHead: () => import('./component/pageHead.vue')
   },
   data() {
     return {
@@ -257,6 +212,13 @@ export default {
     window.removeEventListener('resize', this.isMobile)
   },
   methods: {
+    toOtherPage(val) {
+      console.log(val, 'val')
+    },
+    loginClick(type) {
+      this.loginStatus = true
+      this.loginType = type
+    },
     preventDefault(e) {
       e.preventDefault()
     },
@@ -278,10 +240,6 @@ export default {
     mobileIconClick() {
       this.showCloseIcon = !this.showCloseIcon
     },
-    loginClick(type) {
-      this.loginStatus = true
-      this.loginType = type
-    },
     protocol(type) {
       this.protocolStatus = type
     },
@@ -345,11 +303,6 @@ export default {
     .login-nav {
       padding: 0 !important;
       justify-content: center !important;
-      .nav-desc {
-        flex: initial !important;
-        width: 44% !important;
-        padding-left: 6% !important;
-      }
     }
   }
 }
@@ -359,11 +312,6 @@ export default {
     .login-nav {
       padding: 0 !important;
       justify-content: center !important;
-      .nav-desc {
-        flex: initial !important;
-        width: 62% !important;
-        padding-left: 6% !important;
-      }
     }
   }
 }
@@ -429,22 +377,6 @@ export default {
     justify-content: space-between;
     align-items: center;
     overflow: hidden;
-    .logo-cont {
-      cursor: pointer;
-    }
-    .nav-desc {
-      flex: 1;
-      height: 100%;
-      display: flex;
-      align-items: center;
-      font-size: 16px;
-      color: #E6E6E6;
-      padding-left: 8%;
-      div {
-        cursor: pointer;
-        margin-right: 8%;
-      }
-    }
     .nav-btn {
       flex-basis: 100px;
     }
@@ -597,19 +529,6 @@ export default {
       align-items: center;
       overflow: hidden;
     }
-    .nav-desc {
-      flex: initial;
-      height: 100%;
-      display: flex;
-      align-items: center;
-      font-size: 16px;
-      color: #E6E6E6;
-      padding-left: 8%;
-      div {
-        cursor: pointer;
-        margin-right: 8%;
-      }
-    }
     .nav-desc-mobile {
       position: fixed;
       top: 60px;

src/views/login/index1.vue

@@ -1,725 +1,27 @@
 <template>
-  <div class="login-container">
-    <!-- <div v-if="!isMobileTerminal" class="top-banner">
-      <div class="banner-cont">
-        <img src="@/assets/login/top-mail.png">
-        <span>邮箱  sales@changan-inkasso.com</span>
-      </div>
-      <div class="banner-cont">
-        <img src="@/assets/login/top-phone.png">
-        <span>电话 +86（755）3633 9382</span>
-      </div>
-    </div> -->
-    <div class="login-nav">
-      <div class="logo-cont" @click="clickLogo">
-        <svg-icon icon-class="logo" style="width: 136px; height: 42px;" />
-      </div>
-      <template v-if="!isMobileTerminal">
-        <div class="nav-desc">
-          <div v-for="item in bannerList" :key="item.order" :style="item.isActice ? 'color: #FE7D0B': ''" @click="clickNav(item.order)">
-            {{ item.name }}
-          </div>
-        </div>
-      </template>
-      <div v-if="isMobileTerminal" class="mobile-btn">
-        <img
-          v-if="!showCloseIcon"
-          src="@/assets/login/mobile_1.png"
-          :style="iconAnimate1"
-          @click="mobileIconClick"
-        >
-        <img
-          v-if="showCloseIcon"
-          src="@/assets/login/mobile_2.png"
-          :style="iconAnimate2"
-          @click="mobileIconClick"
-        >
-      </div>
-      <div v-if="!isMobileTerminal && $route.path !== '/login/register'">
-        <el-button type="primary" round @click="loginClick('login')">登 录</el-button>
-        <el-button type="text" @click="loginClick('register')">注册</el-button>
-      </div>
-    </div>
-    <div v-if="showBackToTop && !isMobileTerminal" class="back-to-top" @click="backTotop">
-      <i class="el-icon-top" />
-    </div>
-    <template v-if="isMobileTerminal">
-      <div v-if="showCloseIcon" class="nav-desc-mobile">
-        <div v-for="item in bannerMobileList" :key="item.order" :style="item.isActice ? 'color: #FE7D0B': ''" @click="clickNav(item.order)">
-          {{ item.name }}
-        </div>
-      </div>
-    </template>
-    <router-view :key="key" />
-    <div v-if="loginStatus" class="login-modal" />
-    <transition mode="out-in">
-      <div v-if="loginStatus" class="login-container-box">
-        <div class="left">
-          <div>
-            <template v-if="loginType === 'register' && protocolStatus === 'register'">
-              <register-protocal />
-            </template>
-            <template v-else-if="loginType === 'register' && protocolStatus === 'privacy'">
-              <privacy-protocal />
-            </template>
-            <template v-else>
-              <img src="../../assets/login/leftLogo.png" alt="">
-            </template>
-          </div>
-        </div>
-        <div class="back-home" @click="() => { loginStatus = false }">
-          <svg-icon icon-class="backArrow" style="width: 14px; height: 14px;" />
-          返回首页
-        </div>
-        <login-content v-if="loginType === 'login'" @hideLogin="showChangePwd" />
-        <register-content v-if="loginType === 'register'" @protocol="protocol" @goLogin="() => { loginClick('login')}" />
-      </div>
-    </transition>
-
-    <div v-if="notHomepagePath.includes($route.path)" class="bottom-cont">
-      <div class="bt-l">
-        <!-- <img src="@/assets/glory/bt_desc.png"> -->
-        <div class="bt-l-orange" @click="handleJumpFiling">© 陕ICP备2024033180号-1</div>
-        <template v-if="!isMobileTerminal">
-          <div class="bt-l-orange" @click="handleClickProtocol">用户协议</div>
-          <div
-            class="bt-l-orange"
-            @click="handleJumpInkasso"
-          >长安银科官网：www.changan-inkasso.com</div>
-        </template>
-        <div v-if="isMobileTerminal">服务邮箱：citp@changan-inkasso.com</div>
-        <div v-if="isMobileTerminal">服务电话：029-86689192</div>
-      </div>
-      <div v-if="!isMobileTerminal" class="bt-m">
-        <div class="case-cont" @click="handleJumpCase">陕公网安备61019102000586号</div>
-        <div>服务邮箱：citp@changan-inkasso.com</div>
-        <div>服务电话：029-86689192</div>
-      </div>
-      <div class="bt-r">
-        <div class="qrocde" />
-        <div class="qrcode-desc">关注长银</div>
-      </div>
-    </div>
-
-    <home-bottom v-if="homepagePath === $route.path && !isMobileTerminal" />
-
-    <template v-if="isMobileTerminal && $route.path !== '/login/register'">
-      <div class="bottom-cont">
-        <div class="bt-l">
-          <div class="bt-l-orange" @click="handleJumpFiling">© 陕ICP备2024033180号-1</div>
-          <div class="case-cont" @click="handleJumpCase">陕公网安备61019102000586号</div>
-          <div>服务邮箱：citp@changan-inkasso.com</div>
-          <div>服务电话：029-86689192</div>
-        </div>
-        <div class="bt-r">
-          <div class="qrocde" />
-          <div class="qrcode-desc">关注长银</div>
-        </div>
-      </div>
-    </template>
-
-    <cy-dialog v-if="!isMobileTerminal" ref="protocolDialog" title="用户协议" top="10vh">
-      <div class="user-protocol-content">
-        <register-protocal />
-      </div>
-    </cy-dialog>
-
-    <cy-dialog ref="dialog" :modal="false" title="重置密码" top="10vh">
-      <change-password @showLogin="loginStatus = true" />
-    </cy-dialog>
+  <div class="login-page">
+    
   </div>
 </template>
 
 <script>
-import { isMobileDevice } from '@/utils/index'
-
 export default {
   name: 'Login',
-  components: {
-    LoginContent: () => import('./components/LoginContent'),
-    RegisterContent: () => import('./components/RegisterContent'),
-    RegisterProtocal: () => import('./components/RegisterProtocal'),
-    PrivacyProtocal: () => import('./components/PrivacyProtocal'),
-    HomeBottom: () => import('./components/HomeBottom'),
-    ChangePassword: () => import('./components/ChangePassword')
-  },
+  components: {},
   data() {
-    return {
-      loginStatus: false,
-      loginType: '',
-      protocolStatus: '',
-      bannerList: [
-        {
-          name: '跨境通',
-          isActice: true,
-          order: 0,
-          path: '/login/tradeSinceLink'
-        },
-        {
-          name: '资质荣誉',
-          isActice: false,
-          order: 1,
-          path: '/login/qualificationsHonors'
-        },
-        {
-          name: '关于我们',
-          isActice: false,
-          order: 2,
-          path: '/login/aboutUs'
-        },
-        {
-          name: '联系我们',
-          isActice: false,
-          order: 3,
-          path: '/login/contactUs'
-        }
-      ],
-      bannerMobileList: [
-        {
-          name: '跨境通',
-          isActice: true,
-          order: 0,
-          path: '/login/tradeSinceLink'
-        },
-        {
-          name: '资质荣誉',
-          isActice: false,
-          order: 1,
-          path: '/login/qualificationsHonors'
-        },
-        {
-          name: '关于我们',
-          isActice: false,
-          order: 2,
-          path: '/login/aboutUs'
-        },
-        {
-          name: '联系我们',
-          isActice: false,
-          order: 3,
-          path: '/login/contactUs'
-        },
-        {
-          name: '立即注册',
-          isActice: false,
-          order: 4,
-          path: '/login/register'
-        }
-      ],
-      showBackToTop: false,
-      isMobileTerminal: false,
-      showCloseIcon: false,
-      iconAnimate1: {},
-      iconAnimate2: {},
-      homepagePath: '/login/tradeSinceLink',
-      notHomepagePath: ['/login/qualificationsHonors', '/login/aboutUs', '/login/contactUs']
-    }
+    return {}
   },
-  computed: {
-    key() {
-      return this.$route.path
-    }
-  },
-  watch: {
-    $route: {
-      handler(val) {
-        let findIdx = -1
-        this.isMobile()
-        if (this.isMobileTerminal) {
-          findIdx = this.bannerMobileList.findIndex(el => el.path === val.path)
-        } else {
-          findIdx = this.bannerList.findIndex(el => el.path === val.path)
-        }
-        if (findIdx !== -1) {
-          this.clickNav(findIdx)
-        }
-      },
-      immediate: true
-    },
-    loginStatus: {
-      handler(val) {
-        if (val) {
-          window.addEventListener('scroll', this.preventDefault, { passive: false })
-        } else {
-          window.removeEventListener('scroll', this.preventDefault)
-        }
-      },
-      immediate: true
-    }
-  },
-  mounted() {
-    window.addEventListener('scroll', this.isScrollGt1000)
-    this.isMobile()
-    window.addEventListener('resize', this.isMobile)
-  },
-  destroyed() {
-    window.removeEventListener('scroll', this.isScrollGt1000)
-    window.removeEventListener('resize', this.isMobile)
-  },
-  methods: {
-    preventDefault(e) {
-      e.preventDefault()
-    },
-    isScrollGt1000() {
-      if (window.scrollY > 1000) {
-        this.showBackToTop = true
-      } else {
-        this.showBackToTop = false
-      }
-    },
-    // 是否是手机端
-    isMobile() {
-      if (isMobileDevice() && window.screen.width < 768) {
-        this.isMobileTerminal = true
-      } else {
-        this.isMobileTerminal = false
-      }
-    },
-    mobileIconClick() {
-      this.showCloseIcon = !this.showCloseIcon
-    },
-    loginClick(type) {
-      this.loginStatus = true
-      this.loginType = type
-    },
-    protocol(type) {
-      this.protocolStatus = type
-    },
-    // 顶部菜单点击
-    clickNav(idx) {
-      if (this.isMobileTerminal) {
-        this.showCloseIcon = false
-        this.bannerMobileList.forEach(element => {
-          element.isActice = false
-        })
-        this.bannerMobileList[idx].isActice = true
-        this.$router.push({
-          path: this.bannerMobileList[idx].path,
-          query: this.$route.query
-        })
-      } else {
-        this.bannerList.forEach(element => {
-          element.isActice = false
-        })
-        this.bannerList[idx].isActice = true
-        this.$router.push({
-          path: this.bannerList[idx].path
-        })
-      }
-    },
-    showChangePwd() {
-      this.loginStatus = false
-      this.$refs.dialog.show = true
-    },
-    // 回到顶部
-    backTotop() {
-      window.scrollTo({
-        top: 0,
-        left: 0,
-        behavior: 'smooth'
-      })
-    },
-    clickLogo() {
-      this.$router.push('/login')
-    },
-    handleJumpFiling() {
-      window.open('https://beian.miit.gov.cn/')
-    },
-    handleJumpInkasso() {
-      window.open('http://www.changan-inkasso.com')
-    },
-    handleClickProtocol() {
-      this.$refs.protocolDialog.show = true
-    },
-    handleJumpCase() {
-      window.open('https://beian.mps.gov.cn/#/query/webSearch?code=61019102000586')
-    }
-  }
-
+  computed: {},
+  watch: {},
+  mounted() {},
+  destroyed() {},
+  methods: {}
 }
 </script>
 
 <style lang="scss" scoped>
-@media screen and (min-width: 1930px) {
-  .login-container {
-    .login-nav {
-      padding: 0 !important;
-      justify-content: center !important;
-      .nav-desc {
-        flex: initial !important;
-        width: 44% !important;
-        padding-left: 6% !important;
-      }
-    }
-  }
+.login-page {
+  padding: 70px 0 190px;
+  overflow: auto;
 }
-
-@media screen and (min-width: 768) and (max-width: 1536px) {
-  .login-container {
-    .login-nav {
-      padding: 0 !important;
-      justify-content: center !important;
-      .nav-desc {
-        flex: initial !important;
-        width: 62% !important;
-        padding-left: 6% !important;
-      }
-    }
-  }
-}
-
-.back-to-top {
-  position: fixed;
-  right: 40px;
-  bottom: 60px;
-  width: 40px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  border-radius: 20px;
-  background-color: rgba(0, 0, 0, .6);
-  z-index: 9;
-  cursor: pointer;
-  color: #fff;
-}
-.login-container {
-  width: 100%;
-  background-color: #fff;
-  position: relative;
-  overflow: hidden;
-  .top-banner {
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 99;
-    padding: 0 210px 0 360px;
-    width: 100%;
-    height: 55px;
-    background-color: #292929;
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-end;
-    align-items: center;
-    .banner-cont {
-      height: 100%;
-      font-size: 12px;
-      color: #A3A8AC;
-      margin-right: 10px;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      img {
-        width: 15px;
-        height: 12px;
-        vertical-align: middle;
-        margin-right: 5px;
-      }
-    }
-  }
-  .login-nav {
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 99;
-    height: 80px;
-    width: 100%;
-    background-color: rgba(41, 41, 41, .7);
-    padding: 0 210px 0 360px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    overflow: hidden;
-    .logo-cont {
-      cursor: pointer;
-    }
-    .nav-desc {
-      flex: 1;
-      height: 100%;
-      display: flex;
-      align-items: center;
-      font-size: 16px;
-      color: #E6E6E6;
-      padding-left: 8%;
-      div {
-        cursor: pointer;
-        margin-right: 8%;
-      }
-    }
-    .nav-btn {
-      flex-basis: 100px;
-    }
-  }
-  .login-container-box {
-    height: 600px;
-    width: 1000px;
-    background: #fff;
-    border-radius: 20px;
-    display: flex;
-    box-shadow: 0px 0px 10px 2px #8b8080;
-    position: fixed;
-    top: 50%;
-    transform: translateY(-50%) scale(.9);
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
-    z-index: 100;
-    margin: 0 auto;
-    .left {
-      width: 440px;
-      height: 100%;
-      background: #F9FCFF;
-      border-top-left-radius: 20px;
-      border-bottom-left-radius: 20px;
-      & > div {
-        height: 100%;
-        width: 100%;
-        img {
-          width: 100%;
-          height: 100%;
-
-        }
-      }
-    }
-    .back-home {
-      font-size: 14px;
-      color: #2C4270;
-      text-align: right;
-      position: absolute;
-      right: 35px;
-      top: 20px;
-      cursor: pointer;
-    }
-  }
-
-  .login-modal {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    width: 100vw;
-    height: 100vh;
-    z-index: 18;
-    background-color: rgba(0, 0, 0, 0.7);
-  }
-
-  .bottom-cont {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 100%;
-    height: 230px;
-    background-color: #212121;
-    color: #fff;
-    font-size: 14px;
-    .bt-l {
-      margin-right: 214px;
-       > .bt-l-orange {
-        cursor: pointer;
-        margin-bottom: 10px;
-      }
-      .bt-l-orange:hover {
-        color: #FE7D0B;
-      }
-      .case-cont {
-        cursor: pointer;
-      }
-      .case-cont:hover {
-        color: #FE7D0B;
-      }
-      .case-cont::before {
-        content: ' ';
-        display: inline-block;
-        width: 16px;
-        height: 18px;
-        background: url('../../assets/login/case-icon.png') no-repeat;
-        vertical-align: middle;
-        margin-right: 5px;
-      }
-    }
-    .bt-m {
-      padding-top: 70px;
-      align-self: flex-start;
-      margin-right: 120px;
-      > div {
-        margin-bottom: 10px;
-      }
-      .case-cont {
-        cursor: pointer;
-      }
-      .case-cont:hover {
-        color: #FE7D0B;
-      }
-      .case-cont::before {
-        content: ' ';
-        display: inline-block;
-        width: 16px;
-        height: 18px;
-        background: url('../../assets/login/case-icon.png') no-repeat;
-        vertical-align: middle;
-        margin-right: 5px;
-      }
-    }
-    .bt-r {
-      .qrocde {
-        width: 130px;
-        height: 130px;
-        background: url('../../assets/login/qrcode.png');
-      }
-      .qrcode-desc {
-        width: 130px;
-        font-size: 16px;
-        color: #fff;
-        margin-top: 12px;
-        text-align: center;
-      }
-    }
-  }
-
-}
-
-@media screen and (max-width: 768px) {
-  .login-container {
-    width: 100%;
-    background-color: #fff;
-    overflow: hidden;
-    .login-nav {
-      position: fixed;
-      top: 0;
-      left: 0;
-      z-index: 9;
-      height: 60px;
-      width: 100%;
-      background-color: rgba(41, 41, 41, .7);
-      padding: 0 10px 0 20px;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      overflow: hidden;
-    }
-    .nav-desc {
-      flex: initial;
-      height: 100%;
-      display: flex;
-      align-items: center;
-      font-size: 16px;
-      color: #E6E6E6;
-      padding-left: 8%;
-      div {
-        cursor: pointer;
-        margin-right: 8%;
-      }
-    }
-    .nav-desc-mobile {
-      position: fixed;
-      top: 60px;
-      right: 0;
-      flex-direction: column;
-      background-color: #fff;
-      z-index: 9;
-      > div {
-        padding: 12px;
-      }
-    }
-    // @keyframes rotateIcon1 {
-    //   0% {
-    //     opacity: 1;
-    //     transform: rotate(0deg);
-    //   }
-    //   100% {
-    //     opacity: 0;
-    //     transform: rotate(-180deg);
-    //   }
-    // }
-    .mobile-btn {
-      width: 15px;
-      height: 15px;
-    }
-    .login-container-box {
-      height: 600px;
-      width: 100%;
-      background: #fff;
-      border-radius: 20px;
-      display: flex;
-      flex-direction: column;
-      box-shadow: 0px 0px 10px 2px #8b8080;
-      position: fixed;
-      top: 50%;
-      right: 0px;
-      bottom: 0px;
-      left: 0px;
-      margin: 0 auto;
-      z-index: 20;
-      transform: translateY(-50%);
-      .left {
-        width: 440px;
-        height: 100%;
-        background: #F9FCFF;
-        border-top-left-radius: 20px;
-        border-bottom-left-radius: 20px;
-        & > div {
-          height: 0;
-          width: 0;
-          img {
-            width: 0;
-            height: 0;
-          }
-        }
-      }
-      .back-home {
-        font-size: 14px;
-        color: #2C4270;
-        text-align: right;
-        position: absolute;
-        right: 20px;
-        top: 20px;
-        cursor: pointer;
-      }
-    }
-
-    .bottom-cont {
-      position: absolute;
-      left: 0;
-      bottom: 0;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      width: 100%;
-      height: 170px;
-      background-color: #212121;
-      color: #fff;
-      font-size: 14px;
-      .bt-l {
-        margin-right: 20px;
-        transform: scale(.9);
-        .bt-l-orange {
-          color: #fff;
-        }
-      }
-      .bt-r {
-        transform: scale(.8);
-        margin-right: 0;
-        .qrocde {
-          width: 130px;
-          height: 130px;
-          background: url('../../assets/login/qrcode.png');
-        }
-        .qrcode-desc {
-          width: 130px;
-          font-size: 16px;
-          color: #fff;
-          margin-top: 12px;
-          text-align: center;
-        }
-      }
-    }
-  }
-}
-
-.user-protocol-content {
-    height: 80vh;
-    overflow-y: auto;
-    margin: -20px;
-    margin-top: -60px;
-  }
 </style>

src/views/login/index2.vue

@@ -0,0 +1,725 @@
+<template>
+  <div class="login-container">
+    <!-- <div v-if="!isMobileTerminal" class="top-banner">
+      <div class="banner-cont">
+        <img src="@/assets/login/top-mail.png">
+        <span>邮箱  sales@changan-inkasso.com</span>
+      </div>
+      <div class="banner-cont">
+        <img src="@/assets/login/top-phone.png">
+        <span>电话 +86（755）3633 9382</span>
+      </div>
+    </div> -->
+    <div class="login-nav">
+      <div class="logo-cont" @click="clickLogo">
+        <svg-icon icon-class="logo" style="width: 136px; height: 42px;" />
+      </div>
+      <template v-if="!isMobileTerminal">
+        <div class="nav-desc">
+          <div v-for="item in bannerList" :key="item.order" :style="item.isActice ? 'color: #FE7D0B': ''" @click="clickNav(item.order)">
+            {{ item.name }}
+          </div>
+        </div>
+      </template>
+      <div v-if="isMobileTerminal" class="mobile-btn">
+        <img
+          v-if="!showCloseIcon"
+          src="@/assets/login/mobile_1.png"
+          :style="iconAnimate1"
+          @click="mobileIconClick"
+        >
+        <img
+          v-if="showCloseIcon"
+          src="@/assets/login/mobile_2.png"
+          :style="iconAnimate2"
+          @click="mobileIconClick"
+        >
+      </div>
+      <div v-if="!isMobileTerminal && $route.path !== '/login/register'">
+        <el-button type="primary" round @click="loginClick('login')">登 录</el-button>
+        <el-button type="text" @click="loginClick('register')">注册</el-button>
+      </div>
+    </div>
+    <div v-if="showBackToTop && !isMobileTerminal" class="back-to-top" @click="backTotop">
+      <i class="el-icon-top" />
+    </div>
+    <template v-if="isMobileTerminal">
+      <div v-if="showCloseIcon" class="nav-desc-mobile">
+        <div v-for="item in bannerMobileList" :key="item.order" :style="item.isActice ? 'color: #FE7D0B': ''" @click="clickNav(item.order)">
+          {{ item.name }}
+        </div>
+      </div>
+    </template>
+    <router-view :key="key" />
+    <div v-if="loginStatus" class="login-modal" />
+    <transition mode="out-in">
+      <div v-if="loginStatus" class="login-container-box">
+        <div class="left">
+          <div>
+            <template v-if="loginType === 'register' && protocolStatus === 'register'">
+              <register-protocal />
+            </template>
+            <template v-else-if="loginType === 'register' && protocolStatus === 'privacy'">
+              <privacy-protocal />
+            </template>
+            <template v-else>
+              <img src="../../assets/login/leftLogo.png" alt="">
+            </template>
+          </div>
+        </div>
+        <div class="back-home" @click="() => { loginStatus = false }">
+          <svg-icon icon-class="backArrow" style="width: 14px; height: 14px;" />
+          返回首页
+        </div>
+        <login-content v-if="loginType === 'login'" @hideLogin="showChangePwd" />
+        <register-content v-if="loginType === 'register'" @protocol="protocol" @goLogin="() => { loginClick('login')}" />
+      </div>
+    </transition>
+
+    <div v-if="notHomepagePath.includes($route.path)" class="bottom-cont">
+      <div class="bt-l">
+        <!-- <img src="@/assets/glory/bt_desc.png"> -->
+        <div class="bt-l-orange" @click="handleJumpFiling">© 陕ICP备2024033180号-1</div>
+        <template v-if="!isMobileTerminal">
+          <div class="bt-l-orange" @click="handleClickProtocol">用户协议</div>
+          <div
+            class="bt-l-orange"
+            @click="handleJumpInkasso"
+          >长安银科官网：www.changan-inkasso.com</div>
+        </template>
+        <div v-if="isMobileTerminal">服务邮箱：citp@changan-inkasso.com</div>
+        <div v-if="isMobileTerminal">服务电话：029-86689192</div>
+      </div>
+      <div v-if="!isMobileTerminal" class="bt-m">
+        <div class="case-cont" @click="handleJumpCase">陕公网安备61019102000586号</div>
+        <div>服务邮箱：citp@changan-inkasso.com</div>
+        <div>服务电话：029-86689192</div>
+      </div>
+      <div class="bt-r">
+        <div class="qrocde" />
+        <div class="qrcode-desc">关注长银</div>
+      </div>
+    </div>
+
+    <home-bottom v-if="homepagePath === $route.path && !isMobileTerminal" />
+
+    <template v-if="isMobileTerminal && $route.path !== '/login/register'">
+      <div class="bottom-cont">
+        <div class="bt-l">
+          <div class="bt-l-orange" @click="handleJumpFiling">© 陕ICP备2024033180号-1</div>
+          <div class="case-cont" @click="handleJumpCase">陕公网安备61019102000586号</div>
+          <div>服务邮箱：citp@changan-inkasso.com</div>
+          <div>服务电话：029-86689192</div>
+        </div>
+        <div class="bt-r">
+          <div class="qrocde" />
+          <div class="qrcode-desc">关注长银</div>
+        </div>
+      </div>
+    </template>
+
+    <cy-dialog v-if="!isMobileTerminal" ref="protocolDialog" title="用户协议" top="10vh">
+      <div class="user-protocol-content">
+        <register-protocal />
+      </div>
+    </cy-dialog>
+
+    <cy-dialog ref="dialog" :modal="false" title="重置密码" top="10vh">
+      <change-password @showLogin="loginStatus = true" />
+    </cy-dialog>
+  </div>
+</template>
+
+<script>
+import { isMobileDevice } from '@/utils/index'
+
+export default {
+  name: 'Login',
+  components: {
+    LoginContent: () => import('./components/LoginContent'),
+    RegisterContent: () => import('./components/RegisterContent'),
+    RegisterProtocal: () => import('./components/RegisterProtocal'),
+    PrivacyProtocal: () => import('./components/PrivacyProtocal'),
+    HomeBottom: () => import('./components/HomeBottom'),
+    ChangePassword: () => import('./components/ChangePassword')
+  },
+  data() {
+    return {
+      loginStatus: false,
+      loginType: '',
+      protocolStatus: '',
+      bannerList: [
+        {
+          name: '跨境通',
+          isActice: true,
+          order: 0,
+          path: '/login/tradeSinceLink'
+        },
+        {
+          name: '资质荣誉',
+          isActice: false,
+          order: 1,
+          path: '/login/qualificationsHonors'
+        },
+        {
+          name: '关于我们',
+          isActice: false,
+          order: 2,
+          path: '/login/aboutUs'
+        },
+        {
+          name: '联系我们',
+          isActice: false,
+          order: 3,
+          path: '/login/contactUs'
+        }
+      ],
+      bannerMobileList: [
+        {
+          name: '跨境通',
+          isActice: true,
+          order: 0,
+          path: '/login/tradeSinceLink'
+        },
+        {
+          name: '资质荣誉',
+          isActice: false,
+          order: 1,
+          path: '/login/qualificationsHonors'
+        },
+        {
+          name: '关于我们',
+          isActice: false,
+          order: 2,
+          path: '/login/aboutUs'
+        },
+        {
+          name: '联系我们',
+          isActice: false,
+          order: 3,
+          path: '/login/contactUs'
+        },
+        {
+          name: '立即注册',
+          isActice: false,
+          order: 4,
+          path: '/login/register'
+        }
+      ],
+      showBackToTop: false,
+      isMobileTerminal: false,
+      showCloseIcon: false,
+      iconAnimate1: {},
+      iconAnimate2: {},
+      homepagePath: '/login/tradeSinceLink',
+      notHomepagePath: ['/login/qualificationsHonors', '/login/aboutUs', '/login/contactUs']
+    }
+  },
+  computed: {
+    key() {
+      return this.$route.path
+    }
+  },
+  watch: {
+    $route: {
+      handler(val) {
+        let findIdx = -1
+        this.isMobile()
+        if (this.isMobileTerminal) {
+          findIdx = this.bannerMobileList.findIndex(el => el.path === val.path)
+        } else {
+          findIdx = this.bannerList.findIndex(el => el.path === val.path)
+        }
+        if (findIdx !== -1) {
+          this.clickNav(findIdx)
+        }
+      },
+      immediate: true
+    },
+    loginStatus: {
+      handler(val) {
+        if (val) {
+          window.addEventListener('scroll', this.preventDefault, { passive: false })
+        } else {
+          window.removeEventListener('scroll', this.preventDefault)
+        }
+      },
+      immediate: true
+    }
+  },
+  mounted() {
+    window.addEventListener('scroll', this.isScrollGt1000)
+    this.isMobile()
+    window.addEventListener('resize', this.isMobile)
+  },
+  destroyed() {
+    window.removeEventListener('scroll', this.isScrollGt1000)
+    window.removeEventListener('resize', this.isMobile)
+  },
+  methods: {
+    preventDefault(e) {
+      e.preventDefault()
+    },
+    isScrollGt1000() {
+      if (window.scrollY > 1000) {
+        this.showBackToTop = true
+      } else {
+        this.showBackToTop = false
+      }
+    },
+    // 是否是手机端
+    isMobile() {
+      if (isMobileDevice() && window.screen.width < 768) {
+        this.isMobileTerminal = true
+      } else {
+        this.isMobileTerminal = false
+      }
+    },
+    mobileIconClick() {
+      this.showCloseIcon = !this.showCloseIcon
+    },
+    loginClick(type) {
+      this.loginStatus = true
+      this.loginType = type
+    },
+    protocol(type) {
+      this.protocolStatus = type
+    },
+    // 顶部菜单点击
+    clickNav(idx) {
+      if (this.isMobileTerminal) {
+        this.showCloseIcon = false
+        this.bannerMobileList.forEach(element => {
+          element.isActice = false
+        })
+        this.bannerMobileList[idx].isActice = true
+        this.$router.push({
+          path: this.bannerMobileList[idx].path,
+          query: this.$route.query
+        })
+      } else {
+        this.bannerList.forEach(element => {
+          element.isActice = false
+        })
+        this.bannerList[idx].isActice = true
+        this.$router.push({
+          path: this.bannerList[idx].path
+        })
+      }
+    },
+    showChangePwd() {
+      this.loginStatus = false
+      this.$refs.dialog.show = true
+    },
+    // 回到顶部
+    backTotop() {
+      window.scrollTo({
+        top: 0,
+        left: 0,
+        behavior: 'smooth'
+      })
+    },
+    clickLogo() {
+      this.$router.push('/login')
+    },
+    handleJumpFiling() {
+      window.open('https://beian.miit.gov.cn/')
+    },
+    handleJumpInkasso() {
+      window.open('http://www.changan-inkasso.com')
+    },
+    handleClickProtocol() {
+      this.$refs.protocolDialog.show = true
+    },
+    handleJumpCase() {
+      window.open('https://beian.mps.gov.cn/#/query/webSearch?code=61019102000586')
+    }
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+@media screen and (min-width: 1930px) {
+  .login-container {
+    .login-nav {
+      padding: 0 !important;
+      justify-content: center !important;
+      .nav-desc {
+        flex: initial !important;
+        width: 44% !important;
+        padding-left: 6% !important;
+      }
+    }
+  }
+}
+
+@media screen and (min-width: 768) and (max-width: 1536px) {
+  .login-container {
+    .login-nav {
+      padding: 0 !important;
+      justify-content: center !important;
+      .nav-desc {
+        flex: initial !important;
+        width: 62% !important;
+        padding-left: 6% !important;
+      }
+    }
+  }
+}
+
+.back-to-top {
+  position: fixed;
+  right: 40px;
+  bottom: 60px;
+  width: 40px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  border-radius: 20px;
+  background-color: rgba(0, 0, 0, .6);
+  z-index: 9;
+  cursor: pointer;
+  color: #fff;
+}
+.login-container {
+  width: 100%;
+  background-color: #fff;
+  position: relative;
+  overflow: hidden;
+  .top-banner {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 99;
+    padding: 0 210px 0 360px;
+    width: 100%;
+    height: 55px;
+    background-color: #292929;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-end;
+    align-items: center;
+    .banner-cont {
+      height: 100%;
+      font-size: 12px;
+      color: #A3A8AC;
+      margin-right: 10px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      img {
+        width: 15px;
+        height: 12px;
+        vertical-align: middle;
+        margin-right: 5px;
+      }
+    }
+  }
+  .login-nav {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 99;
+    height: 80px;
+    width: 100%;
+    background-color: rgba(41, 41, 41, .7);
+    padding: 0 210px 0 360px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    overflow: hidden;
+    .logo-cont {
+      cursor: pointer;
+    }
+    .nav-desc {
+      flex: 1;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      font-size: 16px;
+      color: #E6E6E6;
+      padding-left: 8%;
+      div {
+        cursor: pointer;
+        margin-right: 8%;
+      }
+    }
+    .nav-btn {
+      flex-basis: 100px;
+    }
+  }
+  .login-container-box {
+    height: 600px;
+    width: 1000px;
+    background: #fff;
+    border-radius: 20px;
+    display: flex;
+    box-shadow: 0px 0px 10px 2px #8b8080;
+    position: fixed;
+    top: 50%;
+    transform: translateY(-50%) scale(.9);
+    right: 0px;
+    bottom: 0px;
+    left: 0px;
+    z-index: 100;
+    margin: 0 auto;
+    .left {
+      width: 440px;
+      height: 100%;
+      background: #F9FCFF;
+      border-top-left-radius: 20px;
+      border-bottom-left-radius: 20px;
+      & > div {
+        height: 100%;
+        width: 100%;
+        img {
+          width: 100%;
+          height: 100%;
+
+        }
+      }
+    }
+    .back-home {
+      font-size: 14px;
+      color: #2C4270;
+      text-align: right;
+      position: absolute;
+      right: 35px;
+      top: 20px;
+      cursor: pointer;
+    }
+  }
+
+  .login-modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    width: 100vw;
+    height: 100vh;
+    z-index: 18;
+    background-color: rgba(0, 0, 0, 0.7);
+  }
+
+  .bottom-cont {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 230px;
+    background-color: #212121;
+    color: #fff;
+    font-size: 14px;
+    .bt-l {
+      margin-right: 214px;
+       > .bt-l-orange {
+        cursor: pointer;
+        margin-bottom: 10px;
+      }
+      .bt-l-orange:hover {
+        color: #FE7D0B;
+      }
+      .case-cont {
+        cursor: pointer;
+      }
+      .case-cont:hover {
+        color: #FE7D0B;
+      }
+      .case-cont::before {
+        content: ' ';
+        display: inline-block;
+        width: 16px;
+        height: 18px;
+        background: url('../../assets/login/case-icon.png') no-repeat;
+        vertical-align: middle;
+        margin-right: 5px;
+      }
+    }
+    .bt-m {
+      padding-top: 70px;
+      align-self: flex-start;
+      margin-right: 120px;
+      > div {
+        margin-bottom: 10px;
+      }
+      .case-cont {
+        cursor: pointer;
+      }
+      .case-cont:hover {
+        color: #FE7D0B;
+      }
+      .case-cont::before {
+        content: ' ';
+        display: inline-block;
+        width: 16px;
+        height: 18px;
+        background: url('../../assets/login/case-icon.png') no-repeat;
+        vertical-align: middle;
+        margin-right: 5px;
+      }
+    }
+    .bt-r {
+      .qrocde {
+        width: 130px;
+        height: 130px;
+        background: url('../../assets/login/qrcode.png');
+      }
+      .qrcode-desc {
+        width: 130px;
+        font-size: 16px;
+        color: #fff;
+        margin-top: 12px;
+        text-align: center;
+      }
+    }
+  }
+
+}
+
+@media screen and (max-width: 768px) {
+  .login-container {
+    width: 100%;
+    background-color: #fff;
+    overflow: hidden;
+    .login-nav {
+      position: fixed;
+      top: 0;
+      left: 0;
+      z-index: 9;
+      height: 60px;
+      width: 100%;
+      background-color: rgba(41, 41, 41, .7);
+      padding: 0 10px 0 20px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      overflow: hidden;
+    }
+    .nav-desc {
+      flex: initial;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      font-size: 16px;
+      color: #E6E6E6;
+      padding-left: 8%;
+      div {
+        cursor: pointer;
+        margin-right: 8%;
+      }
+    }
+    .nav-desc-mobile {
+      position: fixed;
+      top: 60px;
+      right: 0;
+      flex-direction: column;
+      background-color: #fff;
+      z-index: 9;
+      > div {
+        padding: 12px;
+      }
+    }
+    // @keyframes rotateIcon1 {
+    //   0% {
+    //     opacity: 1;
+    //     transform: rotate(0deg);
+    //   }
+    //   100% {
+    //     opacity: 0;
+    //     transform: rotate(-180deg);
+    //   }
+    // }
+    .mobile-btn {
+      width: 15px;
+      height: 15px;
+    }
+    .login-container-box {
+      height: 600px;
+      width: 100%;
+      background: #fff;
+      border-radius: 20px;
+      display: flex;
+      flex-direction: column;
+      box-shadow: 0px 0px 10px 2px #8b8080;
+      position: fixed;
+      top: 50%;
+      right: 0px;
+      bottom: 0px;
+      left: 0px;
+      margin: 0 auto;
+      z-index: 20;
+      transform: translateY(-50%);
+      .left {
+        width: 440px;
+        height: 100%;
+        background: #F9FCFF;
+        border-top-left-radius: 20px;
+        border-bottom-left-radius: 20px;
+        & > div {
+          height: 0;
+          width: 0;
+          img {
+            width: 0;
+            height: 0;
+          }
+        }
+      }
+      .back-home {
+        font-size: 14px;
+        color: #2C4270;
+        text-align: right;
+        position: absolute;
+        right: 20px;
+        top: 20px;
+        cursor: pointer;
+      }
+    }
+
+    .bottom-cont {
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 100%;
+      height: 170px;
+      background-color: #212121;
+      color: #fff;
+      font-size: 14px;
+      .bt-l {
+        margin-right: 20px;
+        transform: scale(.9);
+        .bt-l-orange {
+          color: #fff;
+        }
+      }
+      .bt-r {
+        transform: scale(.8);
+        margin-right: 0;
+        .qrocde {
+          width: 130px;
+          height: 130px;
+          background: url('../../assets/login/qrcode.png');
+        }
+        .qrcode-desc {
+          width: 130px;
+          font-size: 16px;
+          color: #fff;
+          margin-top: 12px;
+          text-align: center;
+        }
+      }
+    }
+  }
+}
+
+.user-protocol-content {
+    height: 80vh;
+    overflow-y: auto;
+    margin: -20px;
+    margin-top: -60px;
+  }
+</style>

src/views/myAccounts/payment/component/list.vue

@@ -13,12 +13,6 @@
             />
           </el-select>
         </div>
-        <div>
-          <el-input v-model="search.applyNo" placeholder="融资申请编号" />
-        </div>
-        <div>
-          <el-input v-model="search.salesContractNo" placeholder="销售合同编号" />
-        </div>
         <div>
           <el-select v-model="search.status" placeholder="请选择支付状态" clearable>
             <el-option
@@ -29,19 +23,27 @@
             />
           </el-select>
         </div>
+        <el-date-picker
+          v-model="createTime"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="产生时间日期范围"
+          end-placeholder="产生时间日期范围"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          style="max-width: 350px;"
+        />
+        <el-date-picker
+          v-model="deadlineTime"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="付款截止日期范围"
+          end-placeholder="付款截止日期范围"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          style="max-width: 350px;"
+        />
         <div>
           <el-input v-model="search.voucherNo" placeholder="付款凭证号" />
         </div>
-        <div>
-          <el-date-picker
-            v-model="deadlineTime"
-            type="daterange"
-            range-separator="至"
-            start-placeholder="付款截止日期范围"
-            end-placeholder="付款截止日期范围"
-            value-format="yyyy-MM-dd HH:mm:ss"
-          />
-        </div>
         <div>
           <el-date-picker
             v-model="paymentTime"
@@ -100,6 +102,7 @@ export default {
       size: 10,
       deadlineTime: [],
       paymentTime: [],
+      createTime: [],
       tableData: [],
       columns: [
         {
@@ -127,14 +130,9 @@ export default {
           }
         },
         {
-          label: '融资申请编号',
-          showTooltip: true,
-          prop: 'applyNo'
-        },
-        {
-          label: '销售合同编号',
+          label: '产生时间',
           showTooltip: true,
-          prop: 'salesContractNo'
+          prop: 'gmtCreate'
         },
         {
           label: '付款截止时间',
@@ -237,6 +235,7 @@ export default {
           }
           this.deadlineTime = []
           this.paymentTime = []
+          this.createTime = []
         }
       }
       const params = {
@@ -245,13 +244,14 @@ export default {
         deadlineEndTime: this.deadlineTime.length ? this.deadlineTime[1] : '',
         paymentStartTime: this.paymentTime.length ? this.paymentTime[0] : '',
         paymentEndTime: this.paymentTime.length ? this.paymentTime[1] : '',
+        gmtCreateStartTime: this.createTime.length ? this.createTime[0] : '',
+        gmtCreatEndTime: this.createTime.length ? this.createTime[1] : '',
         page: this.page || 1,
         rows: this.size || 10
       }
       getList(params).then(({ data }) => {
         this.loading = false
-        // this.tableData = data.rows
-        this.tableData = [{ id: 123, status: '1' }]
+        this.tableData = data.rows
         this.count = Number(data.records)
       })
     },

src/views/myAccounts/payment/view.vue

@@ -10,14 +10,17 @@
       class="rule-form-orange"
     >
       <cy-info-title>付款信息</cy-info-title>
-      <el-form-item label="融资申请编号">
-        <el-input :value="ruleForm.payableAccountInfo.applyNo" :disabled="disabled" />
+      <el-form-item label="账款类型">
+        <el-input :value="codeToName(constant.payable_accounts_payment_type, ruleForm.payableAccountInfo.paymentType, 'dictValue', 'dictLabel')" :disabled="disabled" />
       </el-form-item>
       <el-form-item label="应付金额">
         <el-input :value="ruleForm.payableAccountInfo.paymentAmount ? ruleForm.payableAccountInfo.paymentCurrency + ' ' + formatMoney(ruleForm.payableAccountInfo.paymentAmount) : ''" :disabled="disabled" />
       </el-form-item>
-      <el-form-item label="账款类型">
-        <el-input :value="codeToName(constant.payable_accounts_payment_type, ruleForm.payableAccountInfo.paymentType, 'dictValue', 'dictLabel')" :disabled="disabled" />
+      <el-form-item label="支付状态">
+        <el-input :value="codeToName(constant.payable_accounts_payment_status, ruleForm.payableAccountInfo.status, 'dictValue', 'dictLabel')" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="产生时间">
+        <el-input :value="ruleForm.payableAccountInfo.gmtCreate ? ruleForm.payableAccountInfo.gmtCreate.split(' ')[0] : ''" :disabled="disabled" />
       </el-form-item>
       <el-form-item label="付款截止时间">
         <el-input :value="ruleForm.payableAccountInfo.paymentDeadline ? ruleForm.payableAccountInfo.paymentDeadline.split(' ')[0] : ''" :disabled="disabled" />
@@ -30,85 +33,12 @@
       </el-form-item>
       <el-form-item label="付款凭证">
         <cy-upload
-          :file-data="ruleForm.payableAccounts.payableAccountsFile ? [ruleForm.payableAccounts.payableAccountsFile] : []"
+          :file-data="ruleForm.payableAccountsFile ? [ruleForm.payableAccountsFile] : []"
           :upload-from-orange-status="true"
           disabled
         />
       </el-form-item>
-
-      <!-- <cy-info-title>
-        贸易基础信息</cy-info-title>
-      <el-form-item label="销售合同编号">
-        <el-input :value="ruleForm.billingDisbursement.salesContractNo" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="销售合同名称">
-        <el-input :value="ruleForm.billingDisbursement.contractName" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="进口商名称">
-        <el-input :value="ruleForm.billingDisbursement.importerEnterpriseName" :disabled="disabled" />
-      </el-form-item> -->
-      <!-- <el-form-item v-if="exportType === 'proxy_export'" label="代理公司名称"> -->
-      <!-- <el-form-item label="代理公司名称">
-        <el-input :value="ruleForm.billingDisbursement.agencyEnterpriseName" :disabled="disabled" />
-      </el-form-item>
-
-      <div style="width: 100%; margin-top: 15px;" class="table-box">
-        <el-table :data="ruleForm.documentInfoDtos" style="width: 100%;">
-          <el-table-column label="序号" type="index" width="50" />
-          <el-table-column label="合同单据类别" prop="category" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据编号" prop="documentNumber" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据名称" prop="documentName" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据日期" prop="documentDate" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据" prop="documentFile" :show-overflow-tooltip="true">
-            <template slot-scope="{ row }">
-              <cy-upload
-                :file-data="row.documentFile ? [row.documentFile] : []"
-                :upload-from-orange-status="true"
-                disabled
-              />
-            </template>
-          </el-table-column>
-          <el-table-column label="相关订单编号" prop="orderNumber" :show-overflow-tooltip="true" />
-        </el-table>
-      </div> -->
-
-      <!-- <cy-info-title style="margin-top: 20px;">融资底层商品信息</cy-info-title>
-      <div style="width: 100%;margin: 0;">
-        <cy-comm-table
-          ref="ReceiveView"
-          :columns="columns"
-          :data="goodsInfoList"
-          :count="0"
-        />
-      </div>
-
-      <el-form-item label="融资商品总额" prop="amountTotal">
-        <el-input
-          :value="ruleForm.amountTotal ? '￥ ' + formatMoney(ruleForm.amountTotal) : ''"
-          disabled
-        />
-      </el-form-item>
-      <el-form-item label="融资本金" prop="taxAmountTotal">
-        <el-input
-          :value="ruleForm.taxAmountTotal ? '￥ ' + formatMoney(ruleForm.taxAmountTotal) : ''"
-          disabled
-        />
-      </el-form-item>
-
-      <el-form-item label="融资利率（%）">
-        <el-input :value="logisticsVo?logisticsVo.companyName: ''" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="融资期限（天）">
-        <el-input :value="logisticsVo?logisticsVo.logisticsOrderNumber: ''" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="融资起算日">
-        <el-input :value="logisticsVo?logisticsVo.logisticsOrderNumber: ''" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="逾期利率（%）">
-        <el-input :value="logisticsVo?logisticsVo.companyName: ''" :disabled="disabled" />
-      </el-form-item> -->
     </el-form>
-
     <div class="submit-btn">
       <el-button @click="() => { $router.push({name: 'Receive'}) }">返回</el-button>
     </div>
@@ -127,7 +57,7 @@ export default {
     return {
       ruleForm: {
         payableAccountInfo: {},
-        payableAccounts: {}
+        payableAccountsFile: null
       },
       rules: {
 
@@ -237,7 +167,7 @@ export default {
       detail({ id: id }).then(res => {
         const { data } = res
         this.ruleForm.payableAccountInfo = data.payableAccountInfo || {}
-        this.ruleForm.payableAccounts = data.payableAccounts || {}
+        this.ruleForm.payableAccountsFile = data.payableAccountsFile
       })
     },
 

src/views/myAccounts/receive/component/list.vue

@@ -4,7 +4,7 @@
       <div class="left" />
       <div class="right">
         <div>
-          <el-input v-model="search.businessNumber" style="width: 240px;" placeholder="业务编号 / 融资申请编号 / 报关单号" />
+          <el-input v-model="search.businessNumber" style="width: 320px;" placeholder="业务编号 / 融资申请编号 / 报关单号 / 收款凭证号" />
         </div>
         <div>
           <el-select v-model="search.paymentType" placeholder="请选择款项类型" clearable>
@@ -19,7 +19,7 @@
         <div>
           <el-input v-model="search.salesContractNo" placeholder="销售合同编号" />
         </div>
-        <div>
+        <!-- <div>
           <el-select v-model="search.importerCertNo" placeholder="请选择进口商" clearable>
             <el-option
               v-for="item in entryComList"
@@ -28,7 +28,7 @@
               :value="item.certNo"
             />
           </el-select>
-        </div>
+        </div> -->
         <div>
           <el-select v-model="search.payerType" placeholder="请选择付款方类型" clearable>
             <el-option
@@ -72,10 +72,10 @@
 
 <script>
 import { mapGetters } from 'vuex'
-import store from '@/store'
+// import store from '@/store'
 import { getList } from '@/api/myAccounts/receive'
 import { formatMoney, codeChangeName } from '@/utils'
-import { entryEntityList } from '@/api/myTrade/salesBill'
+// import { entryEntityList } from '@/api/myTrade/salesBill'
 
 export default {
   name: 'Receive',
@@ -135,11 +135,6 @@ export default {
           showTooltip: true,
           prop: 'salesContractNo'
         },
-        {
-          label: '进口商名称',
-          showTooltip: true,
-          prop: 'importerEnterpriseName'
-        },
         {
           label: '付款方类型',
           prop: 'paymentWay',
@@ -152,6 +147,11 @@ export default {
             </el-tooltip></div>
           }
         },
+        // {
+        //   label: '进口商名称',
+        //   showTooltip: true,
+        //   prop: 'importerEnterpriseName'
+        // },
         {
           label: '付款方名称',
           showTooltip: true,
@@ -217,10 +217,10 @@ export default {
   },
   created() {
     this.$store.dispatch('getConstant', ['ledger_type', 'payer_type'])
-    const userId = store.getters.userInfo.id
-    entryEntityList({ userId: userId }).then(res => {
-      this.entryComList = res.data || []
-    })
+    // const userId = store.getters.userInfo.id
+    // entryEntityList({ userId: userId }).then(res => {
+    //   this.entryComList = res.data || []
+    // })
   },
   mounted() {
     this.fetchData()

src/views/myAccounts/receive/view.vue

@@ -28,62 +28,63 @@
       <el-form-item label="付款日期">
         <el-input :value="ruleForm.billingDisbursement.paymentDate ? ruleForm.billingDisbursement.paymentDate.split(' ')[0] : ''" :disabled="disabled" />
       </el-form-item>
-      <el-form-item label="收款账户名">
-        <el-input :value="ruleForm.paymentExtendDto.accountName" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="收款银行账号">
-        <el-input :value="ruleForm.paymentExtendDto.accountNumber" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="开户行">
-        <el-input :value="ruleForm.paymentExtendDto.openingBank" :disabled="disabled" />
-      </el-form-item>
       <el-form-item label="收款凭证号">
         <el-input :value="ruleForm.billingDisbursement.voucherNo" :disabled="disabled" />
       </el-form-item>
-      <el-form-item label="备注">
-        <el-input :value="remark" :disabled="disabled" />
-      </el-form-item>
-      <cy-upload
-        :file-data="attachments"
-        :upload-from-orange-status="true"
-        disabled
-      />
-
-      <cy-info-title>
-        贸易基础信息</cy-info-title>
-      <el-form-item label="销售合同编号">
-        <el-input :value="ruleForm.billingDisbursement.salesContractNo" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="销售合同名称">
-        <el-input :value="ruleForm.billingDisbursement.contractName" :disabled="disabled" />
-      </el-form-item>
-      <el-form-item label="进口商名称">
-        <el-input :value="ruleForm.billingDisbursement.importerEnterpriseName" :disabled="disabled" />
+      <el-form-item label="收款凭证">
+        <cy-upload
+          :file-data="attachments"
+          :upload-from-orange-status="true"
+          disabled
+        />
       </el-form-item>
-      <!-- <el-form-item v-if="exportType === 'proxy_export'" label="代理公司名称"> -->
-      <el-form-item label="代理公司名称">
-        <el-input :value="ruleForm.billingDisbursement.agencyEnterpriseName" :disabled="disabled" />
+      <el-form-item label="收款银行账号">
+        <el-input :value="ruleForm.paymentExtendDto.accountNumber" :disabled="disabled" />
       </el-form-item>
-
-      <div style="width: 100%; margin-top: 15px;" class="table-box">
-        <el-table :data="ruleForm.documentInfoDtos" style="width: 100%;">
-          <el-table-column label="序号" type="index" width="50" />
-          <el-table-column label="合同单据类别" prop="category" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据编号" prop="documentNumber" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据名称" prop="documentName" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据日期" prop="documentDate" :show-overflow-tooltip="true" />
-          <el-table-column label="合同单据" prop="documentFile" :show-overflow-tooltip="true">
-            <template slot-scope="{ row }">
-              <cy-upload
-                :file-data="row.documentFile ? [row.documentFile] : []"
-                :upload-from-orange-status="true"
-                disabled
-              />
-            </template>
-          </el-table-column>
-          <el-table-column label="相关订单编号" prop="orderNumber" :show-overflow-tooltip="true" />
-        </el-table>
-      </div>
+      <template v-if="'2,3,5,6'.includes(ruleForm.billingDisbursement.paymentType)">
+        <cy-info-title>贸易基础信息</cy-info-title>
+        <el-form-item label="销售合同编号">
+          <el-input :value="ruleForm.billingDisbursement.salesContractNo" :disabled="disabled" />
+        </el-form-item>
+        <el-form-item label="销售合同名称">
+          <el-input :value="ruleForm.billingDisbursement.contractName" :disabled="disabled" />
+        </el-form-item>
+        <el-form-item label="进口商名称">
+          <el-input :value="ruleForm.billingDisbursement.importerEnterpriseName" :disabled="disabled" />
+        </el-form-item>
+        <!-- <el-form-item v-if="exportType === 'proxy_export'" label="代理公司名称"> -->
+        <el-form-item label="代理公司名称">
+          <el-input :value="ruleForm.billingDisbursement.agencyEnterpriseName" :disabled="disabled" />
+        </el-form-item>
+        <cy-info-title>销售合同项下已收款的订单列表</cy-info-title>
+        <div style="width: 100%; margin-top: 15px;" class="table-box">
+          <el-table :data="ruleForm.orderListInfo" style="width: 100%;">
+            <el-table-column label="序号" type="index" width="50" />
+            <el-table-column label="销售订单ID" prop="orderNo" :show-overflow-tooltip="true" />
+            <el-table-column label="预计货款到期日" prop="expectedPaymentDueDate" :show-overflow-tooltip="true" />
+            <el-table-column label="商品总金额" prop="documentName" :show-overflow-tooltip="true">
+              <template slot-scope="{ row }">
+                {{ row.currency + ' ' + row.amount }}
+              </template>
+            </el-table-column>
+            <el-table-column label="本次实际收款金额" prop="documentDate" :show-overflow-tooltip="true">
+              <template slot-scope="{ row }">
+                {{ row.currency + ' ' + row.actualAmount }}
+              </template>
+            </el-table-column>
+            <el-table-column label="补充协议文件 " prop="documentFile" :show-overflow-tooltip="true">
+              <template slot-scope="{ row }">
+                <cy-upload
+                  :file-data="row.supplementaryAgreementDocument ? [row.supplementaryAgreementDocument] : []"
+                  :upload-from-orange-status="true"
+                  disabled
+                />
+              </template>
+            </el-table-column>
+            <el-table-column label="备注" prop="remark" :show-overflow-tooltip="true" />
+          </el-table>
+        </div>
+      </template>
 
       <!-- <cy-info-title style="margin-top: 20px;">融资底层商品信息</cy-info-title>
       <div style="width: 100%;margin: 0;">
@@ -141,13 +142,12 @@ export default {
       ruleForm: {
         billingDisbursement: {},
         paymentExtendDto: {},
-        documentInfoDtos: []
+        orderListInfo: []
       },
       rules: {
 
       },
       logisticsVo: {},
-      purchaseAcountVo: {},
       columns: [
         {
           label: '采购订单ID',
@@ -253,7 +253,7 @@ export default {
         const { data } = res
         this.ruleForm.billingDisbursement = data.billingDisbursement || {}
         this.ruleForm.paymentExtendDto = data.paymentExtendDto || {}
-        this.ruleForm.documentInfoDtos = data.documentInfoDtos || []
+        this.ruleForm.orderListInfo = data.orderListInfo || []
         this.attachments = data.attachments || []
         this.remark = data.remark || ''
       })

src/views/myApplication/tax/index.vue

@@ -1,236 +1,24 @@
 <template>
-  <div class="export-tax">
-    <div class="search">
-      <div class="left" />
-      <div class="right">
-        <el-date-picker
-          v-model="applyDate"
-          type="daterange"
-          range-separator="至"
-          value-format="yyyy-MM-dd HH:mm:ss"
-          start-placeholder="申报年月日期范围"
-          end-placeholder="申报年月日期范围"
-        />
-        <div>
-          <el-input v-model="search.declarationBatch" placeholder="申报批次" />
-        </div>
-        <div>
-          <el-input v-model="search.customsDeclarationNo" placeholder="报关单号" />
-        </div>
-        <div>
-          <el-input v-model="search.salesOrderNo" placeholder="销售订单ID" />
-        </div>
-        <div>
-          <el-input v-model="search.proformaInvoiceNo" placeholder="出口发票号" />
-        </div>
-        <el-date-picker
-          v-model="exportDate"
-          type="daterange"
-          range-separator="至"
-          start-placeholder="出口日期范围"
-          end-placeholder="出口日期范围"
-          value-format="yyyy-MM-dd HH:mm:ss"
-        />
-        <div>
-          <el-select v-model="search.status" placeholder="请选择退税状态" clearable>
-            <el-option
-              v-for="item in constant.rebate_process_status"
-              :key="item.dictCode"
-              :label="item.dictLabel"
-              :value="item.dictValue"
-            />
-          </el-select>
-        </div>
-        <div class="right-btn">
-          <el-button type="primary" @click="fetchData('reset')">重置</el-button>
-          <el-button type="primary" @click="fetchData('search')">查询</el-button>
-        </div>
-      </div>
-    </div>
-    <div style="text-align: right; margin-top: 10px;">
-      <el-button v-if="$store.state.user.showApplyTaxRebateBtn" type="primary" @click="taxRebate(1)">申请出口退税</el-button>
-      <el-button v-if="$store.state.user.showTaxRebateBtn" type="primary" @click="taxRebate(2)">出口退税</el-button>
-    </div>
-    <cy-comm-table
-      ref="commTable"
-      v-loading="loading"
-      :columns="columns"
-      :data="tableData"
-      :count="count"
-      parent-component="ExportTax"
-    />
-
+  <div class="sales-bill">
+    <template v-if="!$route.query.type">
+      <receive-list />
+    </template>
+    <router-view />
   </div>
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
-import {
-  getList, applyTaxRebate, taxRebate
-} from '@/api/myApplication/exportTax'
-import { formatMoney, codeChangeName } from '@/utils'
-
 export default {
-  name: 'ExportTax',
+  name: 'Tax',
   components: {
-  },
-  data() {
-    return {
-      count: 0,
-      search: {
-        declarationBatch: '',
-        customsDeclarationNo: '',
-        salesOrderNo: '',
-        proformaInvoiceNo: '',
-        status: ''
-      },
-      applyDate: [],
-      exportDate: [],
-      page: 1,
-      size: 10,
-      tableData: [],
-      columns: [
-        {
-          label: '序号',
-          index: true
-        },
-        {
-          label: '申报年月',
-          prop: 'declarationMonthYear',
-          showTooltip: true
-        },
-        {
-          label: '申报批次',
-          showTooltip: true,
-          prop: 'declarationBatch'
-        },
-        {
-          label: '报关单号',
-          showTooltip: true,
-          prop: 'customsDeclarationNo'
-        },
-        {
-          label: '销售订单ID',
-          showTooltip: true,
-          prop: 'salesOrderNo'
-        },
-        {
-          label: '退税总额',
-          showTooltip: true,
-          render: (h, row) => {
-            return <div>{ formatMoney(row.taxRefundAmount) }</div>
-          }
-        },
-        {
-          label: '出口发票号',
-          showTooltip: true,
-          prop: 'proformaInvoiceNo'
-        },
-        {
-          label: '出口数量',
-          showTooltip: true,
-          prop: 'exportQuantity'
-        },
-        {
-          label: '出口日期',
-          showTooltip: true,
-          prop: 'exportDate'
-        },
-        {
-          label: '退税状态',
-          prop: 'status',
-          showTooltip: true,
-          render: (h, row) => {
-            return <div> <el-tooltip class='item' effect='dark' content={codeChangeName(this.constant.rebate_process_status, row.status, 'dictValue', 'dictLabel')} placement='top'>
-              <div class='one-ellipsis'>
-                {codeChangeName(this.constant.rebate_process_status, row.status, 'dictValue', 'dictLabel')}
-              </div>
-            </el-tooltip></div>
-          }
-        }
-
-      ],
-      loading: false
-    }
-  },
-  computed: {
-    ...mapGetters(['constant', '']),
-    tablePower() {
-      return ({ item, row }) => {
-        const { rowPower } = item
-        if (rowPower) {
-          if (rowPower.includes(row.status)) {
-            return true
-          }
-        } else {
-          return true
-        }
-      }
-    }
-  },
-  created() {
-    this.$store.dispatch('getConstant', ['rebate_process_status'])
-  },
-  mounted() {
-    this.fetchData()
+    ReceiveList: () => import('./list.vue')
   },
   methods: {
-    fetchData(type) {
-      this.loading = true
-      if (type) {
-        this.page = 1
-        this.size = 10
-        if (type === 'reset') {
-          for (const key in this.search) {
-            this.search[key] = ''
-          }
-          this.applyDate = []
-          this.exportDate = []
-        }
-      }
-      const params = {
-        ...this.search,
-        declarationMonthYearStart: this.applyDate && this.applyDate.length ? this.applyDate[0] : '',
-        declarationMonthYearEnd: this.applyDate && this.applyDate.length ? this.applyDate[1] : '',
-        exportDateStart: this.exportDate && this.exportDate.length ? this.exportDate[0] : '',
-        exportDateEnd: this.exportDate && this.exportDate.length ? this.exportDate[1] : '',
-        page: this.page || 1,
-        rows: this.size || 10
-      }
-      getList(params).then(({ data }) => {
-        this.loading = false
-        this.tableData = data.rows
-        this.count = Number(data.records)
-      })
-    },
-    addContract() {
-      this.$router.push({
-        name: 'SalesContractAdd',
-        query: {
-          type: 'add'
-        }
-      })
-    },
-    taxRebate(type) {
-      if (type === 1) {
-        applyTaxRebate()
-      } else {
-        taxRebate()
-      }
-    }
+
   }
 }
+
 </script>
 
   <style lang="scss" scoped>
-      .export-tax {
-
-      }
-  </style>
-  <style lang="scss">
-      .export-tax {
-          .icon-a-Group957, .icon-a-Group1087 {
-              font-size: 28px;
-          }
-      }
   </style>

src/views/myApplication/tax/list.vue

@@ -0,0 +1,274 @@
+<template>
+  <div class="export-tax">
+    <div class="search">
+      <div class="left" />
+      <div class="right">
+        <el-date-picker
+          v-model="applyDate"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          start-placeholder="申报年月日期范围"
+          end-placeholder="申报年月日期范围"
+        />
+        <div>
+          <el-input v-model="search.declarationBatch" placeholder="申报批次" />
+        </div>
+        <div>
+          <el-input v-model="search.customsDeclarationNo" placeholder="报关单号" />
+        </div>
+        <div>
+          <el-input v-model="search.salesOrderNo" placeholder="销售订单ID" />
+        </div>
+        <div>
+          <el-input v-model="search.proformaInvoiceNo" placeholder="出口发票号" />
+        </div>
+        <el-date-picker
+          v-model="exportDate"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="出口日期范围"
+          end-placeholder="出口日期范围"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          style="max-width: 350px;"
+        />
+        <div>
+          <el-select v-model="search.status" placeholder="请选择退税状态" clearable style="max-width: 250px;">
+            <el-option
+              v-for="item in constant.rebate_process_status"
+              :key="item.dictCode"
+              :label="item.dictLabel"
+              :value="item.dictValue"
+            />
+          </el-select>
+        </div>
+        <div class="right-btn">
+          <el-button type="primary" @click="fetchData('reset')">重置</el-button>
+          <el-button type="primary" @click="fetchData('search')">查询</el-button>
+        </div>
+      </div>
+    </div>
+    <div style="text-align: right; margin-top: 10px;">
+      <el-button v-if="$store.state.user.showApplyTaxRebateBtn" type="primary" @click="exportTax(1)">申请出口退税</el-button>
+      <el-button v-if="$store.state.user.showTaxRebateBtn" type="primary" @click="exportTax(2)">出口退税</el-button>
+    </div>
+    <cy-comm-table
+      ref="commTable"
+      v-loading="loading"
+      :columns="columns"
+      :data="tableData"
+      :count="count"
+      parent-component="ExportTax"
+    />
+
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import {
+  getList, applyTaxRebate, taxRebate
+} from '@/api/myApplication/exportTax'
+import { formatMoney, codeChangeName } from '@/utils'
+
+export default {
+  name: 'ExportTax',
+  components: {
+  },
+  data() {
+    return {
+      count: 0,
+      search: {
+        declarationBatch: '',
+        customsDeclarationNo: '',
+        salesOrderNo: '',
+        proformaInvoiceNo: '',
+        status: ''
+      },
+      applyDate: [],
+      exportDate: [],
+      page: 1,
+      size: 10,
+      tableData: [],
+      columns: [
+        {
+          label: '序号',
+          index: true
+        },
+        {
+          label: '申报年月',
+          prop: 'declarationMonthYear',
+          showTooltip: true
+        },
+        {
+          label: '申报批次',
+          showTooltip: true,
+          prop: 'declarationBatch'
+        },
+        {
+          label: '报关单号',
+          showTooltip: true,
+          prop: 'customsDeclarationNo'
+        },
+        {
+          label: '销售订单ID',
+          showTooltip: true,
+          prop: 'salesOrderNo'
+        },
+        {
+          label: '退税总额',
+          showTooltip: true,
+          render: (h, row) => {
+            return <div>{ '￥ ' + formatMoney(row.taxRefundAmount) }</div>
+          }
+        },
+        {
+          label: '出口发票号',
+          showTooltip: true,
+          prop: 'proformaInvoiceNo'
+        },
+        {
+          label: '出口数量',
+          showTooltip: true,
+          prop: 'exportQuantity'
+        },
+        {
+          label: '出口日期',
+          showTooltip: true,
+          prop: 'exportDate',
+          render: (h, row) => {
+            return <div>{ row.exportDate ? row.exportDate.split(' ')[0] : '' }</div>
+          }
+        },
+        {
+          label: '退税状态',
+          prop: 'status',
+          showTooltip: true,
+          render: (h, row) => {
+            return <div> <el-tooltip class='item' effect='dark' content={codeChangeName(this.constant.rebate_process_status, row.status, 'dictValue', 'dictLabel')} placement='top'>
+              <div class='one-ellipsis'>
+                {codeChangeName(this.constant.rebate_process_status, row.status, 'dictValue', 'dictLabel')}
+              </div>
+            </el-tooltip></div>
+          }
+        },
+        {
+          label: '操作',
+          width: 150,
+          render: (h, row) => {
+            const btnList = [
+              {
+                msg: '详情',
+                icon: 'iconfont icon-a-Group957',
+                power: '',
+                category: 'see'
+              }
+            ]
+            const options = btnList.map(item => {
+              return (
+                this.tablePower({ item, row }) && <el-tooltip class='item' effect='dark' content={item.msg} placement='top'>
+                  <span class='table-icon-box'>
+                    <i class={item.icon} style={item.style} onClick={() => { this.handlerOperate(item.category, row) }}></i>
+                  </span>
+                </el-tooltip>
+              )
+            })
+            return <div>{ options }</div>
+          }
+        }
+      ],
+      loading: false
+    }
+  },
+  computed: {
+    ...mapGetters(['constant', '']),
+    tablePower() {
+      return ({ item, row }) => {
+        const { rowPower } = item
+        if (rowPower) {
+          if (rowPower.includes(row.status)) {
+            return true
+          }
+        } else {
+          return true
+        }
+      }
+    }
+  },
+  created() {
+    this.$store.dispatch('getConstant', ['rebate_process_status'])
+  },
+  mounted() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData(type) {
+      this.loading = true
+      if (type) {
+        this.page = 1
+        this.size = 10
+        if (type === 'reset') {
+          for (const key in this.search) {
+            this.search[key] = ''
+          }
+          this.applyDate = []
+          this.exportDate = []
+        }
+      }
+      const params = {
+        ...this.search,
+        declarationMonthYearStart: this.applyDate && this.applyDate.length ? this.applyDate[0] : '',
+        declarationMonthYearEnd: this.applyDate && this.applyDate.length ? this.applyDate[1] : '',
+        exportDateStart: this.exportDate && this.exportDate.length ? this.exportDate[0] : '',
+        exportDateEnd: this.exportDate && this.exportDate.length ? this.exportDate[1] : '',
+        page: this.page || 1,
+        rows: this.size || 10
+      }
+      getList(params).then(({ data }) => {
+        this.loading = false
+        // this.tableData = data.rows
+        this.tableData = [{id: 1}]
+        this.count = Number(data.records)
+      })
+    },
+    exportTax(type) {
+      if (type === 1) {
+        applyTaxRebate()
+      } else {
+        taxRebate()
+      }
+    },
+    handlerOperate(type, info) {
+      if (type === 'see') {
+        this.$router.push({
+          name: 'ExportTaxView',
+          query: {
+            type: 'view',
+            cid: info.customerUserId,
+            sid: info.salesOrderNo,
+            dTime: info.declarationMonthYear,
+            db: info.declarationBatch,
+            cdId: info.customsDeclarationNo,
+            pn: info.proformaInvoiceNo,
+            eTime: info.exportDate,
+            sta: info.status
+          }
+        })
+      }
+    }
+  }
+}
+</script>
+
+  <style lang="scss" scoped>
+      .export-tax {
+
+      }
+  </style>
+  <style lang="scss">
+      .export-tax {
+          .icon-a-Group957, .icon-a-Group1087 {
+              font-size: 28px;
+          }
+      }
+  </style>

src/views/myApplication/tax/view.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="my-receive-view">
+
+    <el-form
+      ref="ruleFormRef"
+      :model="ruleForm"
+      :rules="rules"
+      label-position="top"
+      label-width="150px"
+      class="rule-form-orange"
+    >
+      <cy-info-title>基础信息</cy-info-title>
+      <el-form-item label="申报年月">
+        <el-input :value="ruleForm.declarationMonthYear" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="申报批次">
+        <el-input :value="ruleForm.declarationBatch" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="报关单号">
+        <el-input :value="ruleForm.customsDeclarationNo" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="报关单">
+        <cy-upload
+          :file-data="ruleForm.customsDeclarationFile ? [ruleForm.customsDeclarationFile] : []"
+          :upload-from-orange-status="true"
+          disabled
+        />
+      </el-form-item>
+      <el-form-item label="销售订单ID">
+        <el-input :value="ruleForm.salesOrderNo" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="销售合同编号">
+        <el-input :value="ruleForm.salesContractNo" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="进口商名称">
+        <el-input :value="ruleForm.importerName" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="代理公司名称">
+        <el-input :value="ruleForm.agencyName" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="出口发票号码">
+        <el-input :value="ruleForm.proformaInvoiceNo" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="出口总额">
+        <el-input :value="ruleForm.fobPriceUsd ? '$ ' + formatMoney(ruleForm.fobPriceUsd) : ''" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="出口数量">
+        <el-input :value="ruleForm.exportQuantity" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="出口日期">
+        <el-input :value="ruleForm.exportDate" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item v-if="'3'.includes($store.state.user.enterpriseInfo.enterpriseType)" label="采购发票 (张) ">
+        <el-input :value="ruleForm.purchaseInvoiceCount" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="退税总额">
+        <el-input :value="ruleForm.taxRefundAmount ? '￥ ' + formatMoney(ruleForm.taxRefundAmount) : ''" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="退税状态">
+        <el-input :value="codeToName(constant.rebate_process_status, ruleForm.status, 'dictValue', 'dictLabel')" :disabled="disabled" />
+      </el-form-item>
+      <cy-info-title>出口明细</cy-info-title>
+      <div style="width: 100%; margin-top: 15px;" class="table-box">
+        <el-table :data="exportDetailList" style="width: 100%;">
+          <el-table-column label="申报序号" type="declarationSerialNo" width="50" />
+          <el-table-column label="HS编码" prop="hsCode" :show-overflow-tooltip="true" />
+          <el-table-column label="报关品名" prop="exportCommodityName" :show-overflow-tooltip="true" />
+          <el-table-column label="法定计量单位" prop="measurementUnit" :show-overflow-tooltip="true" />
+          <el-table-column label="出口数量" prop="exportQuantity" :show-overflow-tooltip="true" />
+          <el-table-column label="商品金额 " prop="fobPriceUsd" :show-overflow-tooltip="true">
+            <template slot-scope="{ row }">
+              {{ '$ ' + row.fobPriceUsd }}
+            </template>
+          </el-table-column>
+          <el-table-column label="退税额" prop="taxRefundAmount" :show-overflow-tooltip="true">
+            <template slot-scope="{ row }">
+              {{ '￥ ' + row.taxRefundAmount }}
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <template v-if="!'1,2'.includes($store.state.user.enterpriseInfo.enterpriseType)">
+        <cy-info-title>进货明细</cy-info-title>
+        <div style="width: 100%; margin-top: 15px;" class="table-box">
+          <el-table :data="purchaseDetailList" style="width: 100%;">
+            <el-table-column label="采购订单ID" type="purchaseOrderNo" width="50" />
+            <el-table-column label="发票类型" prop="voucherTypeName" :show-overflow-tooltip="true" />
+            <el-table-column label="发票号码" prop="purchaseVoucherNo" :show-overflow-tooltip="true" />
+            <el-table-column label="开票日期" prop="invoiceDate" :show-overflow-tooltip="true" />
+            <el-table-column label="HS编码" prop="hsCode" :show-overflow-tooltip="true" />
+            <el-table-column label="报关品名 " prop="exportCommodityName" :show-overflow-tooltip="true" />
+            <el-table-column label="计量单位" prop="measurementUnit" :show-overflow-tooltip="true" />
+            <el-table-column label="数量" prop="exportQuantity" :show-overflow-tooltip="true" />
+            <el-table-column label="金额 (不含税)" prop="taxBaseAmount" :show-overflow-tooltip="true">
+              <template slot-scope="{ row }">
+                {{ '￥ ' + row.taxBaseAmount }}
+              </template>
+            </el-table-column>
+            <el-table-column label="征税率 (%)" prop="addedTaxRate" :show-overflow-tooltip="true" />
+            <el-table-column label="税额" prop="taxRefundableAmount" :show-overflow-tooltip="true">
+              <template slot-scope="{ row }">
+                {{ '￥ ' + row.taxRefundableAmount }}
+              </template>
+            </el-table-column>
+            <el-table-column label="退税率 (%)" prop="exportTaxRebateRate" :show-overflow-tooltip="true" />
+          </el-table>
+        </div>
+      </template>
+    </el-form>
+
+    <div class="submit-btn">
+      <el-button @click="() => { $router.push({name: 'ExportTax'}) }">返回</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { handleMoney, codeChangeName } from '@/utils'
+import { taxDetail } from '@/api/myApplication/exportTax'
+export default {
+  name: 'ReceiveView',
+  components: {
+  },
+  data() {
+    return {
+      ruleForm: {},
+      exportDetailList: [],
+      purchaseDetailList: [],
+      rules: {
+
+      },
+      disabled: true
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'constant'
+    ]),
+    formatMoney() {
+      return (val) => {
+        return handleMoney(val)
+      }
+    }
+  },
+  created() {
+    this.$store.dispatch('getConstant', ['rebate_process_status'])
+    this.getDetails()
+  },
+  methods: {
+    getDetails() {
+      taxDetail({
+        customerUserId: this.$route.query.cid,
+        salesOrderNo: this.$route.query.sid,
+        declarationMonthYear: this.$route.query.dTime,
+        declarationBatch: this.$route.query.db,
+        customsDeclarationNo: this.$route.query.cdId,
+        proformaInvoiceNo: this.$route.query.pn,
+        exportDate: this.$route.query.eTime,
+        status: this.$route.query.sta
+      }).then(res => {
+        const { data } = res
+        this.ruleForm = data || {}
+        this.exportDetailList = data.exportDetailList || []
+        this.purchaseDetailList = data.purchaseDetailList || []
+      })
+    },
+
+    codeToName(list, type, code, name) {
+      return codeChangeName(list, type, code, name)
+    }
+  }
+}
+</script>
+
+  <style lang="scss" scoped>
+  .my-receive-view {
+      padding: 10px 20px;
+  }
+  </style>

src/views/myTrade/purchaseBill/purchaseOrder/index.vue

@@ -293,7 +293,9 @@ export default {
       })
     },
     downloadFile() {
-      downloadInvoice()
+      downloadInvoice().then(res => {
+        window.open(res.data, '_blank')
+      })
     }
   }
 }

src/views/myTrade/salesBill/declarationForm/index.vue

@@ -150,7 +150,7 @@ export default {
         },
         {
           label: '申报日期',
-          prop: 'hgckhwbgdsbr',
+          prop: 'hgckhwbgdsbrq',
           showTooltip: true
         },
         {

src/views/myTrade/salesBill/salesOrder/index.vue

@@ -315,7 +315,9 @@ export default {
       })
     },
     downloadFile() {
-      downloadDeclaration()
+      downloadDeclaration().then(res => {
+        window.open(res.data, '_blank')
+      })
     }
 
   }