JNBusiness/ruoyi-ui/src/views/redBook/productSelect.vue

<template>
  <div class="app-container">
    <el-form label-width="80px" :model="form">
      <el-row :gutter="5">
        <el-col :span="10">
          <el-input style="width:30%" size="mini" v-model="queryParams.name_0" placeholder="型号 模糊查询"></el-input>
          <el-input style="width:30%;margin-left: 5px;" size="mini" v-model="queryParams.model" placeholder="规格 模糊查询"></el-input>
          <el-button style="float: right;" size="mini" type="primary" icon="el-icon-search" @click="handleSearchClick">搜索</el-button>
        </el-col>
        <el-col :span="14">
          <el-button style="float: right;margin-left: 5px;" size="mini" type="success" icon="el-icon-document" @click="handleMadeQuotClick" :disabled="selectedResultData.length==0">生成报价单</el-button>
          <el-button style="float: right;" size="mini"  type="warning" icon="el-icon-folder" @click="handleSaveClick" :disabled="selectedResultData.length==0">保存</el-button>
        </el-col>
      </el-row>
      <el-row :gutter="5" class="mt5">
        <el-col :span="10">
          <el-card id="scroll" class="box-card scrollable" :style="{'overflow': 'auto','max-height': scrollableHeight,'height': scrollableHeight}">
            <el-form-item label="目录:">
              <el-link :underline="false" class="block" :type="selectedModelTag==item.name_0?'warning':'primary'" @click="selModelTag(item)" v-for="(item, index) in modelList" :key="index">{{item.name_0}}</el-link>
            </el-form-item>
            <el-form-item label="备注:" v-if="showRemarkList">
              <div class="text-content">
                <div v-if="expandedIndex === id">
                  <el-button type="text" style="float: right" @click="toggleText(-1)">收起</el-button>
                  <div v-for="(item, index) in remarkList" :key="index" style="line-height: 25px">
                    {{index+1}}、{{item.remark_0}}
                  </div>
                </div>
                <div v-else>
                  <el-button type="text" style="float: right" @click="toggleText(id)">更多</el-button>
                  <div class="text-preview">
                    <div v-for="(item, index) in remarkList" :key="index" style="line-height: 25px">
                      {{index+1}}、{{item.remark_0}}
                    </div>
                  </div>
                </div>
              </div>
            </el-form-item>
            <el-form-item label="型号:" v-if="showXinghList">
              <el-link :underline="false" class="block" :type="selectedXinghTag==item.name_0?'warning':'primary'" plain @click="selXinghTag(item)" v-for="(item, index) in xinghList" :key="index">{{item.name_0}}</el-link>
            </el-form-item>
            <el-form-item label="子类:" v-if="showZlList">
              <el-link :underline="false" class="block" size="mini" :type="selectedZlTag==item.name_0?'warning':'primary'" plain @click="selZlTag(item)" v-for="(item, index) in zlList" :key="index">{{item.name_0}}</el-link>
            </el-form-item>
            <el-form-item label="衍生型号:" v-if="showYsxhList">
              <el-link :underline="false" class="block" :type="selectedYsxhTag==item.name_0?'warning':'primary'" plain @click="selYsxhTag(item)" v-for="(item, index) in ysxhList" :key="index">{{item.name_0}}</el-link>
            </el-form-item>
            <el-form-item label="截面:" v-if="showJmList">
              <el-link :underline="false"class="block" :type="selectedJmTag==item.section?'warning':'primary'" plain @click="selJmTag(item)" v-for="(item, index) in jmList" :key="index">{{item.section}}</el-link>
            </el-form-item>

            <el-table width="100%" v-loading="searchResultLoading" ref="searchResultTable" :data="searchResultPagedData" @row-dblclick="handleRowDblclick">
              <el-table-column label="版本uid" align="center" prop="uid_0" v-if="false"/>
              <el-table-column label="产品型号" align="center" prop="name_0" width="180"/>
              <el-table-column label="型号" align="center" prop="model" width="180" v-if="false"/>
              <el-table-column label="规格" align="center" prop="spec" width="180" v-if="false"/>
              <el-table-column label="电压" align="center" prop="voltage"/>
              <el-table-column label="红本价(元)" align="center" prop="price"/>
              <el-table-column label="单位" align="center" prop="stu"/>
            </el-table>
            <pagination
              v-show="searchResultTotal>0"
              :total="searchResultTotal"
              :page.sync="searchResultCurrentPage"
              :limit.sync="searchResultPageSize"
              @size-change="handleSearchResultSizeChange"
              @current-change="handleSearchResultCurrentChange"
              :layout="'total, prev, pager, next'"
            />
          </el-card>
        </el-col>
        <el-col :span="14">
          <el-card id="scroll" class="box-card scrollable" :style="{'overflow': 'auto','max-height': scrollableHeight,'height': scrollableHeight}">
            <el-row :gutter="8">
              <el-col :span="12">
                <el-form-item label="询价单位" prop="quotCustomer">
                  <el-input v-model="form.quotCustomer" placeholder="请输入询价单位" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="项目名称" prop="quotProject">
                  <el-input v-model="form.quotProject" placeholder="请输入项目名称"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="8">
              <el-col :span="8">
                <el-form-item label="联系人" prop="quotLxr">
                  <el-input v-model="form.quotLxr" placeholder="请输入联系人" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="联系电话" prop="quotLxrdh">
                  <el-input v-model="form.quotLxrdh" placeholder="请输入联系电话"/>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="总价">
                  <el-input class="totalPrice-input" v-model="sumSelectedResultData"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="8">
              <el-col :span="24">
                <el-form-item label="总金额" prop="totalPrice" v-if="false">
                  <el-input v-model="form.totalPrice"/>
                </el-form-item>
                <el-form-item label="设置折扣率" label-width="100px">
                  <el-input style="width:65px" v-model="perc" size="small" @blur="changeData"></el-input>
                  <el-input style="width:65px;margin-left: 5px" v-model="perc2" size="small" @blur="changeData"></el-input>
                  <!--总价:<span style="color:red;font-size: 15px">{{sumSelectedResultData}} 元</span>-->
                  <el-select v-model="form.rbDateUid" style="width: 235px;float: right" :disabled="selectedResultData.length==0">
                    <el-option
                      v-for="item in versionList"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                      @click.native="selectRbDate(item.value)"/>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-table v-loading="selectedResultLoading" width="100%;" :height="tableHeight" :row-class-name="selectedResultIndex" style="margin-top:5px" ref="selectedResultTable" :data="selectedResultData">
              <el-table-column fixed="left" label="" align="center" prop="index" width="50"/>
              <el-table-column fixed="left" label="操作" align="center" width="60" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                  <el-button type="text" @click="handleDeleteClick(scope.$index)">删除</el-button>
                </template>
              </el-table-column>
              <el-table-column label="版本uid" align="center" prop="uid_0" v-if="false"/>
              <el-table-column fixed="left" label="产品型号" align="center" prop="name_0" width="180" />
              <el-table-column label="型号" align="center" prop="name_1" width="180" v-if="false"/>
              <el-table-column label="规格" align="center" prop="spec" width="180" v-if="false"/>
              <el-table-column label="电压" align="center" prop="voltage" width="100"/>
              <el-table-column label="红本价(元)" align="center" prop="price" width="120"/>
              <el-table-column label="单位" align="center" prop="stu" width="50"/>
              <el-table-column label="一次折扣" align="center" prop="per" width="80">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.per" @blur="changeRowData"/>
                </template>
              </el-table-column>
              <el-table-column label="二次折扣" align="center" prop="per2" width="80">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.per2" @blur="changeRowData"/>
                </template>
              </el-table-column>
              <el-table-column label="单价" align="center" prop="setPrice" width="120"/>
              <el-table-column label="数量调整" align="center" prop="count" width="100">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.count" @blur="changeRowData"/>
                </template>
              </el-table-column>
              <el-table-column label="总价" align="center" prop="allPrice" width="120"/>
            </el-table>
            <!--<pagination
              v-show="selectedResultTotal>0"
              :total="selectedResultTotal"
              :page.sync="selectedResultCurrentPage"
              :page-sizes="[10,20,30,40]"
              :limit.sync="selectedResultPageSize"
              @size-change="handleSelectedResultSizeChange"
              @current-change="handleSelectedResultCurrentChange"
            />-->
          </el-card>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<style>
  /* 设置间距 */
  .block {
    margin-left: 20px;
    display: inline-block;
  }
  /* 设置行距 */
  .el-form-item--medium .el-form-item__content {
    line-height: 25px;
  }
  /*卡片内容滚动条设置*/
  .scrollable::-webkit-scrollbar {
    display: none; /* 对于Webkit浏览器 */
  }
  /*备注内容设置*/
  .text-content .text-preview {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 控制显示的行数 */
  }

  /*总价输入框设置*/
  .totalPrice-input .el-input__inner {
    color: red;
  }
