2024-04-17 报表前端

src/api/report/EcwReportPermission.js

+import request from '@/utils/request'
+//报表权限 lanbm 2024-04-15 add
+export function create(data) {
+  return request({
+    url: '/Report/EcwReportPermission/create',
+    method: 'post',
+    data: data
+  })
+}
+
+export function update(data) {
+  return request({
+    url: '/Report/EcwReportPermission/update',
+    method: 'post',
+    data: data
+  })
+}
+
+export function del(id) {
+  return request({
+    url: '/Report/EcwReportPermission/delete?id=' + id,
+    method: 'get'
+  })
+}
+
+export function getModel(id) {
+  return request({
+    url: '/Report/EcwReportPermission/get?id=' + id,
+    method: 'get'
+  })
+}
+
+//获取当前用户的报表权限 lanbm 2024-05-15 add
+export function getCurUserPermission() {
+  return request({
+    url: '/Report/EcwReportPermission/getCurUserPermission',
+    method: 'get'
+  })
+}
+
+
+export function getPageList(query) {
+  return request({
+    url: '/Report/EcwReportPermission/page',
+    method: 'get',
+    params: query
+  })
+}
+
+export function exportExcel(query) {
+  return request({
+    url: '/Report/EcwReportPermission/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/report/customeranalysis.js

+import request from '@/utils/request'
+
+// 获得测试分页
+export function getListPage(data) {
+  return request({
+    url: '/Report/CustomerAnalysis/getListPage',
+    method: 'post',
+    data
+  })
+}
+
+// 导出测试 Excel
+export function exportExcel(data) {
+  return request({
+    url: '/Report/CustomerAnalysis/exportExcel',
+    method: 'post',
+    data: data,
+    responseType: 'blob'
+  })
+}

src/api/report/customerreport.js

+import request from '@/utils/request'
+
+//lanbm 2024-03-31 add
+//获取报表统计结果
+export function getReportResult(data) {
+  return request({
+    url: '/Report/CustomerReport/getPageList',
+    method: 'post',
+    data
+  })
+}
+
+export function getBarData(data) {
+  return request({
+    url: '/Report/CustomerReport/getBarData',
+    method: 'post',
+    data: data
+  })
+}
+
+
+// 导出测试 Excel
+export function exportExcel(query) {
+  return request({
+    url: '/Report/CustomerReport/exportExcel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/report/salesanalysis.js

+import request from '@/utils/request'
+
+//lanbm 2024-03-31 add
+// 创建测试
+export function createTest(data) {
+  return request({
+    url: '/SalesAnalysis/test/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新测试
+export function updateTest(data) {
+  return request({
+    url: '/SalesAnalysis/test/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除测试
+export function deleteTest(id) {
+  return request({
+    url: '/SalesAnalysis/test/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得测试
+export function getTest(id) {
+  return request({
+    url: '/SalesAnalysis/test/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得测试分页
+export function getTestPage(query) {
+  return request({
+    url: '/SalesAnalysis/test/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出测试 Excel
+export function exportTestExcel(query) {
+  return request({
+    url: '/SalesAnalysis/test/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/report/salesreport.js

+import request from '@/utils/request'
+
+//查询运输方式体积货重量 lanbm 2024-04-01 add
+export function SalesReportCount(data) {
+  return request({
+    url: '/Report/SalesReport/SalesReportCount',
+    method: 'post',
+    data: data
+  })
+}
+
+//查询首次成交客户数量 lanbm 2024-04-01 add
+export function FirstCustomerCount(data) {
+  return request({
+    url: '/Report/SalesReport/FirstCustomerCount',
+    method: 'post',
+    data: data
+  })
+}
+
+//销售分析统计列表 lanbm 2024-04-01 add
+export function SalesReportList(data) {
+  return request({
+    url: '/Report/SalesReport/SalesReportList',
+    method: 'post',
+    data: data
+  })
+}
+
+// 导出测试 Excel
+export function exportTestExcel(query) {
+  return request({
+    url: '/SalesReport/test/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/report/vz.js

+import request from '@/utils/request'
+//报表V值设置参数 lanbm 2024-04-03 add
+export function create(data) {
+  return request({
+    url: '/ecwVz/vz/create',
+    method: 'post',
+    data: data
+  })
+}
+
+export function update(data) {
+  return request({
+    url: '/ecwVz/vz/update',
+    method: 'post',
+    data: data
+  })
+}
+
+export function del(id) {
+  return request({
+    url: '/ecwVz/vz/delete?id=' + id,
+    method: 'get'
+  })
+}
+
+export function getModel(id) {
+  return request({
+    url: '/ecwVz/vz/get?id=' + id,
+    method: 'get'
+  })
+}
+
+export function getPageList(query) {
+  return request({
+    url: '/ecwVz/vz/page',
+    method: 'get',
+    params: query
+  })
+}
+
+export function exportExcel(query) {
+  return request({
+    url: '/ecwVz/vz/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/assets/styles/vue-treeselect.css

+/*!
+ * vue-treeselect v0.4.0 | (c) 2017-2019 Riophae Lee
+ * Released under the MIT License.
+ * https://vue-treeselect.js.org/
+ */
+/**
+ * Dependencies
+ */
+/**
+ * Variables
+ */
+/**
+ * Mixins
+ */
+/**
+ * Helpers
+ */
+.vue-treeselect-helper-hide {
+  display: none;
+}
+.vue-treeselect-helper-zoom-effect-off {
+  -ms-transform: none !important;
+      transform: none !important;
+}
+/**
+ * Animations
+ */
+@keyframes vue-treeselect-animation-fade-in {
+  0% {
+    opacity: 0;
+  }
+}
+@keyframes vue-treeselect-animation-bounce {
+  0%,
+  100% {
+    transform: scale(0);
+  }
+  50% {
+    transform: scale(1);
+  }
+}
+@keyframes vue-treeselect-animation-rotate {
+  100% {
+    transform: rotate(360deg);
+  }
+}
+/**
+ * Transitions
+ */
+.vue-treeselect__multi-value-item--transition-enter-active,
+.vue-treeselect__multi-value-item--transition-leave-active {
+  transition-duration: 200ms;
+  transition-property: transform, opacity;
+}
+.vue-treeselect__multi-value-item--transition-enter-active {
+  transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
+}
+.vue-treeselect__multi-value-item--transition-leave-active {
+  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  position: absolute;
+}
+.vue-treeselect__multi-value-item--transition-enter,
+.vue-treeselect__multi-value-item--transition-leave-to {
+  -ms-transform: scale(0.7);
+      transform: scale(0.7);
+  opacity: 0;
+}
+.vue-treeselect__multi-value-item--transition-move {
+  transition: 200ms transform cubic-bezier(0.165, 0.84, 0.44, 1);
+}
+/**
+ * Namespace
+ */
+.vue-treeselect {
+  position: relative;
+  text-align: left;
+}
+[dir="rtl"] .vue-treeselect {
+  text-align: right;
+}
+.vue-treeselect div,
+.vue-treeselect span {
+  box-sizing: border-box;
+}
+.vue-treeselect svg {
+  fill: currentColor;
+}
+/**
+ * Control
+ */
+.vue-treeselect__control {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: table;
+  table-layout: fixed;
+  width:300px;
+  height: 35px;
+  border: 1px solid #ddd;
+  border-radius: 5px;
+  background: #fff;
+  transition-duration: 200ms;
+  transition-property: border-color, box-shadow, width, height, background-color, opacity;
+  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+}
+.vue-treeselect:not(.vue-treeselect--disabled):not(.vue-treeselect--focused) .vue-treeselect__control:hover {
+  border-color: #cfcfcf;
+}
+.vue-treeselect--focused:not(.vue-treeselect--open) .vue-treeselect__control {
+  border-color: #039be5;
+  box-shadow: 0 0 0 3px rgba(3, 155, 229, 0.1);
+}
+.vue-treeselect--disabled .vue-treeselect__control {
+  background-color: #f9f9f9;
+}
+.vue-treeselect--open .vue-treeselect__control {
+  border-color: #cfcfcf;
+}
+.vue-treeselect--open.vue-treeselect--open-below .vue-treeselect__control {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.vue-treeselect--open.vue-treeselect--open-above .vue-treeselect__control {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+.vue-treeselect__value-container,
+.vue-treeselect__multi-value {
+  width: 100%;
+  vertical-align: middle;
+}
+.vue-treeselect__value-container {
+  display: table-cell;
+  position: relative;
+}
+.vue-treeselect--searchable:not(.vue-treeselect--disabled) .vue-treeselect__value-container {
+  cursor: text;
+}
+.vue-treeselect__multi-value {
+  display: inline-block;
+}
+.vue-treeselect--has-value .vue-treeselect__multi-value {
+  margin-bottom: 5px;
+}
+.vue-treeselect__placeholder,
+.vue-treeselect__single-value {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  padding-left: 5px;
+  padding-right: 5px;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  line-height: 34px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  pointer-events: none;
+}
+.vue-treeselect__placeholder {
+  color: #bdbdbd;
+}
+.vue-treeselect__single-value {
+  color: #333;
+}
+.vue-treeselect--focused.vue-treeselect--searchable .vue-treeselect__single-value {
+  color: #bdbdbd;
+}
+.vue-treeselect--disabled .vue-treeselect__single-value {
+  position: static;
+}
+.vue-treeselect__multi-value-item-container {
+  display: inline-block;
+  padding-top: 5px;
+  padding-right: 5px;
+  vertical-align: top;
+}
+[dir="rtl"] .vue-treeselect__multi-value-item-container {
+  padding-right: 0;
+  padding-left: 5px;
+}
+.vue-treeselect__multi-value-item {
+  cursor: pointer;
+  display: inline-table;
+  background: #e3f2fd;
+  padding: 2px 0;
+  border: 1px solid transparent;
+  border-radius: 2px;
+  color: #039be5;
+  font-size: 12px;
+  vertical-align: top;
+}
+.vue-treeselect:not(.vue-treeselect--disabled) .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-disabled):hover .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-new) .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-new):hover {
+  cursor: pointer;
+  background: #e3f2fd;
+  color: #039be5;
+}
+.vue-treeselect__multi-value-item.vue-treeselect__multi-value-item-disabled {
+  cursor: default;
+  background: #f5f5f5;
+  color: #757575;
+}
+.vue-treeselect--disabled .vue-treeselect__multi-value-item {
+  cursor: default;
+  background: #fff;
+  border-color: #e5e5e5;
+  color: #555;
+}
+.vue-treeselect__multi-value-item.vue-treeselect__multi-value-item-new {
+  background: #e8f5e9;
+}
+.vue-treeselect__multi-value-item.vue-treeselect__multi-value-item-new:hover {
+  background: #e8f5e9;
+}
+.vue-treeselect__value-remove,
+.vue-treeselect__multi-value-label {
+  display: table-cell;
+  padding: 0 5px;
+  vertical-align: middle;
+}
+.vue-treeselect__value-remove {
+  color: #039be5;
+  padding-left: 5px;
+  border-left: 1px solid #fff;
+  line-height: 0;
+}
+[dir="rtl"] .vue-treeselect__value-remove {
+  border-left: 0 none;
+  border-right: 1px solid #fff;
+}
+.vue-treeselect__multi-value-item:hover .vue-treeselect__value-remove {
+  color: #e53935;
+}
+.vue-treeselect--disabled .vue-treeselect__value-remove,
+.vue-treeselect__multi-value-item-disabled .vue-treeselect__value-remove {
+  display: none;
+}
+.vue-treeselect__value-remove > svg {
+  width: 6px;
+  height: 6px;
+}
+.vue-treeselect__multi-value-label {
+  padding-right: 5px;
+  white-space: pre-line;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+.vue-treeselect__limit-tip {
+  display: inline-block;
+  padding-top: 5px;
+  padding-right: 5px;
+  vertical-align: top;
+}
+[dir="rtl"] .vue-treeselect__limit-tip {
+  padding-right: 0;
+  padding-left: 5px;
+}
+.vue-treeselect__limit-tip-text {
+  cursor: default;
+  display: block;
+  margin: 2px 0;
+  padding: 1px 0;
+  color: #bdbdbd;
+  font-size: 12px;
+  font-weight: 600;
+}
+.vue-treeselect__input-container {
+  display: block;
+  max-width: 100%;
+  outline: none;
+}
+.vue-treeselect--single .vue-treeselect__input-container {
+  font-size: inherit;
+  height: 100%;
+}
+.vue-treeselect--multi .vue-treeselect__input-container {
+  display: inline-block;
+  font-size: 12px;
+  vertical-align: top;
+}
+.vue-treeselect--searchable .vue-treeselect__input-container {
+  padding-left: 5px;
+  padding-right: 5px;
+}
+.vue-treeselect--searchable.vue-treeselect--multi.vue-treeselect--has-value .vue-treeselect__input-container {
+  padding-top: 5px;
+  padding-left: 0;
+}
+[dir="rtl"] .vue-treeselect--searchable.vue-treeselect--multi.vue-treeselect--has-value .vue-treeselect__input-container {
+  padding-left: 5px;
+  padding-right: 0;
+}
+.vue-treeselect--disabled .vue-treeselect__input-container {
+  display: none;
+}
+.vue-treeselect__input,
+.vue-treeselect__sizer {
+  margin: 0;
+  line-height: inherit;
+  font-family: inherit;
+  font-size: inherit;
+}
+.vue-treeselect__input {
+  max-width: 100%;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  outline: none;
+  box-sizing: content-box;
+  box-shadow: none;
+  background: none transparent;
+  line-height: 1;
+  vertical-align: middle;
+}
+.vue-treeselect__input::-ms-clear {
+  display: none;
+}
+.vue-treeselect--single .vue-treeselect__input {
+  width: 100%;
+  height: 100%;
+}
+.vue-treeselect--multi .vue-treeselect__input {
+  padding-top: 3px;
+  padding-bottom: 3px;
+}
+.vue-treeselect--has-value .vue-treeselect__input {
+  line-height: inherit;
+  vertical-align: top;
+}
+.vue-treeselect__sizer {
+  position: absolute;
+  top: 0;
+  left: 0;
+  visibility: hidden;
+  height: 0;
+  overflow: scroll;
+  white-space: pre;
+}
+.vue-treeselect__x-container {
+  display: table-cell;
+  vertical-align: middle;
+  width: 20px;
+  text-align: center;
+  line-height: 0;
+  cursor: pointer;
+  color: #ccc;
+  animation: 200ms vue-treeselect-animation-fade-in cubic-bezier(0.075, 0.82, 0.165, 1);
+}
+.vue-treeselect__x-container:hover {
+  color: #e53935;
+}
+.vue-treeselect__x {
+  width: 8px;
+  height: 8px;
+}
+.vue-treeselect__control-arrow-container {
+  display: table-cell;
+  vertical-align: middle;
+  width: 20px;
+  text-align: center;
+  line-height: 0;
+  cursor: pointer;
+}
+.vue-treeselect--disabled .vue-treeselect__control-arrow-container {
+  cursor: default;
+}
+.vue-treeselect__control-arrow {
+  width: 9px;
+  height: 9px;
+  color: #ccc;
+}
+.vue-treeselect:not(.vue-treeselect--disabled) .vue-treeselect__control-arrow-container:hover .vue-treeselect__control-arrow {
+  color: #616161;
+}
+.vue-treeselect--disabled .vue-treeselect__control-arrow {
+  opacity: 0.35;
+}
+.vue-treeselect__control-arrow--rotated {
+  -ms-transform: rotate(180deg);
+      transform: rotateZ(180deg);
+}
+/**
+ * Menu
+ */
+.vue-treeselect__menu-container {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  overflow: visible;
+  transition: 0s;
+}
+.vue-treeselect--open-below:not(.vue-treeselect--append-to-body) .vue-treeselect__menu-container {
+  top: 100%;
+}
+.vue-treeselect--open-above:not(.vue-treeselect--append-to-body) .vue-treeselect__menu-container {
+  bottom: 100%;
+}
+.vue-treeselect__menu {
+  cursor: default;
+  padding-top: 5px;
+  padding-bottom: 5px;
+  display: block;
+  position: absolute;
+  overflow-x: hidden;
+  overflow-y: auto;
+  width: auto;
+  border: 1px solid #cfcfcf;
+  background: #fff;
+  line-height: 180%;
+  -webkit-overflow-scrolling: touch;
+}
+.vue-treeselect--open-below .vue-treeselect__menu {
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+  top: 0;
+  margin-top: -1px;
+  border-top-color: #f2f2f2;
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
+}
+.vue-treeselect--open-above .vue-treeselect__menu {
+  border-top-left-radius: 5px;
+  border-top-right-radius: 5px;
+  bottom: 0;
+  margin-bottom: -1px;
+  border-bottom-color: #f2f2f2;
+}
+.vue-treeselect__indent-level-0 .vue-treeselect__option {
+  padding-left: 5px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-0 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 5px;
+}
+.vue-treeselect__indent-level-0 .vue-treeselect__tip {
+  padding-left: 25px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-0 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 25px;
+}
+.vue-treeselect__indent-level-1 .vue-treeselect__option {
+  padding-left: 25px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-1 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 25px;
+}
+.vue-treeselect__indent-level-1 .vue-treeselect__tip {
+  padding-left: 45px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-1 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 45px;
+}
+.vue-treeselect__indent-level-2 .vue-treeselect__option {
+  padding-left: 45px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-2 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 45px;
+}
+.vue-treeselect__indent-level-2 .vue-treeselect__tip {
+  padding-left: 65px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-2 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 65px;
+}
+.vue-treeselect__indent-level-3 .vue-treeselect__option {
+  padding-left: 65px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-3 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 65px;
+}
+.vue-treeselect__indent-level-3 .vue-treeselect__tip {
+  padding-left: 85px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-3 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 85px;
+}
+.vue-treeselect__indent-level-4 .vue-treeselect__option {
+  padding-left: 85px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-4 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 85px;
+}
+.vue-treeselect__indent-level-4 .vue-treeselect__tip {
+  padding-left: 105px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-4 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 105px;
+}
+.vue-treeselect__indent-level-5 .vue-treeselect__option {
+  padding-left: 105px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-5 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 105px;
+}
+.vue-treeselect__indent-level-5 .vue-treeselect__tip {
+  padding-left: 125px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-5 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 125px;
+}
+.vue-treeselect__indent-level-6 .vue-treeselect__option {
+  padding-left: 125px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-6 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 125px;
+}
+.vue-treeselect__indent-level-6 .vue-treeselect__tip {
+  padding-left: 145px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-6 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 145px;
+}
+.vue-treeselect__indent-level-7 .vue-treeselect__option {
+  padding-left: 145px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-7 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 145px;
+}
+.vue-treeselect__indent-level-7 .vue-treeselect__tip {
+  padding-left: 165px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-7 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 165px;
+}
+.vue-treeselect__indent-level-8 .vue-treeselect__option {
+  padding-left: 165px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-8 .vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 165px;
+}
+.vue-treeselect__indent-level-8 .vue-treeselect__tip {
+  padding-left: 185px;
+}
+[dir="rtl"] .vue-treeselect__indent-level-8 .vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 185px;
+}
+.vue-treeselect__option {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: table;
+  table-layout: fixed;
+  width: 100%;
+}
+.vue-treeselect__option--highlight {
+  background: #f5f5f5;
+}
+.vue-treeselect--single .vue-treeselect__option--selected {
+  background: #e3f2fd;
+  font-weight: 600;
+}
+.vue-treeselect--single .vue-treeselect__option--selected:hover {
+  background: #e3f2fd;
+}
+.vue-treeselect__option--hide {
+  display: none;
+}
+.vue-treeselect__option-arrow-container,
+.vue-treeselect__option-arrow-placeholder {
+  display: table-cell;
+  vertical-align: middle;
+  width: 20px;
+  text-align: center;
+  line-height: 0;
+}
+.vue-treeselect__option-arrow-container {
+  cursor: pointer;
+}
+.vue-treeselect__option-arrow {
+  display: inline-block;
+  width: 9px;
+  height: 9px;
+  color: #ccc;
+  vertical-align: middle;
+  transition: 200ms transform cubic-bezier(0.19, 1, 0.22, 1);
+  -ms-transform: rotate(-90deg);
+      transform: rotateZ(-90deg);
+}
+[dir="rtl"] .vue-treeselect__option-arrow {
+  -ms-transform: rotate(90deg);
+      transform: rotateZ(90deg);
+}
+.vue-treeselect__option-arrow-container:hover .vue-treeselect__option-arrow,
+.vue-treeselect--branch-nodes-disabled .vue-treeselect__option:hover .vue-treeselect__option-arrow {
+  color: #616161;
+}
+.vue-treeselect__option-arrow--rotated {
+  -ms-transform: rotate(0);
+      transform: rotateZ(0);
+}
+[dir="rtl"] .vue-treeselect__option-arrow--rotated {
+  -ms-transform: rotate(0);
+      transform: rotateZ(0);
+}
+.vue-treeselect__option-arrow--rotated.vue-treeselect__option-arrow--prepare-enter {
+  -ms-transform: rotate(-90deg) !important;
+      transform: rotateZ(-90deg) !important;
+}
+[dir="rtl"] .vue-treeselect__option-arrow--rotated.vue-treeselect__option-arrow--prepare-enter {
+  -ms-transform: rotate(90deg) !important;
+      transform: rotateZ(90deg) !important;
+}
+.vue-treeselect__label-container {
+  display: table-cell;
+  vertical-align: middle;
+  cursor: pointer;
+  display: table;
+  width: 100%;
+  table-layout: fixed;
+  color: inherit;
+}
+.vue-treeselect__option--disabled .vue-treeselect__label-container {
+  cursor: not-allowed;
+  color: rgba(0, 0, 0, 0.25);
+}
+.vue-treeselect__checkbox-container {
+  display: table-cell;
+  width: 20px;
+  min-width: 20px;
+  height: 100%;
+  text-align: center;
+  vertical-align: middle;
+}
+.vue-treeselect__checkbox {
+  display: block;
+  margin: auto;
+  width: 12px;
+  height: 12px;
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 2px;
+  position: relative;
+  transition: 200ms all cubic-bezier(0.075, 0.82, 0.165, 1);
+}
+.vue-treeselect__check-mark,
+.vue-treeselect__minus-mark {
+  display: block;
+  position: absolute;
+  left: 1px;
+  top: 1px;
+  background-repeat: no-repeat;
+  opacity: 0;
+  transition: 200ms all ease;
+}
+.vue-treeselect__minus-mark {
+  width: 8px;
+  height: 8px;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAIAgMAAAC5YVYYAAAACVBMVEUAAAD///////9zeKVjAAAAAnRSTlMAuLMp9oYAAAAPSURBVAjXY4CDrJUgBAMAGaECJ9dz3BAAAAAASUVORK5CYII=);
+  background-size: 8px 8px;
+}
+@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
+  .vue-treeselect__minus-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAADFBMVEUAAAD///////////84wDuoAAAAA3RSTlMAyTzPIdReAAAAGUlEQVQI12PAD+b///+Nof7//79gAsLFCwAx/w4blADeeQAAAABJRU5ErkJggg==);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+  .vue-treeselect__minus-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAADFBMVEUAAAD///////////84wDuoAAAAA3RSTlMAyTzPIdReAAAAGUlEQVQI12PAD+b///+Nof7//79gAsLFCwAx/w4blADeeQAAAABJRU5ErkJggg==);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 288dpi) {
+  .vue-treeselect__minus-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAD1BMVEUAAAD///////////////+PQt5oAAAABHRSTlMAy2EFIuWxUgAAACRJREFUGNNjGBBgJOICBY7KDCoucODEAJSAS6FwUJShGjAQAADBPRGrK2/FhgAAAABJRU5ErkJggg==);
+  }
+}
+.vue-treeselect__checkbox--indeterminate > .vue-treeselect__minus-mark {
+  opacity: 1;
+}
+.vue-treeselect__checkbox--disabled .vue-treeselect__minus-mark {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAIAgMAAAC5YVYYAAAACVBMVEUAAADi4uLh4eHOxeSRAAAAAnRSTlMAuLMp9oYAAAAPSURBVAjXY4CDrJUgBAMAGaECJ9dz3BAAAAAASUVORK5CYII=);
+}
+@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
+  .vue-treeselect__checkbox--disabled .vue-treeselect__minus-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAADFBMVEUAAADi4uLi4uLh4eE5RQaIAAAAA3RSTlMAyTzPIdReAAAAGUlEQVQI12PAD+b///+Nof7//79gAsLFCwAx/w4blADeeQAAAABJRU5ErkJggg==);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+  .vue-treeselect__checkbox--disabled .vue-treeselect__minus-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAADFBMVEUAAADi4uLi4uLh4eE5RQaIAAAAA3RSTlMAyTzPIdReAAAAGUlEQVQI12PAD+b///+Nof7//79gAsLFCwAx/w4blADeeQAAAABJRU5ErkJggg==);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 288dpi) {
+  .vue-treeselect__checkbox--disabled .vue-treeselect__minus-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAD1BMVEUAAADh4eHg4ODNzc3h4eEYfw2wAAAABHRSTlMAy2EFIuWxUgAAACRJREFUGNNjGBBgJOICBY7KDCoucODEAJSAS6FwUJShGjAQAADBPRGrK2/FhgAAAABJRU5ErkJggg==);
+  }
+}
+.vue-treeselect__check-mark {
+  width: 8px;
+  height: 8px;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAMAAADz0U65AAAAQlBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////8IX9KGAAAAFXRSTlMA8u24NxILB+Tawb6jiH1zRz0xIQIIP3GUAAAAMklEQVQI1y3FtQEAMQDDQD+EGbz/qkEVOpyEOP6PudKjZNSXn4Jm2CKRdBKzSLsFWl8fMG0Bl6Jk1rMAAAAASUVORK5CYII=);
+  background-size: 8px 8px;
+  -ms-transform: scaleY(0.125);
+      transform: scaleY(0.125);
+}
+@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
+  .vue-treeselect__check-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAYFBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////98JRy6AAAAH3RSTlMAzu4sDenl38fBvo1OMyIdEQrj1cSihX5hYFpHNycIcQOASAAAAF9JREFUGNN9zEcOgDAMRFHTS0LvNfe/JRmHKAIJ/mqeLJn+k9uDtaeUeFnFziGsBucUTirrprfe81RqZ3Bb6hPWeuZwDFOHyf+ig9CCzQ7INBn7bG5kF+QSt13BHNJnF7AaCT4Y+CW7AAAAAElFTkSuQmCC);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+  .vue-treeselect__check-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAYFBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////98JRy6AAAAH3RSTlMAzu4sDenl38fBvo1OMyIdEQrj1cSihX5hYFpHNycIcQOASAAAAF9JREFUGNN9zEcOgDAMRFHTS0LvNfe/JRmHKAIJ/mqeLJn+k9uDtaeUeFnFziGsBucUTirrprfe81RqZ3Bb6hPWeuZwDFOHyf+ig9CCzQ7INBn7bG5kF+QSt13BHNJnF7AaCT4Y+CW7AAAAAElFTkSuQmCC);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 288dpi) {
+  .vue-treeselect__check-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAWlBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////9ZMre9AAAAHXRSTlMA/PiJhGNI9XlEHJB/b2ldV08+Oibk49vPp6QhAYgGBuwAAACCSURBVCjPrdHdDoIwDAXgTWAqCigo/+f9X5OwnoUwtis4V92XNWladUl+rzQPeQJAN2EHxoOnsPn7/oYk8fxBv08Rr/deOH/aZ2Nm8ZJ+s573QGfWKnNuZGzWm3+lv2V3pcU1XQ385/yjmBoM3Z+dXvlbYLLD3ujhTaOM3KaIXvNkFkuSEvYy1LqOAAAAAElFTkSuQmCC);
+  }
+}
+.vue-treeselect__checkbox--checked > .vue-treeselect__check-mark {
+  opacity: 1;
+  -ms-transform: scaleY(1);
+      transform: scaleY(1);
+}
+.vue-treeselect__checkbox--disabled .vue-treeselect__check-mark {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAMAAADz0U65AAAAP1BMVEUAAADj4+Pf39/h4eHh4eHh4eHk5OTh4eHg4ODi4uLh4eHh4eHg4ODh4eHh4eHg4ODh4eHh4eHp6en////h4eFqcyvUAAAAFHRSTlMAOQfy7bgS5NrBvqOIfXNHMSELAgQ/iFsAAAA2SURBVAjXY4AANjYIzcjMAaVFuBkY+RkEWERYmRjYRXjANAOfiIgIFxNIAa8IpxBEi6AwiAQAK2MBd7xY8csAAAAASUVORK5CYII=);
+}
+@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
+  .vue-treeselect__checkbox--disabled .vue-treeselect__check-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAXVBMVEUAAADh4eHh4eHh4eHi4uLb29vh4eHh4eHh4eHh4eHh4eHh4eHh4eHi4uLi4uLj4+Pi4uLk5OTo6Ojh4eHh4eHi4uLg4ODg4ODh4eHg4ODh4eHf39/g4OD////h4eEzIk+wAAAAHnRSTlMAzu6/LA3p5eLZx8ONTjYiHRIKooV+YWBaRzEnCANnm5rnAAAAZElEQVQY033P2wqAIAyA4VWaaWrnc/n+j5mbhBjUf7WPoTD47TJb4i5zTr/sRDRHuyFaoWX7uK/RlbctlPEuyI1f4WY9yQINEkf6rzzo8YIzmUFoCs7J1EjeIaa9bXIEmzl8dgOZEAj/+2IvzAAAAABJRU5ErkJggg==);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+  .vue-treeselect__checkbox--disabled .vue-treeselect__check-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAXVBMVEUAAADh4eHh4eHh4eHi4uLb29vh4eHh4eHh4eHh4eHh4eHh4eHh4eHi4uLi4uLj4+Pi4uLk5OTo6Ojh4eHh4eHi4uLg4ODg4ODh4eHg4ODh4eHf39/g4OD////h4eEzIk+wAAAAHnRSTlMAzu6/LA3p5eLZx8ONTjYiHRIKooV+YWBaRzEnCANnm5rnAAAAZElEQVQY033P2wqAIAyA4VWaaWrnc/n+j5mbhBjUf7WPoTD47TJb4i5zTr/sRDRHuyFaoWX7uK/RlbctlPEuyI1f4WY9yQINEkf6rzzo8YIzmUFoCs7J1EjeIaa9bXIEmzl8dgOZEAj/+2IvzAAAAABJRU5ErkJggg==);
+  }
+}
+@media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 288dpi) {
+  .vue-treeselect__checkbox--disabled .vue-treeselect__check-mark {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAUVBMVEUAAADh4eHh4eHh4eHh4eHi4uLi4uLh4eHh4eHh4eHf39/j4+Ph4eHh4eHh4eHg4ODi4uLh4eHh4eHi4uLh4eHh4eHh4eHh4eHh4eH////h4eF3FMFTAAAAGnRSTlMA+/eJhGhfSHE9JBzz5KaQf3pXT0Xbz0I5AYDw8F0AAAB+SURBVCjPrdHbDoMgEEVRKAii1dZe9fz/hxplTiKIT7qfYCWTEEZdUvOwbckNAD2WHeh3brHW5f5EzGQ+iN+b1Gt6KPvtv16Dn6JX9M9ya3/A1yfu5dlyduL6Hec7mXY6ddXLPP2lpABGZ8PWXfYLTJxZekVhhl7eTX24zZPNKXoRC7zQLjUAAAAASUVORK5CYII=);
+  }
+}
+.vue-treeselect__checkbox--unchecked {
+  border-color: #e0e0e0;
+  background: #fff;
+}
+.vue-treeselect__label-container:hover .vue-treeselect__checkbox--unchecked {
+  border-color: #039be5;
+  background: #fff;
+}
+.vue-treeselect__checkbox--indeterminate {
+  border-color: #039be5;
+  background: #039be5;
+}
+.vue-treeselect__label-container:hover .vue-treeselect__checkbox--indeterminate {
+  border-color: #039be5;
+  background: #039be5;
+}
+.vue-treeselect__checkbox--checked {
+  border-color: #039be5;
+  background: #039be5;
+}
+.vue-treeselect__label-container:hover .vue-treeselect__checkbox--checked {
+  border-color: #039be5;
+  background: #039be5;
+}
+.vue-treeselect__checkbox--disabled {
+  border-color: #e0e0e0;
+  background-color: #f7f7f7;
+}
+.vue-treeselect__label-container:hover .vue-treeselect__checkbox--disabled {
+  border-color: #e0e0e0;
+  background-color: #f7f7f7;
+}
+.vue-treeselect__label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: table-cell;
+  padding-left: 5px;
+  max-width: 100%;
+  vertical-align: middle;
+  cursor: inherit;
+}
+[dir="rtl"] .vue-treeselect__label {
+  padding-left: 0;
+  padding-right: 5px;
+}
+.vue-treeselect__count {
+  margin-left: 5px;
+  font-weight: 400;
+  opacity: 0.6;
+}
+[dir="rtl"] .vue-treeselect__count {
+  margin-left: 0;
+  margin-right: 5px;
+}
+.vue-treeselect__tip {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: table;
+  table-layout: fixed;
+  width: 100%;
+  color: #757575;
+}
+.vue-treeselect__tip-text {
+  display: table-cell;
+  vertical-align: middle;
+  padding-left: 5px;
+  padding-right: 5px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  width: 100%;
+  font-size: 12px;
+}
+.vue-treeselect__error-tip .vue-treeselect__retry {
+  cursor: pointer;
+  margin-left: 5px;
+  font-style: normal;
+  font-weight: 600;
+  text-decoration: none;
+  color: #039be5;
+}
+[dir="rtl"] .vue-treeselect__error-tip .vue-treeselect__retry {
+  margin-left: 0;
+  margin-right: 5px;
+}
+.vue-treeselect__icon-container {
+  display: table-cell;
+  vertical-align: middle;
+  width: 20px;
+  text-align: center;
+  line-height: 0;
+}
+.vue-treeselect--single .vue-treeselect__icon-container {
+  padding-left: 5px;
+}
+[dir="rtl"] .vue-treeselect--single .vue-treeselect__icon-container {
+  padding-left: 0;
+  padding-right: 5px;
+}
+.vue-treeselect__icon-warning {
+  display: block;
+  margin: auto;
+  border-radius: 50%;
+  position: relative;
+  width: 12px;
+  height: 12px;
+  background: #fb8c00;
+}
+.vue-treeselect__icon-warning::after {
+  display: block;
+  position: absolute;
+  content: "";
+  left: 5px;
+  top: 2.5px;
+  width: 2px;
+  height: 1px;
+  border: 0 solid #fff;
+  border-top-width: 5px;
+  border-bottom-width: 1px;
+}
+.vue-treeselect__icon-error {
+  display: block;
+  margin: auto;
+  border-radius: 50%;
+  position: relative;
+  width: 12px;
+  height: 12px;
+  background: #e53935;
+}
+.vue-treeselect__icon-error::before,
+.vue-treeselect__icon-error::after {
+  display: block;
+  position: absolute;
+  content: "";
+  background: #fff;
+  -ms-transform: rotate(45deg);
+      transform: rotate(45deg);
+}
+.vue-treeselect__icon-error::before {
+  width: 6px;
+  height: 2px;
+  left: 3px;
+  top: 5px;
+}
+.vue-treeselect__icon-error::after {
+  width: 2px;
+  height: 6px;
+  left: 5px;
+  top: 3px;
+}
+.vue-treeselect__icon-loader {
+  display: block;
+  margin: auto;
+  position: relative;
+  width: 12px;
+  height: 12px;
+  text-align: center;
+  animation: 1.6s vue-treeselect-animation-rotate linear infinite;
+}
+.vue-treeselect__icon-loader::before,
+.vue-treeselect__icon-loader::after {
+  border-radius: 50%;
+  position: absolute;
+  content: "";
+  left: 0;
+  top: 0;
+  display: block;
+  width: 100%;
+  height: 100%;
+  opacity: 0.6;
+  animation: 1.6s vue-treeselect-animation-bounce ease-in-out infinite;
+}
+.vue-treeselect__icon-loader::before {
+  background: #039be5;
+}
+.vue-treeselect__icon-loader::after {
+  background: #b3e5fc;
+  animation-delay: -0.8s;
+}
+/**
+ * Menu Portal
+ */
+.vue-treeselect__menu-placeholder {
+  display: none;
+}
+.vue-treeselect__portal-target {
+  position: absolute;
+  display: block;
+  left: 0;
+  top: 0;
+  height: 0;
+  width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  overflow: visible;
+  box-sizing: border-box;
+}
+
+
+/*# sourceMappingURL=vue-treeselect.css.map*/
\ No newline at end of file

src/views/dashboard/SalesPanelGroup.vue

+<template>
+  <el-row :gutter="40" class="panel-group" v-if="data">
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel" @click="checkPermi(['member:user']) ? $router.push('/member/member-user') : $alert($t('暂无权限'))">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            {{$t('业绩总览')}}
+          </div>
+          <count-to :start-val="0" :end-val="data.memberCount" :duration="2600" class="card-panel-num" />
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel" @click="$router.push('/system/internalMessage/my-internal-message?status=0')">
+        <div class="card-panel-icon-wrapper icon-message">
+          <svg-icon icon-class="message" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            {{$t('海运拼柜')}}
+          </div>
+          <count-to :start-val="0" :end-val="data.messageCount" :duration="3000" class="card-panel-num" />
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel" @click="$router.push('/system/internalMessage/my-internal-message?status=0')">
+        <div class="card-panel-icon-wrapper icon-message">
+          <svg-icon icon-class="message" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            {{$t('专线空运')}}
+          </div>
+          <count-to :start-val="0" :end-val="data.messageCount" :duration="3000" class="card-panel-num" />
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel" @click="$router.push('/task/todo')">
+        <div class="card-panel-icon-wrapper icon-money">
+          <svg-icon icon-class="date" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            {{$t('客户成交总览')}}
+          </div>
+          <count-to :start-val="0" :end-val="todoCount" :duration="3200" class="card-panel-num" />
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel" @click="$router.push('/order/mine')">
+        <div class="card-panel-icon-wrapper icon-shopping">
+          <svg-icon icon-class="shopping" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            {{$t('首次成交')}}
+          </div>
+          <count-to :start-val="0" :end-val="data.messageCount" :duration="3600" class="card-panel-num" />
+        </div>
+      </div>
+    </el-col>  
+  </el-row>
+</template>
+
+<script>
+import CountTo from 'vue-count-to'
+import {panelData} from '@/api/system/pannel'
+import {checkPermi} from '@/utils/permission'
+import {taskTodoCount} from '@/api/bpm/task'
+export default {
+  components: {
+    CountTo
+  },
+  props:['data1', 'data2'],
+  data(){
+    return {
+      data: null,
+      todoCount: 0
+    }
+  },
+  methods: {
+    handleSetLineChartData(type) {
+      this.$emit('handleSetLineChartData', type)
+    },
+    checkPermi
+  },
+  created(){
+    panelData().then(res => {
+      this.data = res.data
+    })
+
+    taskTodoCount().then(res => {
+      this.todoCount = res.data
+    })
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.panel-group {
+  margin-top: 5px;
+
+  .card-panel-col {
+    margin-bottom: 8px;
+  }
+
+  .card-panel {
+    display: flex;
+    justify-content: space-between;
+    height: 108px;
+    cursor: pointer;
+    font-size: 12px;
+    position: relative;
+    overflow: hidden;
+    color: #666;
+    background: #fff;
+    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+    border-color: rgba(0, 0, 0, .05);
+
+    &:hover {
+      .card-panel-icon-wrapper {
+        color: #fff;
+      }
+
+      .icon-people {
+        background: #40c9c6;
+      }
+
+      .icon-message {
+        background: #36a3f7;
+      }
+
+      .icon-money {
+        background: #f4516c;
+      }
+
+      .icon-shopping {
+        background: #34bfa3
+      }
+    }
+
+    .icon-people {
+      color: #40c9c6;
+    }
+
+    .icon-message {
+      color: #36a3f7;
+    }
+
+    .icon-money {
+      color: #f4516c;
+    }
+
+    .icon-shopping {
+      color: #34bfa3
+    }
+
+    .card-panel-icon-wrapper {
+      margin: 14px 0 0 14px;
+      padding: 5px;
+      transition: all 0.38s ease-out;
+      border-radius: 6px;
+    }
+
+    .card-panel-icon {
+      font-size: 48px;
+    }
+
+    .card-panel-description {
+      font-weight: bold;
+      margin: 5px;
+      margin-left: 0px;
+
+      .card-panel-text {
+        line-height: 18px;
+        color: rgba(0, 0, 0, 0.45);
+        font-size: 16px;
+        margin-bottom: 12px;
+      }
+
+      .card-panel-num {
+        font-size: 20px;
+      }
+    }
+  }
+}
+
+@media (max-width:550px) {
+  .card-panel-description {
+    display: none;
+  }
+
+  .card-panel-icon-wrapper {
+    float: none !important;
+    width: 100%;
+    height: 100%;
+    margin: 0 !important;
+
+    .svg-icon {
+      display: block;
+      margin: 14px auto !important;
+      float: none !important;
+    }
+  }
+}
+</style>

src/views/ecw/financial/receiptDetail.vue

 <template>
   <div class="app-container">
     <el-card>
-      <div slot="header" class="card-title">{{ $t('收款单详情') }}</div>
+      <div slot="header" class="card-title">{{ $t("收款单详情") }}</div>
       <el-descriptions :column="3" border>
-        <el-descriptions-item :label="$t('收款单编号')">{{ form.receiptNo }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('收款单编号')">{{
+          form.receiptNo
+        }}</el-descriptions-item>
         <el-descriptions-item :label="$t('状态')">
-          <dict-tag :type="DICT_TYPE.ECW_RECEIPT_STATE" :value="form.state"/>
+          <dict-tag :type="DICT_TYPE.ECW_RECEIPT_STATE" :value="form.state" />
         </el-descriptions-item>
-        <el-descriptions-item :label="$t('客户')">{{form.customerName }}</el-descriptions-item>
-        <el-descriptions-item :label="$t('部门')">{{ form.departmentName }}</el-descriptions-item>
-        <el-descriptions-item :label="$t('业务员')">{{ form.salesmanName }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('客户')">{{
+          form.customerName
+        }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('部门')">{{
+          form.departmentName
+        }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('业务员')">{{
+          form.salesmanName
+        }}</el-descriptions-item>
         <!-- <el-descriptions-item :label="$t('手续费（RMB）')">{{ form.feeRate }}</el-descriptions-item> -->
-        <el-descriptions-item :label="$t('备注')">{{ form.remark }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('备注')">{{
+          form.remark
+        }}</el-descriptions-item>
       </el-descriptions>
     </el-card>
     <el-card class="card">
-      <div slot="header" class="card-title">{{ $t('应收明细') }}</div>
+      <div slot="header" class="card-title">{{ $t("应收明细") }}</div>
       <el-table :data="list" border>
         <el-table-column :label="$t('订单号')" align="center" prop="orderNo" />
         <el-table-column :label="$t('提单号')" align="center" prop="tidanNo" />
         <el-table-column :label="$t('唛头')" align="center" prop="marks" />
         <el-table-column :label="$t('品名')" align="center" prop="title">
           <template slot-scope="scope">
-            <span v-if="scope.row.feeType!=5">{{ scope.row.titleZh?(scope.row.titleZh + "(" + scope.row.titleEn + ")"):'' }}</span>
+            <span v-if="scope.row.feeType != 5">{{
+              scope.row.titleZh
+                ? scope.row.titleZh + "(" + scope.row.titleEn + ")"
+                : ""
+            }}</span>
           </template>
         </el-table-column>
         <el-table-column :label="$t('箱数')" align="center" prop="num" />
         <el-table-column :label="$t('体积/重量')" align="center" prop="weight">
           <template slot-scope="scope">
-             <span v-if="scope.row.feeType!=5"> {{ scope.row.volume + "/" + scope.row.weight }}</span>
+            <span v-if="scope.row.feeType != 5">
+              {{ scope.row.volume + "/" + scope.row.weight }}</span
+            >
           </template>
         </el-table-column>
         <el-table-column :label="$t('收入类型')" align="center" prop="feeType">
@@ -39,39 +55,58 @@
             ></dict-tag>
           </template>
         </el-table-column>
-        <el-table-column :label="$t('单价金额')" align="center" prop="unitPrice">
+        <el-table-column
+          :label="$t('单价金额')"
+          align="center"
+          prop="unitPrice"
+        >
           <template slot-scope="scope">
             <span>{{ scope.row.unitPrice }}</span>
-            {{getCurrencyLabel(scope.row.currencyId)}}
+            {{ getCurrencyLabel(scope.row.currencyId) }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('总金额')" align="center" prop="totalAmount">
+        <el-table-column
+          :label="$t('总金额')"
+          align="center"
+          prop="totalAmount"
+        >
           <template slot-scope="scope">
             <span>{{ scope.row.totalAmount }}</span>
-            {{getCurrencyLabel(scope.row.currencyId)}}
+            {{ getCurrencyLabel(scope.row.currencyId) }}
           </template>
         </el-table-column>
         <el-table-column :label="$t('优惠金额')" align="center">
           <template slot-scope="scope">
-            {{ scope.row.discountTotal ? `${scope.row.discountTotal}(${scope.row.discountRemark})` : 0 }}
+            {{
+              scope.row.discountTotal
+                ? `${scope.row.discountTotal}(${scope.row.discountRemark})`
+                : 0
+            }}
           </template>
         </el-table-column>
       </el-table>
       <el-descriptions :column="2" border class="card">
         <el-descriptions-item :label="$t('是否需要开票')">
-          <span>{{ form.openInvoice == 1 ? $t('需要') : $t('不需要') }}</span>
+          <span>{{ form.openInvoice == 1 ? $t("需要") : $t("不需要") }}</span>
         </el-descriptions-item>
         <el-descriptions-item>
           <template slot="label">
-                {{$t('核销基准币种')}}
-                <span :title="$t('应收可能出现多个币种的情况，多个币种没法计算整个收款单的核销比例，所以增加一个中间币种，如果应收只有一个币种就使用应收币种，如果有多个币种就以美元为核销基准币种')"><i class="el-icon-question"></i></span>
+            {{ $t("核销基准币种") }}
+            <span
+              :title="
+                $t(
+                  '应收可能出现多个币种的情况，多个币种没法计算整个收款单的核销比例，所以增加一个中间币种，如果应收只有一个币种就使用应收币种，如果有多个币种就以美元为核销基准币种'
+                )
+              "
+              ><i class="el-icon-question"></i
+            ></span>
           </template>
-          {{getCurrencyLabel(showCurrencyId)}}
+          {{ getCurrencyLabel(showCurrencyId) }}
         </el-descriptions-item>
       </el-descriptions>
     </el-card>
     <el-card class="card">
-      <div slot="header" class="card-title">{{ $t('开票资料') }}</div>
+      <div slot="header" class="card-title">{{ $t("开票资料") }}</div>
       <el-descriptions :column="3" border>
         <el-descriptions-item :label="$t('发票抬头')">
           {{ form.invoice }}
@@ -88,7 +123,7 @@
         <el-descriptions-item :label="$t('项目')">
           {{ form.projectName }}
         </el-descriptions-item>
-        <el-descriptions-item :label="$t('税率')+'%'">
+        <el-descriptions-item :label="$t('税率') + '%'">
           {{ form.taxRate }}
         </el-descriptions-item>
         <el-descriptions-item :label="$t('开票地址/电话')">
@@ -98,62 +133,104 @@
     </el-card>
 
     <el-card class="card">
-      <div slot="header" class="card-title">{{ $t('收款信息') }}</div>
+      <div slot="header" class="card-title">{{ $t("收款信息") }}</div>
       <el-table :data="form.receiptAccountList" border>
         <el-table-column :label="$t('应收币种')" align="center">
           <template slot-scope="scope">
-             {{getCurrencyLabel(scope.row.currencyId)}}
+            {{ getCurrencyLabel(scope.row.currencyId) }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('应收金额')" align="center" prop="receivableAmount">
+        <el-table-column
+          :label="$t('应收金额')"
+          align="center"
+          prop="receivableAmount"
+        >
           <template slot-scope="scope" v-if="scope.row.type !== 'total'">
-           <span v-if="scope.row.discountTotal&&scope.row.discountTotal>0">{{ `${scope.row.receivableAmount - scope.row.discountTotal }(${scope.row.receivableAmount} - ${scope.row.discountTotal})` }}</span>
+            <span
+              v-if="scope.row.discountTotal && scope.row.discountTotal > 0"
+              >{{
+                `${scope.row.receivableAmount - scope.row.discountTotal}(${
+                  scope.row.receivableAmount
+                } - ${scope.row.discountTotal})`
+              }}</span
+            >
             <span v-else>{{ `${scope.row.receivableAmount}` }}</span>
           </template>
         </el-table-column>
         <el-table-column align="center" width="220">
           <template #header>
-            {{ $t('核销基准币种') }}（{{getCurrencyLabel(showCurrencyId)}}）{{ $t('汇率') }}
+            {{ $t("核销基准币种") }}（{{ getCurrencyLabel(showCurrencyId) }}）{{
+              $t("汇率")
+            }}
           </template>
           <template slot-scope="scope">
             <template v-if="scope.row.type !== 'total'">
               <span>{{ scope.row.writeOffRate }}</span>
             </template>
             <template v-else>
-              {{ $t('应核销总金额') }}（{{getCurrencyLabel(showCurrencyId)}}）
+              {{ $t("应核销总金额") }}（{{ getCurrencyLabel(showCurrencyId) }}）
             </template>
           </template>
         </el-table-column>
         <el-table-column align="center" prop="writeOffAmount">
           <template #header>
-            {{ $t('核销基准金额') }}（{{getCurrencyLabel(showCurrencyId)}}）
+            {{ $t("核销基准金额") }}（{{ getCurrencyLabel(showCurrencyId) }}）
           </template>
         </el-table-column>
         <el-table-column :label="$t('期望收款账户')" align="center">
           <template slot-scope="scope" v-if="scope.row.type !== 'total'">
-            {{ `${bankData.find(v => v.id == scope.row.platformAccountId)?bankData.find(v => v.id == scope.row.platformAccountId).baAccountName:''}(${bankData.find(v => v.id == scope.row.platformAccountId)?bankData.find(v => v.id == scope.row.platformAccountId).baAccountNum:''})` }}
+            {{
+              `${
+                bankData.find((v) => v.id == scope.row.platformAccountId)
+                  ? bankData.find((v) => v.id == scope.row.platformAccountId)
+                      .baAccountName
+                  : ""
+              }(${
+                bankData.find((v) => v.id == scope.row.platformAccountId)
+                  ? bankData.find((v) => v.id == scope.row.platformAccountId)
+                      .baAccountNum
+                  : ""
+              })`
+            }}
           </template>
         </el-table-column>
 
         <el-table-column :label="$t('期望收款币种')" align="center">
           <template slot-scope="scope">
-            {{getCurrencyLabel(scope.row.collectionCurrencyId)}}
+            {{ getCurrencyLabel(scope.row.collectionCurrencyId) }}
           </template>
         </el-table-column>
         <el-table-column :label="$t('期望收款汇率')" align="center">
           <template slot-scope="scope">
-            <span v-if="scope.row.type !== 'total'">{{ scope.row.collectionRate }}</span>
-            <span v-else>{{ $t('期望收费金额') }}
-              <span :title="$t('导出账单给客户时显示的收款金额与币种')"><i class="el-icon-question"></i></span>
+            <span v-if="scope.row.type !== 'total'">{{
+              scope.row.collectionRate
+            }}</span>
+            <span v-else
+              >{{ $t("期望收费金额") }}
+              <span :title="$t('导出账单给客户时显示的收款金额与币种')"
+                ><i class="el-icon-question"></i
+              ></span>
             </span>
-
           </template>
         </el-table-column>
-        <el-table-column :label="$t('期望收款金额')" align="center" prop="collectionAmount">
+        <el-table-column
+          :label="$t('期望收款金额')"
+          align="center"
+          prop="collectionAmount"
+        >
           <template slot-scope="scope">
-            <span v-if="scope.row.type !== 'total'">{{ scope.row.collectionAmount||0 }}</span>
+            <span v-if="scope.row.type !== 'total'">{{
+              scope.row.collectionAmount || 0
+            }}</span>
             <div v-else>
-              <div v-for="itemAmount in scope.row.collectionAmount">{{$i18n.locale=='zh_CN'?itemAmount.currencyNameZh:itemAmount.currencyNameEn}}: {{ itemAmount&&itemAmount.amount?itemAmount.amount:0}}</div>
+              <div v-for="itemAmount in scope.row.collectionAmount">
+                {{
+                  $i18n.locale == "zh_CN"
+                    ? itemAmount.currencyNameZh
+                    : itemAmount.currencyNameEn
+                }}:
+                {{ itemAmount && itemAmount.amount ? itemAmount.amount : 0 }}
+              </div>
             </div>
           </template>
         </el-table-column>
@@ -165,32 +242,65 @@
       </el-descriptions>
     </el-card>
     <el-card class="card">
-      <div slot="header" class="card-title">{{ $t('银行收款明细') }}</div>
+      <div slot="header" class="card-title">{{ $t("银行收款明细") }}</div>
       <div>
-        <el-button type="primary"  v-if="form.state!=7&&form.state!=0" plain size="mini" @click="handleAddReceiptItem" v-hasPermi="['ecw:payment:detail:addBank']" style="padding: 10px; margin-bottom: 10px">{{ $t('添加收款明细') }}</el-button>
+        <el-button
+          type="primary"
+          v-if="form.state != 7 && form.state != 0"
+          plain
+          size="mini"
+          @click="handleAddReceiptItem"
+          v-hasPermi="['ecw:payment:detail:addBank']"
+          style="padding: 10px; margin-bottom: 10px"
+          >{{ $t("添加收款明细") }}</el-button
+        >
       </div>
-      <el-table ref="multipleTable" :data="detailed" border row-key="id" @selection-change="handleSelectionChange">
-        <el-table-column type="selection" width="50" :reserve-selection="true"> </el-table-column>
-        <el-table-column :label="$t('序号')" type="index" align="center" width="50"></el-table-column>
-        <el-table-column :label="$t('收款账户')" align="center" prop="accountName" />
+      <el-table
+        ref="multipleTable"
+        :data="detailed"
+        border
+        row-key="id"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="selection" width="50" :reserve-selection="true">
+        </el-table-column>
+        <el-table-column
+          :label="$t('序号')"
+          type="index"
+          align="center"
+          width="50"
+        ></el-table-column>
+        <el-table-column
+          :label="$t('收款账户')"
+          align="center"
+          prop="accountName"
+        />
         <el-table-column :label="$t('实收金额')" align="center" prop="amount" />
         <el-table-column :label="$t('实收币种')" align="center" prop="marks">
           <template slot-scope="scope">
-            {{getCurrencyLabel(scope.row.currencyId)}}
+            {{ getCurrencyLabel(scope.row.currencyId) }}
           </template>
         </el-table-column>
         <el-table-column :label="$t('汇率')" align="center" prop="rate" />
-        <el-table-column align="center" prop="writeOffAmount" >
+        <el-table-column align="center" prop="writeOffAmount">
           <template #header>
-            {{ $t('兑核销基准金额') }}（{{getCurrencyLabel(showCurrencyId)}}）
+            {{ $t("兑核销基准金额") }}（{{ getCurrencyLabel(showCurrencyId) }}）
           </template>
         </el-table-column>
-        <el-table-column :label="$t('实收日期')" align="center" prop="amountDate">
+        <el-table-column
+          :label="$t('实收日期')"
+          align="center"
+          prop="amountDate"
+        >
         </el-table-column>
         <el-table-column :label="$t('水单号')" align="center" prop="billNo" />
         <el-table-column :label="$t('水单附件')" align="center" prop="attr">
           <template slot-scope="scope" v-if="scope.row.attr">
-            <div v-for="(v, i) in scope.row.attr" :key="i"><el-link :href="v.url" type="primary" target="_blank">{{ v.name }}</el-link></div>
+            <div v-for="(v, i) in scope.row.attr" :key="i">
+              <el-link :href="v.url" type="primary" target="_blank">{{
+                v.name
+              }}</el-link>
+            </div>
           </template>
         </el-table-column>
         <el-table-column :label="$t('状态')" align="center" prop="status">
@@ -203,141 +313,294 @@
         </el-table-column>
         <el-table-column :label="$t('操作')" align="center" width="200">
           <template slot-scope="scope">
-            <el-button v-if="scope.row.status == 0" v-hasPermi="['ecw:payment:detail:delete']" type="text" @click="deleteClick(scope.row)">{{ $t('删除') }}</el-button>
-            <el-button v-if="scope.row.status == 0" type="text" @click="detailClick(scope.row)" v-hasPermi="['ecw:payment:detail:detail']">{{ $t('详情') }}</el-button>
-            <el-button v-if="scope.row.status == 0" type="text" @click="$router.push(`bankDetail?id=`+id+`&bankId=`+scope.row.id)" v-hasPermi="['ecw:payment:detail:writeOff']">{{ $t('核销') }}</el-button>
-            <el-button v-if="scope.row.status == 1" type="text" @click="showCancel(scope.$index)" v-hasPermi="['ecw:payment:detail:cancelWriteOff']">{{ $t('反核销') }}</el-button>
-            <el-button v-if="scope.row.status == 0" type="text" @click="editClick(scope.row)" v-hasPermi="['ecw:payment:detail:bankEdit']">{{ $t('编辑') }}</el-button>
-            <el-button v-if="scope.row.status == 2" type="text" @click="cancelClick(scope.$index,1)" v-hasPermi="['ecw:payment:detail:cancelDetailApproval']">{{ $t('取消审核') }}</el-button>
-             <el-button v-if="scope.row.status == 3" type="text" @click="cancelClick(scope.$index,2)" v-hasPermi="['ecw:payment:detail:cancelWriteOffNo']">{{ $t('取消反核销审核') }}</el-button>
-            <el-button v-if="scope.row.status == 3 || scope.row.status == 2" type="text"  @click="$router.push(`/bpm/process-instance/detail?id=`+scope.row.bmpId)" v-hasPermi="['ecw:payment:detail:approval']">{{ $t('审核详情') }}</el-button>
+            <el-button
+              v-if="scope.row.status == 0"
+              v-hasPermi="['ecw:payment:detail:delete']"
+              type="text"
+              @click="deleteClick(scope.row)"
+              >{{ $t("删除") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 0"
+              type="text"
+              @click="detailClick(scope.row)"
+              v-hasPermi="['ecw:payment:detail:detail']"
+              >{{ $t("详情") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 0"
+              type="text"
+              @click="
+                $router.push(`bankDetail?id=` + id + `&bankId=` + scope.row.id)
+              "
+              v-hasPermi="['ecw:payment:detail:writeOff']"
+              >{{ $t("核销") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 1"
+              type="text"
+              @click="showCancel(scope.$index)"
+              v-hasPermi="['ecw:payment:detail:cancelWriteOff']"
+              >{{ $t("反核销") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 0"
+              type="text"
+              @click="editClick(scope.row)"
+              v-hasPermi="['ecw:payment:detail:bankEdit']"
+              >{{ $t("编辑") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 2"
+              type="text"
+              @click="cancelClick(scope.$index, 1)"
+              v-hasPermi="['ecw:payment:detail:cancelDetailApproval']"
+              >{{ $t("取消审核") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 3"
+              type="text"
+              @click="cancelClick(scope.$index, 2)"
+              v-hasPermi="['ecw:payment:detail:cancelWriteOffNo']"
+              >{{ $t("取消反核销审核") }}</el-button
+            >
+            <el-button
+              v-if="scope.row.status == 3 || scope.row.status == 2"
+              type="text"
+              @click="
+                $router.push(
+                  `/bpm/process-instance/detail?id=` + scope.row.bmpId
+                )
+              "
+              v-hasPermi="['ecw:payment:detail:approval']"
+              >{{ $t("审核详情") }}</el-button
+            >
           </template>
         </el-table-column>
       </el-table>
     </el-card>
     <el-card class="card hexiaoCard">
       <el-descriptions :column="3" border>
-        <el-descriptions-item >
+        <el-descriptions-item>
           <template slot="label">
-            {{ $t('实收已核销总金额') }}<span :title="$t('所有银行收款明细中状态为已核销的实收金额，币种根据实收币种分类统计')"><i class="el-icon-question"></i></span>
-          </template>
-          <template v-if="!Object.keys(writeOffTotal).length">
-            0
+            {{ $t("实收已核销总金额")
+            }}<span
+              :title="
+                $t(
+                  '所有银行收款明细中状态为已核销的实收金额，币种根据实收币种分类统计'
+                )
+              "
+              ><i class="el-icon-question"></i
+            ></span>
           </template>
+          <template v-if="!Object.keys(writeOffTotal).length"> 0 </template>
           <div v-else>
             <div v-for="(amount, currency) in writeOffTotal" :key="currency">
-              {{amount}}{{getCurrencyLabel(currency)}}
+              {{ amount }}{{ getCurrencyLabel(currency) }}
             </div>
           </div>
         </el-descriptions-item>
         <el-descriptions-item>
           <template slot="label">
-            {{ $t('核销基准币种已核销总金额') }}（{{getCurrencyLabel(showCurrencyId)}}）
-            <span :title="$t('为了方便统计收款单核销比例，将所有银行收款明细中状态为已核销的实收金额，转换为核销基准币种的金额累加')"><i class="el-icon-question"></i></span>
+            {{ $t("核销基准币种已核销总金额") }}（{{
+              getCurrencyLabel(showCurrencyId)
+            }}）
+            <span
+              :title="
+                $t(
+                  '为了方便统计收款单核销比例，将所有银行收款明细中状态为已核销的实收金额，转换为核销基准币种的金额累加'
+                )
+              "
+              ><i class="el-icon-question"></i
+            ></span>
           </template>
-          {{ writeOffAmount}}
+          {{ writeOffAmount }}
         </el-descriptions-item>
         <el-descriptions-item>
           <template slot="label">
-            {{ $t('总核销比例') }}（{{getCurrencyLabel(showCurrencyId)}}）
-            <span :title="$t('总核销比例=核销基准币种已核销总金额/核销基准币种应收总金额')"><i class="el-icon-question"></i></span>
+            {{ $t("总核销比例") }}（{{ getCurrencyLabel(showCurrencyId) }}）
+            <span
+              :title="
+                $t('总核销比例=核销基准币种已核销总金额/核销基准币种应收总金额')
+              "
+              ><i class="el-icon-question"></i
+            ></span>
           </template>
           {{ WriteOffProportion }}%
         </el-descriptions-item>
       </el-descriptions>
     </el-card>
-    <div style="margin: 20px 0;font-size:16px" v-if="form.financeRemark">{{$t('备注')}}:{{form.financeRemark}}</div>
+    <div style="margin: 20px 0; font-size: 16px" v-if="form.financeRemark">
+      {{ $t("备注") }}:{{ form.financeRemark }}
+    </div>
     <div slot="footer" style="margin: 20px 0">
-      <el-button v-if="form.state!=7&&form.state!=9&&form.state!=10&&form.state!=11&&form.state != 4&&form.state != 5 && form.state != 6" type="primary" @click="toEdit" v-hasPermi="['ecw:payment:detail:edit']">{{ $t('编辑') }}</el-button>
-      <el-button v-if="form.state!=7&&form.state!=9&&form.state!=10&&form.state!=11&&form.state != 4&&form.state != 5 && form.state != 6"  type="primary" @click="verificationAll" v-hasPermi="['ecw:payment:detail:allWriteOff']">{{ $t('全部核销') }}</el-button>
+      <el-button
+        v-if="
+          form.state != 7 &&
+          form.state != 9 &&
+          form.state != 10 &&
+          form.state != 11 &&
+          form.state != 4 &&
+          form.state != 5 &&
+          form.state != 6
+        "
+        type="primary"
+        @click="toEdit"
+        v-hasPermi="['ecw:payment:detail:edit']"
+        >{{ $t("编辑") }}</el-button
+      >
+      <el-button
+        v-if="
+          form.state != 7 &&
+          form.state != 9 &&
+          form.state != 10 &&
+          form.state != 11 &&
+          form.state != 4 &&
+          form.state != 5 &&
+          form.state != 6
+        "
+        type="primary"
+        @click="verificationAll"
+        v-hasPermi="['ecw:payment:detail:allWriteOff']"
+        >{{ $t("全部核销") }}</el-button
+      >
       <el-button
         type="primary"
         v-if="form.state == 11"
         v-hasPermi="['ecw:voucher:cancelWriteOff']"
-        @click="$router.push(`/bpm/process-instance/detail?id=`+form.bmpId)"
-        >{{ $t('反核销审核详情') }}</el-button
+        @click="$router.push(`/bpm/process-instance/detail?id=` + form.bmpId)"
+        >{{ $t("反核销审核详情") }}</el-button
       >
       <el-button
         type="primary"
         v-if="form.state == 10"
         v-hasPermi="['ecw:voucher:cancelWriteOff']"
-        @click="$router.push(`/bpm/process-instance/detail?id=`+form.bmpId)"
-        >{{ $t('全部核销审核详情') }}</el-button
+        @click="$router.push(`/bpm/process-instance/detail?id=` + form.bmpId)"
+        >{{ $t("全部核销审核详情") }}</el-button
       >
       <el-button
         v-if="form.state == 11"
         type="primary"
         v-hasPermi="['ecw:vocher:cancelWriteOfflNo']"
         @click="detailClickCancel(1)"
-        >{{ $t('取消反核销审核') }}</el-button
+        >{{ $t("取消反核销审核") }}</el-button
       >
       <el-button
         v-if="form.state == 10"
         type="primary"
         v-hasPermi="['ecw:vocher:cancelWriteOffAll']"
         @click="detailClickCancel(2)"
-        >{{ $t('取消全部核销审核') }}</el-button
+        >{{ $t("取消全部核销审核") }}</el-button
       >
       <el-button
         v-if="form.state == 4 || form.state == 5 || form.state == 6"
         type="primary"
         v-hasPermi="['ecw:voucher:cancelWriteOff']"
         @click="writeOffShow()"
-        >{{ $t('提交收款单反核销') }}</el-button
+        >{{ $t("提交收款单反核销") }}</el-button
+      >
+      <el-button
+        plain
+        type="primary"
+        @click="$store.dispatch('tagsView/delCurrentView')"
+        >{{ $t("返回") }}</el-button
       >
-      <el-button  plain type="primary" @click="$store.dispatch('tagsView/delCurrentView')">{{$t('返回')}}</el-button>
-
     </div>
-    <el-dialog
-     :title="detailTitle"
-      :visible.sync="detailShow"
-      width="30%">
+    <el-dialog :title="detailTitle" :visible.sync="detailShow" width="30%">
       <div class="cancel_content">
-         <span>{{$t('申请理由')}}</span>
-         <el-input type="textarea" :rows ="6" v-model="detailReason" :placeholder="$t('请输入取消理由')"></el-input>
+        <span>{{ $t("申请理由") }}</span>
+        <el-input
+          type="textarea"
+          :rows="6"
+          v-model="detailReason"
+          :placeholder="$t('请输入取消理由')"
+        ></el-input>
       </div>
       <span slot="footer" class="dialog-footers">
-        <el-button type="primary" @click="detailWriteOffClick()">{{$t('提交')}}</el-button>
-        <el-button @click="detailShow = false">{{$t('取消')}}</el-button>
+        <el-button type="primary" @click="detailWriteOffClick()">{{
+          $t("提交")
+        }}</el-button>
+        <el-button @click="detailShow = false">{{ $t("取消") }}</el-button>
       </span>
     </el-dialog>
-    <el-dialog
-     :title="$t('收款单反核销')"
-      :visible.sync="wiffShow"
-      width="30%">
+    <el-dialog :title="$t('收款单反核销')" :visible.sync="wiffShow" width="30%">
       <div class="cancel_content">
-         <span>{{$t('申请理由')}}</span>
-         <el-input type="textarea" :rows ="6" v-model="wiffRemark" :placeholder="$t('请输入理由')"></el-input>
+        <span>{{ $t("申请理由") }}</span>
+        <el-input
+          type="textarea"
+          :rows="6"
+          v-model="wiffRemark"
+          :placeholder="$t('请输入理由')"
+        ></el-input>
       </div>
       <span slot="footer" class="dialog-footers">
-        <el-button  type="primary" @click="writeOffClick()">{{$t('提交反核销')}}</el-button>
-        <el-button @click="wiffShow = false">{{$t('取消')}}</el-button>
+        <el-button type="primary" @click="writeOffClick()">{{
+          $t("提交反核销")
+        }}</el-button>
+        <el-button @click="wiffShow = false">{{ $t("取消") }}</el-button>
       </span>
     </el-dialog>
-    <el-dialog v-if="openAddDialog" :visible.sync="openAddDialog" :title="dialogTitle" width="50%" append-to-body>
+    <el-dialog
+      v-if="openAddDialog"
+      :visible.sync="openAddDialog"
+      :title="dialogTitle"
+      width="50%"
+      append-to-body
+    >
       <div style="padding: 0 24px">
         <el-form ref="addForm" :model="addForm" label-width="250px">
-          <el-form-item :label="$t('收款单号')">{{ form.receiptNo }}</el-form-item>
+          <el-form-item :label="$t('收款单号')">{{
+            form.receiptNo
+          }}</el-form-item>
           <el-form-item :label="$t('剩余应收金额')">
-            <template v-if="surplusData.length==0">
-              0
-            </template>
+            <template v-if="surplusData.length == 0"> 0 </template>
             <div v-else>
               <div v-for="(amount, currency) in surplusData" :key="currency">
-                 <span v-if="amount"> {{amount}}{{getCurrencyLabel(currency)}}</span>
+                <span v-if="amount">
+                  {{ amount }}{{ getCurrencyLabel(currency) }}</span
+                >
               </div>
             </div>
           </el-form-item>
-          <el-form-item :label="$t('收款账户')" prop="accountNo" :rules="{ required: true, trigger: ['blur', 'change'], message: $t('收款账户不能为空') }">
-            <el-select v-if="!isView" filterable clear v-model="addForm.accountId" :placeholder="$t('请选择收款账户')" style="width: 220px" @change="accountChange" v-el-select-loadmore="loadmore">
-              <el-option v-for="item in bankData" :key="item.id" :label="item.baAccountName + '(' + item.baAccountNum + ')'" :value="item.id" />
+          <el-form-item
+            :label="$t('收款账户')"
+            prop="accountNo"
+            :rules="{
+              required: true,
+              trigger: ['blur', 'change'],
+              message: $t('收款账户不能为空'),
+            }"
+          >
+            <el-select
+              v-if="!isView"
+              filterable
+              clear
+              v-model="addForm.accountId"
+              :placeholder="$t('请选择收款账户')"
+              style="width: 220px"
+              @change="accountChange"
+              v-el-select-loadmore="loadmore"
+            >
+              <el-option
+                v-for="item in bankData"
+                :key="item.id"
+                :label="item.baAccountName + '(' + item.baAccountNum + ')'"
+                :value="item.id"
+              />
             </el-select>
-            <span v-else>{{ addForm.accountNo}}{{'('+addForm.accountName+')' }}</span>
+            <span v-else
+              >{{ addForm.accountNo
+              }}{{ "(" + addForm.accountName + ")" }}</span
+            >
           </el-form-item>
           <el-form-item
             :label="$t('实收日期')"
             prop="amountDate"
-            :rules="{ required: true, trigger: ['blur', 'change'], message: $t('实收日期不能为空') }"
+            :rules="{
+              required: true,
+              trigger: ['blur', 'change'],
+              message: $t('实收日期不能为空'),
+            }"
           >
             <el-date-picker
               v-if="!isView"
@@ -350,30 +613,43 @@
             />
             <span v-else>{{ addForm.amountDate }}</span>
           </el-form-item>
-          <div style="display: flex;">
+          <div style="display: flex">
             <el-form-item
               :label="$t('实收')"
               prop="amount"
-              :rules="{ required: true, trigger: ['blur', 'change'], message: $t('实收不能为空') }"
+              :rules="{
+                required: true,
+                trigger: ['blur', 'change'],
+                message: $t('实收不能为空'),
+              }"
             >
-              <el-input v-if="!isView" v-model="addForm.amount" style="width: 220px; margin-right: 12px" @input="setWriteOffAmount"></el-input>
+              <el-input
+                v-if="!isView"
+                v-model="addForm.amount"
+                style="width: 220px; margin-right: 12px"
+                @input="setWriteOffAmount"
+              ></el-input>
               <span v-else>{{ addForm.amount }}</span>
             </el-form-item>
             <el-form-item
               label-width="0px"
               prop="currencyId"
-              :rules="{ required: true, trigger: ['blur', 'change'], message: $t('币种不能为空') }"
+              :rules="{
+                required: true,
+                trigger: ['blur', 'change'],
+                message: $t('币种不能为空'),
+              }"
             >
               <el-select
                 v-model="addForm.currencyId"
                 :placeholder="$t('请选择')"
                 :disabled="isView"
-              @change="val => currencyIdChange(val)"
+                @change="(val) => currencyIdChange(val)"
               >
                 <el-option
                   v-for="item in currencyList"
                   :key="item.id"
-                :label="$i18n.locale=='zh_CN'?item.titleZh:item.titleEn"
+                  :label="$i18n.locale == 'zh_CN' ? item.titleZh : item.titleEn"
                   :value="item.id"
                 />
               </el-select>
@@ -382,26 +658,44 @@
           <el-form-item
             v-if="showCurrencyId != addForm.currencyId"
             prop="rate"
-            :rules="{ required: true, trigger: ['blur', 'change'], message: $t('兑核销基准币种汇率不能为空') }"
+            :rules="{
+              required: true,
+              trigger: ['blur', 'change'],
+              message: $t('兑核销基准币种汇率不能为空'),
+            }"
           >
             <template slot="label">
-            <span :title="$t('实收币种与核销基准币种一样时，无需填写汇率，不一样需要填写汇率')">{{ $t('兑核销基准币种汇率') }}（{{getCurrencyLabel(showCurrencyId)}}）</span>
+              <span
+                :title="
+                  $t(
+                    '实收币种与核销基准币种一样时，无需填写汇率，不一样需要填写汇率'
+                  )
+                "
+                >{{ $t("兑核销基准币种汇率") }}（{{
+                  getCurrencyLabel(showCurrencyId)
+                }}）</span
+              >
             </template>
-            <el-input  v-if="!isView" v-model="addForm.rate" style="width: 220px"></el-input>
-            <span v-else>{{ addForm.rate}}</span>
+            <el-input
+              v-if="!isView"
+              v-model="addForm.rate"
+              style="width: 220px"
+            ></el-input>
+            <span v-else>{{ addForm.rate }}</span>
           </el-form-item>
-          <el-form-item
-            v-if="showCurrencyId != addForm.currencyId"
-          >
+          <el-form-item v-if="showCurrencyId != addForm.currencyId">
             <template slot="label">
-              {{ $t('兑核销基准币种金额') }}（{{getCurrencyLabel(showCurrencyId)}}）
+              {{ $t("兑核销基准币种金额") }}（{{
+                getCurrencyLabel(showCurrencyId)
+              }}）
             </template>
-            <span>{{ addForm.writeOffAmount?parseFloat(addForm.writeOffAmount).toFixed(2):'' }}</span>
+            <span>{{
+              addForm.writeOffAmount
+                ? parseFloat(addForm.writeOffAmount).toFixed(2)
+                : ""
+            }}</span>
           </el-form-item>
-          <el-form-item
-            :label="$t('水单附件')"
-            prop="attr"
-          >
+          <el-form-item :label="$t('水单附件')" prop="attr">
             <el-upload
               v-if="!isView"
               class="upload-demo"
@@ -414,61 +708,82 @@
               :file-list="addForm.attr"
               multiple
             >
-              <el-button size="small" type="primary">{{ $t('上传附件') }}</el-button>
+              <el-button size="small" type="primary">{{
+                $t("上传附件")
+              }}</el-button>
             </el-upload>
             <div v-else>
-              <div v-for="(v, i) in addForm.attr" :key="i"><el-link :href="v.url" type="primary" target="_blank">{{ v.name }}</el-link></div>
+              <div v-for="(v, i) in addForm.attr" :key="i">
+                <el-link :href="v.url" type="primary" target="_blank">{{
+                  v.name
+                }}</el-link>
+              </div>
             </div>
           </el-form-item>
-          <el-form-item
-            :label="$t('水单号')"
-            prop="billNo"
-          >
-            <el-input v-if="!isView" v-model="addForm.billNo" style="width: 220px"></el-input>
+          <el-form-item :label="$t('水单号')" prop="billNo">
+            <el-input
+              v-if="!isView"
+              v-model="addForm.billNo"
+              style="width: 220px"
+            ></el-input>
             <span v-else>{{ addForm.billNo }}</span>
           </el-form-item>
         </el-form>
         <div slot="footer" v-if="!isView">
-          <el-button type="primary" @click="saveFrom">{{ saveBtnText }}</el-button>
-          <el-button @click="hiddenDialog">{{ $t('取消') }}</el-button>
+          <el-button type="primary" @click="saveFrom">{{
+            saveBtnText
+          }}</el-button>
+          <el-button @click="hiddenDialog">{{ $t("取消") }}</el-button>
         </div>
       </div>
     </el-dialog>
     <el-dialog
       :title="$t('收款单银行实收明细反核销-未提交')"
       :visible.sync="dialogVisible"
-          width="30%">
+      width="30%"
+    >
       <div class="cancel_content">
-             <span>{{$t('申请理由')}}</span>
-             <el-input type="textarea" :rows ="6" v-model="reason" :placeholder="$t('请输入理由')"></el-input>
+        <span>{{ $t("申请理由") }}</span>
+        <el-input
+          type="textarea"
+          :rows="6"
+          v-model="reason"
+          :placeholder="$t('请输入理由')"
+        ></el-input>
       </div>
       <span slot="footer" class="dialog-footer">
-            <el-button type="primary" @click="verificationCancelClick()">{{$t('提交反核销')}}</el-button>
-            <el-button @click="dialogVisible = false">{{$t('取消')}}</el-button>
+        <el-button type="primary" @click="verificationCancelClick()">{{
+          $t("提交反核销")
+        }}</el-button>
+        <el-button @click="dialogVisible = false">{{ $t("取消") }}</el-button>
       </span>
     </el-dialog>
-        <el-dialog
-         :title="$t('取消审核')"
-          :visible.sync="cancelShow"
-          width="30%">
+    <el-dialog :title="$t('取消审核')" :visible.sync="cancelShow" width="30%">
       <div class="cancel_content">
-             <span>{{$t('申请理由')}}</span>
-             <el-input type="textarea" :rows ="6" v-model="cancelReason" :placeholder="$t('请输入取消审核理由')"></el-input>
+        <span>{{ $t("申请理由") }}</span>
+        <el-input
+          type="textarea"
+          :rows="6"
+          v-model="cancelReason"
+          :placeholder="$t('请输入取消审核理由')"
+        ></el-input>
       </div>
       <span slot="footer" class="dialog-footer">
-            <el-button type="primary" @click="cancelWriteOffClick()">{{$t('提交')}}</el-button>
-            <el-button @click="cancelShow = false">{{$t('取消')}}</el-button>
+        <el-button type="primary" @click="cancelWriteOffClick()">{{
+          $t("提交")
+        }}</el-button>
+        <el-button @click="cancelShow = false">{{ $t("取消") }}</el-button>
       </span>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import helpIcon from  "@/assets/images/help.png"
+import helpIcon from "@/assets/images/help.png";
 import { getBankAccountPage } from "@/api/ecw/bankAccount";
 import { getToken } from "@/utils/auth";
 import { listSimpleDepts } from "@/api/system/dept";
-import { getCustomer } from '@/api/ecw/customer'
+import { getCustomer } from "@/api/ecw/customer";
 import { getExchangeRatePage } from "@/api/ecw/exchangeRate";
 
 import {
@@ -489,14 +804,12 @@ import {
   cancelFinanceReceiptItemWriteOffNo,
   cancelFinanceReceiptWriteOffNo,
   cancelFinanceReceiptWriteOff,
-  financeReceiptWriteOffNo
+  financeReceiptWriteOffNo,
 } from "@/api/ecw/financial";
 import { getCurrencyPage } from "@/api/ecw/currency";
-import NP from 'number-precision'
-
+import NP from "number-precision";
 
 export default {
-
   data() {
     return {
       uploadFileUrl: process.env.VUE_APP_BASE_API + "/app-api/file/upload", // 上传的图片服务器地址
@@ -517,8 +830,8 @@ export default {
       detailed: [],
       deptData: [],
       deptArr: [],
-      dialogTitle: this.$t('添加银行实收明细'),
-      saveBtnText: this.$t('添加'),
+      dialogTitle: this.$t("添加银行实收明细"),
+      saveBtnText: this.$t("添加"),
       isView: false,
       multipleSelection: [],
       currencyList: [],
@@ -527,613 +840,754 @@ export default {
         rmbCount: 0,
         nairaCount: 0,
         writtenOff: 0,
-        WriteOffProportion: 0
+        WriteOffProportion: 0,
       },
       remainingAmount: {
         usAmount: 0,
         rmbAmount: 0,
-        nairaAmount: 0
+        nairaAmount: 0,
       },
-      surplusData:[],
-      dialogVisible:false,
-      reason:'',
-      cancelShow:false,
-      cancelTitle:'',
-      cancelReason:'',
-      cancelType:1,
-      detailReason:'',
-      detailTitle:'',
-      detailShow:false,
-      detailIndex:1,
-      wiffShow:false,
-      wiffRemark:'',
-      rateList:[],
+      surplusData: [],
+      dialogVisible: false,
+      reason: "",
+      cancelShow: false,
+      cancelTitle: "",
+      cancelReason: "",
+      cancelType: 1,
+      detailReason: "",
+      detailTitle: "",
+      detailShow: false,
+      detailIndex: 1,
+      wiffShow: false,
+      wiffRemark: "",
+      rateList: [],
       codePage: {
         pageNo: 1,
-         pageSize: 20
+        pageSize: 20,
       },
-      pages:1
-    }
+      pages: 1,
+    };
   },
   computed: {
     showCurrencyId() {
       let fieldList = [];
-      let groupList=[];
-      this.list.map((element)=>{
-        if(fieldList.indexOf(element['currencyId'])===-1){
-          fieldList.push(element['currencyId'])
+      let groupList = [];
+      this.list.map((element) => {
+        if (fieldList.indexOf(element["currencyId"]) === -1) {
+          fieldList.push(element["currencyId"]);
         }
-      })
-      for(let i=0;i<fieldList.length;i++){
-        let arr = this.list.filter((element)=>{
-          return element['currencyId']===fieldList[i];
-        })
+      });
+      for (let i = 0; i < fieldList.length; i++) {
+        let arr = this.list.filter((element) => {
+          return element["currencyId"] === fieldList[i];
+        });
         groupList.push({
-          currencyId:arr[0].currencyId,
-          list:arr
-        })
+          currencyId: arr[0].currencyId,
+          list: arr,
+        });
       }
-      if (groupList.length === 1) return groupList[0].currencyId
-      else return 1
+      if (groupList.length === 1) return groupList[0].currencyId;
+      else return 1;
     },
     // 已核销总金额
-    writeOffTotal(){
-      let total = {}
-      this.detailed.forEach(item => {
-        if(item.status){
-          if(!total[item.currencyId]){
-            total[item.currencyId] = item.amount
-          }else total[item.currencyId] = NP.plus(total[item.currencyId], item.amount)
+    writeOffTotal() {
+      let total = {};
+      this.detailed.forEach((item) => {
+        if (item.status) {
+          if (!total[item.currencyId]) {
+            total[item.currencyId] = item.amount;
+          } else
+            total[item.currencyId] = NP.plus(
+              total[item.currencyId],
+              item.amount
+            );
         }
-      })
-      return total
+      });
+      return total;
     },
     // 已核销总金额
-    writeOffAmount(){
-      let total = 0
-      this.detailed.forEach(item => {
-        if(item.status){
-          total = NP.plus(total, item.writeOffAmount)
+    writeOffAmount() {
+      let total = 0;
+      this.detailed.forEach((item) => {
+        if (item.status) {
+          total = NP.plus(total, item.writeOffAmount);
         }
-      })
+      });
 
-      return total.toFixed(2)
+      return total.toFixed(2);
     },
     //显示反审核反核销弹窗
-    writeOffShow(){
-      this.wiffRemark = ''
-      this.wiffShow = true
+    writeOffShow() {
+      this.wiffRemark = "";
+      this.wiffShow = true;
     },
-    WriteOffProportion(){
-        let total = 0
-        if(!this.form.receiptAccountList) return 0
-        let amountTotal = this.form.receiptAccountList.find(item=>item.type=='total').writeOffAmount
+    WriteOffProportion() {
+      let total = 0;
+      if (!this.form.receiptAccountList) return 0;
+      let amountTotal = this.form.receiptAccountList.find(
+        (item) => item.type == "total"
+      ).writeOffAmount;
 
-        this.detailed.forEach(item => {
-          if(item.status){
-            total = NP.plus(total, item.writeOffAmount)
+      this.detailed.forEach((item) => {
+        if (item.status) {
+          total = NP.plus(total, item.writeOffAmount);
         }
-        })
+      });
 
-      let portion = NP.divide(total,amountTotal)
+      let portion = NP.divide(total, amountTotal);
       console.log(portion);
-      if(!portion) return 0
-      return (portion*100).toFixed(2)
-    }
+      if (!portion) return 0;
+      return (portion * 100).toFixed(2);
+    },
   },
   watch: {
-    'addForm.rate'() {
-      this.setWriteOffAmount()
+    "addForm.rate"() {
+      this.setWriteOffAmount();
     },
   },
   directives: {
-      'el-select-loadmore': {
-        bind (el, binding) {
+    "el-select-loadmore": {
+      bind(el, binding) {
         const SELECTWRAP_DOM = el.querySelector(
-            '.el-select-dropdown .el-select-dropdown__wrap'
-          )
-          SELECTWRAP_DOM.addEventListener('scroll', function () {
+          ".el-select-dropdown .el-select-dropdown__wrap"
+        );
+        SELECTWRAP_DOM.addEventListener("scroll", function () {
           const condition =
-              this.scrollHeight - this.scrollTop <= this.clientHeight
+            this.scrollHeight - this.scrollTop <= this.clientHeight;
           if (condition) {
-              binding.value()
-            }
-          })
-        }
+            binding.value();
           }
+        });
+      },
+    },
   },
   async created() {
     // 获取汇率
-    await getCurrencyPage(this.params).then(res => this.currencyList = res.data.list)
-    await getExchangeRatePage(this.params).then(res => this.rateList = res.data.list)
+    await getCurrencyPage(this.params).then(
+      (res) => (this.currencyList = res.data.list)
+    );
+    await getExchangeRatePage(this.params).then(
+      (res) => (this.rateList = res.data.list)
+    );
     await listSimpleDepts().then((res) => {
-       this.deptData = res.data
+      this.deptData = res.data;
     });
     await getBankAccountPage(this.codePage).then((res) => {
-      this.bankData = res.data.list
-      this.pages = (res.data.total/this.codePage.pageSize)+1
+      this.bankData = res.data.list;
+      this.pages = res.data.total / this.codePage.pageSize + 1;
     });
     if (this.$route.query.id) {
       this.id = this.$route.query.id;
-      await getReceiptInfoByIds({ id: this.id }).then(res => {
-        this.form = res.data
-        let dept = this.deptData.filter((itt) => itt.id == res.data.departmentId);
-        if(dept.length>0){
-          this.form.departmentName = dept[0].name
+      await getReceiptInfoByIds({ id: this.id }).then((res) => {
+        this.form = res.data;
+        let dept = this.deptData.filter(
+          (itt) => itt.id == res.data.departmentId
+        );
+        if (dept.length > 0) {
+          this.form.departmentName = dept[0].name;
         }
-      })
-      await getInvoicingItem({ id: this.id }).then(res => {
-        this.list = [...res.data]
-      })
-      getReceiptAccountList({ id: this.id }).then(res => {
+      });
+      await getInvoicingItem({ id: this.id }).then((res) => {
+        this.list = [...res.data];
+      });
+      getReceiptAccountList({ id: this.id }).then((res) => {
         if (res.data.length > 0) {
-          res.data = [...res.data, {
-            type: 'total',
-            writeOffAmount: res.data.reduce((total, currentValue) => NP.plus(total, currentValue.writeOffAmount || 0), 0).toFixed(2),
-            collectionAmount: []
-          }]
+          res.data = [
+            ...res.data,
+            {
+              type: "total",
+              writeOffAmount: res.data
+                .reduce(
+                  (total, currentValue) =>
+                    NP.plus(total, currentValue.writeOffAmount || 0),
+                  0
+                )
+                .toFixed(2),
+              collectionAmount: [],
+            },
+          ];
         }
-       this.$set(this.form, 'receiptAccountList', res.data)
+        this.$set(this.form, "receiptAccountList", res.data);
         // 收款总计
 
-        let num
-        let amountList =[]
-        this.currencyList.forEach((item,index)=>{
-          let nairaListByList = this.list.filter(v => v.currencyId === item.id)
-          if(nairaListByList.length>0){
-            let discountNaira = nairaListByList.reduce((total, currentValue) => NP.plus(total, currentValue.discountTotal || 0), 0)
-            num = res.data.find(v => v.currencyId == item.id)
-            num && (num.discountTotal = discountNaira)
+        let num;
+        let amountList = [];
+        this.currencyList.forEach((item, index) => {
+          let nairaListByList = this.list.filter(
+            (v) => v.currencyId === item.id
+          );
+          if (nairaListByList.length > 0) {
+            let discountNaira = nairaListByList.reduce(
+              (total, currentValue) =>
+                NP.plus(total, currentValue.discountTotal || 0),
+              0
+            );
+            num = res.data.find((v) => v.currencyId == item.id);
+            num && (num.discountTotal = discountNaira);
           }
-          let dollarList = this.form.receiptAccountList.filter(v => v.collectionCurrencyId == item.id)
-          if(dollarList.length>0){
-            let dollar = dollarList.reduce((total, currentValue) => NP.plus(total, currentValue.collectionAmount || 0), 0).toFixed(2)
+          let dollarList = this.form.receiptAccountList.filter(
+            (v) => v.collectionCurrencyId == item.id
+          );
+          if (dollarList.length > 0) {
+            let dollar = dollarList
+              .reduce(
+                (total, currentValue) =>
+                  NP.plus(total, currentValue.collectionAmount || 0),
+                0
+              )
+              .toFixed(2);
             // if(n && n.discountTotal&&n.discountTotal>0){
             //   amountList.push({currencyName:item.titleZh, currencyId: item.id, amount:(dollar-n.discountTotal).toFixed(2)})
             // }else{
-             amountList.push({currencyId:item.id,currencyNameEn:item.titleEn,currencyNameZh:item.titleZh,amount:dollar||0})
+            amountList.push({
+              currencyId: item.id,
+              currencyNameEn: item.titleEn,
+              currencyNameZh: item.titleZh,
+              amount: dollar || 0,
+            });
             // }
-
           }
-        })
-        this.form.receiptAccountList[this.form.receiptAccountList.length -1].collectionAmount = amountList
-        this.$set(this.form, 'receiptAccountList', [...this.form.receiptAccountList])
-
+        });
+        this.form.receiptAccountList[
+          this.form.receiptAccountList.length - 1
+        ].collectionAmount = amountList;
+        this.$set(this.form, "receiptAccountList", [
+          ...this.form.receiptAccountList,
+        ]);
 
         this.$nextTick(() => {
-          if(this.form.receiptAccountList.length>0){
-            this.editReceiptAccountList()
+          if (this.form.receiptAccountList.length > 0) {
+            this.editReceiptAccountList();
           }
-        })
-      })
+        });
+      });
     }
 
-    this.getList()
+    this.getList();
   },
   methods: {
     // 懒加载
-    loadmore () {
-      this.codePage.pageNo++
+    loadmore() {
+      this.codePage.pageNo++;
       // 大于页码不请求了
-      console.log(111)
+      console.log(111);
       if (this.codePage.pageNo > this.pages) {
-        return
+        return;
       }
-      this.getCodeList()
+      this.getCodeList();
     },
     getCodeList() {
       setTimeout(() => {
-           getBankAccountPage(this.codePage).then(res => {
-             this.bankData = this.bankData.concat(res.data.list)
-             this.pages = (res.data.total/this.codePage.pageSize)+1
-             })
-         }, 200)
+        getBankAccountPage(this.codePage).then((res) => {
+          this.bankData = this.bankData.concat(res.data.list);
+          this.pages = res.data.total / this.codePage.pageSize + 1;
+        });
+      }, 200);
     },
     rateChange(row, index) {
-      if(row.collectionRate){
-        row.receivableAmount && (row.collectionAmount = Math.round(NP.times(row.collectionRate || 0, NP.minus(row.receivableAmount, row.discountTotal||0))))
-      }else{
-        row.collectionAmount = ''
+      if (row.collectionRate) {
+        row.receivableAmount &&
+          (row.collectionAmount = Math.round(
+            NP.times(
+              row.collectionRate || 0,
+              NP.minus(row.receivableAmount, row.discountTotal || 0)
+            )
+          ));
+      } else {
+        row.collectionAmount = "";
       }
       // row.receivableAmount && (row.collectionAmount = NP.times(row.collectionRate || 0, NP.minus(row.receivableAmount, row.discountTotal||0)).toFixed(2))
-      this.form.receiptAccountList[index] = {...row}
+      this.form.receiptAccountList[index] = { ...row };
     },
-    editReceiptAccountList(){
-      let amountList =[]
-      this.currencyList.forEach((item,index)=>{
-        let dollarList = this.form.receiptAccountList.filter(v => v.collectionCurrencyId == item.id)
-        if(dollarList.length>0){
-          let dollar = dollarList.reduce((total, currentValue) => NP.plus(total, currentValue.collectionAmount || 0), 0)
-          amountList.push({currencyId:item.id,currencyNameEn:item.titleEn,currencyNameZh:item.titleZh,amount:dollar.toFixed(2)})
+    editReceiptAccountList() {
+      let amountList = [];
+      this.currencyList.forEach((item, index) => {
+        let dollarList = this.form.receiptAccountList.filter(
+          (v) => v.collectionCurrencyId == item.id
+        );
+        if (dollarList.length > 0) {
+          let dollar = dollarList.reduce(
+            (total, currentValue) =>
+              NP.plus(total, currentValue.collectionAmount || 0),
+            0
+          );
+          amountList.push({
+            currencyId: item.id,
+            currencyNameEn: item.titleEn,
+            currencyNameZh: item.titleZh,
+            amount: dollar.toFixed(2),
+          });
         }
-      })
-      this.form.receiptAccountList[this.form.receiptAccountList.length -1].collectionAmount = amountList
-      this.$set(this.form, 'receiptAccountList', [...this.form.receiptAccountList])
+      });
+      this.form.receiptAccountList[
+        this.form.receiptAccountList.length - 1
+      ].collectionAmount = amountList;
+      this.$set(this.form, "receiptAccountList", [
+        ...this.form.receiptAccountList,
+      ]);
     },
     setWriteOffAmount() {
-      let pointArr = []
-      let regs=/^[0-9]+\d*(\.\d*)?$|^0?\.\d*[0-9]\d*$/;
-      if(this.addForm.amount&&!regs.test(this.addForm.amount)){
-        this.addForm.amount = ''
-        this.$modal.msgError(this.$t('输入金额不对'));
-      }else{
-        if(this.addForm&&this.addForm.amount){
-          pointArr = this.addForm.amount.toString().split('.')
-          if(pointArr.length>1&&pointArr[1]){
-            this.addForm.amount =Math.round(this.addForm.amount*100)/100
+      let pointArr = [];
+      let regs = /^[0-9]+\d*(\.\d*)?$|^0?\.\d*[0-9]\d*$/;
+      if (this.addForm.amount && !regs.test(this.addForm.amount)) {
+        this.addForm.amount = "";
+        this.$modal.msgError(this.$t("输入金额不对"));
+      } else {
+        if (this.addForm && this.addForm.amount) {
+          pointArr = this.addForm.amount.toString().split(".");
+          if (pointArr.length > 1 && pointArr[1]) {
+            this.addForm.amount = Math.round(this.addForm.amount * 100) / 100;
           }
         }
       }
-      this.$set(this.addForm, 'writeOffAmount', NP.times(this.addForm.rate || 0, this.addForm.amount || 0))
+      this.$set(
+        this.addForm,
+        "writeOffAmount",
+        NP.times(this.addForm.rate || 0, this.addForm.amount || 0)
+      );
     },
-    getCurrencyLabel(id){
-      let label = this.currencyList.filter(item=>item.id == id)
-      if(label.length>0) return this.$i18n.locale=='zh_CN'?label[0].titleZh:label[0].titleEn
-      return ''
+    getCurrencyLabel(id) {
+      let label = this.currencyList.filter((item) => item.id == id);
+      if (label.length > 0)
+        return this.$i18n.locale == "zh_CN"
+          ? label[0].titleZh
+          : label[0].titleEn;
+      return "";
     },
     getsurplusData() {
       // 已收
-          this.surplusData = []
-          let recepted = []
-          this.detailed.forEach(item => {
-              if(!recepted[item.currencyId]){
-                recepted[item.currencyId] = item.amount
-              }else recepted[item.currencyId] = NP.plus(recepted[item.currencyId], item.amount)
-          })
+      this.surplusData = [];
+      let recepted = [];
+      this.detailed.forEach((item) => {
+        if (!recepted[item.currencyId]) {
+          recepted[item.currencyId] = item.amount;
+        } else
+          recepted[item.currencyId] = NP.plus(
+            recepted[item.currencyId],
+            item.amount
+          );
+      });
       // 应收
-          let collom = []
+      let collom = [];
       // 从期望收费金额中提取应收币种和金额
-         this.form.receiptAccountList.find(item => item.type == 'total').collectionAmount.forEach(item => {
-           collom[item.currencyId] = item.amount
-         })
-            recepted.forEach((amount,currency)=>{
-              if(amount){
-                if(collom[currency]){
-                  if((collom[currency]-amount)!=0) this.surplusData[currency] = +parseFloat((collom[currency]-amount).toPrecision(12))
-                }else{
-                  this.surplusData[currency] = -amount
+      this.form.receiptAccountList
+        .find((item) => item.type == "total")
+        .collectionAmount.forEach((item) => {
+          collom[item.currencyId] = item.amount;
+        });
+      recepted.forEach((amount, currency) => {
+        if (amount) {
+          if (collom[currency]) {
+            if (collom[currency] - amount != 0)
+              this.surplusData[currency] = +parseFloat(
+                (collom[currency] - amount).toPrecision(12)
+              );
+          } else {
+            this.surplusData[currency] = -amount;
           }
         }
-
-            })
-            collom.forEach((amount,currency)=>{
-              if(amount){
-                if(!this.surplusData[currency]){
-                  if(recepted[currency]){
-                   if((amount-recepted[currency])!=0)  this.surplusData[currency] = +parseFloat((amount-recepted[currency]).toPrecision(12))
-                  }else{
-                  this.surplusData[currency] = amount
+      });
+      collom.forEach((amount, currency) => {
+        if (amount) {
+          if (!this.surplusData[currency]) {
+            if (recepted[currency]) {
+              if (amount - recepted[currency] != 0)
+                this.surplusData[currency] = +parseFloat(
+                  (amount - recepted[currency]).toPrecision(12)
+                );
+            } else {
+              this.surplusData[currency] = amount;
             }
           }
         }
-            })
+      });
     },
-    accountChange(val){
-      let data = this.bankData.find(item=>item.id==val)
-      this.$set(this.addForm,'accountName',data.baAccountName||'')
-      this.$set(this.addForm,'accountNo',data.baAccountNum||'')
-      this.$set(this.addForm,'accountBankName',data.baBankName||'')
+    accountChange(val) {
+      let data = this.bankData.find((item) => item.id == val);
+      this.$set(this.addForm, "accountName", data.baAccountName || "");
+      this.$set(this.addForm, "accountNo", data.baAccountNum || "");
+      this.$set(this.addForm, "accountBankName", data.baBankName || "");
     },
     RMBtoUS() {
-      return NP.divide(100, this.currencyList.find(v => v.titleEn === 'USD').huilv)
+      return NP.divide(
+        100,
+        this.currencyList.find((v) => v.titleEn === "USD").huilv
+      );
     },
     NANtoUS() {
-      return NP.times(this.RMBtoUS(), this.NANtoRMB())
+      return NP.times(this.RMBtoUS(), this.NANtoRMB());
     },
     UStoRMB() {
-      return NP.divide(this.currencyList.find(v => v.titleEn === 'USD').huilv, 100)
+      return NP.divide(
+        this.currencyList.find((v) => v.titleEn === "USD").huilv,
+        100
+      );
     },
     UStoNAN() {
-      return NP.times(this.RMBtoNAN(), this.UStoRMB())
+      return NP.times(this.RMBtoNAN(), this.UStoRMB());
     },
     RMBtoNAN() {
-      return NP.divide(100, this.currencyList.find(v => v.titleEn === 'NGN').huilv)
+      return NP.divide(
+        100,
+        this.currencyList.find((v) => v.titleEn === "NGN").huilv
+      );
     },
     NANtoRMB() {
-      return NP.divide(this.currencyList.find(v => v.titleEn === 'NGN').huilv, 100)
+      return NP.divide(
+        this.currencyList.find((v) => v.titleEn === "NGN").huilv,
+        100
+      );
     },
     //显示反核销弹窗
-    showCancel(index){
-      this.selectIndex = index
-      this.reason = ''
-      this.dialogVisible = true
+    showCancel(index) {
+      this.selectIndex = index;
+      this.reason = "";
+      this.dialogVisible = true;
     },
-    writeOffClick(){
-      if(!this.wiffRemark){
-         this.$modal.msgError(this.$t('请输入申请理由'));
-        return
+    writeOffClick() {
+      if (!this.wiffRemark) {
+        this.$modal.msgError(this.$t("请输入申请理由"));
+        return;
       }
       this.$modal
-          .confirm(this.$t('您确认要反核销吗')+'?')
-          .then(()=>{
-            financeReceiptWriteOffNo({receiptId:this.id,receiptNo:this.form.receiptNo,remark:this.wiffRemark}).then(res=>{
+        .confirm(this.$t("您确认要反核销吗") + "?")
+        .then(() => {
+          financeReceiptWriteOffNo({
+            receiptId: this.id,
+            receiptNo: this.form.receiptNo,
+            remark: this.wiffRemark,
+          }).then((res) => {
             this.getReceiptInfoData();
             this.$message.success(this.$t("提交成功"));
-              this.wiffShow = false
+            this.wiffShow = false;
             // this.$store.dispatch('tagsView/delCurrentView')
           });
         })
-          .catch(() => {this.wiffShow = false});
-
+        .catch(() => {
+          this.wiffShow = false;
+        });
     },
     //显示取消审核弹窗
-    detailClickCancel(type){
-      this.detailIndex = type
-      this.detailReason = ''
-      if(this.detailIndex==1){
-        this.detailTitle = this.$t('取消反核销审核')
-      }else{
-        this.detailTitle = this.$t('取消全部核销审核')
+    detailClickCancel(type) {
+      this.detailIndex = type;
+      this.detailReason = "";
+      if (this.detailIndex == 1) {
+        this.detailTitle = this.$t("取消反核销审核");
+      } else {
+        this.detailTitle = this.$t("取消全部核销审核");
       }
-      this.detailShow = true
+      this.detailShow = true;
     },
     //取消审核弹窗
-    cancelClick(index,type){
-       this.selectIndex = index
-       this.cancelType = type
-        this.cancelReason = ''
-        this.cancelShow = true
+    cancelClick(index, type) {
+      this.selectIndex = index;
+      this.cancelType = type;
+      this.cancelReason = "";
+      this.cancelShow = true;
     },
     //取消审核
-    detailWriteOffClick(){
-      if(!this.detailReason){
-         this.$modal.msgError(this.$t('请输入申请理由'));
-        return
+    detailWriteOffClick() {
+      if (!this.detailReason) {
+        this.$modal.msgError(this.$t("请输入申请理由"));
+        return;
       }
-      if(this.detailIndex ==1){
-          cancelFinanceReceiptWriteOffNo({receiptId:this.id,remark:this.detailReason}).then(res=>{
-            this.detailShow = false
+      if (this.detailIndex == 1) {
+        cancelFinanceReceiptWriteOffNo({
+          receiptId: this.id,
+          remark: this.detailReason,
+        }).then((res) => {
+          this.detailShow = false;
           this.getReceiptInfoData();
           this.$message.success(this.$t("提交成功"));
-
         });
-      }else{
-          cancelFinanceReceiptWriteOff({receiptId:this.id,remark:this.detailReason}).then(res=>{
-            this.detailShow = false
+      } else {
+        cancelFinanceReceiptWriteOff({
+          receiptId: this.id,
+          remark: this.detailReason,
+        }).then((res) => {
+          this.detailShow = false;
           this.getReceiptInfoData();
           this.$message.success(this.$t("提交成功"));
-
         });
       }
-
     },
-    getReceiptInfoData(){
-      getReceiptInfoByIds({ id: this.id }).then(res => {
-        this.form = res.data
-        getCustomer(this.form.customerId).then(res => {
-          this.form.customerName = res?.data?.name
-        })
-        let dept = this.deptData.filter((itt) => itt.id == res.data.departmentId);
+    getReceiptInfoData() {
+      getReceiptInfoByIds({ id: this.id }).then((res) => {
+        this.form = res.data;
+        getCustomer(this.form.customerId).then((res) => {
+          this.form.customerName = res?.data?.name;
+        });
+        let dept = this.deptData.filter(
+          (itt) => itt.id == res.data.departmentId
+        );
         // console.log(dept)
-        if(dept.length>0){
-          this.form.departmentName = dept[0].name
+        if (dept.length > 0) {
+          this.form.departmentName = dept[0].name;
         }
-      })
+      });
     },
     //取消审核
-    cancelWriteOffClick(){
-      if(!this.cancelReason){
-         this.$modal.msgError(this.$t('请输入申请理由'));
-        return
+    cancelWriteOffClick() {
+      if (!this.cancelReason) {
+        this.$modal.msgError(this.$t("请输入申请理由"));
+        return;
       }
-      let receiptItemId = this.detailed[this.selectIndex].id
-      if(this.cancelType==1){
-        cancelFinanceReceiptItemWriteOff({receiptItemId:receiptItemId,remark:this.cancelReason}).then(res=>{
-          this.cancelShow = false
-          this.getList()
+      let receiptItemId = this.detailed[this.selectIndex].id;
+      if (this.cancelType == 1) {
+        cancelFinanceReceiptItemWriteOff({
+          receiptItemId: receiptItemId,
+          remark: this.cancelReason,
+        }).then((res) => {
+          this.cancelShow = false;
+          this.getList();
           this.$message.success(this.$t("提交成功"));
-
         });
-      }else{
-        cancelFinanceReceiptItemWriteOffNo({receiptItemId:receiptItemId,remark:this.cancelReason}).then(res=>{
-          this.cancelShow = false
-          this.getList()
+      } else {
+        cancelFinanceReceiptItemWriteOffNo({
+          receiptItemId: receiptItemId,
+          remark: this.cancelReason,
+        }).then((res) => {
+          this.cancelShow = false;
+          this.getList();
           this.$message.success(this.$t("提交成功"));
-
         });
       }
-
     },
     currencyIdChange(val) {
-      val = Number(val)
-      let rate
-      if(val === this.showCurrencyId) {
-        rate = 1
+      val = Number(val);
+      let rate;
+      if (val === this.showCurrencyId) {
+        rate = 1;
       } else {
-        rate = this.getRate(val,this.showCurrencyId)
+        rate = this.getRate(val, this.showCurrencyId);
       }
-      this.$set(this.addForm, 'rate', rate)
+      this.$set(this.addForm, "rate", rate);
     },
     //获取汇率
-    getRate(sourceCurrencyId,targetCurrencyId){
-      let rate = this.rateList.find(v=>(v.sourceCurrencyId === sourceCurrencyId&&v.targetCurrencyId===targetCurrencyId))
-      if(rate) return rate.currencyRate
-      return ''
+    getRate(sourceCurrencyId, targetCurrencyId) {
+      let rate = this.rateList.find(
+        (v) =>
+          v.sourceCurrencyId === sourceCurrencyId &&
+          v.targetCurrencyId === targetCurrencyId
+      );
+      if (rate) return rate.currencyRate;
+      return "";
     },
     getList() {
-      getReceivableItem({ id: this.id }).then(res => {
-        this.detailed = res.data.map(v => ({
+      getReceivableItem({ id: this.id }).then((res) => {
+        this.detailed = res.data.map((v) => ({
           ...v,
-          amountDate: this.parseTime(v.amountDate, '{y}-{m}-{d}'),
-          rate:parseFloat(v.rate),
-          attr: v.attr ? v.attr.split(',').map(t => ({ name: t.slice(t.lastIndexOf('/') + 1), url: t })) : []
-        }))
-      })
+          amountDate: this.parseTime(v.amountDate, "{y}-{m}-{d}"),
+          rate: parseFloat(v.rate),
+          attr: v.attr
+            ? v.attr
+                .split(",")
+                .map((t) => ({ name: t.slice(t.lastIndexOf("/") + 1), url: t }))
+            : [],
+        }));
+      });
     },
     saveFrom() {
-      this.$refs.addForm.validate ((valid)=>{
+      this.$refs.addForm.validate((valid) => {
         if (valid) {
           if (this.addForm.id) {
-            const params = {...this.addForm}
-            params.attr && (params.attr = params.attr.map(v => v.url).join(','))
-            updateReceiptItem(params).then(res => {
-              this.$modal.msgSuccess(this.$t('修改成功'));
-              this.openAddDialog = false
-              this.getList()
-            })
-            return
+            const params = { ...this.addForm };
+            params.attr &&
+              (params.attr = params.attr.map((v) => v.url).join(","));
+            updateReceiptItem(params).then((res) => {
+              this.$modal.msgSuccess(this.$t("修改成功"));
+              this.openAddDialog = false;
+              this.getList();
+            });
+            return;
           }
-          const params = {...this.addForm}
-          params.attr && (params.attr = params.attr.map(v => v.url).join(','))
-          params.receiptId = this.id
-          receiptItemCreate(params).then(res => {
-            this.$modal.msgSuccess(this.$t('新增成功'));
-            this.openAddDialog = false
-            this.getList()
-          })
+          const params = { ...this.addForm };
+          params.attr &&
+            (params.attr = params.attr.map((v) => v.url).join(","));
+          params.receiptId = this.id;
+          receiptItemCreate(params).then((res) => {
+            this.$modal.msgSuccess(this.$t("新增成功"));
+            this.openAddDialog = false;
+            this.getList();
+          });
         }
-      })
-
+      });
     },
     toEdit() {
       return this.$router.push("creatCollection?id=" + this.id);
     },
     detailClick(row) {
-      this.getsurplusData()
-      this.openAddDialog = true
-      this.dialogTitle = this.$t('银行实收明细详情')
-      this.isView = true
+      this.getsurplusData();
+      this.openAddDialog = true;
+      this.dialogTitle = this.$t("银行实收明细详情");
+      this.isView = true;
       setTimeout(() => {
-        this.addForm = { ...row }
-        this.setWriteOffAmount()
-      }, 0)
+        this.addForm = { ...row };
+        this.setWriteOffAmount();
+      }, 0);
     },
     editClick(row) {
-      this.getsurplusData()
-      this.openAddDialog = true
-      this.dialogTitle = this.$t('编辑银行实收明细')
-      this.saveBtnText = this.$t('提交')
-      this.isView = false
+      this.getsurplusData();
+      this.openAddDialog = true;
+      this.dialogTitle = this.$t("编辑银行实收明细");
+      this.saveBtnText = this.$t("提交");
+      this.isView = false;
       setTimeout(() => {
-        this.addForm = { ...row }
-        let bank = this.bankData.find(v=>v.baAccountNum==this.addForm.accountNo)
-        if(bank) this.addForm.accountId = bank.id
-        this.setWriteOffAmount()
-      }, 0)
+        this.addForm = { ...row };
+        let bank = this.bankData.find(
+          (v) => v.baAccountNum == this.addForm.accountNo
+        );
+        if (bank) this.addForm.accountId = bank.id;
+        this.setWriteOffAmount();
+      }, 0);
     },
     deleteClick(row) {
       const id = row.id;
-      this.$modal.confirm(this.$t('是否确认删除该收款单')+'?').then(function() {
+      this.$modal
+        .confirm(this.$t("是否确认删除该收款单") + "?")
+        .then(function () {
           return deleteReceiptItem(id);
-      }).then(() => {
+        })
+        .then(() => {
           this.getList();
-        this.$modal.msgSuccess(this.$t('删除成功'));
-      }).catch(() => {});
+          this.$modal.msgSuccess(this.$t("删除成功"));
+        })
+        .catch(() => {});
     },
     verificationClick(row) {
       const id = row.id;
       this.$modal
-        .confirm(this.$t('您确认要核销吗')+'?')
+        .confirm(this.$t("您确认要核销吗") + "?")
         .then(function () {
           return receiptItemVerification(id);
         })
         .then(() => {
           this.getList();
-          this.$modal.msgSuccess(this.$t('核销成功'));
+          this.$modal.msgSuccess(this.$t("核销成功"));
         })
         .catch(() => {});
     },
     //银行明细反核销
     verificationCancelClick() {
-      if(!this.reason){
-         this.$modal.msgError(this.$t('请输入申请理由'));
-        return
+      if (!this.reason) {
+        this.$modal.msgError(this.$t("请输入申请理由"));
+        return;
       }
-      const id = this.detailed[this.selectIndex].id
+      const id = this.detailed[this.selectIndex].id;
       this.$modal
-        .confirm(this.$t('您确认要反核销吗')+'?')
-        .then(()=>{
-          financeReceiptItemWriteOffNo({receiptId:this.id,receiptNo:this.form.receiptNo,receiptItemId:id,remark:this.reason}).then(res=>{
+        .confirm(this.$t("您确认要反核销吗") + "?")
+        .then(() => {
+          financeReceiptItemWriteOffNo({
+            receiptId: this.id,
+            receiptNo: this.form.receiptNo,
+            receiptItemId: id,
+            remark: this.reason,
+          }).then((res) => {
             this.getList();
             this.$message.success(this.$t("提交成功"));
-              this.dialogVisible = false
+            this.dialogVisible = false;
           });
         })
-        .catch(() => {this.dialogVisible = false});
+        .catch(() => {
+          this.dialogVisible = false;
+        });
     },
     handleSelectionChange(val) {
       this.multipleSelection = val;
     },
     batchVerification() {
       if (this.multipleSelection.length === 0) {
-        this.$modal.msgError(this.$t('请选择需要核销的收款明细'));
-        return
+        this.$modal.msgError(this.$t("请选择需要核销的收款明细"));
+        return;
       }
-      const params = { ids: this.multipleSelection.map(v => v.id).join(',') }
+      const params = { ids: this.multipleSelection.map((v) => v.id).join(",") };
       this.$modal
-        .confirm(this.$t('您确认要核销吗'+'?'))
+        .confirm(this.$t("您确认要核销吗" + "?"))
         .then(function () {
           return receiptItemBatchVerification(params);
         })
         .then(() => {
-          this.multipleSelection.forEach(row => {
+          this.multipleSelection.forEach((row) => {
             this.$refs.multipleTable.toggleRowSelection(row);
           });
           this.getList();
-          this.$modal.msgSuccess(this.$t('核销成功'));
+          this.$modal.msgSuccess(this.$t("核销成功"));
         })
         .catch(() => {});
     },
     verificationAll() {
-      if(!this.detailed||this.detailed.length==0){
-        this.$modal.msgError(this.$t('当前收款单未添加银行收款明细，无法全部核销，请添加银行收款单明细，并核销所有实收明细后再进行全部核销'));
-        return
+      if (!this.detailed || this.detailed.length == 0) {
+        this.$modal.msgError(
+          this.$t(
+            "当前收款单未添加银行收款明细，无法全部核销，请添加银行收款单明细，并核销所有实收明细后再进行全部核销"
+          )
+        );
+        return;
       }
       this.$modal
-        .confirm(this.$t('您确认要全部核销吗'+'?'))
+        .confirm(this.$t("您确认要全部核销吗" + "?"))
         .then(() => {
-          return financeReceiptWriteOff({receiptId:this.id,receiptNo:this.form.receiptNo});
+          return financeReceiptWriteOff({
+            receiptId: this.id,
+            receiptNo: this.form.receiptNo,
+          });
         })
         .then(() => {
-          this.$modal.msgSuccess(this.$t('核销成功'));
-          this.$store.dispatch('tagsView/delCurrentView');
+          this.$modal.msgSuccess(this.$t("核销成功"));
+          this.$store.dispatch("tagsView/delCurrentView");
         })
         .catch(() => {});
     },
     hiddenDialog() {
-      this.openAddDialog = false
+      this.openAddDialog = false;
     },
     handleAddReceiptItem() {
-      this.getsurplusData()
-      this.addForm = {}
-      this.openAddDialog = true
-      this.isView = false
-      this.dialogTitle = this.$t('添加银行实收明细')
-      this.saveBtnText = this.$t('添加')
+      this.getsurplusData();
+      this.addForm = {};
+      this.openAddDialog = true;
+      this.isView = false;
+      this.dialogTitle = this.$t("添加银行实收明细");
+      this.saveBtnText = this.$t("添加");
     },
     handleUploadSuccess(res, file, fileList) {
       let arr = [];
       setTimeout(() => {
         fileList.forEach((item) => {
-          arr.push({ name: item.name, url: item.response ? item.response.data : item.url });
+          arr.push({
+            name: item.name,
+            url: item.response ? item.response.data : item.url,
+          });
         });
         this.addForm.attr = arr;
-      }, 300)
+      }, 300);
       this.loading.close();
     },
     handleBeforeUpload() {
       this.loading = this.$loading({
         lock: true,
-        text: this.$t('上传中'),
+        text: this.$t("上传中"),
         background: "rgba(0, 0, 0, 0.7)",
       });
     },
     handleUploadError() {
       this.$message({
         type: "error",
-        message: this.$t('上传失败'),
+        message: this.$t("上传失败"),
       });
       this.loading.close();
     },
     beforeRemove(file, fileList) {
-      return this.$confirm(this.$t('确定移除')+'?').then(res => {
+      return this.$confirm(this.$t("确定移除") + "?").then((res) => {
         setTimeout(() => {
-          this.addForm.attr = fileList.map(v => ({ name: v.name, url: v.response ? v.response.data : v.url }))
-        }, 300)
+          this.addForm.attr = fileList.map((v) => ({
+            name: v.name,
+            url: v.response ? v.response.data : v.url,
+          }));
+        }, 300);
       });
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style scoped lang="scss">
@@ -1163,15 +1617,15 @@ export default {
     width: 22%;
   }
 }
-  .cancel_content{
+.cancel_content {
   display: flex;
   // align-items: center;
   flex-direction: column;
   // padding-top: 20px;
-  }
-  .cancel_content span{
+}
+.cancel_content span {
   font-size: 16px;
-    font-weight:600;
-    margin-bottom:10px
-  }
+  font-weight: 600;
+  margin-bottom: 10px;
+}
 </style>

src/views/ecw/financial/selfNoReport.vue

@@ -12,8 +12,17 @@
         <el-form-item :label="$t('自编号')" prop="selfNo">
           <el-input v-model="queryParams.selfNo" clearable></el-input>
         </el-form-item>
-          <el-form-item :label="$t('始发仓')" :rules="{required: true, message: $t('请选择始发仓')}" prop="startWarehouseIdList">
-            <el-select v-model="queryParams.startWarehouseIdList" multiple :placeholder="$t('请选择')" clearable>
+        <el-form-item
+          :label="$t('始发仓')"
+          :rules="{ required: true, message: $t('请选择始发仓') }"
+          prop="startWarehouseIdList"
+        >
+          <el-select
+            v-model="queryParams.startWarehouseIdList"
+            multiple
+            :placeholder="$t('请选择')"
+            clearable
+          >
             <el-option
               v-for="item in exportWarehouseList"
               :key="item.id"
@@ -22,8 +31,17 @@
             />
           </el-select>
         </el-form-item>
-          <el-form-item :label="$t('目的国')" :rules="{required: true, message: $t('请选择目的国')}" prop="destCountryId">
-            <el-select v-model="queryParams.destCountryId" :placeholder="$t('请选择')" filterable default-first-option>
+        <el-form-item
+          :label="$t('目的国')"
+          :rules="{ required: true, message: $t('请选择目的国') }"
+          prop="destCountryId"
+        >
+          <el-select
+            v-model="queryParams.destCountryId"
+            :placeholder="$t('请选择')"
+            filterable
+            default-first-option
+          >
             <el-option
               v-for="item in countryList"
               :key="item.id"
@@ -33,7 +51,14 @@
           </el-select>
         </el-form-item>
         <el-form-item :label="$t('目的仓')" prop="destWarehouseIdList">
-            <el-select v-model="queryParams.destWarehouseIdList" multiple :placeholder="queryParams.destCountryId ? $t('请选择') : $t('请先选择目的国')" clearable>
+          <el-select
+            v-model="queryParams.destWarehouseIdList"
+            multiple
+            :placeholder="
+              queryParams.destCountryId ? $t('请选择') : $t('请先选择目的国')
+            "
+            clearable
+          >
             <el-option
               v-for="item in importWarehouseList"
               :key="item.id"
@@ -43,10 +68,17 @@
           </el-select>
         </el-form-item>
         <el-form-item :label="$t('自编号状态')" prop="boxStatus">
-            <dict-selector :type="DICT_TYPE.BOX_ORDER_SHIPMENT_STATE" v-model="queryParams.boxStatus" clearable></dict-selector>
+          <dict-selector
+            :type="DICT_TYPE.BOX_ORDER_SHIPMENT_STATE"
+            v-model="queryParams.boxStatus"
+            clearable
+          ></dict-selector>
         </el-form-item>
         <el-form-item :label="$t('结算时间')" prop="dateFilter">
-            <el-date-picker v-model="dateFilter" type="datetimerange"  range-separator="-"
+          <el-date-picker
+            v-model="dateFilter"
+            type="datetimerange"
+            range-separator="-"
             :start-placeholder="$t('开始日期')"
             :end-placeholder="$t('结束日期')"
             value-format="yyyy-MM-dd HH:mm:ss"
@@ -55,7 +87,11 @@
           </el-date-picker>
         </el-form-item>
         <el-form-item :label="$t('是否结算')" prop="slStatus">
-            <dict-selector :type="DICT_TYPE.SETTLEMENT_STATUS" v-model="queryParams.slStatus" clearable></dict-selector>
+          <dict-selector
+            :type="DICT_TYPE.SETTLEMENT_STATUS"
+            v-model="queryParams.slStatus"
+            clearable
+          ></dict-selector>
         </el-form-item>
         <el-form-item>
           <el-button
@@ -63,8 +99,15 @@
             icon="el-icon-search"
             @click="handleQuery"
             :loading="loading"
-            >{{$t('查询')}}</el-button>
-            <el-button type="primary" :loading="exporting" icon="el-icon-download" @click="handleExport">{{$t('导出搜索')}}</el-button>
+            >{{ $t("查询") }}</el-button
+          >
+          <el-button
+            type="primary"
+            :loading="exporting"
+            icon="el-icon-download"
+            @click="handleExport"
+            >{{ $t("导出搜索") }}</el-button
+          >
         </el-form-item>
       </el-form>
     </el-card>
@@ -79,91 +122,180 @@
     >
       <el-table-column :label="$t('是否结算')" align="center">
         <template slot-scope="scope">
-          <dict-tag :type="DICT_TYPE.SETTLEMENT_STATUS" :value="scope.row.slStatus"></dict-tag>
+          <dict-tag
+            :type="DICT_TYPE.SETTLEMENT_STATUS"
+            :value="scope.row.slStatus"
+          ></dict-tag>
         </template>
       </el-table-column>
       <el-table-column :label="$t('No.柜号')" align="center" prop="selfNo">
         <template slot-scope="scope">
-          <el-button v-if="permissions.indexOf('selfno:report:detail') > -1" type="text" @click="$router.push('./self_no_report_detail?containerNumber=' + scope.row.selfNo)">{{scope.row.selfNo}}</el-button>
-          <span v-else>{{scope.row.selfNo}}</span>
+          <el-button
+            v-if="permissions.indexOf('selfno:report:detail') > -1"
+            type="text"
+            @click="
+              $router.push(
+                './self_no_report_detail?containerNumber=' + scope.row.selfNo
+              )
+            "
+            >{{ scope.row.selfNo }}</el-button
+          >
+          <span v-else>{{ scope.row.selfNo }}</span>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('应收款(Accounts receivable)USD')" prop="summaryInfo.netReceiptsCollectFreightFeeGroup">
-        <template slot-scope="{row}">
-          {{row.summaryInfo.receivableTotalFee}}{{row.summaryInfo.receivableTotalFeeCurrency}}
+      <el-table-column
+        :label="$t('应收款(Accounts receivable)USD')"
+        prop="summaryInfo.netReceiptsCollectFreightFeeGroup"
+      >
+        <template slot-scope="{ row }">
+          {{ row.summaryInfo.receivableTotalFee
+          }}{{ row.summaryInfo.receivableTotalFeeCurrency }}
         </template>
       </el-table-column>
-      <el-table-column :label="$t('应收款 RECEIVABLE')" align="center" prop="summaryInfo.receivableTotalFeeGroup">
-        <el-table-column :label="$t('运费 FREIGHT') + ColumnCurrencyName('Freight')" prop="summaryInfo.netReceiptsCollectFreightFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalReceivableFreightFee}}{{row.summaryInfo.totalFreightFeeCurrency}}
+      <el-table-column
+        :label="$t('应收款 RECEIVABLE')"
+        align="center"
+        prop="summaryInfo.receivableTotalFeeGroup"
+      >
+        <el-table-column
+          :label="$t('运费 FREIGHT') + ColumnCurrencyName('Freight')"
+          prop="summaryInfo.netReceiptsCollectFreightFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalReceivableFreightFee
+            }}{{ row.summaryInfo.totalFreightFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('清关费 CLEARING FEE') + ColumnCurrencyName('Clearance')">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalReceivableClearanceFee}}{{row.summaryInfo.totalClearanceFeeCurrency}}
+        <el-table-column
+          :label="$t('清关费 CLEARING FEE') + ColumnCurrencyName('Clearance')"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalReceivableClearanceFee
+            }}{{ row.summaryInfo.totalClearanceFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('额外费用 EXTRAL FEE') + ColumnCurrencyName('Other')">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalReceivableOtherFee}}{{row.summaryInfo.totalOtherFeeCurrency}}
+        <el-table-column
+          :label="$t('额外费用 EXTRAL FEE') + ColumnCurrencyName('Other')"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalReceivableOtherFee
+            }}{{ row.summaryInfo.totalOtherFeeCurrency }}
           </template>
         </el-table-column>
       </el-table-column>
-      <el-table-column :label="'received in ' + (dstCountryName || $t('目的国')) + `(${$t('目的地实收')})`" align="center" prop="">
-        <el-table-column :label="$t('运费') + ColumnCurrencyName('Freight')" prop="summaryInfo.netReceiptsCollectFreightFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalNetReceiptsCollectFreightFee}}{{row.summaryInfo.totalFreightFeeCurrency}}
+      <el-table-column
+        :label="
+          'received in ' +
+          (dstCountryName || $t('目的国')) +
+          `(${$t('目的地实收')})`
+        "
+        align="center"
+        prop=""
+      >
+        <el-table-column
+          :label="$t('运费') + ColumnCurrencyName('Freight')"
+          prop="summaryInfo.netReceiptsCollectFreightFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalNetReceiptsCollectFreightFee
+            }}{{ row.summaryInfo.totalFreightFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('清关费') + ColumnCurrencyName('Clearance')" prop="summaryInfo.netReceiptsCollectClearanceFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalNetReceiptsCollectClearanceFee}}{{row.summaryInfo.totalClearanceFeeCurrency}}
+        <el-table-column
+          :label="$t('清关费') + ColumnCurrencyName('Clearance')"
+          prop="summaryInfo.netReceiptsCollectClearanceFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalNetReceiptsCollectClearanceFee
+            }}{{ row.summaryInfo.totalClearanceFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('额外费用') + ColumnCurrencyName('Other')" prop="summaryInfo.netReceiptsCollectOtherFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalNetReceiptsCollectOtherFee}}{{row.summaryInfo.totalOtherFeeCurrency}}
+        <el-table-column
+          :label="$t('额外费用') + ColumnCurrencyName('Other')"
+          prop="summaryInfo.netReceiptsCollectOtherFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalNetReceiptsCollectOtherFee
+            }}{{ row.summaryInfo.totalOtherFeeCurrency }}
           </template>
         </el-table-column>
       </el-table-column>
-      <el-table-column :label="$t('received in China(中国实收)')" align="center" prop="" >
-        <el-table-column :label="$t('运费') + ColumnCurrencyName('Freight')" prop="summaryInfo.netReceiptsAdvanceFreightFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.netReceiptsAdvanceFreightFee}}{{row.summaryInfo.totalFreightFeeCurrency}}
+      <el-table-column
+        :label="$t('received in China(中国实收)')"
+        align="center"
+        prop=""
+      >
+        <el-table-column
+          :label="$t('运费') + ColumnCurrencyName('Freight')"
+          prop="summaryInfo.netReceiptsAdvanceFreightFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.netReceiptsAdvanceFreightFee
+            }}{{ row.summaryInfo.totalFreightFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('清关费') + ColumnCurrencyName('Clearance')" prop="summaryInfo.netReceiptsAdvanceClearanceFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalNetReceiptsAdvanceClearanceFee}}{{row.summaryInfo.totalClearanceFeeCurrency}}
+        <el-table-column
+          :label="$t('清关费') + ColumnCurrencyName('Clearance')"
+          prop="summaryInfo.netReceiptsAdvanceClearanceFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalNetReceiptsAdvanceClearanceFee
+            }}{{ row.summaryInfo.totalClearanceFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('额外费用') + ColumnCurrencyName('Other')" prop="summaryInfo.netReceiptsAdvanceOtherFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.totalNetReceiptsAdvanceOtherFee}}{{row.summaryInfo.totalOtherFeeCurrency}}
+        <el-table-column
+          :label="$t('额外费用') + ColumnCurrencyName('Other')"
+          prop="summaryInfo.netReceiptsAdvanceOtherFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.totalNetReceiptsAdvanceOtherFee
+            }}{{ row.summaryInfo.totalOtherFeeCurrency }}
           </template>
         </el-table-column>
       </el-table-column>
       <el-table-column :label="$t('Discounts 折扣')" align="center" prop="">
-        <el-table-column :label="$t('运费') + ColumnCurrencyName('Freight')" prop="summaryInfo.discountFreightFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.discountFreightFee}}{{row.summaryInfo.totalFreightFeeCurrency}}
+        <el-table-column
+          :label="$t('运费') + ColumnCurrencyName('Freight')"
+          prop="summaryInfo.discountFreightFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.discountFreightFee
+            }}{{ row.summaryInfo.totalFreightFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('清关费') + ColumnCurrencyName('Clearance')" prop="summaryInfo.discountClearanceFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.discountClearanceFee}}{{row.summaryInfo.totalClearanceFeeCurrency}}
+        <el-table-column
+          :label="$t('清关费') + ColumnCurrencyName('Clearance')"
+          prop="summaryInfo.discountClearanceFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.discountClearanceFee
+            }}{{ row.summaryInfo.totalClearanceFeeCurrency }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('额外费用') + ColumnCurrencyName('Other')" prop="summaryInfo.discountOtherFeeGroup">
-          <template slot-scope="{row}">
-            {{row.summaryInfo.discountOtherFee}}{{row.summaryInfo.totalOtherFeeCurrency}}
+        <el-table-column
+          :label="$t('额外费用') + ColumnCurrencyName('Other')"
+          prop="summaryInfo.discountOtherFeeGroup"
+        >
+          <template slot-scope="{ row }">
+            {{ row.summaryInfo.discountOtherFee
+            }}{{ row.summaryInfo.totalOtherFeeCurrency }}
           </template>
         </el-table-column>
       </el-table-column>
-      <el-table-column :label="$t('操作')" v-if="permissions.indexOf('selfno:report:detail') > -1">
+      <el-table-column
+        :label="$t('操作')"
+        v-if="permissions.indexOf('selfno:report:detail') > -1"
+      >
         <template slot-scope="scope">
-          <el-button type="text" @click="$router.push('./self_no_report_detail?containerNumber=' + scope.row.selfNo)">{{$t('查看')}}</el-button>
+          <el-button
+            type="text"
+            @click="
+              $router.push(
+                './self_no_report_detail?containerNumber=' + scope.row.selfNo
+              )
+            "
+            >{{ $t("查看") }}</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -179,57 +311,62 @@
 
 <script>
 import { getCurrencyPage } from "@/api/ecw/currency";
-import {getWarehouseList} from '@/api/ecw/warehouse'
+import { getWarehouseList } from "@/api/ecw/warehouse";
 import store from "@/store";
-import {boxSettlementPage, exportSettlementExcel} from "@/api/ecw/box";
-import {getListTree} from "@/api/ecw/region";
-import Decimal from 'decimal.js'
+import { boxSettlementPage, exportSettlementExcel } from "@/api/ecw/box";
+import { getListTree } from "@/api/ecw/region";
+import Decimal from "decimal.js";
 export default {
-  name: 'EcwFinancialSelfnoreport',
+  name: "EcwFinancialSelfnoreport",
   data() {
     return {
       loading: false, // 是否加载中
-      dateFilter:[], // 筛选时间
+      dateFilter: [], // 筛选时间
       list: [],
       total: 0,
       queryParams: {
         page: 1,
         rows: 10,
-        startWarehouseIdList:[],
-        destWarehouseIdList: []
+        startWarehouseIdList: [],
+        destWarehouseIdList: [],
       },
       // tradeCityList: [],
-      currencyList:[],
-      warehouseList:[],
+      currencyList: [],
+      warehouseList: [],
       countryList: [],
       // 导出中状态
-      exporting: false
+      exporting: false,
     };
   },
-  activated(){
+  activated() {
     // 如果有必须的条件则查询
-    if(this.queryParams.startWarehouseIdList.length && this.queryParams.dstCountryId){
+    if (
+      this.queryParams.startWarehouseIdList.length &&
+      this.queryParams.dstCountryId
+    ) {
       this.getList();
     }
   },
   created() {
-    getCurrencyPage(this.params).then(res => this.currencyList = res.data.list)
+    getCurrencyPage(this.params).then(
+      (res) => (this.currencyList = res.data.list)
+    );
     // getTradeCityList().then((res) => (this.tradeCityList = res.data));
     // 默认不查询，必须选择目的国以后才可以查询 this.getList();
-    getWarehouseList().then(res => this.warehouseList = res.data)
-    getListTree({treeType: 1}).then(r => {
-      this.countryList = r.data
-    })
+    getWarehouseList().then((res) => (this.warehouseList = res.data));
+    getListTree({ treeType: 1 }).then((r) => {
+      this.countryList = r.data;
+    });
   },
-  watch:{
+  watch: {
     // 目的国变更后要重置目的仓
-    'queryParams.destCountryId': function(){
-      this.$set(this.queryParams, 'destWarehouseId', '')
-    }
+    "queryParams.destCountryId": function () {
+      this.$set(this.queryParams, "destWarehouseId", "");
+    },
   },
   computed: {
-    permissions(){
-      return store.getters.permissions
+    permissions() {
+      return store.getters.permissions;
     },
     /*exportCityList() {
       return this.tradeCityList.filter((item) => item.type === 2);
@@ -237,128 +374,144 @@ export default {
     importCityList() {
       return this.tradeCityList.filter((item) => item.type === 1);
     },*/
-    exportWarehouseList(){
+    exportWarehouseList() {
       /* tradeType 1 进口，2出口，3进出口 */
-      return this.warehouseList.filter(item => +item.tradeType === 2 || +item.tradeType === 3)
+      return this.warehouseList.filter(
+        (item) => +item.tradeType === 2 || +item.tradeType === 3
+      );
     },
-    importWarehouseList(){
+    importWarehouseList() {
       // 目的仓根据选择的目的国过滤
-      if(!this.queryParams.destCountryId) return []
-      return this.warehouseList.filter(item => {
-        return this.queryParams.destCountryId === item.guojia && ( +item.tradeType === 1 || +item.tradeType === 3)
-      })
+      if (!this.queryParams.destCountryId) return [];
+      return this.warehouseList.filter((item) => {
+        return (
+          this.queryParams.destCountryId === item.guojia &&
+          (+item.tradeType === 1 || +item.tradeType === 3)
+        );
+      });
     },
     // 目的国名称
-    dstCountryName(){
-      if(!this.queryParams.destCountryId) return null
-      const country = this.countryList.find(item => item.id == this.queryParams.destCountryId)
-      if(!country) return null
-      return this.$l(country, 'title')
+    dstCountryName() {
+      if (!this.queryParams.destCountryId) return null;
+      const country = this.countryList.find(
+        (item) => item.id == this.queryParams.destCountryId
+      );
+      if (!country) return null;
+      return this.$l(country, "title");
     },
     // 获取列的货币名称 columnName 取值为Other, Freight, Clearance
-    ColumnCurrencyName(){
+    ColumnCurrencyName() {
       return (columnName, wrapper = true) => {
-        if(!this.list.length) return ''
-        let field = `total${columnName}FeeCurrency`
-        return wrapper ? `(${this.list[0]['summaryInfo'][field]})` : this.list[0]['summaryInfo'][field]
-      }
-    }
+        if (!this.list.length) return "";
+        let field = `total${columnName}FeeCurrency`;
+        return wrapper
+          ? `(${this.list[0]["summaryInfo"][field]})`
+          : this.list[0]["summaryInfo"][field];
+      };
+    },
   },
   methods: {
-    getCurrencyLabel(id){
-      const item = this.currencyList.find(item => item.id === id);
-      if(!item)return ''
-      return this.$l(item, 'title')
+    getCurrencyLabel(id) {
+      const item = this.currencyList.find((item) => item.id === id);
+      if (!item) return "";
+      return this.$l(item, "title");
     },
     /** 查询列表 */
     getList() {
       this.loading = true;
       let params = {
         ...this.queryParams,
-        startWarehouseIdList: this.queryParams.startWarehouseIdList.join(','),
-        destWarehouseIdList: this.queryParams.destWarehouseIdList.join(',')
-      }
+        startWarehouseIdList: this.queryParams.startWarehouseIdList.join(","),
+        destWarehouseIdList: this.queryParams.destWarehouseIdList.join(","),
+      };
       this.addBeginAndEndTime(params, this.dateFilter, "JsDate", false);
       // 执行查询
-      boxSettlementPage(params).then((response) => {
+      boxSettlementPage(params)
+        .then((response) => {
           this.list = response.data.list;
           this.total = response.data.total;
-      }).finally(() => {
-        this.loading = false;
         })
+        .finally(() => {
+          this.loading = false;
+        });
     },
-    getTotal(field){
-      let total = new Decimal(0)
-      this.list.forEach(item => {
-        total = total.plus(item.summaryInfo[field] || 0)
-      })
-      return total.toNumber()
+    getTotal(field) {
+      let total = new Decimal(0);
+      this.list.forEach((item) => {
+        total = total.plus(item.summaryInfo[field] || 0);
+      });
+      return total.toNumber();
     },
     // 返回汇总行数据
-    getSummary(){
-      const FreightCurrencyName = this.ColumnCurrencyName('Freight', false)
-      const ClearanceCurrencyName = this.ColumnCurrencyName('Clearance', false)
-      const OtherCurrencyName = this.ColumnCurrencyName('Other', false)
+    getSummary() {
+      const FreightCurrencyName = this.ColumnCurrencyName("Freight", false);
+      const ClearanceCurrencyName = this.ColumnCurrencyName("Clearance", false);
+      const OtherCurrencyName = this.ColumnCurrencyName("Other", false);
       const data = [
-        this.$t('合计'),
-        '',
+        this.$t("合计"),
+        "",
         // 应收款
-        this.getTotal('receivableTotalFee') + 'USD',
+        this.getTotal("receivableTotalFee") + "USD",
         // 应收运费
-        this.getTotal('totalReceivableFreightFee') + FreightCurrencyName,
+        this.getTotal("totalReceivableFreightFee") + FreightCurrencyName,
         // 应收清关费
-        this.getTotal('totalReceivableClearanceFee') + ClearanceCurrencyName,
+        this.getTotal("totalReceivableClearanceFee") + ClearanceCurrencyName,
         // 应收其他费用
-        this.getTotal('totalReceivableOtherFee') + OtherCurrencyName,
+        this.getTotal("totalReceivableOtherFee") + OtherCurrencyName,
         // 目的地实收运费
-        this.getTotal('totalNetReceiptsCollectFreightFee') + FreightCurrencyName,
+        this.getTotal("totalNetReceiptsCollectFreightFee") +
+          FreightCurrencyName,
         // 目的地实收清关费
-        this.getTotal('totalNetReceiptsCollectClearanceFee') + ClearanceCurrencyName,
+        this.getTotal("totalNetReceiptsCollectClearanceFee") +
+          ClearanceCurrencyName,
         // 目的地实收其他费用
-        this.getTotal('totalNetReceiptsCollectOtherFee') + OtherCurrencyName,
+        this.getTotal("totalNetReceiptsCollectOtherFee") + OtherCurrencyName,
         // 中国实收运费
-        this.getTotal('netReceiptsAdvanceFreightFee') + FreightCurrencyName,
+        this.getTotal("netReceiptsAdvanceFreightFee") + FreightCurrencyName,
         // 中国实收清关费
-        this.getTotal('netReceiptsAdvanceClearanceFee') + ClearanceCurrencyName,
+        this.getTotal("netReceiptsAdvanceClearanceFee") + ClearanceCurrencyName,
         // 中国实收其他费用
-        this.getTotal('netReceiptsAdvanceOtherFee') + OtherCurrencyName,
+        this.getTotal("netReceiptsAdvanceOtherFee") + OtherCurrencyName,
         // 运费折扣
-        this.getTotal('discountFreightFee') + FreightCurrencyName,
+        this.getTotal("discountFreightFee") + FreightCurrencyName,
         // 清关费折扣
-        this.getTotal('discountClearanceFee') + ClearanceCurrencyName,
+        this.getTotal("discountClearanceFee") + ClearanceCurrencyName,
         // 其他费用折扣
-        this.getTotal('discountOtherFee') + OtherCurrencyName,
-      ]
-      console.log('sum', {data})
-      return data
+        this.getTotal("discountOtherFee") + OtherCurrencyName,
+      ];
+      console.log("sum", { data });
+      return data;
     },
     /** 搜索按钮操作 */
     handleQuery() {
       this.$refs.queryForm.validate().then(() => {
         this.queryParams.page = 1;
         this.getList();
-      })
-
+      });
     },
-    handleReset(){
-      this.$refs['queryForm'].resetFields()
-      this.dateFilter = []
-      this.handleQuery()
+    handleReset() {
+      this.$refs["queryForm"].resetFields();
+      this.dateFilter = [];
+      this.handleQuery();
     },
     // 导出搜索
-    handleExport(){
+    handleExport() {
       this.$refs.queryForm.validate().then(() => {
-        this.exporting = true
-        let params = {...this.queryParams}
+        this.exporting = true;
+        let params = { ...this.queryParams };
         this.addBeginAndEndTime(params, this.dateFilter, "JsDate", false);
-        exportSettlementExcel(params).then(res => {
+        exportSettlementExcel(params)
+          .then((res) => {
             //this.$download.excel(res, 'shipment-summary.xls');
-          this.$message.success(this.$t('已加入导出队列，请稍后在下载日志中下载'))
-        }).finally(() => {
-          this.exporting = false
+            this.$message.success(
+              this.$t("已加入导出队列，请稍后在下载日志中下载")
+            );
           })
-      })
-    }
+          .finally(() => {
+            this.exporting = false;
+          });
+      });
+    },
   },
 };
 </script>

src/views/report/EcwReportPermission/index.vue

+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="用户姓名" prop="userId">
+        <user-selector
+          manage
+          v-model="queryParams.userId"
+          clearable
+          @change="handleQuery"
+          :prepend="{ id: 0, nickname: $t('未选择用户') }"
+        />
+      </el-form-item>
+      <el-form-item label="权限范围" prop="titleZh">
+        <el-select
+          v-model="queryParams.permissionFw"
+          clearable
+          style="width: 200px"
+        >
+          <el-option label="本人" value="1"></el-option>
+          <el-option label="部门" value="2"></el-option>
+          <el-option label="全公司" value="3"></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['my:test:create']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          v-show="false"
+          @click="handleExport"
+          :loading="exportLoading"
+          v-hasPermi="['my:test:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        :showSearch.sync="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="编号" align="center" prop="id" />
+      <el-table-column label="用户ID" align="center" prop="userId" />
+      <el-table-column label="用户姓名" align="center" prop="userName" />
+      <el-table-column label="权限类型" align="center" prop="permissionFw">
+        <template slot-scope="scope">
+          <span v-if="scope.row.permissionFw == 1">本人</span>
+          <span v-else-if="scope.row.permissionFw == 2">部门</span>
+          <span v-else-if="scope.row.permissionFw == 3">全公司</span>
+          <span v-else>权限定义异常</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="部门信息"
+        align="center"
+        prop="deptName"
+        width="100"
+      >
+      </el-table-column>
+      <el-table-column label="修改日期" align="center" prop="updateTime">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.updateTime) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['my:test:update']"
+            >修改</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['my:test:delete']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="用户姓名" prop="userId">
+          <user-selector
+            manage
+            v-model="form.userId"
+            clearable
+            @change="handleQuery"
+            :prepend="{ id: 0, nickname: $t('未选择用户') }"
+          />
+        </el-form-item>
+        <el-form-item label="权限范围" prop="permissionFw">
+          <el-select v-model="form.permissionFw" clearable style="width: 200px">
+            <el-option label="本人" value="1"></el-option>
+            <el-option label="部门" value="2"></el-option>
+            <el-option label="全公司" value="3"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="部门信息" prop="deptId">
+          <treeselect
+            v-model="form.deptId"
+            :options="deptOptions"
+            :show-count="true"
+            :placeholder="$t('请选择部门')"
+            :normalizer="normalizer"
+          />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import UserSelector from "@/components/UserSelector";
+import Treeselect from "@riophae/vue-treeselect";
+//自定义目录数样式
+import "@/assets/styles/vue-treeselect.css";
+//部门树需要的函数
+import { listSimpleDepts } from "@/api/system/dept";
+import {
+  create,
+  update,
+  del,
+  getModel,
+  getPageList,
+  exportExcel,
+} from "@/api/report/EcwReportPermission";
+
+export default {
+  name: "EcwReportPermission",
+  components: {
+    UserSelector,
+    Treeselect,
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 测试列表
+      list: [],
+      // 弹出层标题
+      title: "",
+      //是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        userId: null, //用户ID
+        userName: null, //用户姓名
+        permissionFw: null, //权限范围
+        deptId: null, //部门信息
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      deptOptions: undefined,
+    };
+  },
+  created() {
+    this.getTreeselect();
+    this.getList();
+  },
+
+  methods: {
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      // 执行查询
+      getPageList(params).then((response) => {
+        this.list = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    /** 取消按钮 */
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 表单重置 */
+    reset() {
+      this.form = {
+        id: undefined,
+        userId: undefined, //用户ID
+        userName: undefined, //用户姓名
+        permissionFw: undefined, //权限范围
+        deptId: null, //部门
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加测试";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id;
+      getModel(id).then((response) => {
+        this.form = response.data;
+        //要把数据类型做一下转换，不让是在页面上显示不了lable信息
+        this.form.permissionFw = response.data.permissionFw.toString();
+
+        //vue 控件对类型很敏感，类型不对很容易出问题
+        this.form.userId = parseInt(response.data.userId);
+        if (response.data.deptId == null ||
+         response.data.deptId == undefined||
+         response.data.deptId=="") {
+          //treeselect 若是空值,必须是null，不能赋值""，0，等。
+          this.form.deptId = null;
+        }
+        this.open = true;
+        this.title = "修改测试";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        if (!valid) {
+          return;
+        }
+        if (
+          this.form.userId == null ||
+          this.form.userId == undefined ||
+          this.form.userId == ""
+        ) {
+          this.$message.error("请选择用户");
+          return;
+        }
+
+        if (
+          this.form.permissionFw == null ||
+          this.form.permissionFw == undefined ||
+          this.form.permissionFw == ""
+        ) {
+          this.$message.error("请选择权限范围");
+          return;
+        } else {
+          if (this.form.permissionFw == 1 || this.form.permissionFw == 3) {
+            //本人和全公司权限，不用选择部门
+            this.form.deptId = "";
+          } else if (this.form.permissionFw == 2) {
+            //部门权限，需要选中部门信息
+            if (
+              this.form.deptId == null ||
+              this.form.deptId == undefined ||
+              this.form.deptId == ""
+            ) {
+              this.$message.error("请选择部门");
+              return;
+            }
+          }
+        }
+
+        // 修改的提交
+        if (this.form.id != null) {
+          update(this.form).then((response) => {
+            this.$modal.msgSuccess("修改成功");
+            this.open = false;
+            this.getList();
+          });
+          return;
+        }
+        // 添加的提交
+        create(this.form).then((response) => {
+          this.$modal.msgSuccess("新增成功");
+          this.open = false;
+          this.getList();
+        });
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const id = row.id;
+      this.$modal
+        .confirm('是否确认删除测试编号为"' + id + '"的数据项?')
+        .then(function () {
+          return del(id);
+        })
+        .then(() => {
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      params.pageNo = undefined;
+      params.pageSize = undefined;
+      // 执行导出
+      this.$modal
+        .confirm("是否确认导出所有测试数据项?")
+        .then(() => {
+          this.exportLoading = true;
+          return exportExcel(params);
+        })
+        .then((response) => {
+          this.$download.excel(response, "${table.classComment}.xls");
+          this.exportLoading = false;
+        })
+        .catch(() => {});
+    },
+    Test() {
+      this.form.userId = 31;
+    },
+    /** 查询部门下拉树结构 + 岗位下拉 */
+    getTreeselect() {
+      listSimpleDepts().then((response) => {
+        // 处理deptOptions 参数
+        this.deptOptions = [];
+        this.deptOptions.push(...this.handleTree(response.data, "id"));
+      });
+    },
+    //格式化部门的下拉框
+    normalizer(node) {
+      return {
+        id: node.id,
+        label: node.name,
+        children: node.children,
+      };
+    },
+  },
+};
+</script>
+  
\ No newline at end of file

src/views/report/customer_analysis/index.vue

+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="100px"
+    >
+      <el-form-item label="客户" prop="name">
+        <el-select
+          v-model="queryParams.searchtype"
+          clearable
+          style="width: 100px"
+        >
+          <el-option
+            v-for="dict in SearchTypeList"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-input
+          style="width: 200px"
+          v-model="queryParams.name"
+          placeholder="请输入客户姓名/编号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="部门" v-show="showDept">
+        <treeselect
+          v-model="queryParams.deptid"
+          :options="deptOptions"
+          :show-count="true"
+          :placeholder="$t('请选择部门')"
+          :normalizer="normalizer"
+        />
+      </el-form-item>
+      <el-form-item
+        label="客户经理"
+        prop="salesmanid"
+        v-show="showCustomsManage"
+      >
+        <user-selector
+          manage
+          v-model="queryParams.salesmanid"
+          clearable
+          @change="handleQuery"
+          :prepend="{ id: 0, nickname: $t('未分配客户经理') }"
+        />
+      </el-form-item>
+
+      <el-form-item label="首次成交" prop="delFlag">
+        <el-select v-model="queryParams.first" clearable style="width: 200px">
+          <el-option label="是" value="1"></el-option>
+          <el-option label="否" value="0"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="客户业绩类型" prop="remark">
+        <el-select
+          v-model="queryParams.cusYjType"
+          clearable
+          style="width: 200px"
+        >
+          <el-option label="新客户" value="1"></el-option>
+          <el-option label="老客户" value="0"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="客户来源" prop="remark">
+        <el-select
+          v-model="queryParams.source"
+          :placeholder="$t('请选择客户来源')"
+        >
+          <el-option
+            v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_SOURCE)"
+            :key="dict.value"
+            :label="isChinese ? dict.label : dict.labelEn"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="客户角色" prop="customerrole">
+        <el-select
+          v-model="queryParams.customerrole"
+          clearable
+          style="width: 200px"
+        >
+          <el-option
+            v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_TYPE)"
+            :key="dict.value"
+            :label="isChinese ? dict.label : dict.labelEn"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="客户国家" prop="country">
+        <el-select
+          clearable
+          v-model="queryParams.country"
+          :placeholder="$t('请选择国家')"
+        >
+          <el-option
+            v-for="dict in countryList"
+            :key="dict.id"
+            :label="isChinese ? dict.nameZh : dict.nameEn"
+            :value="parseInt(dict.id)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="数据筛选" prop="searchDataType">
+        <el-select
+          v-model="queryParams.searchDataType1"
+          clearable
+          style="width: 200px"
+        >
+          <el-option
+            v-for="dict in SearchDataTypeList1"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-select
+          v-model="queryParams.searchDataType2"
+          clearable
+          style="width: 200px"
+        >
+          <el-option
+            v-for="dict in SearchDataTypeList"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-input
+          v-model="queryParams.searchDataType3"
+          style="width: 200px"
+          placeholder="请输入数值"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="订单业绩产生时间" prop="searchDateType">
+        <!--
+        <el-select
+          v-model="queryParams.searchDateType"
+          clearable
+          style="width: 150px"
+        >
+          <el-option
+            v-for="dict in SearchDateTypeList"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>-->
+        <el-date-picker
+          v-model="queryParams.sdate"
+          type="date"
+          value-format="yyyy-MM-dd"
+          clearable
+          placeholder="请输入起始日期"
+        />
+        <el-date-picker
+          v-model="queryParams.edate"
+          type="date"
+          value-format="yyyy-MM-dd"
+          clearable
+          placeholder="请输截止日期"
+        />
+      </el-form-item>
+      <el-form-item label="同比年份" prop="duibiYear">
+        <el-date-picker
+          v-model="queryParams.duibiYear"
+          type="year"
+          value-format="yyyy"
+          placeholder="请选择同比年份"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery"
+          >查询</el-button
+        >
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          :loading="exportLoading"
+          >导出</el-button
+        >
+        <el-button type="primary" size="mini" @click="test" v-show="false">
+          测试
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="排名" align="center" prop="px" />
+      <el-table-column label="客户编号" align="center" prop="number">
+        <template slot-scope="{ row }">
+          <el-link
+            type="primary"
+            @click.native="$router.push('/customer/query/' + row.id)"
+            >{{ row.number }}</el-link
+          >
+        </template>
+      </el-table-column>
+      <el-table-column label="客户姓名" align="center" prop="name" />
+      <el-table-column label="客户经理" align="center" prop="salesman" />
+      <el-table-column label="部门" align="center" prop="deptname" />
+      <el-table-column label="总V值" align="center" prop="allsumvolume" />
+      <el-table-column
+        label="总V值同比"
+        align="center"
+        prop="allsumvolumeTbShow"
+      />
+
+      <el-table-column label="海运拼柜" align="center" prop="sumvolume1" />
+      <el-table-column label="海运占比" align="center" prop="seaZb" />
+      <el-table-column
+        label="海运拼柜同比"
+        align="center"
+        prop="sumvolumeTbShow1"
+      />
+
+      <el-table-column label="专线空运" align="center" prop="sumweight3" />
+      <el-table-column label="空运占比" align="center" prop="airZb" />
+      <el-table-column
+        label="专线空运同比"
+        align="center"
+        prop="sumweightTbShow3"
+      />
+
+      <el-table-column label="月均" align="center" prop="monthAvg" />
+      <el-table-column label="月均同比" align="center" prop="monthAvgTbShow" />
+      <el-table-column label="海运月均方数" align="center" prop="seaMonthAvg" />
+      <el-table-column
+        label="海运月均同比"
+        align="center"
+        prop="sumvolumeTbShow1"
+      />
+      <el-table-column label="空运月均重量" align="center" prop="airMothAvg" />
+      <el-table-column
+        label="空运月均同比"
+        align="center"
+        prop="sumweightTbShow3"
+      />
+      <el-table-column label="重货总V值" align="center" prop="weightSumV" />
+      <el-table-column label="重货占比" align="center" prop="weithtSumZb" />
+      <el-table-column label="泡货总V值" align="center" prop="phSumV" />
+      <el-table-column label="泡货占比" align="center" prop="phSumZb" />
+      <el-table-column label="控货总V值" align="center" prop="khSumV" />
+      <el-table-column label="控货占比" align="center" prop="khSumZb" />
+      <el-table-column label="是否首次成交" align="center" prop="isFirst" />
+      <el-table-column label="首次成交时间" align="center" prop="firstDate">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.firstDate) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="提货率" align="center" prop="thL" />
+      <el-table-column label="客户业绩类型" align="center" prop="cusYjType" />
+      <el-table-column label="客户来源" align="center" prop="sourcename" />
+      <el-table-column label="客户角色" align="center" prop="customerrole" />
+      <el-table-column label="客户国家" align="center" prop="country" />
+      <el-table-column label="客户户创建时间" align="center" prop="createtime">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.createtime) }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+  
+  <script>
+//国家列表接口
+import { getCountryListAll } from "@/api/ecw/country";
+import UserSelector from "@/components/UserSelector";
+import Treeselect from "@riophae/vue-treeselect";
+//自定义目录数样式
+import "@/assets/styles/vue-treeselect.css";
+import { listSimpleDepts } from "@/api/system/dept";
+import { getListPage, exportExcel } from "@/api/report/customeranalysis";
+import { getCurUserPermission } from "@/api/report/EcwReportPermission";
+import { MessageBox } from "element-ui";
+
+function currentTime2() {
+  var date = new Date();
+  var year = date.getFullYear();
+  //月份从0~11，所以加一
+  let month = date.getMonth() + 1;
+  //如果格式是MM则需要此步骤，如果是M格式则此处注释掉
+  if (month >= 1 && month <= 9) {
+    month = "0" + month;
+  }
+  let day = date.getDay();
+  let strDate = year + "-" + month + "-" + day;
+  return strDate;
+}
+
+function formatDate2() {
+  var date = new Date();
+  const day = date.getDate().toString().padStart(2, "0");
+  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  // 月份是从0开始的
+  const year = date.getFullYear();
+  const hours = date.getHours().toString().padStart(2, "0");
+  const minutes = date.getMinutes().toString().padStart(2, "0");
+  const seconds = date.getSeconds().toString().padStart(2, "0");
+  //`${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+  return `${year}-${month}-${day}`;
+}
+
+function formatDate3() {
+  var date = new Date();
+  // 月份是从0开始的
+  const year = date.getFullYear();
+  return `${year}-01-01`;
+}
+
+function getLastYear() {
+  //获取上一年份
+  var date = new Date();
+  date.setFullYear(date.getFullYear() - 1);
+  let year = date.getFullYear();
+  return year.toString();
+}
+
+export default {
+  name: "customer_analysis",
+  components: {
+    UserSelector,
+    Treeselect,
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      showDept: true, //是否显示部门选择过滤条件
+      showCustomsManage: true, //是否显示客户经理过滤条件
+      deptOptions: undefined,
+      // 总条数
+      total: 0,
+      // 测试列表
+      list: [],
+      countryList: [], //国家列表
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      dateRangeCreateTime: [],
+      SearchTypeList: [
+        { value: "in", label: "包含" },
+        { value: "notin", label: "不包含" },
+        { value: "eq", label: "等于" },
+        { value: "noeq", label: "不等于" },
+      ],
+      // 禁止选择超出当前日期
+      pickerOptions: {
+        disabledDate(time) {
+          const _now = Date.now();
+          return time.getTime() <= _now;
+        },
+      },
+      SearchDataTypeList1: [
+        { value: "allsumvolume", label: "总值" },
+        { value: "2", label: "总值同比" },
+        { value: "3", label: "海运拼柜" },
+        { value: "4", label: "海运占比" },
+        { value: "5", label: "海运同比" },
+        { value: "6", label: "海运占比" },
+        { value: "7", label: "专线空运" },
+        { value: "8", label: "空运占比" },
+        { value: "9", label: "空运同比" },
+        { value: "10", label: "月均" },
+        { value: "11", label: "月均同比" },
+        { value: "12", label: "海运月均方数" },
+        { value: "13", label: "空运月均重量" },
+        { value: "14", label: "重货总V值" },
+        { value: "15", label: "重货占比" },
+        { value: "16", label: "泡货总V值" },
+        { value: "17", label: "泡货总V值" },
+        { value: "18", label: "泡货占比" },
+        { value: "19", label: "控货总V值" },
+        { value: "20", label: "控货占比" },
+        { value: "21", label: "提货率" },
+      ],
+      SearchDataTypeList: [
+        { value: "1", label: "大于等于" },
+        { value: "2", label: "等于" },
+        { value: "3", label: "小于等于" },
+      ],
+      SearchDateTypeList: [
+        { value: "firstdate", label: "首次成交时间" },
+        { value: "createdate", label: "客户创建时间" },
+      ],
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        searchtype: undefined,
+        name: undefined, //客户姓名
+        number: undefined, //客户编号
+        salesmanid: undefined, //客户经理
+        deptid: undefined, //部门
+        country: undefined, //客户国家
+        source: undefined, //客户来源
+        customerrole: undefined, //客户角色
+        first: undefined, //是否首次成交
+        cusYjType: undefined, //客户业绩类型，新客户还是老客户
+        searchDataType1: undefined, //查询数据类型
+        searchDataType2:undefined,
+        searchDataType3:undefined,
+        searchDateType: "createdate", //日期查询类型
+        sdate: formatDate3(),
+        edate: formatDate2(), //结束日期
+        duibiYear: getLastYear(), //对比年份
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      //报表权限信息
+      objEcwReportPermission: {},
+    };
+  },
+  created() {
+    this.getTreeselect();
+    getCountryListAll().then((r) => {
+      this.countryList = r.data;
+    });
+    //获取当前用户报表权限
+    getCurUserPermission().then((response) => {
+      //复制对象
+      Object.assign(this.objEcwReportPermission, response.data);
+      //this.objEcwReportPermission = response.data;
+      if (this.objEcwReportPermission.permissionFw == 1) {
+        //只能看自己的，不能选择部门和客户经理
+        this.showCustomsManage = false;
+        this.showDept = false;
+      }
+      this.getList();
+    });
+  },
+  computed: {},
+  methods: {
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      // 处理查询参数
+      // 执行查询
+      if (this.objEcwReportPermission.permissionFw == 1) {
+        //只能看自己的，不能选择部门和客户经理
+        this.queryParams.salesmanid = this.objEcwReportPermission.userId;
+      } else if (
+        this.objEcwReportPermission.permissionFw == 2 ||
+        this.objEcwReportPermission.permissionFw == 3
+      ) {
+        //
+      }
+      getListPage(this.queryParams).then((response) => {
+        this.list = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    isChinese() {
+      //基础函数，判断系统显示语言是中文还是英文
+      return this.$i18n.locale === "zh_CN";
+    },
+    handleView(row) {
+      //查看客户详情
+      this.$router.push("/customer/query/" + row.id);
+    },
+    /** 取消按钮 */
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 表单重置 */
+    resetQuery() {
+      this.queryParams = {
+        pageNo: 1,
+        pageSize: 10,
+        searchtype: undefined,
+        name: undefined, //客户姓名
+        number: undefined, //客户编号
+        salesmanid: undefined, //客户经理
+        deptid: undefined, //部门
+        country: undefined, //客户国家
+        source: undefined, //客户来源
+        customerrole: undefined, //客户角色
+        first: undefined, //是否首次成交
+        cusYjType: undefined, //客户业绩类型，新客户还是老客户
+        searchDataType: undefined, //查询数据类型
+        searchDateType: undefined, //日期查询类型
+        sdate: undefined,
+        edate: undefined, //结束日期
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      if (
+        this.queryParams.sdate == undefined ||
+        this.queryParams.sdate == null ||
+        this.queryParams.sdate == ""
+      ) {
+        MessageBox("请输入开始日期。");
+        return;
+      }
+      if (
+        this.queryParams.edate == undefined ||
+        this.queryParams.edate == null ||
+        this.queryParams.edate == ""
+      ) {
+        MessageBox("请输入结束日期。");
+        return;
+      }
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      params.pageNo = undefined;
+      params.pageSize = undefined;
+      // 执行导出
+      this.$modal
+        .confirm("是否确认导出所有测试数据项?")
+        .then(() => {
+          this.exportLoading = true;
+          return exportExcel(params);
+        })
+        .then((response) => {
+          this.$download.excel(response, "${table.classComment}.xls");
+          this.exportLoading = false;
+        })
+        .catch(() => {});
+    },
+
+    /** 查询部门下拉树结构 + 岗位下拉 */
+    getTreeselect() {
+      listSimpleDepts().then((response) => {
+        // 处理 deptOptions 参数
+        this.deptOptions = [];
+        this.deptOptions.push(...this.handleTree(response.data, "id"));
+      });
+    },
+    //格式化部门的下拉框
+    normalizer(node) {
+      return {
+        id: node.id,
+        label: node.name,
+        children: node.children,
+      };
+    },
+    getNowDate() {
+      let now = new Date();
+      year = now.getFullYear();
+      month = (now.getMonth() + 1).toString().padStart(2, "0"); //得到月份
+      day = now.getDate().toString().padStart(2, "0"); //得到日期
+      let strDate = year + "-" + month + "-" + day;
+      return strDate;
+    },
+    test() {
+      //对象的拷贝
+      let target = {};
+      let source = { c: 3 };
+      Object.assign(target, source);
+
+      let json = JSON.stringify(this.objEcwReportPermission);
+      alert(json);
+    },
+  },
+};
+</script>
+  
\ No newline at end of file

src/views/report/customerreport/index.vue

+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="100px"
+    >
+      <el-form-item label="选择日期" prop="selDate">
+        <el-date-picker
+          v-model="queryParams.sDate"
+          type="month"
+          value-format="yyyy-MM"
+          clearable
+          placeholder="请输起始月"
+        />
+        <el-date-picker
+          v-model="queryParams.eDate"
+          type="month"
+          value-format="yyyy-MM"
+          clearable
+          placeholder="请输截止月"
+        />
+      </el-form-item>
+      <el-form-item label="同比年份" prop="duibiYear">
+        <el-date-picker
+          v-model="queryParams.duibiYear"
+          type="year"
+          value-format="yyyy"
+          placeholder="请选择同比年份"
+        />
+      </el-form-item>
+      <el-form-item label="部门" prop="deptid" v-show="showDept">
+        <treeselect
+          v-model="queryParams.deptid"
+          :options="deptOptions"
+          :show-count="true"
+          :placeholder="$t('请选择部门')"
+          :normalizer="normalizer"
+        />
+      </el-form-item>
+      <el-form-item
+        label="客户经理"
+        prop="salesmanid"
+        v-show="showCustomsManage"
+      >
+        <user-selector
+          manage
+          v-model="queryParams.salesmanid"
+          clearable
+          @change="handleQuery"
+          :prepend="{ id: 0, nickname: $t('未分配客户经理') }"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row>
+      <el-form size="small" :inline="true" label-width="150px">
+        <el-form-item label="">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            @click="hhandleQueryAnalysis"
+            >更多</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-row>
+    <div
+      ref="mainBar"
+      :class="className"
+      :style="{ height: height, width: width }"
+    ></div>
+    <!--
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />-->
+  </div>
+</template>
+    
+<script>
+import UserSelector from "@/components/UserSelector";
+import Treeselect from "@riophae/vue-treeselect";
+//自定义目录数样式
+import "@/assets/styles/vue-treeselect.css";
+import { listSimpleDepts } from "@/api/system/dept";
+import * as echarts from "echarts";
+require("echarts/theme/macarons");
+import resize from "../../dashboard/mixins/resize";
+import { getReportResult } from "@/api/report/customerreport";
+import { getCurUserPermission } from "@/api/report/EcwReportPermission";
+import { MessageBox } from "element-ui";
+
+const CurDate = new Date();
+
+function currentTime() {
+  var date = new Date();
+  var year = date.getFullYear();
+  //月份从0~11，所以加一
+  let month = date.getMonth() + 1;
+  //如果格式是MM则需要此步骤，如果是M格式则此处注释掉
+  if (month >= 1 && month <= 9) {
+    month = "0" + month;
+  }
+  let strDate = year + "-" + month;
+  return strDate;
+}
+
+function getLastYear() {
+  //获取上一年份
+  var date = new Date();
+  date.setFullYear(date.getFullYear() - 1);
+  let year = date.getFullYear();
+  return year.toString();
+}
+
+export default {
+  name: "customerreport",
+  components: {
+    UserSelector,
+    Treeselect,
+  },
+  mixins: [resize],
+  props: {
+    className: {
+      type: String,
+      default: "chart",
+    },
+    width: {
+      type: String,
+      default: "100%",
+    },
+    height: {
+      type: String,
+      default: "1500px",
+    },
+    autoResize: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 总条数
+      total: 0,
+      // 显示搜索条件
+      showSearch: true,
+      showDept: true, //是否显示部门选择过滤条件
+      showCustomsManage: true, //是否显示客户经理过滤条件
+      deptOptions: undefined,
+      chart: null,
+      dateRangeCreateTime: [],
+      queryParams: {
+        sDate: CurDate.getFullYear() + "-01",
+        eDate: currentTime(), //结束日期
+        duibiYear: getLastYear(), //对比年份
+        deptid: undefined, //部门
+        salesmanid: undefined, //客户经理
+        pageNo: 1,
+        pageSize: 30,
+      },
+      //报表权限信息
+      objEcwReportPermission: {},
+    };
+  },
+  watch: {},
+  mounted() {
+    /*
+    this.$nextTick(() => {
+      this.initChart();
+    });*/
+  },
+  created() {
+    this.getTreeselect();
+
+    //获取当前用户报表权限
+    getCurUserPermission().then((response) => {
+      this.objEcwReportPermission = response.data;
+      if (this.objEcwReportPermission.permissionFw == 1) {
+        this.showCustomsManage = false;
+        this.showDept = false;
+        this.queryParams.salesmanid = this.objEcwReportPermission.userId;
+      }
+      //获取权限后再初始化统计图表
+      this.initChart();
+    });
+
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return;
+    }
+    this.chart.dispose();
+    this.chart = null;
+  },
+  methods: {
+    initChart() {
+      var chartDom = this.$refs["mainBar"];
+      this.chart = echarts.init(chartDom, "macarons");
+      this.setOptions();
+    },
+    setOptions() {
+      this.loading = true;
+      getReportResult(this.queryParams).then((response) => {
+        //全部列表数据
+        this.total = response.data.total;
+        let resultList = response.data.resultList;
+        this.loading = false;
+        this.chart.setOption({
+          title: {
+            text: "客户贡献排名",
+          },
+          tooltip: {
+            trigger: "axis",
+            axisPointer: {
+              type: "shadow",
+            },
+            // 自定义提示框内容，使用回调函数
+            formatter: function (params) {
+              //params 是一个数组，数组中每个元素代表一个系列的数据信息
+              var result = "";
+              params.forEach(function (item) {
+                //var s=JSON.stringify(item);
+                //alert(s);
+                //在数据中查询
+                let vR = resultList.filter((r) => r.name === item.name);
+                result += "客户：" + item.name + "<br/>";
+                result += "客户经理部门：" + vR[0].deptname + "<br/>";
+                result += "总V值：" + item.value + "<br/>";
+                result += "海运V值：" + vR[0].sumvolume1 + "<br/>";
+                result += "空运V值：" + vR[0].sumweight3 + "<br/>";
+                result += "对比年份：" + vR[0].duibiYear + "<br/>";
+                result += "同比：" + vR[0].allsumvolumeTbMsg + "<br/>";
+                result += "环比：" + vR[0].allsumvolumeTbMsg + "<br/>";
+              });
+              return result;
+            },
+          },
+          legend: {},
+          grid: {
+            left: "3%",
+            right: "4%",
+            bottom: "3%",
+            containLabel: true,
+          },
+          xAxis: {
+            type: "value",
+            boundaryGap: [0, 0.5],
+          },
+          yAxis: response.data.objyAxis,
+          series: response.data.obSseries,
+        });
+      });
+    },
+    hhandleQueryAnalysis() {
+      this.$router.push("/member/customer_analysis");
+    },
+    handleQuery() {
+      //校验查询参数 lanbm 2024-04-07 add
+      if (this.queryParams.sDate == undefined) {
+        MessageBox("请输入起始月份。");
+        return;
+      }
+      if (this.queryParams.eDate == undefined) {
+        MessageBox("请输入截止月份。");
+        return;
+      }
+      if (this.queryParams.duibiYear == undefined) {
+        MessageBox("请输入对比年份。");
+        return;
+      }
+      //查询统计结果
+      this.initChart();
+    },
+    getList() {
+      //this.initChart();
+    },
+    resetQuery() {
+      this.queryParams = {
+        sDate: undefined, //开始日期
+        eDate: undefined, //结束日期
+        duibiYear: undefined, //对比年份
+        deptid: undefined, //部门
+        salesmanid: undefined, //客户经理
+        pageNo: 1,
+        pageSize: 30,
+      };
+    },
+    handleAdd() {},
+    handleExport() {},
+    /** 查询部门下拉树结构 + 岗位下拉 */
+    getTreeselect() {
+      listSimpleDepts().then((response) => {
+        // 处理deptOptions 参数
+        this.deptOptions = [];
+        this.deptOptions.push(...this.handleTree(response.data, "id"));
+      });
+    },
+    //格式化部门的下拉框
+    normalizer(node) {
+      return {
+        id: node.id,
+        label: node.name,
+        children: node.children,
+      };
+    },
+  },
+};
+</script>
+      
\ No newline at end of file

src/views/report/sales_analysis/index.vue

+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="100px"
+    >
+      <el-form-item label="订单编号" prop="name">
+        <el-select v-model="queryParams.status" clearable style="width: 100px">
+          <el-option
+            v-for="dict in SearchType"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-input
+          style="width: 200px"
+          v-model="queryParams.name"
+          placeholder="请输入订单编号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="提单号" prop="empGender">
+        <el-select v-model="queryParams.status" clearable style="width: 100px">
+          <el-option
+            v-for="dict in SearchType"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-input
+          style="width: 200px"
+          v-model="queryParams.empGender"
+          placeholder="请输入提单号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="发货人编号">
+        <el-select v-model="queryParams.status" clearable style="width: 100px">
+          <el-option
+            v-for="dict in SearchType"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-input
+          style="width: 200px"
+          v-model="queryParams.name"
+          placeholder="请输入发货人编号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="收货人编号" prop="delFlag">
+        <el-select v-model="queryParams.status" clearable style="width: 100px">
+          <el-option
+            v-for="dict in SearchType"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <el-input
+          style="width: 200px"
+          v-model="queryParams.delFlag"
+          placeholder="请输入收货人编号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="唛头" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="请输入备注信息"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="客户经理" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="请输入备注信息"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="部门" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="请选择部门"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item :label="$t('订单状态')" prop="status">
+        <dict-selector
+          :type="DICT_TYPE.ORDER_STATUS"
+          v-model="queryParams.status"
+          @keyup.enter.native="handleQuery"
+          :filter="statusDictFilter"
+          clearable
+        />
+      </el-form-item>
+
+      <el-form-item
+        :label="$t('运输方式')"
+        prop="transportId"
+        v-if="!transportId"
+      >
+        <dict-selector
+          :type="DICT_TYPE.ECW_TRANSPORT_TYPE"
+          v-model.number="queryParams.transportId"
+          clearable
+          @change="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item :label="$t('始发仓')" prop="startWarehouseId">
+        <el-select
+          v-model="queryParams.startWarehouseId"
+          :placeholder="$t('请选择始发仓')"
+          clearable
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="item in exportWarehouseList"
+            :label="$l(item, 'title')"
+            :value="item.id"
+            :key="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="目的国" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="选择目的国"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="目的城市" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="选择目的城市"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item :label="$t('目的仓')" prop="destWarehouseId">
+        <el-select
+          v-model="queryParams.destWarehouseId"
+          :placeholder="$t('请选择目的仓')"
+          clearable
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="item in importWarehouseList"
+            :label="$l(item, 'title')"
+            :value="item.id"
+            :key="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item :label="$t('控货')" prop="isCargoControl">
+        <dict-selector
+          v-model="queryParams.isCargoControl"
+          :type="DICT_TYPE.INFRA_BOOLEAN_STRING"
+          fomatter="bool"
+          clearable
+        />
+      </el-form-item>
+
+      <el-form-item label="重泡类型" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="请输入备注信息"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="付款方" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="选择付款方"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="渠道" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="选择渠道"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="资源类型" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="选择资源类型"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="业绩类型" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="选择业绩类型"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="数据筛选" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="请输入备注信息"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="时间筛选" prop="remark">
+        <el-input
+          v-model="queryParams.remark"
+          placeholder="请输入备注信息"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          :loading="exportLoading"
+          >导出</el-button
+        >
+      </el-form-item>
+    </el-form>
+
+    <!-- 列表 -->
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="排名" align="center" prop="id" />
+      <el-table-column label="订单编号" align="center" prop="name" />
+      <el-table-column label="提单号" align="center" prop="empGender" />
+      <el-table-column label="发货人编号" align="center" prop="age" />
+      <el-table-column label="收货人编号" align="center" prop="email" />
+      <el-table-column
+        label="客户经理"
+        align="center"
+        prop="createTime"
+        width="180"
+      >
+      </el-table-column>
+      <el-table-column label="订单状态" align="center" prop="deleted" />
+      <el-table-column label="运输方式" align="center" prop="deleted" />
+      <el-table-column label="始发仓" align="center" prop="deleted" />
+      <el-table-column label="目的国" align="center" prop="deleted" />
+      <el-table-column label="目的城市" align="center" prop="deleted" />
+      <el-table-column label="目的仓" align="center" prop="deleted" />
+      <el-table-column label="渠道" align="center" prop="deleted" />
+      <el-table-column label="创建时间" align="center" prop="deleted" />
+      <el-table-column label="业绩创建时间" align="center" prop="deleted" />
+      <el-table-column label="资源类型" align="center" prop="deleted" />
+      <el-table-column label="业绩类型" align="center" prop="deleted" />
+      <el-table-column label="唛头" align="center" prop="deleted" />
+      <el-table-column label="始发仓" align="center" prop="deleted" />
+      <el-table-column label="入仓箱数" align="center" prop="deleted" />
+      <el-table-column label="体积" align="center" prop="deleted" />
+      <el-table-column label="重量" align="center" prop="deleted" />
+      <el-table-column label="控货" align="center" prop="deleted" />
+      <el-table-column label="重货/泡货" align="center" prop="deleted" />
+      <el-table-column label="重货/泡货标准" align="center" prop="deleted" />
+      <el-table-column label="付款方" align="center" prop="deleted" />
+      <el-table-column label="首次入仓时间" align="center" prop="deleted" />
+      <el-table-column label="提货率" align="center" prop="deleted" />
+      <el-table-column label="入仓记录" align="center" prop="deleted" />
+    </el-table>
+    <!-- 分页组件 -->
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+  
+  <script>
+import UserSelector from "@/components/UserSelector";
+import Treeselect from "@riophae/vue-treeselect";
+//自定义目录数样式
+import "@/assets/styles/vue-treeselect.css";
+import { getWarehouseList } from "@/api/ecw/warehouse";
+import { getReportResult, exportExcel } from "@/api/report/customerreport";
+import {getCurUserPermission} from "@/api/report/EcwReportPermission";
+
+export default {
+  name: "sales_analysis",
+  components: {
+    UserSelector,
+    Treeselect,
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 测试列表
+      list: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      dateRangeCreateTime: [],
+      SearchType: [
+        { value: "in", label: "包含" },
+        { value: "notin", label: "不包含" },
+        { value: "eq", label: "等于" },
+        { value: "noeq", label: "不等于" },
+      ],
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        startWarehouseId: undefined,
+        empGender: undefined,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      warehouseList: [],
+      //报表权限信息
+      objEcwReportPermission: {},
+    };
+  },
+  created() {
+    getWarehouseList().then((res) => (this.warehouseList = res.data));
+    // this.getList();
+    this.loading = false;
+  },
+  computed: {
+    exportWarehouseList() {
+      //始发仓列表
+      return this.warehouseList.filter(
+        (item) => item.tradeType == 2 || item.tradeType == 3
+      );
+    },
+    importWarehouseList() {
+      //目的仓列表
+      return this.warehouseList.filter(
+        (item) => item.tradeType == 1 || item.tradeType == 3
+      );
+    },
+  },
+  methods: {
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      // 执行查询
+      getTestPage(params).then((response) => {
+        this.list = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+
+    /** 表单重置 */
+    reset() {
+      this.form = {
+        id: undefined,
+        name: undefined,
+        empGender: undefined,
+        age: undefined,
+        email: undefined,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRangeCreateTime = [];
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      params.pageNo = undefined;
+      params.pageSize = undefined;
+      // 执行导出
+      this.$modal
+        .confirm("是否确认导出所有测试数据项?")
+        .then(() => {
+          this.exportLoading = true;
+          return exportTestExcel(params);
+        })
+        .then((response) => {
+          this.$download.excel(response, "${table.classComment}.xls");
+          this.exportLoading = false;
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>@/api/report/vz
+  
\ No newline at end of file

src/views/report/salesreport/index.vue

+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="100px"
+    >
+      <el-form-item label="选择日期" prop="testName">
+        <el-date-picker
+          v-model="dateRangeCreateTime"
+          style="width: 240px"
+          value-format="yyyy-MM-dd"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        />
+      </el-form-item>
+      <el-form-item label="同比年份" prop="duibiYear">
+        <el-input
+          v-model="queryParams.duibiYear"
+          placeholder="请输入排序"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item label="部门" prop="deptid">
+        <el-select
+          v-model="queryParams.deptId"
+          style="width: 300px"
+          :placeholder="$t('请选择部门')"
+          clearable
+        >
+          <el-option
+            v-for="item in this.deptData"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="客户经理" prop="salesmanid">
+        <user-selector
+          manage
+          v-model="queryParams.salesmanid"
+          clearable
+          @change="handleQuery"
+          :prepend="{ id: 0, nickname: $t('未分配客户经理') }"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row>
+      <el-form size="small" :inline="true" label-width="100px">
+        <el-form-item label="客业绩总览" prop="allsumvolume">
+          <el-input
+            v-model="allsumvolume"
+            placeholder=""
+            :readonly="true"
+            clearable
+          />
+        </el-form-item>
+
+        <el-form-item label="海运拼柜" prop="sumvolume1">
+          <el-input
+            v-model="sumvolume1"
+            placeholder=""
+            :readonly="true"
+            clearable
+          />
+        </el-form-item>
+
+        <el-form-item label="专线空运" prop="sumweight3">
+          <el-input
+            v-model="sumweight3"
+            placeholder=""
+            :readonly="true"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="成交客户总览" prop="sumCustomerCount">
+          <el-input
+            v-model="sumCustomerCount"
+            placeholder=""
+            :readonly="true"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="首次成交" prop="fisCustomerCount">
+          <el-input
+            v-model="fisCustomerCount"
+            placeholder=""
+            :readonly="true"
+            clearable
+          />
+        </el-form-item>
+      </el-form>
+    </el-row>
+    <div
+      ref="mainBar"
+      :class="className"
+      :style="{ height: height, width: width }"
+    />
+  </div>
+</template>
+      
+  <script>
+import UserSelector from "@/components/UserSelector";
+import Treeselect from "@riophae/vue-treeselect";
+//自定义目录数样式
+import "@/assets/styles/vue-treeselect.css";
+import { listSimpleDepts } from "@/api/system/dept";
+//报表权限接口
+import {getCurUserPermission} from "@/api/report/EcwReportPermission";
+import { SalesReportCount, FirstCustomerCount } from "@/api/report/salesreport";
+import * as echarts from "echarts";
+require("echarts/theme/macarons");
+import resize from "../../dashboard/mixins/resize";
+import SalesPanelGroup from "../../dashboard/SalesPanelGroup";
+
+export default {
+  name: "salesreport",
+  components: {
+    SalesPanelGroup,
+    UserSelector,
+    Treeselect,
+  },
+  mixins: [resize],
+  props: {
+    className: {
+      type: String,
+      default: "chart",
+    },
+    width: {
+      type: String,
+      default: "100%",
+    },
+    height: {
+      type: String,
+      default: "350px",
+    },
+    autoResize: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      chart: null,
+      allsumvolume: undefined,
+      sumvolume1: undefined,
+      sumweight3: undefined,
+      sumCustomerCount: undefined, //成交客户总数
+      fisCustomerCount: undefined, //首次成交客户户数
+      dateRangeCreateTime: [],
+      queryParams: {
+        salesmanid: undefined, //销售经理
+        deptid: undefined, //部门
+      },
+      deptData: [],
+      //报表权限信息
+      objEcwReportPermission: {},
+    };
+  },
+  watch: {},
+  mounted() {
+    this.getSalesReportCount();
+    this.getFirstCustomerCount();
+
+    this.$nextTick(() => {
+      this.initChart();
+    });
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return;
+    }
+    this.chart.dispose();
+    this.chart = null;
+  },
+  methods: {
+    getDept() {
+      listSimpleDepts().then((response) => {
+        //this.deptData.add
+      });
+    },
+    getSalesReportCount() {
+      //获取运输方式统计数 lanbm 2024-04-01 add
+      SalesReportCount(this.queryParams).then((response) => {
+        //业绩总览
+        this.allsumvolume = response.data.allsumvolume;
+        //海运拼柜
+        this.sumvolume1 = response.data.sumvolume1;
+        //专线空运
+        this.sumweight3 = response.data.sumweight3;
+      });
+    },
+    getFirstCustomerCount() {
+      //获取首次成交客户数 lanbm 2024-04-01 add
+      FirstCustomerCount(this.queryParams).then((response) => {
+        //首次成交客户数
+        this.fisCustomerCount = response.data;
+      });
+    },
+    initChart() {
+      var chartDom = this.$refs["mainBar"];
+      this.chart = echarts.init(chartDom, "macarons");
+      this.setOptions();
+    },
+    setOptions() {
+      this.chart.setOption({
+        xAxis: {
+          type: "category",
+          data: ["Mon1", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+        },
+        yAxis: {
+          type: "value",
+        },
+        series: [
+          {
+            data: [200, 230, 224, 218, 135, 147, 260],
+            type: "line",
+          },
+        ],
+      });
+    },
+    handleQuery() {},
+    getList() {},
+    resetQuery() {},
+    handleAdd() {},
+    handleExport() {},
+  },
+};
+</script>
+      
\ No newline at end of file

src/views/report/vz/index.vue

+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      size="small"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="运输方式" prop="titleZh">
+        <el-select v-model="queryParams.titleZh" clearable style="width: 200px">
+          <el-option label="海运拼柜" value="海运拼柜"></el-option>
+          <el-option label="专线空运" value="专线空运"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="基础单位" prop="fuhao">
+        <el-input
+          v-model="queryParams.fuhao"
+          placeholder="请输入基础单位"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['my:test:create']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+         <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          v-show="false"
+          @click="handleExport"
+          :loading="exportLoading"
+          v-hasPermi="['my:test:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        :showSearch.sync="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="编号" align="center" prop="id" />
+      <el-table-column label="运输方式" align="center" prop="titleZh" />
+      <el-table-column label="基础单位" align="center" prop="fuhao" />
+      <el-table-column label="V值" align="center" prop="vz" width="100">
+      </el-table-column>
+      <el-table-column label="修改日期" align="center" prop="updateTime">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.updateTime) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['my:test:update']"
+            >修改</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['my:test:delete']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="运输方式" prop="titleZh">
+          <el-select v-model="form.titleZh" clearable style="width: 200px">
+          <el-option label="海运拼柜" value="海运拼柜"></el-option>
+          <el-option label="专线空运" value="专线空运"></el-option>
+        </el-select>
+        </el-form-item>
+        <el-form-item label="基础单位" prop="fuhao">
+          <el-input v-model="form.fuhao" placeholder="基础单位" />
+        </el-form-item>
+        <el-form-item label="V值" prop="vz">
+          <el-input v-model="form.vz" placeholder="V值" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  create,
+  update,
+  del,
+  getModel,
+  getPageList,
+  exportExcel,
+} from "@/api/report/vz";
+
+export default {
+  name: "vz",
+  components: {},
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 测试列表
+      list: [],
+      // 弹出层标题
+      title: "",
+      //是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        titleZh: null, //运输方式
+        fuhao: null, //基础单位
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      // 执行查询
+      getPageList(params).then((response) => {
+        this.list = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    /** 取消按钮 */
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 表单重置 */
+    reset() {
+      this.form = {
+        id: undefined,
+        titleZh: undefined, //运输方式
+        fuhao: undefined, //基础单位
+        vz: undefined //v值
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加测试";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id;
+      getModel(id).then((response) => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改测试";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        if (!valid) {
+          return;
+        }
+        // 修改的提交
+        if (this.form.id != null) {
+          update(this.form).then((response) => {
+            this.$modal.msgSuccess("修改成功");
+            this.open = false;
+            this.getList();
+          });
+          return;
+        }
+        // 添加的提交
+        create(this.form).then((response) => {
+          this.$modal.msgSuccess("新增成功");
+          this.open = false;
+          this.getList();
+        });
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const id = row.id;
+      this.$modal
+        .confirm('是否确认删除测试编号为"' + id + '"的数据项?')
+        .then(function () {
+          return del(id);
+        })
+        .then(() => {
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      params.pageNo = undefined;
+      params.pageSize = undefined;
+      // 执行导出
+      this.$modal
+        .confirm("是否确认导出所有测试数据项?")
+        .then(() => {
+          this.exportLoading = true;
+          return exportExcel(params);
+        })
+        .then((response) => {
+          this.$download.excel(response, "${table.classComment}.xls");
+          this.exportLoading = false;
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>