94 lines
3.0 KiB
Vue
94 lines
3.0 KiB
Vue
<template>
|
|
<div class="table-box">
|
|
<div style="padding-bottom: 16px">
|
|
<PermissionButton
|
|
:buttons="dataStore.buttons"
|
|
@handleButtonClickCallback="handleButtonClickCallback"
|
|
></PermissionButton>
|
|
</div>
|
|
<div class="card table-main">
|
|
<div style="padding-bottom: 10px; border-bottom: 1px solid #eeeeee">
|
|
<h3 style="margin: 10px">基础信息</h3>
|
|
<DetailsSearch :formData="dataStore.formData" :ruleForm="dataStore.ruleForm" :labelWidth="dataStore.labelWidth" />
|
|
</div>
|
|
|
|
<div style="padding-top: 16px; padding-bottom: 16px">
|
|
<h3 style="margin: 10px">物料信息</h3>
|
|
<el-table :data="tableData" border height="300" style="width: 100%; margin-top: 20px">
|
|
<el-table-column prop="id" label="ID" width="180" />
|
|
<el-table-column prop="name" label="Name" />
|
|
<el-table-column prop="amount1" label="Cost 1 ($)" />
|
|
<el-table-column prop="amount2" label="Cost 2 ($)" />
|
|
<el-table-column prop="amount3" label="Cost 3 ($)" />
|
|
</el-table>
|
|
</div>
|
|
|
|
<div style="padding-top: 16px; border-bottom: 1px solid #eeeeee">
|
|
<h3 style="margin: 10px">操作信息</h3>
|
|
<DetailsSearch
|
|
:formData="dataStore.formData1"
|
|
:ruleForm="dataStore.ruleForm1"
|
|
:labelWidth="dataStore.labelWidth"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts" name="shipmentOutboundShipmentOrderDetails">
|
|
import { cloneDeep } from "lodash-es";
|
|
import DetailsSearch from "@/components/DetailsSearch/index.vue";
|
|
import PermissionButton from "@/components/PermissionButton/index.vue";
|
|
import { BUTTON } from "./constant/details/button";
|
|
import { FORM_DATA, RULE_FORM, RULE_FORM1, FORM_DATA1 } from "./constant/details/search";
|
|
const dataStore = reactive<any>({
|
|
labelWidth: "165px",
|
|
buttons: cloneDeep(BUTTON),
|
|
ruleForm: cloneDeep(RULE_FORM), // 表单值
|
|
formData: cloneDeep(FORM_DATA), //表单配置项
|
|
ruleForm1: cloneDeep(RULE_FORM1), // 表单值
|
|
formData1: cloneDeep(FORM_DATA1) //表单配置项
|
|
});
|
|
|
|
const tableData: any[] = [
|
|
{
|
|
id: "12987122",
|
|
name: "Tom",
|
|
amount1: "234",
|
|
amount2: "3.2",
|
|
amount3: 10
|
|
},
|
|
{
|
|
id: "12987123",
|
|
name: "Tom",
|
|
amount1: "165",
|
|
amount2: "4.43",
|
|
amount3: 12
|
|
},
|
|
{
|
|
id: "12987124",
|
|
name: "Tom",
|
|
amount1: "324",
|
|
amount2: "1.9",
|
|
amount3: 9
|
|
},
|
|
{
|
|
id: "12987125",
|
|
name: "Tom",
|
|
amount1: "621",
|
|
amount2: "2.2",
|
|
amount3: 17
|
|
},
|
|
{
|
|
id: "12987126",
|
|
name: "Tom",
|
|
amount1: "539",
|
|
amount2: "4.1",
|
|
amount3: 15
|
|
}
|
|
];
|
|
const handleButtonClickCallback = () => {};
|
|
</script>
|
|
|
|
<style scoped></style>
|