kz-ui-base 1.0.103 → 1.0.104

package/api/sm/cm/salesContract.js

@@ -98,3 +98,14 @@ export function salesContractAntiAudit(data) {
     data: data
   })
 }
+
+
+export function salesOrderDetails(params) {
+  return request({
+    url: '/sm/salesOrderDetails/selectAllDetailsAndOrderMES',
+    method: 'get',
+   params
+  })
+}
+
+

package/common/src/utils/index.js

@@ -388,3 +388,60 @@ export function isNumberStr(str) {
   return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str)
 }
  
+/**
+ * el-table 手动勾选数据行的 Checkbox 时触发的事件
+ * @param selection
+ * @param row
+ * @param tableRef
+ */
+export function tableHandleSelect(selection, row, tableRef) {
+  if (selection.indexOf(row) >= 0) {
+    tableRef?.setCurrentRow?.(row)
+  }
+}
+
+/**
+ * el-table 明细复选框选中事件
+ * @param val
+ * @param multipleChoice
+ * @param tableRef
+ */
+export function tableOnSelectionChange(val, multipleChoice, tableRef) {
+  if (!multipleChoice && val.length > 1) {
+    tableRef.clearSelection()
+    tableRef.toggleRowSelection(val.pop())
+  }
+}
+
+/**
+ * el-table  行点击事件
+ * @param row
+ * @param multipleChoice
+ * @param tableRef
+ * @param multipleSelection
+ */
+export function tableRowClick(row, multipleChoice, tableRef, multipleSelection) {
+  const findRow = multipleSelection.find((c) => c.rowIndex === row.rowIndex) // 找到选中的行
+  if (findRow) {
+    tableRef?.toggleRowSelection?.(row, false) // 如过重复选中，则取消选中
+    return
+  }
+  // 如果是单选模式
+  if (!multipleChoice && multipleSelection.length > 0) {
+    tableRef?.toggleRowSelection?.(multipleSelection[0], false)
+  }
+  tableRef?.toggleRowSelection?.(row, true) // 实现选中行中选中事件
+}
+
+/**
+ *  给每一行添加不可枚举属性rowIndex来标识当前行
+ * @param row
+ * @param rowIndex
+ */
+export function tableRowStyle({ row, rowIndex }) {
+  Object.defineProperty(row, 'rowIndex', {
+    value: rowIndex,
+    writable: true,
+    enumerable: false
+  })
+}

package/components/sm/SmOrderSelectModal.vue

