opt_web/src/views/product-manage/historical-detail/index.vue

<script lang="ts" setup>
/**
 * @Name: index.vue
 * @Description: 历史详情
 * @Author: Cheney
 */

import { useTableHeight } from '/@/utils/useCustomHeight';


const isShowHistory = defineModel({ default: false });

const props = defineProps({
  rowData: <any>Object,
  title: String
});
const { rowData, title } = props;
console.log("(index.vue: 15)=> rowData", rowData);


const heightObj = { topBar: 50, cardMargin: 8, cardPadding: 20 };
const { tableHeight } = useTableHeight(heightObj);


</script>

<template>
  <div class="drawer-container">
    <el-drawer
        ref="editDrawer"
        v-model="isShowHistory"
        :show-close="false"
        direction="btt"
        size="85%"
        style="background-color:#F3F4FB;"
        :title="`${title} - 历史详情`">
      <div class="sticky top-0" style="background-color:#F3F4FB; min-height: 20px; z-index: 2"></div>
      <div class="px-5">
        <el-card>12341</el-card>
        <el-card :body-style="{ height: tableHeight + 'px' }">
          <div class="h-full overflow-hidden">
            <vxe-table height="100%">
              <vxe-column type="seq"></vxe-column>
              <vxe-column type="seq"></vxe-column>
              <vxe-column type="seq"></vxe-column>
              <vxe-column type="seq"></vxe-column>
              <vxe-column type="seq"></vxe-column>
            </vxe-table>
          </div>
        </el-card>
      </div>
      
    </el-drawer>

  </div>

</template>

<style scoped>
.drawer-container :deep(.el-drawer__header) {
  border-bottom: none;
  font-weight: 500;
}

.drawer-container :deep(.el-drawer__title) {
  font-size: 18px;
}
</style>