|
|
@@ -0,0 +1,263 @@
|
|
|
+@extends('layouts.app')
|
|
|
+@section('title')KPI-日报表@endsection
|
|
|
+@section('content')
|
|
|
+ <div class="d-none" id="list">
|
|
|
+ <!--查询 -->
|
|
|
+ <div class="row m-3" style="background-color: #fff;">
|
|
|
+
|
|
|
+ <div class="form-group m-2">
|
|
|
+ <select class="form-control selectpicker" title="分页大小" v-model="size">
|
|
|
+ <option value="50">50</option>
|
|
|
+ <option value="100">100</option>
|
|
|
+ <option value="200">200</option>
|
|
|
+ <option value="500">500</option>
|
|
|
+ <option value="1000">1000</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group m-2" style="max-width: 200px !important;">
|
|
|
+ <select v-model="search.customerCodeList" class="selectpicker form-control" multiple title="选择货主"
|
|
|
+ data-actions-box="true"
|
|
|
+ data-live-search="true"
|
|
|
+ data-live-search-placeholder="搜索"
|
|
|
+ >
|
|
|
+ <option v-for="(v,k) of owners" :value="v.id" :key="v.id">@{{ v.name }}</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="form-group m-2" data-toggle="tooltip" data-placement="top" title="起始日期">
|
|
|
+ <input v-model="search.startDate" class="form-control" type="date">
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group m-2" data-toggle="tooltip" data-placement="top" title="截止日期">
|
|
|
+ <input v-model="search.endDate" class="form-control" type="date">
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group m-2">
|
|
|
+ <button class="form-control btn btn-sm btn-info" @click="searchData()">查询</button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group m-2">
|
|
|
+ <button class="form-control btn btn-sm btn-success" @click="resetSearch()">重置</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 导出-->
|
|
|
+ <span class="dropdown"></span>
|
|
|
+ {{-- <h3>2021</h3>--}}
|
|
|
+ <!-- 表格-->
|
|
|
+ <table class="table table-striped table-bordered table-hover text-nowrap waybill-table td-min-width-80"
|
|
|
+ style="background: #fff;" id="table">
|
|
|
+ <tr v-for="(item,i) in details.data" :key="i">
|
|
|
+ <td><input class="checkItem" type="checkbox" :value="item.id"></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.customerName }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.statTime.slice(0,10) }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.b2bck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.jyck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.qtck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.jitck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.hhck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.ptck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f4ck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f21ck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f11ck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f1ck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.xnck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.bfck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.dbck }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.cgth }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.xsck }}</span></td>
|
|
|
+
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.cgrk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.thrk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.dbrk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.xnrk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f31rk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f10rk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f21rk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.f32rk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.hhrk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.cskc }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.qtrk }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.b2brk }}</span></td>
|
|
|
+
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.rejectedOrder }}</span></td>
|
|
|
+ <td class="td-warm text-muted"><span>@{{ item.rejectedCommodity }}</span></td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <nav aria-label="...">
|
|
|
+ <ul class="pagination">
|
|
|
+ <li class="page-item" :class="current===1?'disabled':''">
|
|
|
+ <button class="page-link" @click="pagination('pre')">上一页</button>
|
|
|
+ </li>
|
|
|
+ <li class="page-item" :class="current===details.pages?'disabled':''">
|
|
|
+ <button class="page-link" @click="pagination('next')">下一页</button>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </nav>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+@endsection
|
|
|
+
|
|
|
+@section('lastScript')
|
|
|
+ <script type="text/javascript" src="{{mix('js/queryForm/header.js')}}"></script>{{--新版2--}}
|
|
|
+ <script>
|
|
|
+ let vue = new Vue({
|
|
|
+ el: "#list",
|
|
|
+ data: {
|
|
|
+ owners: [
|
|
|
+ @foreach($owners as $owner)
|
|
|
+ {
|
|
|
+ name: '{{$owner->name}}', id: '{{$owner->id}}', code: '{{$owner->code}}'
|
|
|
+ },
|
|
|
+ @endforeach
|
|
|
+ ],
|
|
|
+ selectTr: '',
|
|
|
+ details: {
|
|
|
+ data: [],
|
|
|
+ total: null,
|
|
|
+ current: null,
|
|
|
+ pages: null,
|
|
|
+ size: null
|
|
|
+ },
|
|
|
+ size: 50,
|
|
|
+ current: 1,
|
|
|
+ search: {
|
|
|
+ startDate: '',
|
|
|
+ endDate: '',
|
|
|
+ customerCodeList: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ let url = this.getBaseUrl();
|
|
|
+ url += `/api/deliver/getDayDetailCustomerPage?size=${this.size}¤t=${this.current}`;
|
|
|
+ axios.post(url, this.search).then(res => {
|
|
|
+ this.details.data = res.data.data.list;
|
|
|
+ this.details.total = res.data.data.page.total;
|
|
|
+ this.details.current = res.data.data.page.pageNum;
|
|
|
+ this.details.pages = res.data.data.page.pages
|
|
|
+ this.details.size = res.data.data.page.pageSize;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ mounted: function () {
|
|
|
+ $('#list').removeClass('d-none');
|
|
|
+ this.rendingHeader();
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ resetSearch() {
|
|
|
+ this.current = 1;
|
|
|
+ this.size = 50;
|
|
|
+ this.search = {
|
|
|
+ startDate: '',
|
|
|
+ endDate: '',
|
|
|
+ customerCodeList: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ searchData() {
|
|
|
+ this.current = 1;
|
|
|
+ this.pagination();
|
|
|
+ },
|
|
|
+ cal_deliver_percentage(item) {
|
|
|
+ if (item.workTimes == 0) return 0;
|
|
|
+ return Math.round(item.totalDeliveryQty / item.workTimes * 100);
|
|
|
+ },
|
|
|
+
|
|
|
+ //根据环境获取不同的url
|
|
|
+ getBaseUrl() {
|
|
|
+ let url = '';
|
|
|
+ let env = "{{ config('app.env') }}";
|
|
|
+ if (env === 'local') {
|
|
|
+ url = 'http://127.0.0.1:8111'
|
|
|
+ } else if (env === 'production') {
|
|
|
+ url = 'https://stat.baoshi56.com'
|
|
|
+ }
|
|
|
+ return url;
|
|
|
+ },
|
|
|
+ pagination(flag) {
|
|
|
+ if (flag === 'pre' && this.current > 1) {
|
|
|
+ this.current--;
|
|
|
+ } else if (flag === 'next' && this.current < this.details.pages) {
|
|
|
+ this.current++;
|
|
|
+ }
|
|
|
+ let env = "{{ config('env') }}";
|
|
|
+ console.log(env);
|
|
|
+ let url = this.getBaseUrl();
|
|
|
+
|
|
|
+ url += `/api/deliver/getDayDetailCustomerPage?size=${this.size}¤t=${this.current}`;
|
|
|
+ axios.post(url, this.search).then(res => {
|
|
|
+ if (res.data.data === undefined) {
|
|
|
+ this.details.data = [];
|
|
|
+ this.details.total = 0
|
|
|
+ this.details.current = 1
|
|
|
+ this.details.pages = 0
|
|
|
+ this.details.size = 50;
|
|
|
+ } else {
|
|
|
+ this.details.data = res.data.data.list;
|
|
|
+ this.details.total = res.data.data.page.total;
|
|
|
+ this.details.current = res.data.data.page.pageNum;
|
|
|
+ this.details.pages = res.data.data.page.pages
|
|
|
+ this.details.size = res.data.data.page.pageSize;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ rendingHeader() {
|
|
|
+ let column = [
|
|
|
+ {name: 'ownerName', value: '货主', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'statTime', value: '统计日期', neglect: true, class: "td-cool"},
|
|
|
+
|
|
|
+ {name: 'b2bck', value: 'B2B出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'jyck', value: '一般交易出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'qtck', value: '其他出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'jitck', value: '唯品出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'hhck', value: '换货出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'ptck', value: '普通出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'f4ck', value: '笕尚移仓出库单', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'f21ck', value: '笕尚调整出库单', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'f11ck', value: '笕尚退仓出库单', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'f1ck', value: '笕尚配货出库单', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'xnck', value: '虚拟出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'bfck', value: '补发出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'dbck', value: '调拨出库', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'cgth', value: '采购退货', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'xsck', value: '销售出库', neglect: true, class: "td-cool"},
|
|
|
+
|
|
|
+
|
|
|
+ {name: 'cgrk', value: '采购入库', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'thrk', value: '退货入库', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'dbrk', value: '调拨入库', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'xnrk', value: '虚拟入库', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'f31rk', value: '笕尚退货入库单', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'f10rk', value: '笕尚进仓入库单', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'f21rk', value: '笕尚调整入库单', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'f32rk', value: '笕尚移仓入库单', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'hhrk', value: '换货入库', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'cskc', value: '初始化库存', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'qtrk', value: '其他入库', neglect: true, class: "td-warm"},
|
|
|
+ {name: 'b2brk', value: 'B2B入库', neglect: true, class: "td-warm"},
|
|
|
+
|
|
|
+ {name: 'rejectedOrder', value: '退货单数', neglect: true, class: "td-cool"},
|
|
|
+ {name: 'rejectedCommodity', value: '退货商品数', neglect: true, class: "td-cool"},
|
|
|
+
|
|
|
+ ];
|
|
|
+ new Header({
|
|
|
+ el: "table",
|
|
|
+ name: "details",
|
|
|
+ column: column,
|
|
|
+ data: this.details.data,
|
|
|
+ restorationColumn: 'id',
|
|
|
+ fixedTop: ($('#form_div').height()) + ($('#btn').height()) + 2,
|
|
|
+ before: [
|
|
|
+ {colspan: '18', value: '出库', class: "table-header-layer-1"},
|
|
|
+
|
|
|
+ {colspan: '12', value: '入库', class: "table-header-layer-1"},
|
|
|
+
|
|
|
+ {colspan: '2', value: '退货', class: "table-header-layer-1"},
|
|
|
+ ],
|
|
|
+ }).init();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+@endsection
|