@@ -0,0 +1,286 @@
+<template>
+  <base-dialog :visible.sync="visible" width="1200px" title="物料选择" append-to-body @on-confirm="handleConfirm"
+               @on-cancel="cancel">
+    <div class="app-container">
+      <el-container class="item-panel default-background">
+        <el-container class="main-info-panel default-background">
+          <el-header class="search-panel white">
+            <el-form ref="queryForm" :model="searchParams" label-width="120px" size="small">
+              <el-row>
+                <el-col :span="6">
+                  <el-form-item label="订单号" prop="salesOrderNo">
+                    <el-input clearable v-model="searchParams.salesOrderNo" placeholder="请输入订单号"></el-input>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+
+              <div style="float: right; margin-top: 6px">
+                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索
+                </el-button>
+                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置
+                </el-button>
+              </div>
+            </el-form>
+          </el-header>
+          <el-main class="table-panel white" style="height: 50px">
+            <el-row style="height: 100%">
+              <el-col :span="24" style="height: 100%">
+                <el-table ref="multipleTable"
+                          height="100%"
+                          :border="true"
+                          v-loading="tableLoading"
+                          :data="listData"
+                          highlight-current-row
+                          @row-click="clickRow"
+                          @selection-change="handleSelectionChange"
+                          @select="handleSelect"
+                          :row-style="rowStyle"
+                          :header-cell-style="{ 'text-align': 'center' }">
+                  <el-table-column type="selection" width="55" align="center">
+                  </el-table-column>
+                  <el-table-column type="index" label="序号" width="50" align="center">
+                    <template scope="scope">
+                      <span>{{
+                          (searchParams.page.current - 1) * searchParams.page.size +
+                          scope.$index +
+                          1
+                        }}</span>
+                    </template>
+                  </el-table-column>
+                  <el-table-column v-for="col in listColumns" :label="col.text" :property="col.property"
+                                   :align="col.align || 'left'" :prop="col.property" v-if="col.visible != false"
+                                   :width="col.width"
+                                   :min-width="col.width || 100" show-overflow-tooltip>
+                    <template slot-scope="scope">
+                      {{
+                        col.dictType
+                          ? getDictLabelByValue(
+                            col.dictType,
+                            scope.row[col.property]
+                          )
+                          : scope.row[col.property]
+                      }}
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </el-col>
+            </el-row>
+
+          </el-main>
+          <el-footer class="white">
+            <pagination :total="searchParams.total" :page.sync="searchParams.page.current"
+                        :limit.sync="searchParams.page.size"
+                        @pagination="getList"/>
+          </el-footer>
+        </el-container>
+      </el-container>
+    </div>
+  </base-dialog>
+</template>
+
+<script lang="ts">
+import {Component, Prop, Vue, Watch} from "vue-property-decorator";
+import {getDictLabelByValue} from "@api/common/common";
+import EntitySelect from "@srcComponents/selector/EntitySelect.vue";
+import {tableHandleSelect, tableOnSelectionChange, tableRowClick, tableRowStyle} from "@utils/index";
+import {salesOrderDetails} from "@srcApi/sm/cm/salesContract";
+
+
+@Component({
+  components: {
+    EntitySelect
+  },
+})
+export default class SmOrderSelectModal extends Vue {
+  @Prop()
+  value;
+  @Prop()
+  searchObj;
+  @Prop({default: false})
+  multipleChoice;
+  //表格是否自动加载数据
+  dialogType = 2;
+  visible = false;
+  listData = [];
+  tableLoading = false;
+  loadingParams = false;
+  // 点击的选中行
+  currentEntity = {};
+  // 勾选框的勾选行
+  currentEntities = [];
+  searchParams = {
+    salesOrderNo: undefined,
+    materialNo: undefined,
+    isFinished: true,
+    documentStatusCode: '3',
+    total: 0,
+    page:{
+      current: 1,
+      size: 20
+    }
+  };
+  listColumns = [
+    {text: "销售订单号", property: "salesOrderNo", width: 150},
+    {text: "行号", property: "lineNo", width: 60, align: "right"},
+    {text: "物料编号", property: "materialNo"},
+    {text: "物料名称", property: "materialName"},
+    {text: "规格型号", property: "materialSpec"},
+    {text: "交付类型", property: "exportFlagLabel"}
+  ];
+
+  handleSelectionChange(val) {
+    this.currentEntities = val;
+    tableOnSelectionChange(val, this.multipleChoice, this.$refs.multipleTable)
+  }
+
+  /** 手动勾选数据行的 Checkbox 时触发的事件*/
+  handleSelect(selection, row) {
+    tableHandleSelect(selection, row, this.$refs.multipleTable)
+  }
+
+  rowStyle({row, rowIndex}) {
+    tableRowStyle({row, rowIndex})
+  }
+
+  getDictLabelByValue(dictType, value) {
+    return getDictLabelByValue(dictType, value);
+  }
+
+  handleQuery() {
+    this.getList();
+  }
+
+  getList() {
+    this.tableLoading = true;
+    if (this.searchObj != null) {
+      for (let prop in this.searchObj) {
+        this.searchParams[prop] = this.searchObj[prop];
+      }
+    }
+    salesOrderDetails(this.searchParams).then((res)=>{
+      this.listData = (res as any).records;
+      this.listData.forEach((item)=>{
+        item.exportFlagLabel = item.exportFlag == '0' ? "国内" : "国外";
+      })
+      this.searchParams.total = (res as any).total;
+    }).finally(()=>{
+      this.tableLoading = false;
+    })
+  }
+
+  handleConfirm() {
+    if (this.multipleChoice) {
+      (this as any).$closeDialog(true, this.currentEntities);
+    } else {
+      let res = this.currentEntities?.[0];
+      //国内外字段关系映射
+      if(res != null && res.exportFlag != null){
+          res.deliveryTypeCode = (res.exportFlag == "1" || res.exportFlag == 1 )? "2" : "1"
+      }
+      (this as any).$closeDialog(true, res);
+    }
+  }
+
+  resetQuery(){
+    this.$set(this.searchParams,'salesOrderNo', null);
+  }
+
+  clickRow(row) {
+    this.$set(this, 'currentEntity', row);
+    // this.$set(this,'currentEntities', [row]);
+    tableRowClick(row, this.multipleChoice, this.$refs.multipleTable, this.currentEntities)
+  }
+
+  cancel() {
+    (this as any).$closeDialog();
+  }
+
+  created() {
+    this.getList();
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  height: 100%;
+  padding: 10px;
+  display: flex;
+  width: 100%;
+}
+
+.search-panel {
+  background-color: white;
+  height: unset !important;
+  padding: 20px 10px 10px;
+}
+
+.tree-panel {
+  width: 15% !important;
+  min-width: 210px;
+  padding: 20px 5px 20px 5px;
+}
+
+.item-panel {
+  height: 100%;
+}
+
+.item-panel > * {
+  margin: 5px;
+}
+
+.white {
+  background-color: #ffffff;
+}
+
+.main-info-panel {
+}
+
+.table-panel {
+  margin: 5px 0 0 0;
+  padding-bottom: 0px;
+}
+
+.default-background {
+  background-color: #f1f2f5;
+}
+
+.tree-scroll {
+  width: 100%;
+  overflow: auto;
+}
+
+.el-container__header {
+  margin-bottom: 10px;
+}
+
+.el-form-item--small.el-form-item {
+  margin-bottom: 12px;
+}
+
+::v-deep .custom-dialog {
+  height: 700px;
+}
+
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+/* 设置滚动条轨道的背景色 */
+::-webkit-scrollbar-track {
+  background-color: #f5f5f5;
+  border-radius: 8px;
+}
+
+/* 设置滚动条滑块的背景色和圆角 */
+::-webkit-scrollbar-thumb {
+  background-color: #c5c5c5;
+  border-radius: 8px;
+}
+
+/* 设置滚动条滑块在hover状态下的背景色 */
+::-webkit-scrollbar-thumb:hover {
+  background-color: #a5a5a5;
+}
+</style>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kz-ui-base",
-  "version": "1.0.103",
+  "version": "1.0.104",
   "description": "",
   "main": "index.js",
   "scripts": {