greater_wms/templates/src/pages/inbound/asn.vue

<template>
  <div>
    <transition appear enter-active-class="animated fadeIn">
      <q-table
        class="my-sticky-header-column-table shadow-24"
        :data="table_list"
        row-key="id"
        :separator="separator"
        :loading="loading"
        :columns="columns"
        hide-bottom
        :pagination.sync="pagination"
        no-data-label="No data"
        no-results-label="No data you want"
        :table-style="{ height: height }"
        flat
        bordered
      >
        <template v-slot:top>
          <q-btn-group push>
            <q-btn
              :label="$t('new')"
              icon="add"
              @click="
                newForm = true;
                newFormData.creater = login_name;
              "
            >
              <q-tooltip
                content-class="bg-amber text-black shadow-4"
                :offset="[10, 10]"
                content-style="font-size: 12px"
                >{{ $t("newtip") }}</q-tooltip
              >
            </q-btn>
            <q-btn :label="$t('refresh')" icon="refresh" @click="reFresh()">
              <q-tooltip
                content-class="bg-amber text-black shadow-4"
                :offset="[10, 10]"
                content-style="font-size: 12px"
                >{{ $t("refreshtip") }}</q-tooltip
              >
            </q-btn>
          </q-btn-group>
          <q-space />
          <div class="flex items-center">
            <q-input
              outlined
              rounded
              dense
              debounce="200"
              color="primary"
              v-model="filter"
              :placeholder="'输入名称搜索'"
              @input="getSearchList()"
              @keyup.enter="getSearchList()"
            >
              <template v-slot:append>
                <q-icon name="search" />
              </template>
            </q-input>
          </div>
        </template>
        <template v-slot:body="props">
          <q-tr :props="props">
            <template v-if="props.row.id === editid">
              <q-td key="detail" :props="props">
                <q-btn
                  round
                  flat
                  push
                  color="black"
                  icon="description"
                  @click="detailData(props.row)"
                >
                  <q-tooltip
                    content-class="bg-amber text-black shadow-4"
                    :offset="[10, 10]"
                    content-style="font-size: 12px"
                    >{{ "查看批次详情" }}</q-tooltip
                  >
                </q-btn>
              </q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="detail" :props="props">
                <q-btn
                  round
                  flat
                  push
                  color="black"
                  icon="description"
                  @click="detailData(props.row)"
                >
                  <q-tooltip
                    content-class="bg-amber text-black shadow-4"
                    :offset="[10, 10]"
                    content-style="font-size: 12px"
                    >{{ "查看批次详情" }}</q-tooltip
                  >
                </q-btn>
              </q-td>
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_date" :props="props">{{
                props.row.bound_date
              }}</q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_date" :props="props">{{
                props.row.bound_date
              }}</q-td>
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_code" :props="props">{{
                props.row.bound_code
              }}</q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_code" :props="props">{{
                props.row.bound_code
              }}</q-td>
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_code_type" :props="props">
                <q-select
                  dense
                  outlined
                  square
                  v-model="editFormData.bound_code_type"
                  :label="'单据类型'"
                  autofocus
                  :options="bound_code_type_list"
                  option-label="label"
                  option-value="value"
                  emit-value
                  map-options
                  transition-show="scale"
                  transition-hide="scale"
                  :rules="[(val) => (val && val.length > 0) || error1]"
                />
              </q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_code_type" :props="props">
                {{
                  bound_code_type_map[props.row.bound_code_type] ||
                  props.row.bound_code_type
                }}</q-td
              >
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_bs_type" :props="props">
                <q-select
                  dense
                  outlined
                  square
                  v-model="editFormData.bound_bs_type"
                  :label="'单据类型'"
                  :options="bound_bs_type_list"
                  option-label="label"
                  option-value="value"
                  emit-value
                  map-options
                  transition-show="scale"
                  transition-hide="scale"
                  :rules="[(val) => (val && val.length > 0) || error1]"
                />
              </q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_bs_type" :props="props">
                {{
                  bound_bs_type_map[props.row.bound_bs_type] ||
                  props.row.bound_bs_type
                }}</q-td
              >
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_desc" :props="props">
                <q-select
                  dense
                  outlined
                  square
                  v-model="editFormData.bound_desc"
                  :label="'出入库类别'"
                  :options="bound_desc_list"
                  option-label="label"
                  option-value="value"
                  emit-value
                  map-options
                  transition-show="scale"
                  transition-hide="scale"
                  :rules="[(val) => (val && val.length > 0) || error1]"
                />
              </q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_desc" :props="props">
                {{
                  bound_desc_map[props.row.bound_desc] || props.row.bound_desc
                }}</q-td
              >
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_department" :props="props">
                <q-select
                  dense
                  outlined
                  square
                  v-model="editFormData.bound_department"
                  :label="'部门'"
                  :options="bound_department_list"
                  option-label="label"
                  option-value="value"
                  emit-value
                  map-options
                  transition-show="scale"
                  transition-hide="scale"
                  :rules="[(val) => (val && val.length > 0) || error1]"
                />
              </q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_department" :props="props">
                {{
                  bound_department_map[props.row.bound_department] ||
                  props.row.bound_department
                }}</q-td
              >
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="creater" :props="props">
                <q-input
                  dense
                  outlined
                  square
                  v-model.number="editFormData.creater"
                  :label="'经办人'"
                  :rules="[(val) => (val && val > 0) || error1]"
                />
              </q-td>
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="creater" :props="props">{{ props.row.creater }}</q-td>
            </template>

            <template v-if="props.row.id === editid">
              <q-td key="bound_status" :props="props">
                {{
                  bound_status_map[props.row.bound_status] ||
                  props.row.bound_status
                }}</q-td
              >
            </template>
            <template v-else-if="props.row.id !== editid">
              <q-td key="bound_status" :props="props">
                {{
                  bound_status_map[props.row.bound_status] ||
                  props.row.bound_status
                }}</q-td
              >
            </template>

            <template v-if="!editMode">
              <q-td key="action" :props="props" style="width: 100px">
                <q-btn
                  round
                  flat
                  push
                  color="dark"
                  icon="trolley"
                  @click="change_status(props.row)"
                >
                  <q-tooltip
                    content-class="bg-amber text-black shadow-4"
                    :offset="[10, 10]"
                    content-style="font-size: 12px"
                    >一键分拣</q-tooltip
                  >
                </q-btn>
              </q-td>
            </template>
            <template v-else-if="editMode">
              <template v-if="props.row.id === editid">
                <q-td key="action" :props="props" style="width: 100px">
                  <q-btn
                    round
                    flat
                    push
                    color="secondary"
                    icon="check"
                    @click="editDataSubmit()"
                  >
                    <q-tooltip
                      content-class="bg-amber text-black shadow-4"
                      :offset="[10, 10]"
                      content-style="font-size: 12px"
                      >{{ $t("confirmedit") }}</q-tooltip
                    >
                  </q-btn>
                  <q-btn
                    round
                    flat
                    push
                    color="red"
                    icon="close"
                    @click="editDataCancel()"
                  >
                    <q-tooltip
                      content-class="bg-amber text-black shadow-4"
                      :offset="[10, 10]"
                      content-style="font-size: 12px"
                      >{{ $t("canceledit") }}</q-tooltip
                    >
                  </q-btn>
                </q-td>
              </template>
              <template v-else-if="props.row.id !== editid"></template>
            </template>
          </q-tr>
        </template>
      </q-table>
    </transition>
    <template>
      <div v-show="max !== 0" class="q-pa-lg flex flex-center">
        <div>{{ total }}</div>
        <q-pagination
          v-model="current"
          color="black"
          :max="max"
          :max-pages="6"
          boundary-links
          @click="
            getSearchList(current);
            paginationIpt = current;
          "
        />
        <div>
          <input
            v-model="paginationIpt"
            @blur="changePageEnter"
            @keyup.enter="changePageEnter"
            style="width: 60px; text-align: center"
          />
        </div>
      </div>
      <div v-show="max === 0" class="q-pa-lg flex flex-center">
        <q-btn flat push color="dark" :label="$t('no_data')"></q-btn>
      </div>
    </template>
    <q-dialog v-model="newForm">
      <q-card class="shadow-24">
        <q-bar
          class="bg-light-blue-10 text-white rounded-borders"
          style="height: 50px"
        >
          <div>{{ $t("newtip") }}</div>
          <q-space />
          <q-btn dense flat icon="close" v-close-popup>
            <q-tooltip content-class="bg-amber text-black shadow-4">{{
              $t("index.close")
            }}</q-tooltip>
          </q-btn>
        </q-bar>
        <q-card-section style="max-height: 325px; width: 400px" class="scroll">
          <q-select
            dense
            outlined
            square
            v-model="newFormData.bound_code_type"
            :label="'单据类型'"
            autofocus
            :options="bound_code_type_list"
            option-label="label"
            option-value="value"
            emit-value
            map-options
            transition-show="scale"
            transition-hide="scale"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />
          <q-select
            dense
            outlined
            square
            v-model="newFormData.bound_bs_type"
            :label="'业务类型'"
            :options="bound_bs_type_list"
            option-label="label"
            option-value="value"
            emit-value
            map-options
            transition-show="scale"
            transition-hide="scale"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />
          <q-select
            dense
            outlined
            square
            v-model="newFormData.bound_desc"
            :label="'出入库类别'"
            :options="bound_desc_list"
            option-label="label"
            option-value="value"
            emit-value
            map-options
            transition-show="scale"
            transition-hide="scale"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />
          <q-select
            dense
            outlined
            square
            v-model="newFormData.bound_department"
            :label="'部门'"
            :options="bound_department_list"
            option-label="label"
            option-value="value"
            emit-value
            map-options
            transition-show="scale"
            transition-hide="scale"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />
          <q-input
            dense
            outlined
            square
            v-model="newFormData.creater"
            :label="'经办人'"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />
        </q-card-section>

        <div style="float: right; padding: 15px 15px 15px 0">
          <q-btn
            color="white"
            text-color="black"
            style="margin-right: 25px"
            @click="newDataCancel()"
            >{{ $t("cancel") }}</q-btn
          >
          <q-btn color="primary" @click="newDataSubmit()">{{
            $t("submit")
          }}</q-btn>
        </div>
      </q-card>
    </q-dialog>
    <q-dialog v-model="deleteForm">
      <q-card class="shadow-24">
        <q-bar
          class="bg-light-blue-10 text-white rounded-borders"
          style="height: 50px"
        >
          <div>{{ $t("delete") }}</div>
          <q-space />
          <q-btn dense flat icon="close" v-close-popup>
            <q-tooltip>{{ $t("index.close") }}</q-tooltip>
          </q-btn>
        </q-bar>
        <q-card-section
          style="max-height: 325px; width: 400px"
          class="scroll"
          >{{ $t("deletetip") }}</q-card-section
        >
        <div style="float: right; padding: 15px 15px 15px 0">
          <q-btn
            color="white"
            text-color="black"
            style="margin-right: 25px"
            @click="deleteDataCancel()"
            >{{ $t("cancel") }}</q-btn
          >
          <q-btn color="primary" @click="deleteDataSubmit()">{{
            $t("submit")
          }}</q-btn>
        </div>
      </q-card>
    </q-dialog>
    <q-dialog v-model="newBatchForm">
      <q-card class="shadow-24">
        <q-bar
          class="bg-light-blue-10 text-white rounded-borders"
          style="height: 50px"
        >
          <div>{{ "新建批次" }}</div>
          <q-space />
          <q-btn dense flat icon="close" v-close-popup>
            <q-tooltip content-class="bg-amber text-black shadow-4">{{
              $t("index.close")
            }}</q-tooltip>
          </q-btn>
        </q-bar>
        <q-card-section style="min-height: 325px; width: 500px" class="scroll">
          <div class="text-h6 q-mb-md">{{ "批次信息" }}</div>
          <div class="row q-gutter-x-md">
            <div class="col column q-gutter-y-md">
              <q-select
                dense
                outlined
                square
                v-model="newBatchFormData.goods_code"
                :label="'物料编码'"
                :options="product_list"
                option-label="value"
                option-value="value"
                emit-value
                map-options
                transition-show="scale"
                transition-hide="scale"
                :rules="[(val) => (val && val.length > 0) || error1]"
              />
            </div>
            <div class="col column q-gutter-y-md">
              <q-input
                outlined
                dense
                color="primary"
                v-model="product_filter"
                :placeholder="'搜索名称'"
                autofocus
                @input="getProductSearchList()"
                @keyup.enter="getProductSearchList()"
              >
                <template v-slot:append>
                  <q-icon name="search" />
                </template>
              </q-input>
            </div>
          </div>
          <q-select
            dense
            outlined
            square
            v-model="newBatchFormData.goods_code"
            :label="'物料'"
            :options="product_list"
            option-label="label"
            option-value="value"
            emit-value
            map-options
            :readonly="true"
            transition-show="scale"
            transition-hide="scale"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />

          <q-input
            dense
            outlined
            square
            v-model="newBatchFormData.goods_desc"
            :label="'名称'"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />

          <div class="row q-gutter-x-md">
            <div class="col column q-gutter-y-md">
              <q-input
                dense
                outlined
                square
                v-model.number="newBatchFormData.goods_weight"
                :label="'单重'"
                type="number"
                :rules="[(val) => (val && val > 0) || error1]"
              />
              <q-input
                dense
                outlined
                square
                v-model="newBatchFormData.goods_std"
                :label="'规格/备注'"
                :rules="[(val) => (val && val.length > 0) || error1]"
              />
            </div>
            <div class="col column q-gutter-y-md">
              <q-input
                dense
                outlined
                square
                v-model="newBatchFormData.goods_unit"
                :label="'单位'"
                :rules="[(val) => (val && val.length > 0) || error1]"
              />
              <q-toggle
                v-model="isorder"
                :label="isorder ? '自动编码' : '手动编码(建议)'"
              />
            </div>
          </div>
          <q-input
            v-show="!isorder"
            dense
            outlined
            square
            v-model.number="newBatchFormData.bound_batch_order"
            :label="'批号——年月第几批(20250409)'"
            type="number"
            :rules="[(val) => (val && val > 0) || error1]"
          />
          <q-input
            dense
            outlined
            square
            v-model.number="newBatchFormData.goods_qty"
            :label="'数量'"
            type="number"
            :rules="[(val) => (val && val > 0) || error1]"
          />

          <q-input
            dense
            outlined
            square
            v-model="newBatchFormData.creater"
            :label="'经办人'"
            :rules="[(val) => (val && val.length > 0) || error1]"
          />
        </q-card-section>

        <div style="float: right; padding: 15px 15px 15px 0">
          <q-btn
            color="white"
            text-color="black"
            style="margin-right: 25px"
            @click="newBatchCancel()"
            >{{ $t("cancel") }}</q-btn
          >
          <q-btn color="primary" @click="newBatchSubmit()">{{
            $t("submit")
          }}</q-btn>
        </div>
      </q-card>
    </q-dialog>
    <q-dialog
      v-model="detailForm"
      transition-show="jump-down"
      transition-hide="jump-up"
    >
      <q-card style="min-width: 900px">
        <q-bar
          class="bg-light-blue-10 text-white rounded-borders"
          style="height: 50px"
        >
          <div>
            {{ "批次信息" }}
          </div>
          <q-space></q-space>
          <q-btn dense flat icon="close" v-close-popup>
            <q-tooltip
              content-class="bg-amber text-black shadow-4"
              :offset="[20, 20]"
              content-style="font-size: 12px"
            >
              {{ $t("index.close") }}</q-tooltip
            >
          </q-btn>
        </q-bar>
        <q-card-section class="q-pt-md">
          <q-tabs v-model="activeTab">
            <q-tab name="tab1" label="入库信息" />
            <!-- <q-tab name="tab2" label="货物信息" /> -->
          </q-tabs>
        </q-card-section>
        <!-- 选项卡内容 -->
        <q-tab-panels v-model="activeTab" animated>
          <q-tab-panel name="tab1" style="height: 70px">
            <div class="row q-gutter-x-md">
              <div class="col column q-gutter-y-md">
                <q-input
                  dense
                  outlined
                  square
                  v-model="table_detail.bound_date"
                  :label="'单据时间'"
                  :readonly="true"
                />
              </div>
              <div class="col column q-gutter-y-md">
                <q-input
                  dense
                  outlined
                  square
                  v-model="table_detail.bound_code"
                  :label="'单据编码'"
                  :readonly="true"
                />
              </div>
            </div>
          </q-tab-panel>
        </q-tab-panels>

        <div
          style="float: right; padding: 15px 15px 50px 15px; min-width: 100%"
          flow="row wrap"
        >
          <q-card class="q-mb-md" bordered>
            <q-card-actions
              class="q-px-none"
              style="position: absolute; right: 20px; top: 10px; z-index: 100"
            >
              <q-btn
                v-if="!onlyread"
                icon="add"
                flat
                dense
                color="primary"
                @click="addbatch(table_detail.id)"
                :label="$t('stock.add')"
              />
            </q-card-actions>
            <q-card-section>
              <template>
                <div class="text-h6 q-mb-md">{{ "批次信息" }}</div>
                <template v-if="batch_detail.length > 0">
                  <div
                    v-for="(item, index) in batch_detail"
                    :key="index"
                    class="row q-col-gutter-md q-mb-sm"
                  >
                    <div class="col-1">
                      <q-btn icon="print" flat @click="print(item.id)"></q-btn>
                      <q-tooltip
                        content-class="bg-amber text-black shadow-4"
                        :offset="[-0, 0]"
                        content-style="font-size: 12px"
                        >打印条码</q-tooltip
                      >
                    </div>
                    <div class="col-3">
                      <q-input
                        v-model="item.bound_batch.sourced_number"
                        :label="'批次'"
                        :readonly="onlyread"
                        dense
                        outlined
                      />
                    </div>
                    <div class="col-4">
                      <q-input
                        v-model="item.bound_batch.goods_desc"
                        :label="'货物'"
                        :readonly="onlyread"
                        dense
                        outlined
                      />
                    </div>

                    <div class="col-2">
                      <q-input
                        v-model="item.bound_batch.goods_qty"
                        :label="'数量'"
                        :readonly="onlyread"
                        dense
                        outlined
                      />
                    </div>
                    <div class="col-2">
                      <q-input
                        v-model="item.bound_batch.goods_unit"
                        :label="'单位'"
                        :readonly="onlyread"
                        dense
                        outlined
                      />
                    </div>
                    <div class="col" style="max-width: 50px">
                      <q-btn
                        v-if="!onlyread"
                        icon="delete"
                        flat
                        dense
                        color="primary"
                        @click="addbatch(table_detail.id)"
                        style="margin-top: 1px"
                      />
                    </div>
                  </div>
                </template>
              </template>
            </q-card-section>
          </q-card>
        </div>
      </q-card>
    </q-dialog>
  </div>
