drp-ui/src/views/material/label/index.vue

<script>
import LabelTable from "./label-table.vue";
import LabelAddDialog from "./label-add-dialog.vue";
import LabelEditDialog from "./label-edit-dialog.vue";
import LabelBindDialog from "./label-bind-dialog.vue";
import LabelAutoBindDialog from "./label-auto-bind-dialog.vue";
import LabelHandBindDialog from "./label-hand-bind-dialog.vue";
export default {
  name: "MaterialLabel",
  components: {
    LabelTable,
    LabelAddDialog,
    LabelEditDialog,
    LabelBindDialog,
    LabelAutoBindDialog,
    LabelHandBindDialog,
  },
  data() {
    return {};
  },
  methods: {},
};
</script>

<template>
  <el-container class="container material-label">
    <label-table></label-table>
    <label-add-dialog></label-add-dialog>
    <label-edit-dialog></label-edit-dialog>
    <label-bind-dialog></label-bind-dialog>
    <label-auto-bind-dialog></label-auto-bind-dialog>
    <label-hand-bind-dialog></label-hand-bind-dialog>
  </el-container>
</template>

<style scoped>
.container {
  --size: 12px;
  --margin: var(--size);
  --padding: var(--size);
}
.container {
  width: calc(100% - calc(var(--size) * 2));
  /* height: calc(100vh - calc(var(--size) * 2)); */
  margin: var(--margin);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
.container .el-aside {
  margin: 0;
  padding: var(--padding);
  background-color: rgba(255, 255, 255, 1);
  border-right: 1px solid #dcdfe6;
  overflow: hidden;
}
</style>