Merge branch 'develop' of http://123.206.9.27:3000/Rz_Ware_Grop/Proj_RZWare_Vue_web into develop

src/views/sto/main/cargo.vue

@@ -0,0 +1,615 @@
+<template>
+  <div>
+    <!-- 查询条件 -->
+    <el-card :body-style="cardBodyStyle">
+      <el-form :model="query" label-width="auto" label-position="right">
+        <el-row :gutter="10">
+          <el-col :span="5">
+            <el-form-item label="上游客户" style="margin-bottom: 0px;">
+              <el-select v-model="query.uperCustomerId" filterable placeholder="请选择上游客户" clearable style="width:100%;" size="small">
+                <el-option v-for="item in optionsCustomer" :key="item.id" :label="item.customerNm" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5">
+            <el-form-item label="客户" style="margin-bottom: 0px;">
+              <el-select v-model="query.customerId" filterable placeholder="请选择客户" clearable style="width:100%;" size="small">
+                <el-option v-for="item in optionsCustomer" :key="item.id" :label="item.customerNm" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="" style="margin-bottom: 0px; margin-top: 5px;">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button type="success" @click="handleAdd">新增</el-button>
+              <el-button type="info" @click="handleReset">重置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+
+    <!-- 数据表格 -->
+    <el-card :body-style="cardBodyStyle">
+      <el-table :data="tableData" border highlight-current-row v-loading="loading">
+        <el-table-column type="index" label="序号" align="center" width="60">
+          <template #default="scope">
+            <span>{{ scope.$index + (currentPage - 1) * pageSize + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="uperCustomerName" label="上游客户" width="180" show-overflow-tooltip />
+        <el-table-column prop="customerName" label="客户" width="180" show-overflow-tooltip />
+        <el-table-column prop="sumWeight" label="可使用量(吨)" width="120" show-overflow-tooltip align="right">
+          <template #default="scope">
+            <span>{{ scope.row.sumWeight ? scope.row.sumWeight.toFixed(3) : '0.000' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="useWeight" label="已使用量(吨)" width="120" show-overflow-tooltip align="right">
+          <template #default="scope">
+            <span>{{ scope.row.useWeight ? scope.row.useWeight.toFixed(3) : '0.000' }}</span>
+          </template>
+        </el-table-column>
+        <!-- 启用状态列 -->
+<!--        <el-table-column prop="enableStatus" label="启用状态" width="100" align="center">
+          <template #default="scope">
+            <el-switch
+                v-model="scope.row.enableStatus"
+                :active-value="'1'"
+                :inactive-value="'0'"
+                @change="handleEnableStatusChange(scope.row)"
+            />
+          </template>
+        </el-table-column>-->
+        <el-table-column label="启用状态操作" width="120" fixed="right">
+          <template #default="scope">
+            <el-button
+                plain
+                :type="scope.row.enableStatus === '1' ? 'danger' : 'success'"
+                size="mini"
+                @click="handleToggleEnableStatus(scope.row)"
+                :loading="enableStatusLoading"
+            >
+              {{ scope.row.enableStatus === '1' ? '禁用' : '启用' }}
+            </el-button>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="120" fixed="right">
+          <template #default="scope">
+            <el-button plain type="warning" size="mini" @click="handleEdit(scope.row)">编辑</el-button>
+          </template>
+        </el-table-column>
+        <el-table-column label="日志记录" width="100" fixed="right">
+          <template #default="scope">
+            <el-button plain type="primary" size="mini" @click="handleLog(scope.row)">查看</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <!-- 分页 -->
+    <el-card :body-style="cardBodyStyle">
+      <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="pageSizes" :total="totalRows"
+                     background layout="total, sizes, prev, pager, next, jumper"
+                     @size-change="handleSizeChange"
+                     @current-change="handleCurrentChange" />
+    </el-card>
+
+    <!-- 新增/编辑对话框 -->
+    <el-dialog :title="form.id ? '货权调整' : '新增货权'" v-model="dialogVisible" width="500px" :close-on-click-modal="false">
+      <el-form :model="form" label-width="120px" label-position="right" :rules="rules" ref="ruleFormRef">
+        <el-form-item label="上游客户" prop="uperCustomerId">
+          <el-select
+              v-model="form.uperCustomerId"
+              filterable
+              placeholder="请选择上游客户"
+              :disabled="!!form.id"
+              style="width: 100%;">
+            <el-option v-for="item in optionsCustomer" :key="item.id" :label="item.customerNm" :value="item.id" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="客户" prop="customerId">
+          <el-select
+              v-model="form.customerId"
+              filterable
+              placeholder="请选择客户"
+              :disabled="!!form.id"
+              style="width: 100%;">
+            <el-option v-for="item in optionsCustomer" :key="item.id" :label="item.customerNm" :value="item.id" />
+          </el-select>
+        </el-form-item>
+        <!-- 编辑时显示启用状态 -->
+        <el-form-item v-if="form.id" label="启用状态">
+          <el-tag :type="form.enableStatus === '1' ? 'success' : 'info'">
+            {{ form.enableStatus === '1' ? '已启用' : '未启用' }}
+          </el-tag>
+        </el-form-item>
+        <el-form-item label="修改内容" prop="subStr">
+          <el-select
+              v-model="form.subStr"
+              placeholder="请选择修改内容"
+              :disabled="isReduceDisabled"
+              style="width: 100%;">
+            <el-option label="增加" value="增加" />
+            <el-option label="减少" value="减少" :disabled="isReduceDisabled" />
+          </el-select>
+          <div v-if="isReduceDisabled" style="color: #f56c6c; font-size: 12px; margin-top: 5px;">
+            当前记录已启用且可使用量为0，不能进行减少操作
+          </div>
+        </el-form-item>
+        <el-form-item label="重量" prop="weight">
+          <el-input v-model="form.weight" type="number" placeholder="请输入重量" style="width: 100%;">
+            <template slot="append">吨</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="单号" prop="ordNo">
+          <el-input v-model="form.ordNo" placeholder="请输入单号" style="width: 100%;" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入备注" style="width: 100%;" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="success" plain @click="handleSave">保存</el-button>
+          <el-button type="danger" plain @click="handleCancelSave">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 日志记录对话框 -->
+    <el-dialog title="转移数量变动日志" v-model="logDialogVisible" width="900px" :close-on-click-modal="false">
+      <!-- 日志查询条件 -->
+      <el-form :model="logQuery" label-width="auto" label-position="right">
+        <el-row :gutter="10">
+          <el-col :span="10">
+            <el-form-item label="修改时间" style="margin-bottom: 0px;">
+              <el-date-picker
+                  v-model="logQuery.dateRange"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  value-format="yyyy-MM-dd"
+                  style="width:100%;"
+                  size="small"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="修改类型" style="margin-bottom: 0px;">
+              <el-select v-model="logQuery.subStr" placeholder="请选择" clearable style="width:100%;" size="small">
+                <el-option label="增加" value="增加" />
+                <el-option label="减少" value="减少" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="修改来源" style="margin-bottom: 0px;">
+              <el-select v-model="logQuery.changeFrom" placeholder="请选择" clearable style="width:100%;" size="small">
+                <el-option label="手动调整" value="手动调整" />
+                <el-option label="货权转移" value="货权转移" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="3">
+            <el-form-item label="" style="margin-bottom: 0px; margin-top: 5px;">
+              <el-button type="primary" @click="handleLogSearch">查询</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <!-- 日志表格 -->
+      <el-table :data="logTableData" border highlight-current-row v-loading="logLoading">
+        <el-table-column type="index" label="序号" align="center" width="60">
+          <template #default="scope">
+            <span>{{ scope.$index + (logCurrentPage - 1) * logPageSize + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="modifyTime" label="修改时间" width="180" show-overflow-tooltip>
+          <template #default="scope">
+            <span>{{ formatDate(scope.row.modifyTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="modifyName" label="修改人员" width="120" show-overflow-tooltip />
+        <el-table-column prop="weight" label="修改重量(吨)" width="120" show-overflow-tooltip align="right">
+          <template #default="scope">
+            <span>{{ scope.row.weight ? scope.row.weight.toFixed(3) : '0.000' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="subStr" label="修改类型" width="100" show-overflow-tooltip />
+        <el-table-column prop="changeFrom" label="修改来源" width="120" show-overflow-tooltip />
+        <el-table-column prop="ordNo" label="单号" width="150" show-overflow-tooltip />
+        <el-table-column prop="remark" label="备注" show-overflow-tooltip />
+      </el-table>
+
+      <!-- 日志分页 -->
+      <div style="margin-top: 15px;">
+        <el-pagination :current-page="logCurrentPage" :page-size="logPageSize" :page-sizes="logPageSizes" :total="logTotalRows"
+                       background layout="total, sizes, prev, pager, next, jumper"
+                       @size-change="handleLogSizeChange"
+                       @current-change="handleLogCurrentChange" />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import axios from '@/axios'
+
+export default {
+  data() {
+    return {
+      cardBodyStyle: { padding: '10px' },
+      // 查询条件
+      query: {
+        uperCustomerId: '',
+        customerId: ''
+      },
+      // 表格数据
+      tableData: [],
+      loading: false,
+      // 对话框控制
+      dialogVisible: false,
+      logDialogVisible: false,
+      // 客户选项
+      optionsCustomer: [],
+      // 表单数据
+      form: {
+        id: '',
+        uperCustomerId: '',
+        customerId: '',
+        subStr: '',
+        weight: '',
+        ordNo: '',
+        remark: '',
+        enableStatus: '0',
+        sumWeight: 0
+      },
+      // 分页相关
+      currentPage: 1,
+      totalRows: 0,
+      pageSizes: [10, 20, 50, 100],
+      pageSize: 10,
+      // 日志查询条件
+      logQuery: {
+        dateRange: [],
+        subStr: '',
+        changeFrom: ''
+      },
+      // 日志表格数据
+      logTableData: [],
+      logLoading: false,
+      // 日志分页相关
+      logCurrentPage: 1,
+      logTotalRows: 0,
+      logPageSizes: [10, 20, 50, 100],
+      logPageSize: 10,
+      // 当前选中的货权记录（用于日志查询）
+      currentCargoRecord: null,
+      // 启用状态修改加载状态
+      enableStatusLoading: false,
+      // 表单验证规则
+      rules: {
+        uperCustomerId: [
+          { required: true, message: '请选择上游客户', trigger: 'change' }
+        ],
+        customerId: [
+          { required: true, message: '请选择客户', trigger: 'change' }
+        ],
+        subStr: [
+          { required: true, message: '请选择修改内容', trigger: 'change' }
+        ],
+        weight: [
+          { required: true, message: '请输入重量', trigger: 'blur' },
+          { validator: this.validateWeight, trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  computed: {
+    // 计算是否禁用减少操作
+    isReduceDisabled() {
+      if (!this.form.id) {
+        // 新增时，减少操作不可用
+        return true
+      }
+      // 编辑时，如果启用状态为1且可使用量为0，则禁用减少操作
+      return this.form.enableStatus === '1' && (this.form.sumWeight === 0 || this.form.sumWeight === null)
+    }
+  },
+  mounted() {
+    this.getTableData()
+    this.getAllCustomer()
+  },
+  methods: {
+    // 重量验证
+    validateWeight(rule, value, callback) {
+      if (!value) {
+        callback(new Error('请输入重量'))
+      } else if (parseFloat(value) <= 0) {
+        callback(new Error('重量必须大于0'))
+      } else {
+        callback()
+      }
+    },
+
+    // 查询
+    handleSearch() {
+      this.currentPage = 1
+      this.getTableData()
+    },
+
+    // 重置查询条件
+    handleReset() {
+      this.query = {
+        uperCustomerId: '',
+        customerId: ''
+      }
+      this.currentPage = 1
+      this.getTableData()
+    },
+
+    // 新增按钮
+    handleAdd() {
+      this.form = {
+        id: '',
+        uperCustomerId: '',
+        customerId: '',
+        subStr: '增加', // 新增时默认为增加
+        weight: '',
+        ordNo: '',
+        remark: '',
+        enableStatus: '0',
+        sumWeight: 0
+      }
+      this.dialogVisible = true
+      // 清除表单验证
+      if (this.$refs.ruleFormRef) {
+        this.$refs.ruleFormRef.clearValidate()
+      }
+    },
+
+    // 编辑按钮
+    handleEdit(row) {
+      this.form = {
+        id: row.id,
+        uperCustomerId: row.uperCustomerId,
+        customerId: row.customerId,
+        subStr: '增加', // 编辑时默认为增加
+        weight: '',
+        ordNo: '',
+        remark: '',
+        enableStatus: row.enableStatus,
+        sumWeight: row.sumWeight
+      }
+      this.dialogVisible = true
+      // 清除表单验证
+      if (this.$refs.ruleFormRef) {
+        this.$refs.ruleFormRef.clearValidate()
+      }
+    },
+
+    // 查看日志
+    handleLog(row) {
+      this.currentCargoRecord = row
+      this.logQuery = {
+        dateRange: [],
+        subStr: '',
+        changeFrom: ''
+      }
+      this.logCurrentPage = 1
+      this.getLogTableData()
+      this.logDialogVisible = true
+    },
+
+    // 日志查询
+    handleLogSearch() {
+      this.logCurrentPage = 1
+      this.getLogTableData()
+    },
+
+    // 保存
+    handleSave() {
+      this.$refs.ruleFormRef.validate((valid) => {
+        if (valid) {
+          // 使用transfer接口进行货权调整
+          const url = 'sto/Cargo/transfer'
+          const param = {
+            json: JSON.stringify(this.form)
+          }
+          axios.post(url, param).then(response => {
+            if (response.data.code == 0) {
+              this.$message({
+                message: '保存成功',
+                type: 'success',
+              })
+              this.dialogVisible = false
+              this.getTableData()
+            } else {
+              this.$message({
+                type: 'error',
+                message: '保存失败：' + response.data.msg
+              })
+            }
+          }).catch(error => {
+            this.$message({
+              type: 'error',
+              message: '请求失败：' + error
+            })
+          })
+        } else {
+          this.$message({
+            type: 'warning',
+            message: '请完善表单信息'
+          })
+          return false
+        }
+      })
+    },
+
+    // 取消保存
+    handleCancelSave() {
+      this.dialogVisible = false
+    },
+
+    // 切换启用状态
+    handleToggleEnableStatus(row) {
+      const newStatus = row.enableStatus === '1' ? '0' : '1'
+      const action = newStatus === '1' ? '启用' : '禁用'
+
+      this.$confirm(`确定要${action}此货权记录吗？`, '提示', {
+        type: 'warning'
+      }).then(() => {
+        this.updateEnableStatus(row.id, newStatus)
+      }).catch(() => {})
+    },
+
+    // 更新启用状态
+    updateEnableStatus(id, enableStatus) {
+      this.enableStatusLoading = true
+      const url = 'sto/Cargo/updateEnableStatus'
+      const param = {
+        id: id,
+        enableStatus: enableStatus
+      }
+
+      axios.post(url, param).then(response => {
+        if (response.data.code == 0) {
+          this.$message({
+            message: '操作成功',
+            type: 'success',
+          })
+          this.getTableData() // 刷新表格数据
+        } else {
+          this.$message({
+            type: 'error',
+            message: '操作失败：' + response.data.msg
+          })
+          // 操作失败，刷新表格以恢复正确的状态
+          this.getTableData()
+        }
+        this.enableStatusLoading = false
+      }).catch(error => {
+        this.enableStatusLoading = false
+        this.$message({
+          type: 'error',
+          message: '请求失败：' + error
+        })
+        // 请求失败，刷新表格以恢复正确的状态
+        this.getTableData()
+      })
+    },
+
+    // 开关状态改变事件
+    handleEnableStatusChange(row) {
+      this.updateEnableStatus(row.id, row.enableStatus)
+    },
+
+    // 分页大小改变
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.getTableData()
+    },
+
+    // 当前页改变
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getTableData()
+    },
+
+    // 日志分页大小改变
+    handleLogSizeChange(val) {
+      this.logPageSize = val
+      this.getLogTableData()
+    },
+
+    // 日志当前页改变
+    handleLogCurrentChange(val) {
+      this.logCurrentPage = val
+      this.getLogTableData()
+    },
+
+    // 格式化日期
+    formatDate(dateString) {
+      if (!dateString) return ''
+      const date = new Date(dateString)
+      return date.toLocaleString()
+    },
+
+    // 获取表格数据
+    getTableData() {
+      this.loading = true
+      const url = 'sto/Cargo/query'
+      const param = {
+        page: this.currentPage,
+        rows: this.pageSize,
+        uperCustomerId: this.query.uperCustomerId,
+        customerId: this.query.customerId
+      }
+      axios.get(url, param).then(response => {
+        if (response.data.code == 0) {
+          this.tableData = response.data.data.records || response.data.data.list
+          this.totalRows = response.data.data.total
+        } else {
+          this.$message.error('操作失败！' + response.data.msg)
+        }
+        this.loading = false
+      }).catch(error => {
+        this.loading = false
+        this.$message.error('请求失败：' + error)
+      })
+    },
+
+    // 获取日志表格数据
+    getLogTableData() {
+      this.logLoading = true
+      const url = 'sto/CargoChangeRecord/query'
+      const param = {
+        page: this.logCurrentPage,
+        rows: this.logPageSize,
+        uperCustomerId: this.currentCargoRecord ? this.currentCargoRecord.uperCustomerId : '',
+        customerId: this.currentCargoRecord ? this.currentCargoRecord.customerId : '',
+        startDate: this.logQuery.dateRange && this.logQuery.dateRange[0] ? this.logQuery.dateRange[0] : '',
+        endDate: this.logQuery.dateRange && this.logQuery.dateRange[1] ? this.logQuery.dateRange[1] : '',
+        subStr: this.logQuery.subStr,
+        changeFrom: this.logQuery.changeFrom
+      }
+      axios.get(url, param).then(response => {
+        if (response.data.code == 0) {
+          this.logTableData = response.data.data.records || response.data.data.list
+          this.logTotalRows = response.data.data.total
+        } else {
+          this.$message.error('操作失败！' + response.data.msg)
+        }
+        this.logLoading = false
+      }).catch(error => {
+        this.logLoading = false
+        this.$message.error('请求失败：' + error)
+      })
+    },
+
+    // 获取所有客户
+    getAllCustomer() {
+      const url = 'sto/Customer/query'
+      const param = {
+        page: 1,
+        rows: 1000
+      }
+      axios.get(url, param).then(response => {
+        if (response.data.code == 0) {
+          this.optionsCustomer = response.data.data.records || response.data.data.list
+        }
+      }).catch(error => {
+        this.$message.error('获取客户列表失败：' + error)
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+::v-deep .el-dialog__body {
+  background-color: #F2F6FC;
+}
+</style>

src/views/sto/main/material.vue

@@ -1,349 +1,343 @@
 <template>
   <div>
     <el-card :body-style="cardBodyStyle">
-      <el-form :inline="true" label-position="right" label-width="100px">
-        <el-form-item label="" class="no-show-error-message">
-          <el-input v-model="queryParams.material" size="small" placeholder="请输入物料名称或编码" style="width:300px;float: left;margin-right: 10px;"></el-input>
-          <el-input v-model="queryParams.standard" size="small" placeholder="请输入钢种" style="width:300px;float: left;margin-right: 10px;"></el-input>
-          <el-button v-prevent-re-click type="primary" plain @click="handleSearch">查询</el-button>
-          <el-button v-prevent-re-click type="primary" @click="handleAdd">新增</el-button>
-        </el-form-item>
+      <el-form :model="query" label-width="auto" label-position="right">
+        <el-row :gutter="10">
+          <el-col :span="5">
+            <el-form-item label="物料名称/编码" style="margin-bottom: 0px;">
+              <el-input v-model="query.material" clearable placeholder="请输入物料名称或编码" style="width:100%;"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5">
+            <el-form-item label="钢种" style="margin-bottom: 0px;">
+              <el-input v-model="query.standard" clearable placeholder="请输入钢种" style="width:100%;"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="" style="margin-bottom: 0px; margin-top: 5px;">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button type="success" @click="insertDialog">新增</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
       </el-form>
     </el-card>
 
     <el-card :body-style="cardBodyStyle">
-      <el-table :data="tableData" border v-loading="loading" style="width: 100%">
-        <el-table-column prop="materialName" label="物料名称" width="150" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialCode" label="物料编码" width="120" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialStandard" label="钢种" width="150" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialModel" label="尺寸" width="120" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialAttr1" label="属性1" width="120" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialAttr2" label="属性2" width="120" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialAttr3" label="属性3" width="120" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialAttr4" label="属性4" width="120" header-align="center" align="center" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="materialAttr5" label="属性5" width="120" header-align="center" align="center" show-overflow-tooltip>
+      <el-table :data="tableData" border highlight-current-row @selection-change="handleSelectionChange" :height="height">
+        <el-table-column type="selection" fixed></el-table-column>
+        <el-table-column type="index" label="序号" align="center" width="60">
+          <template #default="scope">
+            <span>{{ scope.$index + (currentPage - 1) * pageSize + 1 }}</span>
+          </template>
         </el-table-column>
-        <el-table-column label="操作" width="200" header-align="center" align="center" fixed="right">
+        <el-table-column prop="materialName" label="物料名称" width="150" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialCode" label="物料编码" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialStandard" label="钢种" width="150" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialModel" label="尺寸" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialAttr1" label="属性1" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialAttr2" label="属性2" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialAttr3" label="属性3" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialAttr4" label="属性4" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="materialAttr5" label="属性5" width="120" header-align="center" align="center" show-overflow-tooltip></el-table-column>
+        <el-table-column label="操作" header-align="center" align="center" width="200px" fixed="right">
           <template #default="scope">
-            <el-button plain type="warning" size="mini" @click="handleEdit(scope.row)">编辑</el-button>
-            <el-button plain type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>
+            <el-button plain type="warning" @click="handleEdit(scope.row)">编辑</el-button>
+            <el-button plain type="danger" @click="handleRemove(scope.row)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
+    </el-card>
 
-      <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="pagination.currentPage"
-          :page-sizes="pagination.pageSizes"
-          :page-size="pagination.pageSize"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="pagination.totalRows">
+    <el-card :body-style="cardBodyStyle">
+      <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="pageSizes" :total="totalRows"
+                     background layout="total, sizes, prev, pager, next, jumper"
+                     @size-change="handleSizeChange"
+                     @current-change="handleCurrentChange">
       </el-pagination>
     </el-card>
 
     <!-- 新增/编辑对话框 -->
-    <el-dialog
-        :close-on-click-modal="false"
-        :title="form.id ? '编辑物料' : '新增物料'"
-        v-model="dialogVisible"
-        width="600px">
-      <el-form :model="form" label-width="100px" :rules="rules" ref="formRef">
-        <el-form-item label="物料名称" prop="materialName">
-          <el-input v-model="form.materialName" style="width: 400px;" placeholder="请输入物料名称"></el-input>
-        </el-form-item>
-        <el-form-item label="物料编码" prop="materialCode">
-          <el-input v-model="form.materialCode" style="width: 400px;" placeholder="请输入物料编码"></el-input>
-        </el-form-item>
-        <el-form-item label="钢种" prop="materialStandard">
-          <el-input v-model="form.materialStandard" style="width: 400px;" placeholder="请输入钢种"></el-input>
-        </el-form-item>
-        <el-form-item label="尺寸">
-          <el-input v-model="form.materialModel" style="width: 400px;" placeholder="请输入尺寸"></el-input>
-        </el-form-item>
-        <el-form-item label="属性1">
-          <el-input v-model="form.materialAttr1" style="width: 400px;" placeholder="请输入属性1"></el-input>
-        </el-form-item>
-        <el-form-item label="属性2">
-          <el-input v-model="form.materialAttr2" style="width: 400px;" placeholder="请输入属性2"></el-input>
-        </el-form-item>
-        <el-form-item label="属性3">
-          <el-input v-model="form.materialAttr3" style="width: 400px;" placeholder="请输入属性3"></el-input>
-        </el-form-item>
-        <el-form-item label="属性4">
-          <el-input v-model="form.materialAttr4" style="width: 400px;" placeholder="请输入属性4"></el-input>
-        </el-form-item>
-        <el-form-item label="属性5">
-          <el-input v-model="form.materialAttr5" style="width: 400px;" placeholder="请输入属性5"></el-input>
-        </el-form-item>
-      </el-form>
+    <el-dialog class="diaClass" :close-on-click-modal="false" draggable :title="dialogTitle" v-model="dialogVisible" width="50%" top="5vh">
+      <el-card>
+        <el-form :model="form" label-width="120px" label-position="right" inline ref="ruleFormRef" :rules="rules">
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="物料名称" prop="materialName">
+                <el-input v-model="form.materialName" maxlength="100" placeholder="请输入物料名称"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="物料编码" prop="materialCode">
+                <el-input v-model="form.materialCode" maxlength="100" placeholder="请输入物料编码"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="钢种" prop="materialStandard">
+                <el-input v-model="form.materialStandard" maxlength="50" placeholder="请输入钢种"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="尺寸">
+                <el-input v-model="form.materialModel" maxlength="50" placeholder="请输入尺寸"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="属性1">
+                <el-input v-model="form.materialAttr1" maxlength="50" placeholder="请输入属性1"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="属性2">
+                <el-input v-model="form.materialAttr2" maxlength="50" placeholder="请输入属性2"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="属性3">
+                <el-input v-model="form.materialAttr3" maxlength="50" placeholder="请输入属性3"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="属性4">
+                <el-input v-model="form.materialAttr4" maxlength="50" placeholder="请输入属性4"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="属性5">
+                <el-input v-model="form.materialAttr5" maxlength="50" placeholder="请输入属性5"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </el-card>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="success" @click="handleSave">保存</el-button>
-          <el-button type="danger" @click="handleCancelSave">取消</el-button>
+          <el-button type="success" plain @click="handleSave(ruleFormRef)">保存</el-button>
+          <el-button type="danger" plain @click="handleCancelSave">取消</el-button>
         </div>
       </template>
     </el-dialog>
   </div>
 </template>
 
-<script>
-import axios from '@/axios'
-export default {
-  name: 'MaterialManagement',
-  data() {
-    return {
-      // 表格数据
-      tableData: [],
-      loading: false,
-
-      // 分页参数
-      pagination: {
-        currentPage: 1,
-        totalRows: 0,
-        pageSizes: [50, 100, 200, 500],
-        pageSize: 50
-      },
+<script setup>
+import {getCurrentInstance, onMounted, reactive, ref} from 'vue'
+import tools from '@/tools'
+import { ElMessage, ElMessageBox } from 'element-plus'
 
-      // 查询条件
-      queryParams: {
-        material: '',
-        standard: ''
-      },
+const {
+  proxy
+} = getCurrentInstance()
 
-      // 对话框控制
-      dialogVisible: false,
+const cardBodyStyle = ref(tools.style.card)
+const inputStyle = ref(tools.style.input)
 
-      // 表单数据
-      form: {
-        id: '',
-        materialName: '',
-        materialCode: '',
-        materialStandard: '',
-        materialModel: '',
-        materialAttr1: '',
-        materialAttr2: '',
-        materialAttr3: '',
-        materialAttr4: '',
-        materialAttr5: ''
-      },
+/**
+ * 查询相关
+ */
+const query = ref({
+  material: '',
+  standard: ''
+})
 
-      // 表单验证规则
-      rules: {
-        materialName: [
-          { required: true, message: '物料名称不能为空', trigger: 'blur' }
-        ],
-        materialCode: [
-          { required: true, message: '物料编码不能为空', trigger: 'blur' }
-        ],
-        materialStandard: [
-          { required: true, message: '钢种不能为空', trigger: 'blur' }
-        ]
-      },
+const form = ref({
+  id: '',
+  materialName: '',
+  materialCode: '',
+  materialStandard: '',
+  materialModel: '',
+  materialAttr1: '',
+  materialAttr2: '',
+  materialAttr3: '',
+  materialAttr4: '',
+  materialAttr5: ''
+})
 
-      // 样式
-      cardBodyStyle: {
-        padding: '10px'
-      }
-    }
-  },
+const tableData = ref([])
 
-  // 界面渲染完毕调用 - 初始化表格数据
-  mounted() {
-    this.getTableData()
-  },
-
-  methods: {
-    /**
-     * 获取表格数据
-     */
-    getTableData() {
-      this.loading = true
-      const url = 'sto/Material/query'
-      const params = {
-        page: this.pagination.currentPage,
-        rows: this.pagination.pageSize,
-        material: this.queryParams.material,
-        standard: this.queryParams.standard
-      }
-
-      axios.get(url, { params })
-          .then(response => {
-            this.loading = false
-            if (response.data.code === '0') {
-              this.tableData = response.data.data.records
-              this.pagination.totalRows = response.data.data.total
-            } else {
-              this.$message.error('查询失败！' + response.data.msg)
-            }
-          })
-          .catch(error => {
-            this.loading = false
-            this.$message.error('查询失败！' + error.message)
-          })
-    },
+/**
+ * 分页相关
+ */
+const currentPage = ref(1)
+const totalRows = ref(0)
+const pageSizes = ref([10, 20, 30, 40])
+const pageSize = ref(10)
 
-    /**
-     * 修改每页条数
-     */
-    handleSizeChange(val) {
-      this.pagination.pageSize = val
-      this.pagination.currentPage = 1
-      this.getTableData()
-    },
+/**
+ * 对话框相关
+ */
+const dialogVisible = ref(false)
+const dialogTitle = ref('新增物料')
+const ruleFormRef = ref()
 
-    /**
-     * 修改当前页
-     */
-    handleCurrentChange(val) {
-      this.pagination.currentPage = val
-      this.getTableData()
-    },
+const rules = reactive({
+  materialName: [
+    {required: true, message: '物料名称不能为空', trigger: 'blur'},
+  ],
+  materialCode: [
+    {required: true, message: '物料编码不能为空', trigger: 'blur'},
+  ],
+  materialStandard: [
+    {required: true, message: '钢种不能为空', trigger: 'blur'},
+  ]
+})
 
-    /**
-     * 查询
-     */
-    handleSearch() {
-      this.pagination.currentPage = 1
-      this.getTableData()
-    },
+/**
+ * 方法定义
+ */
+const handleSearch = () => {
+  currentPage.value = 1
+  getTableData()
+}
 
-    /**
-     * 新增
-     */
-    handleAdd() {
-      this.dialogVisible = true
-      this.resetForm()
-    },
+const handleSizeChange = (val) => {
+  pageSize.value = val
+  getTableData()
+}
 
-    /**
-     * 编辑
-     */
-    handleEdit(row) {
-      this.dialogVisible = true
-      this.$nextTick(() => {
-        this.form = { ...row }
-      })
-    },
+const handleCurrentChange = (val) => {
+  currentPage.value = val
+  getTableData()
+}
 
-    /**
-     * 保存（新增和编辑）
-     */
-    handleSave() {
-      this.$refs.formRef.validate((valid) => {
-        if (!valid) {
-          this.$message.warning('请完善表单信息')
-          return
-        }
+const insertDialog = () => {
+  form.value = {
+    id: '',
+    materialName: '',
+    materialCode: '',
+    materialStandard: '',
+    materialModel: '',
+    materialAttr1: '',
+    materialAttr2: '',
+    materialAttr3: '',
+    materialAttr4: '',
+    materialAttr5: ''
+  }
+  dialogTitle.value = '新增物料'
+  dialogVisible.value = true
+}
 
-        const url = 'sto/Material/save'
-        const params = {
-          json: JSON.stringify(this.form)
+const handleSave = (ruleFormRef) => {
+  if (!ruleFormRef) return
+  ruleFormRef.validate((valid) => {
+    if (valid) {
+      const url = 'sto/Material/save'
+      const param = {
+        json: JSON.stringify(form.value)
+      }
+      proxy.$axios.post(url, param).then(response => {
+        if (response.data.code == 0) {
+          ElMessage({
+            message: '保存成功',
+            type: 'success',
+          })
+          dialogVisible.value = false
+          handleSearch()
+        } else {
+          ElMessage({
+            type: 'error',
+            message: '操作失败: ' + response.data.msg
+          })
         }
-
-        axios.post(url, params)
-            .then(response => {
-              if (response.data.code === '0') {
-                this.$message.success(this.form.id ? '更新成功' : '新增成功')
-                this.dialogVisible = false
-                this.getTableData()
-              } else {
-                this.$message.error('操作失败！' + response.data.msg)
-              }
-            })
-            .catch(error => {
-              this.$message.error('操作失败！' + error.message)
-            })
       })
-    },
+    }
+  })
+}
 
-    /**
-     * 取消保存
-     */
-    handleCancelSave() {
-      this.dialogVisible = false
-      this.resetForm()
-    },
+const handleCancelSave = () => {
+  dialogVisible.value = false
+}
 
-    /**
-     * 删除
-     */
-    handleDelete(row) {
-      this.$confirm(
-          `确定删除物料 "${row.materialName}" 吗？`,
-          '提示',
-          {
-            confirmButtonText: '确认',
-            cancelButtonText: '取消',
-            type: 'warning',
-            draggable: true,
-          }
-      )
-          .then(() => {
-            const url = 'sto/Material/remove'
-            const params = {
-              id: row.id,
-            }
+const handleEdit = (row) => {
+  const url = 'sto/Material/queryByPK'
+  const param = {
+    id: row.id
+  }
+  proxy.$axios.get(url, param).then(response => {
+    if (response.data.code == '0') {
+      form.value = response.data.data
+      dialogTitle.value = '编辑物料'
+      dialogVisible.value = true
+    } else {
+      ElMessage.error('操作失败！' + response.data.msg)
+    }
+  })
+}
 
-            axios.post(url, params)
-                .then(response => {
-                  if (response.data.code === '0') {
-                    this.$message.success('删除成功!')
-                    this.getTableData()
-                  } else {
-                    this.$message.error('删除失败！' + response.data.msg)
-                  }
-                })
-                .catch(error => {
-                  this.$message.error('删除失败！' + error.message)
-                })
-          })
-          .catch(() => {
-            this.$message.info('已取消删除')
-          })
-    },
+const handleRemove = (row) => {
+  ElMessageBox.confirm(
+      `确定删除物料 "${row.materialName}" 吗？`,
+      '提示', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+        draggable: true,
+      }
+  ).then(() => {
+    const url = 'sto/Material/remove'
+    const param = {
+      id: row.id
+    }
+    proxy.$axios.get(url, param).then(response => {
+      if (response.data.code == '0') {
+        ElMessage({
+          type: 'success',
+          message: '删除成功！',
+        })
+        getTableData()
+      } else {
+        ElMessage.error('操作失败！' + response.data.msg)
+      }
+    })
+  }).catch(() => {
+    ElMessage({
+      type: 'info',
+      message: '已取消',
+    })
+  })
+}
 
+const handleSelectionChange = (val) => {
+  multipleSelection.value = val
+}
 
-    /**
-     * 重置表单
-     */
-    resetForm() {
-      this.$nextTick(() => {
-        if (this.$refs.formRef) {
-          this.$refs.formRef.resetFields()
-        }
-        this.form = {
-          id: '',
-          materialName: '',
-          materialCode: '',
-          materialStandard: '',
-          materialModel: '',
-          materialAttr1: '',
-          materialAttr2: '',
-          materialAttr3: '',
-          materialAttr4: '',
-          materialAttr5: ''
-        }
-      })
-    }
+const getTableData = () => {
+  const url = 'sto/Material/query'
+  const param = {
+    page: currentPage.value,
+    rows: pageSize.value,
+    material: query.value.material,
+    standard: query.value.standard
   }
+  proxy.$axios.get(url, param).then(response => {
+    if (response.data.code == '0') {
+      tableData.value = response.data.data.records
+      totalRows.value = response.data.data.total
+    } else {
+      ElMessage.error('操作失败！' + response.data.msg)
+    }
+  })
+}
+
+const height = ref(600)
+const updateViewportHeight = () => {
+  height.value = window.innerHeight * 0.65
 }
+
+const multipleSelection = ref([])
+
+onMounted(() => {
+  getTableData()
+  updateViewportHeight()
+  window.addEventListener('resize', updateViewportHeight)
+})
 </script>
 
 <style scoped>
-.no-show-error-message {
-  margin-bottom: 0;
+::v-deep .diaClass .el-form-item {
+  width: 100%
 }
-
-.dialog-footer {
-  text-align: center;
+::v-deep .el-dialog__body {
+  background-color: #F2F6FC;
 }
 </style>

src/views/sto/main/price.vue

@@ -0,0 +1,352 @@
+<template>
+  <div>
+    <el-card :body-style="cardBodyStyle">
+      <el-form :model="query" label-width="auto" label-position="right">
+        <el-row :gutter="10">
+          <el-col :span="5">
+            <el-form-item label="客户名称" style="margin-bottom: 0px;">
+              <el-select v-model="query.customerName" filterable placeholder="请选择客户" clearable style="width:100%;" size="small">
+                <el-option v-for="item in optionsCust" :key="item.id" :label="item.customerNm" :value="item.customerNm" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="" style="margin-bottom: 0px; margin-top: 5px;">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button type="success" @click="handleAdd">新增</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+
+    <el-card :body-style="cardBodyStyle">
+      <el-table :data="tableData" border highlight-current-row v-loading="loading">
+        <el-table-column type="index" label="序号" align="center" width="60">
+          <template #default="scope">
+            <span>{{ scope.$index + (currentPage - 1) * pageSize + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="customer.customerNm" label="客户名称" width="180" show-overflow-tooltip />
+        <el-table-column prop="materialName" label="品名简称" width="180" show-overflow-tooltip />
+        <el-table-column prop="keepDay" label="免堆时间（天）" width="150" show-overflow-tooltip />
+        <el-table-column prop="ordPrice" label="免堆期价格（元/吨）" width="150" show-overflow-tooltip align="right">
+          <template #default="scope">
+            <span>{{ scope.row.ordPrice ? scope.row.ordPrice.toFixed(2) : '0.00' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="outOrdPrice" label="超期价格（元/天/吨）" width="150" show-overflow-tooltip align="right">
+          <template #default="scope">
+            <span>{{ scope.row.outOrdPrice ? scope.row.outOrdPrice.toFixed(2) : '0.00' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="payWay" label="支付方式" width="120" show-overflow-tooltip />
+        <el-table-column prop="addName" label="添加人" width="120" show-overflow-tooltip />
+        <el-table-column prop="addTime" label="添加时间" width="180" show-overflow-tooltip>
+          <template #default="scope">
+            <span>{{ formatDate(scope.row.addTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="200" fixed="right">
+          <template #default="scope">
+            <el-button plain type="warning" size="mini" @click="handleEdit(scope.row)">编辑</el-button>
+            <el-button plain type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <el-card :body-style="cardBodyStyle">
+      <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="pageSizes" :total="totalRows"
+                     background layout="total, sizes, prev, pager, next, jumper"
+                     @size-change="handleSizeChange"
+                     @current-change="handleCurrentChange" />
+    </el-card>
+
+    <!-- 新增/编辑对话框 -->
+    <el-dialog :title="dialogTitle" v-model="dialogVisible" width="500px" :close-on-click-modal="false">
+      <el-form :model="form" label-width="120px" label-position="right" :rules="rules" ref="ruleFormRef">
+        <el-form-item label="客户名称" prop="customerId">
+          <el-select v-model="form.customerId" filterable placeholder="请选择客户" clearable style="width: 100%;">
+            <el-option v-for="item in optionsCust" :key="item.id" :label="item.customerNm" :value="item.id" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="品名" prop="materialName">
+          <el-input v-model="form.materialName" placeholder="请输入品名" style="width: 100%;" />
+        </el-form-item>
+        <el-form-item label="免堆时间" prop="keepDay">
+          <el-input v-model="form.keepDay" type="number" placeholder="请输入免堆时间" style="width: 100%;">
+            <template slot="append">天</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="免堆期单价" prop="ordPrice">
+          <el-input v-model="form.ordPrice" type="number" placeholder="请输入免堆期单价" style="width: 100%;">
+            <template slot="append">元/吨</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="超期单价" prop="outOrdPrice">
+          <el-input v-model="form.outOrdPrice" type="number" placeholder="请输入超期单价" style="width: 100%;">
+            <template slot="append">元/天/吨</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="支付方式" prop="payWay">
+          <el-radio-group v-model="form.payWay">
+            <el-radio label="月结">月结</el-radio>
+            <el-radio label="现金">现金</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="success" plain @click="handleSave">保存</el-button>
+          <el-button type="danger" plain @click="handleCancelSave">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import axios from '@/axios'
+
+export default {
+  data() {
+    return {
+      cardBodyStyle: { padding: '10px' },
+      // 查询条件
+      query: {
+        customerName: '',
+      },
+      // 表格数据
+      tableData: [],
+      loading: false,
+      // 对话框控制
+      dialogVisible: false,
+      dialogTitle: '新增价格',
+      // 客户选项
+      optionsCust: [],
+      // 表单数据
+      form: {
+        id: '',
+        customerId: '',
+        materialName: '',
+        keepDay: '',
+        ordPrice: '',
+        outOrdPrice: '',
+        payWay: '月结'
+      },
+      // 分页相关
+      currentPage: 1,
+      totalRows: 0,
+      pageSizes: [10, 20, 50, 100],
+      pageSize: 10,
+      // 表单验证规则
+      rules: {
+        customerId: [
+          { required: true, message: '请选择客户', trigger: 'change' }
+        ],
+        materialName: [
+          { required: true, message: '请输入品名', trigger: 'blur' }
+        ],
+        keepDay: [
+          { required: true, message: '请输入免堆时间', trigger: 'blur' }
+        ],
+        ordPrice: [
+          { required: true, message: '请输入免堆期单价', trigger: 'blur' }
+        ],
+        outOrdPrice: [
+          { required: true, message: '请输入超期单价', trigger: 'blur' }
+        ],
+        payWay: [
+          { required: true, message: '请选择支付方式', trigger: 'change' }
+        ]
+      }
+    }
+  },
+  mounted() {
+    this.getTableData()
+    this.getAllCustomer()
+  },
+  methods: {
+    // 查询
+    handleSearch() {
+      this.currentPage = 1
+      this.getTableData()
+    },
+
+    // 新增按钮
+    handleAdd() {
+      this.dialogTitle = '新增价格'
+      this.form = {
+        id: '',
+        customerId: '',
+        materialName: '',
+        keepDay: '',
+        ordPrice: '',
+        outOrdPrice: '',
+        payWay: '月结'
+      }
+      this.dialogVisible = true
+      // 清除表单验证
+      if (this.$refs.ruleFormRef) {
+        this.$refs.ruleFormRef.clearValidate()
+      }
+    },
+
+    // 编辑按钮
+    handleEdit(row) {
+      this.dialogTitle = '编辑价格'
+      this.form = {
+        id: row.id,
+        customerId: row.customerId,
+        materialName: row.materialName,
+        keepDay: row.keepDay,
+        ordPrice: row.ordPrice,
+        outOrdPrice: row.outOrdPrice,
+        payWay: row.payWay || '月结'
+      }
+      this.dialogVisible = true
+      // 清除表单验证
+      if (this.$refs.ruleFormRef) {
+        this.$refs.ruleFormRef.clearValidate()
+      }
+    },
+
+    // 保存
+    handleSave() {
+      this.$refs.ruleFormRef.validate((valid) => {
+        if (valid) {
+          const url = 'sto/Price/save'
+          const param = {
+            json: JSON.stringify(this.form)
+          }
+          axios.post(url, param).then(response => {
+            if (response.data.code == 0) {
+              this.$message({
+                message: '保存成功',
+                type: 'success',
+              })
+              this.dialogVisible = false
+              this.getTableData()
+            } else {
+              this.$message({
+                type: 'error',
+                message: '保存失败：' + response.data.msg
+              })
+            }
+          }).catch(error => {
+            this.$message({
+              type: 'error',
+              message: '请求失败：' + error
+            })
+          })
+        } else {
+          this.$message({
+            type: 'warning',
+            message: '请完善表单信息'
+          })
+          return false
+        }
+      })
+    },
+
+    // 取消保存
+    handleCancelSave() {
+      this.dialogVisible = false
+    },
+
+    // 删除
+    handleDelete(row) {
+      this.$confirm('确定删除本条记录?', '提示', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+        draggable: true,
+      }).then(() => {
+        const url = 'sto/Price/remove'
+        const param = { id: row.id }
+        axios.post(url, param).then(response => {
+          if (response.data.code == 0) {
+            this.$message({
+              type: 'success',
+              message: '删除成功！',
+            })
+            this.getTableData()
+          } else {
+            this.$message.error('操作失败！' + response.data.msg)
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消',
+        })
+      })
+    },
+
+    // 分页大小改变
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.getTableData()
+    },
+
+    // 当前页改变
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.getTableData()
+    },
+
+    // 格式化日期
+    formatDate(dateString) {
+      if (!dateString) return ''
+      const date = new Date(dateString)
+      return date.toLocaleString()
+    },
+
+    // 获取表格数据
+    getTableData() {
+      this.loading = true
+      const url = 'sto/Price/query'
+      const param = {
+        page: this.currentPage,
+        rows: this.pageSize,
+        customerName: this.query.customerName
+      }
+      axios.get(url, param).then(response => {
+        if (response.data.code == 0) {
+          this.tableData = response.data.data.records || response.data.data.list
+          this.totalRows = response.data.data.total
+        } else {
+          this.$message.error('操作失败！' + response.data.msg)
+        }
+        this.loading = false
+      }).catch(error => {
+        this.loading = false
+        this.$message.error('请求失败：' + error)
+      })
+    },
+
+    // 获取所有客户
+    getAllCustomer() {
+      const url = 'sto/Customer/query'
+      const param = {
+        page: 1,
+        rows: 1000
+      }
+      axios.get(url, param).then(response => {
+        if (response.data.code == 0) {
+          this.optionsCust = response.data.data.records || response.data.data.list
+        }
+      }).catch(error => {
+        this.$message.error('获取客户列表失败：' + error)
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+::v-deep .el-dialog__body {
+  background-color: #F2F6FC;
+}
+</style>

src/views/sto/main/ware.vue

@@ -0,0 +1,495 @@
+<template>
+  <div>
+    <el-card :body-style="cardBodyStyle">
+      <el-form :model="query" label-width="auto" label-position="right">
+        <el-row :gutter="10">
+          <el-col :span="5">
+            <el-form-item label="库房名称" style="margin-bottom: 0px;" >
+              <el-input v-model="query.wareNm" clearable placeholder="请输入库房名称" style="width:100%;"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="" style="margin-bottom: 0px; margin-top: 5px;">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button type="success" @click="insertDialog">新增</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+    <ButtonBox @search="handleSearch" @add="insertDialog"></ButtonBox>
+    <el-card :body-style="cardBodyStyle">
+      <el-table :data="tableData" border highlight-current-row   @selection-change="handleSelectionChange" :height="height"  >
+        <el-table-column type="selection" fixed></el-table-column>
+        <el-table-column type="index" label="序号" align="center" width="60">
+          <template #default="scope">
+            <span>{{ scope.$index + (currentPage - 1) * pageSize + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column v-if="true" prop="wareNm" label="库房名称" width="150" header-align="center"
+                         align="center" show-overflow-tooltip>
+        </el-table-column>
+        <el-table-column v-if="true" prop="wareCode" label="库房编码" width="150" header-align="center"
+                         align="center" show-overflow-tooltip>
+        </el-table-column>
+        <el-table-column v-if="true" prop="wareLength" label="库房长度" width="150" header-align="center"
+                         align="center" show-overflow-tooltip>
+        </el-table-column>
+        <el-table-column v-if="true" prop="wareWidth" label="库房宽度" width="150" header-align="center"
+                         align="center" show-overflow-tooltip>
+        </el-table-column>
+        <el-table-column label="操作" header-align="center" align="center" width="200px" fixed="right">
+          <template #default="scope">
+            <el-button plain type="warning" @click="handleEdit(scope.row)">编辑</el-button>
+            <el-button plain type="danger" @click="handleRemove(scope.row )">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card :body-style="cardBodyStyle">
+      <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="pageSizes" :total="totalRows"
+                     background="background" layout="total, sizes, prev, pager, next, jumper"
+                     @size-change="handleSizeChange"
+                     @current-change="handleCurrentChange">
+      </el-pagination>
+    </el-card>
+
+    <el-dialog class="diaClass"  :close-on-click-modal="false" draggable title="新增" v-model="dialogVisible" width="40%" top="5vh"
+               @open="openDialog">
+      <el-card  >
+      <el-form :model="form" label-width="120px" label-position="right" inline ref="ruleFormRef" :rules="rules">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="库房名称" prop="wareNm">
+              <el-input v-model="form.wareNm" maxlength="100" placeholder="请输入库房名称"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="库房编码" prop="wareCode">
+              <el-input v-model="form.wareCode" maxlength="100"  placeholder="请输入库房编码"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="库房长度" prop="wareLength">
+              <el-input v-model="form.wareLength"  maxlength="50" placeholder="请输入库房长度"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="库房宽度" prop="wareWidth">
+              <el-input v-model="form.wareWidth" maxlength="50" placeholder="请输入库房宽度"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      </el-card>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="success" plain @click="handleInsert(ruleFormRef)">保存</el-button>
+          <el-button type="danger" plain @click="handleCancelSave">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog class="diaClass"  :close-on-click-modal="false" draggable title="编辑" v-model="dialogVisibleEdit" width="40%" top="5vh"
+               @open="openDialog">
+      <el-card :body-style="cardBodyStyle">
+      <el-form :model="form" label-width="120px" label-position="right" inline ref="ruleFormRef" :rules="rules">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="库房名称" prop="wareNm">
+              <el-input v-model="form.wareNm" placeholder="请输入库房名称"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="库房编码" prop="wareCode">
+              <el-input v-model="form.wareCode" placeholder="请输入库房编码"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="库房长度" prop="wareLength">
+              <el-input v-model="form.wareLength" placeholder="请输入库房长度"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="库房宽度" prop="wareWidth">
+              <el-input v-model="form.wareWidth" placeholder="请输入库房宽度"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      </el-card>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="success" plain @click="handleSave(ruleFormRef)">保存</el-button>
+          <el-button type="danger" plain @click="handleCancelSave2">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+
+</template>
+
+<script setup>
+import {getCurrentInstance, onMounted, reactive, ref} from 'vue'
+import tools from '@/tools'
+import ButtonBox from "@/components/ButtonBox.vue";
+
+const {
+  proxy
+} = getCurrentInstance()
+
+const cardBodyStyle = ref(tools.style.card)
+const inputStyle = ref(tools.style.input)
+
+
+
+const url = ref('sto/Ware/query')
+
+/**
+ *   查询
+ */
+
+const form = ref({
+  wareNm: '',
+  wareCode: '',
+  wareLength: '',
+  wareWidth: ''
+});
+
+const query = ref({
+  wareNm: '',
+  wareCode: '',
+  wareLength: '',
+  wareWidth: ''
+})
+const tableData = ref([])
+const TableBoxRef = ref(null)
+const handleSearch = () => {
+  // TableBoxRef.value.search()
+  getTableData()
+}
+
+
+
+
+/**
+ * 分页
+ */
+const currentPage = ref(1)
+const totalRows = ref(0)
+const pageSizes = ref([ 10, 20, 30, 40])
+const pageSize = ref(10)
+const handleSizeChange = (val) => {
+  pageSize.value = val
+  getTableData()
+}
+const handleCurrentChange = (val) => {
+  currentPage.value = val
+  getTableData()
+}
+/**
+ * 分页
+ */
+
+
+/**
+ * 新增
+ */
+const dialogVisible = ref(false)
+const dialogVisibleEdit = ref(false)
+
+const ruleFormRef = ref()
+
+const rules = reactive({
+  wareNm: [
+    {required: true, message: '不允许为空', trigger: 'blur'},
+  ],
+  wareCode: [
+    {required: true, message: '不允许为空', trigger: 'blur'},
+  ],
+  wareLength: [
+    {required: true, message: '不允许为空', trigger: 'blur'},
+  ],
+  wareWidth: [
+    {required: true, message: '不允许为空', trigger: 'blur'},
+  ],
+
+})
+
+const insertDialog = () => {
+  form.value = {
+    wareNm: '',
+    wareCode: '',
+    wareLength: '',
+    wareWidth: ''
+  }
+  dialogVisible.value = true
+}
+/**
+ * 新增
+ */
+
+
+/**
+ * 保存、修改、删除
+ */
+const refUpload = ref()
+
+const openDialog = () => {
+
+}
+
+
+const handleSave = (ruleFormRef) => {
+  if (!ruleFormRef) return
+  ruleFormRef.validate((valid) => {
+    if (valid) {
+      console.log('submit!')
+      var url = 'sto/Ware/save'
+      var param = {
+        json: JSON.stringify(form.value),
+
+      }
+      proxy.$axios.post(url, param).then(response => {
+        if (response.data.code == 0) {
+          ElMessage({
+            message: '保存成功',
+            type: 'success',
+          })
+          dialogVisibleEdit.value = false
+          handleSearch()
+        } else {
+          ElMessage({
+            type: 'error',
+            message: '操作失败' + response.data.msg
+          })
+        }
+      });
+    } else {
+      console.log('error submit!')
+      return false
+    }
+  })
+};
+const handleInsert = (ruleFormRef) => {
+  if (!ruleFormRef) return
+  ruleFormRef.validate((valid) => {
+    if (valid) {
+      console.log('submit!')
+      var url = 'sto/Ware/save'
+      var param = {
+        json: JSON.stringify(form.value),
+
+      }
+      console.log('form.value!' ,form.value)
+      proxy.$axios.post(url, param).then(response => {
+        if (response.data.code == 0) {
+          ElMessage({
+            message: '保存成功',
+            type: 'success',
+          })
+          dialogVisible.value = false
+          handleSearch()
+        } else {
+          ElMessage({
+            type: 'error',
+            message: '操作失败' + response.data.msg
+          })
+        }
+      });
+    } else {
+      console.log('error submit!')
+      return false
+    }
+  })
+};
+
+const handleCancelSave = () => {
+  dialogVisible.value = false
+}
+const handleCancelSave2 = () => {
+  dialogVisibleEdit.value = false
+}
+
+const handleEdit = (row) => {
+  var url = 'sto/Ware/queryByPK'
+  var param = {
+    id: row.id
+  }
+  proxy.$axios.get(url, param).then(response => {
+    if (response.data.code == '0') {
+      form.value = response.data.data
+      console.log(form.value)
+      dialogVisibleEdit.value = true
+    } else {
+      ElMessage.error('操作失败！' + response.data.msg)
+    }
+  })
+}
+
+const handleRemove = (row) => {
+  var url = 'sto/Ware/remove'
+  var param = {
+    id: row.id
+  }
+  ElMessageBox.confirm(
+      '确定删除本条记录?',
+      '提示', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+        draggable: true,
+      }
+  )
+      .then(() => {
+        proxy.$axios.get(url, param).then(response => {
+          if (response.data.code == '0') {
+            console.log(response.data.data)
+            ElMessage({
+              type: 'success',
+              message: '删除成功！',
+            });
+            getTableData()
+          } else {
+            ElMessage.error('操作失败！' + response.data.msg)
+          }
+        })
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '已取消',
+        })
+      })
+
+
+}
+
+
+/**
+ * 保存、修改、删除
+ */
+
+const multipleSelection = ref([])
+const handleSelectionChange = (val) => {
+  multipleSelection.value = val
+}
+
+const handleRemoveBatch = () => {
+  console.log('handleRemoveBatch')
+
+  if (multipleSelection.value.length < 1) {
+    ElMessage({
+      type: 'warning',
+      message: '请选择要删除的数据!'
+    })
+    return
+  }
+
+  ElMessageBox.confirm('此操作将删除该数据, 是否继续?', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(() => {
+    var ids = []
+    multipleSelection.value.forEach((item, index) => {
+      ids.push(item.id)
+    })
+    /* var url = 'cot/SignRequest/removeBatch'*/
+    var param = {
+      ids: JSON.stringify(ids)
+    }
+    proxy.$axios.post(url, param).then(response => {
+      if (response.data.code == '0') {
+        ElMessage({
+          type: 'success',
+          message: '操作成功!',
+        });
+        getTableData()
+        dialogVisible.value = false
+      } else {
+        ElMessage({
+          type: 'error',
+          message: '操作失败!' + response.data.msg
+        });
+      }
+    })
+  }).catch(() => {
+    ElMessage({
+      type: 'info',
+      message: '已取消删除'
+    })
+  })
+}
+
+const handleEditBatch = () => {
+  console.log('handleEditBatch')
+  if (multipleSelection.value.length != 1) {
+    ElMessage({
+      type: 'warning',
+      message: '请选择一条数据编辑!'
+    })
+    return
+  }
+  handleEdit(multipleSelection.value[0])
+}
+
+const handleUpload = () => {
+  console.log('handleUpload')
+}
+
+const handleDownload = () => {
+  console.log('handleDownload')
+}
+
+const handleImport = () => {
+  console.log('handleImport')
+}
+
+const handleExport = () => {
+  console.log('handleExport')
+}
+const getTableData = () => {
+  var url = 'sto/Ware/query'
+  var param = {
+    page: currentPage.value,
+    rows: pageSize.value,
+    wareNm: query.value.wareNm,
+    wareCode: query.value.wareCode,
+    wareLength: query.value.wareLength,
+    wareWidth: query.value.wareWidth,
+    json: JSON.stringify(query.value)
+  }
+  proxy.$axios.get(url, param).then(response => {
+    if (response.data.code == '0') {
+      tableData.value = response.data.data.records
+      totalRows.value = response.data.data.total
+    } else {
+      ElMessage.error('操作失败！' + response.data.msg)
+    }
+  })
+}
+const height = ref(600)
+const updateViewportHeight = () => {
+  height.value = window.innerHeight * 0.65
+  console.log( window.innerHeight);
+};
+onMounted(() => {
+  getTableData()
+  updateViewportHeight()
+})
+</script>
+
+<style scoped>
+::v-deep .diaClass .el-form-item {
+  width: 100%
+}
+::v-deep .el-autocomplete{
+  width: 100%;
+}
+::v-deep .el-dialog__body {
+  background-color: #F2F6FC;
+}
+</style>
+