</template>
<router-view />

<script>
import { getauth, postauth, putauth, deleteauth } from "boot/axios_request";

import { date, exportFile, LocalStorage } from "quasar";
import { QToggle } from "quasar";

export default {
  components: {
    QToggle,
  },
  name: "Pageasnlist",
  data() {
    return {
      createDate1: "",
      createDate2: "",
      date_range: "",
      proxyDate: "",
      date: "",
      goods_code: "",
      goods_desc: "",
      openid: "",
      login_name: "",
      authin: "0",
      warehouse_code: "",
      warehouse_name: "",

      searchUrl: "",
      pathname: "bound/list/",
      pathfilename: "bound/file/",

      pathname_previous: "",
      pathname_next: "",
      separator: "cell",
      loading: false,
      height: "",

      printObj: {
        id: "printMe",
        popTitle: this.$t("inbound.asn"),
      },
      table_list: [],
      table_detail: {},
      batch_detail: [],
      bound_code_type_list: [],
      bound_code_type_map: [],
      bound_bs_type_list: [],
      bound_bs_type_map: [],
      bound_desc_list: [],
      bound_desc_map: [],
      bound_department_list: [],
      bound_department_map: [],
      bound_status_list: [],
      bound_status_map: [],
      product_list: [],
      product_map: [],

      columns: [
        { name: "detail", label: "详情", field: "detail", align: "center" },
        {
          name: "bound_date",
          label: "单据日期",
          field: "bound_date",
          align: "center",
        },
        {
          name: "bound_code",
          label: "单据编号",
          field: "bound_code",
          align: "center",
        },
        {
          name: "bound_code_type",
          label: "单据类型",
          field: "bound_code_type",
          align: "center",
        },
        {
          name: "bound_bs_type",
          label: "业务类型",
          field: "bound_bs_type",
          align: "center",
        },
        {
          name: "bound_desc",
          label: "出入库类别",
          field: "bound_desc",
          align: "center",
        },
        {
          name: "bound_department",
          label: "部门",
          field: "bound_department",
          align: "center",
        },
        { name: "creater", label: "经办人", field: "creater", align: "center" },
        {
          name: "bound_status",
          label: "状态",
          field: "bound_status",
          align: "center",
        },
        { name: "action", label: "操作", align: "center" },
      ],
      filter: "",
      product_filter: "",
      pagination: {
        page: 1,
        rowsPerPage: 11,
      },
      newForm: false,
      newBatchForm: false,
      newFormData: {},
      newBatchFormData: {},
      newDetailFormData: {},
      editid: 0,
      editFormData: {},
      editMode: false,
      deleteForm: false,
      detailForm: false,
      deleteid: 0,
      detailid: 0,
      bar_code: "",
      error1: this.$t("goods.view_goodslist.error1"),

      max: 0,
      total: 0,
      paginationIpt: 1,
      current: 1,
      onlyread: true,
      bound_batch_list: [],

      activeTab: "tab1",
      isorder: false,
      order: "false",
    };
  },
  computed: {
    interval() {
      return (
        this.$t("download_center.start") +
        " - " +
        this.$t("download_center.end")
      );
    },
  },
  methods: {
    getList(params = {}) {
      var _this = this;
      _this.loading = true;
      // 合并基础参数
      const baseParams = {
        page: _this.current,
        base_type: "0",
        page_size: _this.pagination.rowsPerPage,
      };

      // 创建URLSearchParams处理参数
      const queryParams = new URLSearchParams({
        ...baseParams,
        ...params,
      });
      console.log(queryParams);
      // 过滤空值参数
      Array.from(queryParams.entries()).forEach(([key, value]) => {
        if (value === "" || value === null || value === undefined) {
          queryParams.delete(key);
        }
      });

      getauth(`${_this.pathname}?${queryParams}`)
        .then((res) => {
          _this.table_list = res.results;

          _this.total = res.count;
          _this.max = Math.ceil(res.count / _this.pagination.rowsPerPage) || 0;
          _this.pathname_previous = res.previous;
          _this.pathname_next = res.next;
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        })
        .finally(() => {
          _this.loading = false;
        });
    },
    changePageEnter() {
      if (Number(this.paginationIpt) < 1) {
        this.current = 1;
        this.paginationIpt = 1;
      } else if (Number(this.paginationIpt) > this.max) {
        this.current = this.max;
        this.paginationIpt = this.max;
      } else {
        this.current = Number(this.paginationIpt);
      }
      this.getSearchList(this.current);
    },

    getProductSearchList() {
      var _this = this;
      _this.loading = true;
      const params = {
        product_name__icontains: _this.product_filter,
        max_page: 1000,
      };
      const queryParams = new URLSearchParams({
        ...params,
      });
      console.log(queryParams);
      // 过滤空值参数
      Array.from(queryParams.entries()).forEach(([key, value]) => {
        if (value === "" || value === null || value === undefined) {
          queryParams.delete(key);
        }
      });
      console.log(`warehouse/product/?${queryParams}`);
      getauth(`warehouse/product/?${queryParams}`)
        .then((res) => {
          _this.product_list = res.results.map((item) => ({
            label: item.product_name,
            value: item.product_code,
          }));
          _this.product_map = res.results.reduce((acc, item) => {
            acc[item.product_code] = item.product_name;
            return acc;
          }, {});
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        })
        .finally(() => {
          _this.loading = false;
        });
    },

    // 带搜索条件加载
    getSearchList(page = 1) {
      this.current = page;
      this.paginationIpt = page;
      this.getList({
        goods_desc__icontains: this.filter,
        document_date__range: this.date_range,
      });
    },
    downloadlistData() {
      this.getfileList();
    },
    getfileList() {
      var _this = this;
      _this.loading = true;
      const params = {
        goods_desc__icontains: _this.filter,
        document_date__range: _this.date_range,
      };
      const queryParams = new URLSearchParams({
        ...params,
      });
      console.log(queryParams);
      // 过滤空值参数
      Array.from(queryParams.entries()).forEach(([key, value]) => {
        if (value === "" || value === null || value === undefined) {
          queryParams.delete(key);
        }
      });
      console.log(`${_this.pathfilename}?${queryParams}`);
      getauth(`${_this.pathfilename}?${queryParams}`)
        .then((res) => {
          var timeStamp = Date.now();
          var formattedString = date.formatDate(timeStamp, "YYYYMMDDHHmmss");
          const status = exportFile(
            _this.pathfilename + "list" + formattedString + ".csv",
            "\uFEFF" + res,
            "text/csv"
          );
          if (status !== true) {
            _this.$q.notify({
              message: "Browser denied file download...",
              color: "negative",
              icon: "warning",
            });
          }
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        })
        .finally(() => {
          _this.loading = false;
        });
    },

    getListPrevious() {
      var _this = this;
      if (LocalStorage.has("auth")) {
        getauth(_this.pathname_previous, {})
          .then((res) => {
            _this.table_list = res.results;
            _this.pathname_previous = res.previous;
            _this.pathname_next = res.next;
          })
          .catch((err) => {
            _this.$q.notify({
              message: err.detail,
              icon: "close",
              color: "negative",
            });
          });
      } else {
      }
    },
    getListNext() {
      var _this = this;
      if (LocalStorage.has("auth")) {
        getauth(_this.pathname_next, {})
          .then((res) => {
            _this.table_list = res.results;

            _this.pathname_previous = res.previous;
            _this.pathname_next = res.next;
          })
          .catch((err) => {
            _this.$q.notify({
              message: err.detail,
              icon: "close",
              color: "negative",
            });
          });
      }
    },
    reFresh() {
      var _this = this;
      _this.getSearchList();
    },

    newDataSubmit() {
      var _this = this;

      _this.newFormData.bound_type = "in";
      _this.newFormData.openid = _this.openid;

      postauth(_this.pathname, _this.newFormData)
        .then((res) => {
          _this.getSearchList();
          _this.newDataCancel();
          if (res.status_code != 500) {
            _this.$q.notify({
              message: "成功新增数据",
              icon: "check",
              color: "green",
            });
          }
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
    },
    newBatchSubmit() {
      var _this = this;

      _this.newBatchFormData.openid = _this.openid;
      _this.newBatchFormData.warehouse_code = _this.warehouse_code;
      _this.newBatchFormData.warehouse_name = _this.warehouse_name;
      _this.newBatchFormData.order = _this.order;
      console.log("当前的order是", _this.newBatchFormData.order);
      postauth("bound/batch/", _this.newBatchFormData)
        .then((res) => {
          if (res.status_code != 500) {
            _this.newDetailFormData.bound_batch = res.id;
            _this.newDetailFormData.creater = _this.login_name;

            postauth("bound/detail/", _this.newDetailFormData).then(
              (res) => {
                if (res.status_code != 500) {
                  _this.detailData(_this.newDetailFormData);

                  _this.$q.notify({
                    message: "成功新增数据",
                    icon: "check",
                    color: "green",
                  });
                }
              },
              (err) => {
                _this.$q.notify({
                  message: err.detail,
                  icon: "close",
                  color: "negative",
                });
              }
            );
          }
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
    },
    newDataCancel() {
      var _this = this;
      _this.newForm = false;
      _this.newFormData = {
        bound_code_type: "",
        bound_bs_type: "",
        bound_desc: "",
        bound_department: "",
        creater: "",
      };
    },
    addbatch(bound_number) {
      var _this = this;
      _this.newBatchForm = true;
      _this.newDetailFormData = {
        id: bound_number,
        bound_list: bound_number,
      };
    },
    editData(e) {
      var _this = this;
      _this.editMode = true;
      _this.editid = e.id;
      _this.editFormData = {
        bound_date: e.bound_date,
        bound_code: e.bound_code,
        bound_code_type: e.bound_code_type,
        bound_bs_type: e.bound_bs_type,
        bound_desc: e.bound_desc,

        bound_department: e.bound_department,
        creater: _this.login_name,
      };
    },

    change_status(e) {
      var _this = this;

      var status_FormData = {
        bound_date: e.bound_date,
        bound_code: e.bound_code,
        bound_code_type: e.bound_code_type,
        bound_bs_type: e.bound_bs_type,
        bound_desc: e.bound_desc,

        bound_department: e.bound_department,
        creater: _this.login_name,
        bound_type: "in",
        bound_status: "101",
      };

      putauth(_this.pathname + e.id + "/", status_FormData)
        .then((res) => {
          _this.editDataCancel();
          _this.getSearchList();
          if (res.status_code != 500) {
            _this.$q.notify({
              message: "开始入库",
              icon: "check",
              color: "green",
            });
          }
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
    },
    editDataSubmit() {
      var _this = this;
      _this.editFormData.bound_type = "in";

      putauth(_this.pathname + _this.editid + "/", _this.editFormData)
        .then((res) => {
          _this.editDataCancel();
          _this.getSearchList();
          if (res.status_code != 500) {
            _this.$q.notify({
              message: "成功编辑数据",
              icon: "check",
              color: "green",
            });
          }
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
    },
    editDataCancel() {
      var _this = this;
      _this.editMode = false;
      _this.editid = 0;
      _this.editFormData = {
        bound_date: "",
        bound_code: "",
        bound_code_type: "",
        bound_bs_type: "",
        bound_desc: "",

        bound_department: "",
        creater: "",
      };
    },
    deleteData(e) {
      var _this = this;
      _this.deleteForm = true;
      _this.deleteid = e;
    },
    detailData(e) {
      var _this = this;
      _this.detailForm = true;
      _this.detailid = e.id;
      console.log("detail查询的id是:", _this.detailid);
      getauth(_this.pathname + _this.detailid + "/")
        .then((res) => {
          _this.table_detail = res;
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
      console.log("detail查询的结果是:", _this.table_detail);

      getauth("bound/detail/?bound_list=" + _this.detailid)
        .then((res) => {
          _this.batch_detail = res.results;
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
      console.log("batch查询的结果是:", _this.batch_detail);
      console.log("batch长度查询的结果是:", _this.batch_detail.length);
    },
    deleteDataSubmit() {
      var _this = this;
      deleteauth(_this.pathname + _this.deleteid + "/")
        .then((res) => {
          _this.deleteDataCancel();
          _this.getSearchList();
          _this.$q.notify({
            message: "成功删除数据",
            icon: "check",
            color: "green",
          });
        })
        .catch((err) => {
          _this.$q.notify({
            message: err.detail,
            icon: "close",
            color: "negative",
          });
        });
    },
    deleteDataCancel() {
      var _this = this;
      _this.deleteForm = false;
      _this.deleteid = 0;
    },

    updateProxy() {
      var _this = this;
      _this.proxyDate = _this.date;
    },
  },
  created() {
    var _this = this;
    if (LocalStorage.has("openid")) {
      _this.openid = LocalStorage.getItem("openid");
    } else {
      _this.openid = "";
      LocalStorage.set("openid", "");
    }
    if (LocalStorage.has("warehouse_code")) {
      _this.warehouse_code = LocalStorage.getItem("warehouse_code");
    }
    if (LocalStorage.has("warehouse_name")) {
      _this.warehouse_name = LocalStorage.getItem("warehouse_name");
    }
    if (LocalStorage.has("login_name")) {
      _this.login_name = LocalStorage.getItem("login_name");
    } else {
      _this.login_name = "";
      LocalStorage.set("login_name", "");
    }
    if (LocalStorage.has("auth")) {
      const timeStamp = Date.now();
      const formattedString = date.formatDate(timeStamp, "YYYY/MM/DD");
      _this.date = formattedString;
      console.log(_this.date);
      _this.authin = "1";
      _this.getList();
    } else {
      _this.authin = "0";
    }
    getauth("warehouse/boundcodetype/", {})
      .then((res) => {
        _this.bound_code_type_list = res.results.map((item) => ({
          label: item.bound_code_type_name,
          value: item.bound_code_type_code,
        }));
        // 编码 → 名称的映射（普通对象，确保响应式）
        _this.bound_code_type_map = res.results.reduce((acc, item) => {
          acc[item.bound_code_type_code] = item.bound_code_type_name;
          return acc;
        }, {});
      })
      .catch((err) => {
        _this.$q.notify({
          message: err.detail,
          icon: "close",
          color: "negative",
        });
      });

    getauth("warehouse/boundtype/", {})
      .then((res) => {
        _this.bound_desc_list = res.results.map((item) => ({
          label: item.bound_type_name,
          value: item.bound_type_code,
        }));
        // 编码 → 名称的映射（普通对象，确保响应式）
        _this.bound_desc_map = res.results.reduce((acc, item) => {
          acc[item.bound_type_code] = item.bound_type_name;
          return acc;
        }, {});
      })
      .catch((err) => {
        _this.$q.notify({
          message: err.detail,
          icon: "close",
          color: "negative",
        });
      });

    getauth("warehouse/department/?max_page=1000", {})
      .then((res) => {
        _this.bound_department_list = res.results.map((item) => ({
          label: item.department_name,
          value: item.department_code,
        }));
        _this.bound_department_map = res.results.reduce((acc, item) => {
          acc[item.department_code] = item.department_name;
          return acc;
        }, {});
      })
      .catch((err) => {
        _this.$q.notify({
          message: err.detail,
          icon: "close",
          color: "negative",
        });
      });

    getauth("warehouse/boundbusiness/", {})
      .then((res) => {
        _this.bound_bs_type_list = res.results.map((item) => ({
          label: item.bound_bs_name,
          value: item.bound_bs_code,
        }));
        // 编码 → 名称的映射（普通对象，确保响应式）
        _this.bound_bs_type_map = res.results.reduce((acc, item) => {
          acc[item.bound_bs_code] = item.bound_bs_name;
          return acc;
        }, {});
      })
      .catch((err) => {
        _this.$q.notify({
          message: err.detail,
          icon: "close",
          color: "negative",
        });
      });

    getauth("warehouse/status/", {})
      .then((res) => {
        _this.bound_status_list = res.results.map((item) => ({
          label: item.bound_status_name,
          value: item.bound_status_code,
        }));
        _this.bound_status_map = res.results.reduce((acc, item) => {
          acc[item.bound_status_code] = item.bound_status_name;
          return acc;
        }, {});
      })
      .catch((err) => {
        _this.$q.notify({
          message: err.detail,
          icon: "close",
          color: "negative",
        });
      });
  },

  mounted() {
    var _this = this;
    if (_this.$q.platform.is.electron) {
      _this.height = String(_this.$q.screen.height - 290) + "px";
    } else {
      _this.height = _this.$q.screen.height - 290 + "" + "px";
    }
    _this.newFormData.creater = _this.login_name;
  },
  updated() {},
  destroyed() {},

  watch: {
    isorder: function (val) {
      console.log(val);
      if (val) {
        this.order = "true";
      } else {
        this.order = "false";
      }
    },

    createDate1(val) {
      if (val) {
        if (val.to) {
          this.createDate2 = `${val.from} - ${val.to}`;
          this.date_range = `${val.from},${val.to} `;

          // this.downloadhUrl = this.pathname + 'filelist/?' + 'document_date__range=' + this.date_range
        } else {
          this.createDate2 = `${val}`;
          this.dateArray = val.split("/");
          this.searchUrl =
            this.pathname +
            "?" +
            "document_date__year=" +
            this.dateArray[0] +
            "&" +
            "document_date__month=" +
            this.dateArray[1] +
            "&" +
            "document_date__day=" +
            this.dateArray[2];
          // this.downloadhUrl = this.pathname + 'filelist/?' + 'document_date__year=' + this.dateArray[0] + '&' + 'document_date__month=' + this.dateArray[1] + '&' + 'document_date__day=' + this.dateArray[2]
        }
        this.date_range = this.date_range.replace(/\//g, "-");

        this.getSearchList();
        this.$refs.qDateProxy.hide();
      } else {
        this.createDate2 = "";
        this.date_range = "";
        this.getSearchList();
      }
    },
  },
};
</script>
<style scoped>
/* 添加在 <style> 中 */
.q-date__calendar-item--selected {
  transition: all 0.3s ease;
  background-color: #1976d2 !important;
}

.q-date__range {
  background-color: rgba(25, 118, 210, 0.1);
}

:deep(.q-field__label) {
  margin-top: 8px;
  align-self: center;
}

:deep(.q-field__control-container) {
  padding-left: 50px;
  margin-top: -5px;
}
</style>