</style>
<script>
  import {toDecimal, productList,versionList,productRemarkList,productXinghList,judgeparent,productZlList,productYsxhListCheck,productYsxhList,productJmListCheck,productJmList,searchData,handleSearchData,saveQuot, madeQuot,updateSelectedResultData} from "@/api/redBook/redBook";

  export default {
        name: "productSelect",
        data() {
          return {
            //内容高度
            scrollableHeight:null,
            //已选结果表格高度
            tableHeight:null,

            //备注内容设置
            expandedIndex: -1, // 默认没有展开的文本，设置为-1
            id: 1,

            //查询参数
            queryParams: {},

            //选中的目录tag
            selectedModelTag:"",
            selectedModelUid:"",
            //选中的型号tag
            selectedXinghTag:"",
            selectedXinghUid:"",
            //选中的子类tag
            selectedZlTag:"",
            selectedZlUid:"",
            //选中的衍生型号tag
            selectedYsxhTag:"",
            selectedYsxhUid:"",
            //选中的截面tag
            selectedJmTag:"",

            //目录
            modelList: [],
            //备注信息
            showRemarkList: false,
            remarkList: [],
            //型号
            showXinghList: false,
            xinghList: [],
            //子类
            showZlList: false,
            ZlList: [],
            //衍生型号
            showYsxhList: false,
            ysxhList: [],
            //截面
            showJmList: false,
            jmList: [],

            /**==============查询结果========================= */
            // 遮罩层
            searchResultLoading: false,
            // 查询结果数据
            searchResultTotal: 0,
            searchResultCurrentPage: 1,
            searchResultPageSize: 10,
            searchResultData: [],

            /**==============已选择结果========================= */
            selectedResultLoading: false,
            //已选择的数据
            selectedResultTotal: 0,
            selectedResultCurrentPage: 1,
            selectedResultPageSize: 10,
            selectedResultData: [],

            //折扣率 初始值
            perc: 0.8,
            perc2: '',

            //表单
            form: {totalPrice: ''},

            //调价日期
            versionList: [], // 调价版本数据列表
          }
        },
        created() {
          this.productList();
          this.getVersionList();
        },
        mounted(){
          /*设置内容高度*/
          this.scrollableHeight = (window.innerHeight - 160) + 'px';
          /*设置已选择结果表格高度*/
          this.tableHeight = (window.innerHeight - 380) + 'px';
        },
        methods: {
          //备注内容设置 展开 || 收起文本
          toggleText(id) {
            if (this.expandedIndex === id) {
              this.expandedIndex = -1;
            } else {
              this.expandedIndex = id;
            }
          },
          //目录选择
          selModelTag(item) {
            this.showRemarkList = false,
              this.remarkList = [],

              this.selectedXinghTag = '';
            this.showXinghList = false,
              this.xinghList = [],

              this.selectedZlTag = '';
            this.showZlList = false,
              this.ZlList = [],

              this.selectedYsxhTag = '';
            this.showYsxhList = false,
              this.ysxhList = [],

              this.selectedJmTag = '';
            this.showJmList = false,
              this.jmList = [],

              this.searchResultCurrentPage = 1,
              this.searchResultPageSize = 10,
              this.searchResultData = [],

              this.selectedModelTag = item.name_0;
            //显示备注信息
            this.productRemarkList(item.uid_0)
            //显示型号
            this.productXinghList(item.uid_0)
          },
          //获取目录
          productList() {
            productList().then(response => {
              this.modelList = response;
            });
          },
          //获取备注信息
          productRemarkList(sid) {
            this.params = {uid_0: sid}
            productRemarkList(this.params).then(response => {
              this.remarkList = response;
              this.showRemarkList = this.remarkList.length > 0 ? true : false
            });
          },
          //获取型号
          productXinghList(sid) {
            this.params = {uid_0: sid}
            productXinghList(this.params).then(response => {
              this.xinghList = response;
              this.showXinghList = this.xinghList.length > 0 ? true : false
            });
          },
          //型号选择
          selXinghTag(item) {
            this.selectedZlTag = '';
            this.showZlList = false,
            this.ZlList = [],

            this.selectedYsxhTag = '';
            this.showYsxhList = false,
            this.ysxhList = [],

            this.selectedJmTag = '';
            this.showJmList = false,
            this.jmList = [],

            this.searchResultCurrentPage = 1,
            this.searchResultPageSize = 10,
            this.searchResultData = [],

            this.selectedXinghUid = item.uid_0
            this.selectedXinghTag = item.name_0;
            //判断是否为父节点，如果有说明下面还有子类显示，如果没有则直接显示衍生型号
            this.judgeparent(item)
          },
          //判断是否为父节点，如果有说明下面还有子类显示，如果没有则直接显示衍生型号
          judgeparent(item) {
            this.params = {uid_0: item.uid_0}
            judgeparent(this.params).then(response => {
              if (response) {//存在子类
                this.productZlList(item.uid_0)
              } else {//判断是否存在衍生型号
                this.productYsxhListCheck(item.uid_0, item.name_0)
              }
            });
          },
          //获取子类
          productZlList(sid) {
            this.params = {uid_0: sid}
            productZlList(this.params).then(response => {
              this.zlList = response;
              this.showZlList = this.zlList.length > 0 ? true : false
            });
          },
          //判断是否存在衍生型号
          productYsxhListCheck(sid, name) {
            this.params = {uid_0: sid}
            productYsxhListCheck(this.params).then(response => {
              if (response) {//存在衍生型号
                this.productYsxhList(sid, name)
              } else {
                this.selectedYsxhUid = sid;
                this.selectedYsxhTag = name;
                //检查是否存在截面
                this.productJmListCheck(sid, name)
              }
            });
          },
          //获取衍生型号
          productYsxhList(sid, name) {
            this.params = {uid_0: sid, name_0: name}
            productYsxhList(this.params).then(response => {
              this.ysxhList = response;
              this.showYsxhList = this.ysxhList.length > 0 ? true : false
            });
          },

          //子类选择
          selZlTag(item) {
            this.selectedYsxhTag = '';
            this.showYsxhList = false,
            this.ysxhList = [],

            this.selectedJmTag = '';
            this.showJmList = false,
            this.jmList = [],

            this.searchResultCurrentPage = 1,
            this.searchResultPageSize = 10,
            this.searchResultData = [],

            this.selectedZlTag = item.name_0;

            this.productYsxhListCheck(item.uid_0, item.name_0)
          },

          //衍生型号选择
          selYsxhTag(item) {
            this.selectedJmTag = '';
            this.selectedYsxhUid = item.uid_0;
            this.showJmList = false,
            this.jmList = [],

            this.searchResultCurrentPage = 1,
            this.searchResultPageSize = 10,
            this.searchResultData = [],

            this.selectedYsxhTag = item.name_0;
            this.productJmListCheck(item.uid_0, item.name_0)
          },
          //判断是否存在截面
          productJmListCheck(sid, name) {
            this.params = {uid_0: sid}
            productJmListCheck(this.params).then(response => {
              if (response) {//存在截面
                this.productJmList(sid, name)
              } else {
                this.selectedYsxhTag = this.selectedXinghTag;
                this.searchData(this.selectedXinghUid)
              }
            });
          },
          //获取截面
          productJmList(sid, name) {
            this.params = {uid_0: sid, name_0: name}
            productJmList(this.params).then(response => {
              this.jmList = response;
              this.showJmList = this.jmList.length > 0 ? true : false
            });
          },
          //截面选择
          selJmTag(item) {
            this.selectedJmTag = item.section;

            this.searchResultCurrentPage = 1,
              this.searchResultPageSize = 10,
              this.searchResultData = [],

              this.searchResultLoading = true;
            this.searchData(this.selectedYsxhUid, item.section)
          },

          //查询结果数据
          searchData(sid, section) {
            this.params = {uid_0: sid, section: section, name_0: this.selectedYsxhTag}
            searchData(this.params).then(response => {
              this.searchResultData = response;
              this.searchResultTotal = this.searchResultData.length;
              this.searchResultCurrentPage = 1;
              this.searchResultLoading = false;
            });
          },
          //双击查询结果事件
          handleRowDblclick(row, event, column) {
            const uid_0 = row.uid_0;
            const name_0 = row.name_0;
            const model = row.model;
            const spec = row.spec;
            const voltage = row.voltage;
            const price = row.price;
            const stu = row.stu;
            const per = this.perc;
            const per2 = this.perc2;
            const count = '1';
            const setPrice = toDecimal(price * (per?per:1) * (per2?per2:1));
            const allPrice = toDecimal(count * setPrice);

            const rowDate = {
              uid_0: uid_0,
              name_0: name_0,
              name_1: model,
              spec: spec,
              voltage: voltage,
              price: price,
              stu: stu,
              per: per,
              per2: per2,
              setPrice: setPrice,
              count: count,
              allPrice: allPrice
            }

            this.selectedResultData.push(rowDate)

            //自动跳转当前页
            /*this.selectedResultTotal = this.selectedResultData.length;
            const page = Math.ceil(this.selectedResultTotal / this.selectedResultPageSize);
            this.handleSelectedResultCurrentChange(page)*/
            this.$nextTick(() => {
              this.$refs.selectedResultTable.bodyWrapper.scrollTop = this.$refs.selectedResultTable.bodyWrapper.scrollHeight;
            })
          },

          /** 已选结果数据序号 */
          selectedResultIndex({ row, rowIndex }) {
            row.index = rowIndex + 1;
          },

          //删除已选结果数据
          handleDeleteClick(index) {
            this.selectedResultData.splice(index, 1)
            this.selectedResultTotal = this.selectedResultData.length;
          },

          /** 切换每页显示条数--查询结果 */
          handleSearchResultSizeChange(val) {
            this.searchResultPageSize = val;
            this.searchResultCurrentPage = 1;
          },
          /** 页码选择--查询结果 */
          handleSearchResultCurrentChange(val) {
            this.searchResultCurrentPage = val;
          },

          /** 切换每页显示条数--已选择结果 */
          /*handleSelectedResultSizeChange(val) {
            this.selectedResultPageSize = val;
            this.selectedResultCurrentPage = 1;
          },*/
          /** 页码选择--已选择结果 */
          /*handleSelectedResultCurrentChange(val) {
            this.selectedResultCurrentPage = val;
          },*/

          //手动查询产品
          handleSearchClick() {
            if (this.queryParams.name_0 || this.queryParams.model) {
              this.searchResultCurrentPage = 1,
                this.searchResultPageSize = 10,
                this.searchResultData = [],

              this.searchResultLoading = true;
              handleSearchData(this.queryParams).then(response => {
                this.searchResultData = response;
                this.searchResultTotal = this.searchResultData.length;
                this.searchResultCurrentPage = 1;
                this.searchResultLoading = false;
              });
            } else {
              this.$message.warning("请输入查询条件!");
              return;
            }
          },

          //一次折扣率变化时触发
          changeData() {
            // 校验折扣率格式
            const pattern = /^\d+(\.\d+)?$/;
            if(this.perc) {
              if (!pattern.test(this.perc)) {
                this.$message.warning("折扣率格式错误!");
                return;
              }
            }
            if(this.perc2) {
              if (!pattern.test(this.perc2)) {
                this.$message.warning("折扣率格式错误!");
                return;
              }
            }

            // 遍历表格数据进行计算
            this.selectedResultData.forEach((row, index) => {
              // 进行其他计算
              this.$set(this.selectedResultData, index, {
                ...row,
                per: this.perc,
                per2: this.perc2,
                setPrice: toDecimal(row.price * (this.perc?this.perc:1) * (this.perc2?this.perc2:1)),
                allPrice: toDecimal(row.count * row.price * (this.perc?this.perc:1) * (this.perc2?this.perc2:1)),
              });
            })
          },
          // 行内数据监听
          changeRowData() {
            // 遍历表格数据进行计算
            this.selectedResultData.forEach((row, index) => {
              // 进行其他计算
              this.$set(this.selectedResultData, index, {
                ...row,
                setPrice: toDecimal(row.price * (row.per?row.per:1) * (row.per2?row.per2:1)),
                allPrice: toDecimal(row.count * row.price * (row.per?row.per:1) * (row.per2?row.per2:1)),
              });
            })
          },

          // 报价单保存修改
          handleSaveClick() {
            const allPrice = this.selectedResultData.reduce((sum, row) => sum + parseFloat(row.allPrice), 0);
            this.form.totalPrice = allPrice.toFixed(2);
            this.form.selectedResultData = this.selectedResultData;
            saveQuot(this.form).then(response => {
              this.$modal.msgSuccess("保存报价单成功,单号:"+response.data.quotCode);
            })
          },
          // 报价单生成
          handleMadeQuotClick() {
            this.form.selectedResultData = this.selectedResultData;
            madeQuot(this.form).then(response => {
              this.$modal.msgSuccess("生成报价单成功");
              // 处理返回的文件流
              const content = response;
              const blob = new Blob([content]);
              const fileName = "BJD_"+this.getTodayCourse()+".xls";
              if ("download" in document.createElement("a")) {
                // 非IE下载
                const elink = document.createElement("a");
                elink.download = fileName;
                elink.style.display = "none";
                elink.href = URL.createObjectURL(blob);
                document.body.appendChild(elink);
                elink.click();
                URL.revokeObjectURL(elink.href); // 释放URL 对象
                document.body.removeChild(elink);
              }
              else {
                // IE10+下载
                navigator.msSaveBlob(blob, fileName);
              }
            });
          },
          //获取调价日期
          getVersionList(){
            versionList(this.queryParams).then(response => {
              this.versionList = response.versionList;
              this.form.rbDateUid = this.versionList[0].value
            });
          },
          //选择调价日期
          selectRbDate(uid){
            this.selectedResultData.forEach((row, index) => {
              this.$set(this.selectedResultData, index, {
                ...row,
                uid_0: uid // 重新设置为所选版本uid
              });
            });
            this.selectedResultLoading = true;
            //更新已选结果数据-单价、金额
            updateSelectedResultData(this.selectedResultData).then(response => {
              for (let i = 0; i < this.selectedResultData.length; i++) {
                for (let j = 0; j < response.data.length; j++) {
                  // 检查型号、规格、电压等级是否相等
                  if (
                    this.selectedResultData[i].name_0 === response.data[j].name_0 &&
                    this.selectedResultData[i].spec === response.data[j].spec &&
                    this.selectedResultData[i].voltage === response.data[j].voltage
                  ) {
                    this.selectedResultData[i].price = response.data[j].setPrice;
                    const setPrice = toDecimal(this.selectedResultData[i].price * (this.selectedResultData[i].per?this.selectedResultData[i].per:1) * (this.selectedResultData[i].per2?this.selectedResultData[i].per2:1));
                    const allPrice = toDecimal(this.selectedResultData[i].count * this.selectedResultData[i].price * (this.selectedResultData[i].per?this.selectedResultData[i].per:1) * (this.selectedResultData[i].per2?this.selectedResultData[i].per2:1));

                    this.selectedResultData[i].setPrice = setPrice;
                    this.selectedResultData[i].allPrice = allPrice;
                  }
                }
              }
              this.selectedResultLoading = false;
            });
          },

          // 获取当前时间
          getTodayCourse(){
            const myDate = new Date();
            //获取当前年
            const year = myDate.getFullYear();
            //获取当前月
            const month = myDate.getMonth() + 1;
            //获取当前日
            const date = myDate.getDate();
            const h = myDate.getHours();       //获取当前小时数(0-23)
            const m = myDate.getMinutes();     //获取当前分钟数(0-59)
            const s = myDate.getSeconds();
            return year + '-' + this.p(month) + "-" + this.p(date) + " " + this.p(h) + ':' + this.p(m) + ":" + this.p(s)
          },
          p(s) {
            return s < 10 ? '0' + s : s;
          }
        },

        updated(){
          // 监听数据变化时，滚动条保持在底部
          let div = document.getElementById("scroll")
          div.scrollTop = div.scrollHeight
        },
        computed: {
          // 计算出当前页的查询结果数据列表
          searchResultPagedData() {
            const startIndex = (this.searchResultCurrentPage - 1) * this.searchResultPageSize;
            const endIndex = startIndex + this.searchResultPageSize;
            return this.searchResultData.slice(startIndex, endIndex);
          },
          // 计算出当前页的已选择结果数据列表
          /*selectedResultPagedData() {
            console.log(this.selectedResultData)
            const startIndex = (this.selectedResultCurrentPage - 1) * this.selectedResultPageSize;
            const endIndex = startIndex + this.selectedResultPageSize;
            return this.selectedResultData.slice(startIndex, endIndex);
          },*/

          // 已选择结果数据汇总
          sumSelectedResultData() {
            const allPrice = this.selectedResultData.reduce((sum, row) => sum + parseFloat(row.allPrice), 0);
            return allPrice.toFixed(2);
          },
        },
    }
</script>

<style scoped>

</style>