平台细节图

# 示例1

<template>
  <div class="t-worktable-detail-worktable-area1">
    <div>
      <as-worktable-plate-78-hole comp-mark="details-map-1-worktable-78"></as-worktable-plate-78-hole>
    </div>
    <div>
      <as-worktable-plate-96-hole comp-mark="details-map-1-worktable-96"></as-worktable-plate-96-hole>
    </div>
    <div>
      <as-worktable-plate-46-hole comp-mark="details-map-1-worktable-46"></as-worktable-plate-46-hole>
    </div>
    <div>
      <as-worktable-plate-52-hole comp-mark="details-map-1-worktable-52"></as-worktable-plate-52-hole>
    </div>
    <div>
      <as-worktable-plate-3-hole comp-mark="details-map-1-worktable-3"></as-worktable-plate-3-hole>
    </div>
    <div>
      <as-worktable-plate-56-hole comp-mark="details-map-1-worktable-56"></as-worktable-plate-56-hole>
    </div>
    <div>
      <as-worktable-plate-80-hole comp-mark="details-map-1-worktable-80"></as-worktable-plate-80-hole>
    </div>
    <div>
      <as-worktable-plate-24-hole comp-mark="details-map-1-worktable-24"></as-worktable-plate-24-hole>
    </div>
    <div>
      <as-worktable-plate-left-24-hole comp-mark="details-map-1-worktable-left-24"></as-worktable-plate-left-24-hole>
    </div>
    <div>
      <as-worktable-plate-right-24-hole comp-mark="details-map-1-worktable-right-24"></as-worktable-plate-right-24-hole>
    </div>
    <div>
      <as-worktable-plate-16-hole comp-mark="details-map-1-worktable-16"></as-worktable-plate-16-hole>
    </div>
    <div>
      <as-worktable-plate-4-hole comp-mark="details-map-1-worktable-4"></as-worktable-plate-4-hole>
    </div>
    <div>
      <as-worktable-plate-2-hole comp-mark="details-map-1-worktable-2"></as-worktable-plate-2-hole>
    </div>
    <div>
      <as-worktable-plate-mixer-2-hole comp-mark="details-map-1-worktable-mixer-2"></as-worktable-plate-mixer-2-hole>
    </div>
    <div>
      <as-worktable-plate-62-hole comp-mark="details-map-1-worktable-62"></as-worktable-plate-62-hole>
    </div>
    <div>
      <as-worktable-plate-64-hole comp-mark="details-map-1-worktable-64"></as-worktable-plate-64-hole>
    </div>
    <div>
      <as-worktable-plate-48-hole comp-mark="details-map-1-worktable-48"></as-worktable-plate-48-hole>
    </div>
    <div>
      <as-worktable-plate-78-hole comp-mark="details-map-1-worktable-78-second"></as-worktable-plate-78-hole>
    </div>
    <div>
      <as-worktable-plate-56-hole comp-mark="details-map-1-worktable-56-second"></as-worktable-plate-56-hole>
    </div>
    <div>
      <as-worktable-plate-96-hole comp-mark="details-map-1-worktable-96-second"></as-worktable-plate-96-hole>
    </div>
    <div>
      <as-worktable-plate-48-hole comp-mark="details-map-1-worktable-48-second"></as-worktable-plate-48-hole>
    </div>
    <div>
      <as-worktable-plate-41-hole comp-mark="details-map-1-worktable-41"></as-worktable-plate-41-hole>
    </div>
    <div>
      <as-worktable-plate-special-52-hole comp-mark="details-map-1-worktable-special-52"></as-worktable-plate-special-52-hole>
    </div>
    <div>
      <as-worktable-plate-41-hole comp-mark="details-map-1-worktable-41-second"></as-worktable-plate-41-hole>
    </div>
    <div>
      <as-worktable-plate-96-hole comp-mark="details-map-1-worktable-96-third"></as-worktable-plate-96-hole>
    </div>
    <div>
      <as-worktable-plate-96-hole comp-mark="details-map-1-worktable-96-fourth"></as-worktable-plate-96-hole>
    </div>
    <div>
      <as-worktable-plate-72-hole comp-mark="details-map-1-worktable-72"></as-worktable-plate-72-hole>
    </div>
    <div>
      <as-worktable-plate-72-hole comp-mark="details-map-1-worktable-72-second"></as-worktable-plate-72-hole>
    </div>
    <div>
      <as-worktable-plate-64-hole comp-mark="details-map-1-worktable-64-second"></as-worktable-plate-64-hole>
    </div>
    <div>
      <as-worktable-plate-mixer-4-hole comp-mark="details-map-1-worktable-mixer-4"></as-worktable-plate-mixer-4-hole>
    </div>
  </div>
</template>

<script>
export default {
  name: "t-worktable-detail-worktable1"
}
</script>

<style>
.t-worktable-detail-worktable-area1{
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.t-worktable-detail-worktable-area1>div{
  width: 15%;
  margin-top: 5px;
  margin-bottom: 5px;
}

</style>
Expand Copy

# 示例2

<template>
  <div class="t-worktable-detail-worktable-area2">
    <div>
      <as-worktable-plate-41-hole comp-mark="details-worktable-map-1"></as-worktable-plate-41-hole>
    </div>
    <div>
      <as-worktable-plate-62-hole comp-mark="details-worktable-map-2"></as-worktable-plate-62-hole>
    </div>
    <div>
      <as-worktable-plate-special-52-hole comp-mark="details-worktable-map-3"></as-worktable-plate-special-52-hole>
    </div>
    <div>
      <as-worktable-plate-78-hole comp-mark="details-worktable-map-4"></as-worktable-plate-78-hole>
    </div>
    <div>
      <as-worktable-plate-52-hole comp-mark="details-worktable-map-5"></as-worktable-plate-52-hole>
    </div>
    <div>
      <as-worktable-plate-52-hole comp-mark="details-worktable-map-6"></as-worktable-plate-52-hole>
    </div>
    <div>
      <as-worktable-plate-80-hole comp-mark="details-worktable-map-7"></as-worktable-plate-80-hole>
    </div>
    <div>
      <as-worktable-plate-72-hole comp-mark="details-worktable-map-8"></as-worktable-plate-72-hole>
    </div>
    <div>
      <as-worktable-plate-96-hole comp-mark="details-worktable-map-9"></as-worktable-plate-96-hole>
    </div>
    <div>
      <as-worktable-plate-64-hole comp-mark="details-worktable-map-10"></as-worktable-plate-64-hole>
    </div>
    <div>
      <as-worktable-plate-4-hole comp-mark="details-worktable-map-11"></as-worktable-plate-4-hole>
    </div>
    <div>
      <as-worktable-plate-3-hole comp-mark="details-worktable-map-12"></as-worktable-plate-3-hole>
    </div>
    <div>
      <as-worktable-plate-2-hole comp-mark="details-worktable-map-13"></as-worktable-plate-2-hole>
    </div>
    <div>
      <as-worktable-plate-mixer-4-hole comp-mark="details-worktable-map-14"></as-worktable-plate-mixer-4-hole>
    </div>
    <div>
      <as-worktable-plate-8-hole comp-mark="details-worktable-map-15"></as-worktable-plate-8-hole>
    </div>
    <div>
      <as-worktable-plate-16-hole comp-mark="details-worktable-map-16"></as-worktable-plate-16-hole>
    </div>
    <div>
      <as-worktable-plate-48-hole comp-mark="details-worktable-map-17"></as-worktable-plate-48-hole>
    </div>
    <div>
      <as-worktable-plate-41-hole comp-mark="details-worktable-map-18"></as-worktable-plate-41-hole>
    </div>
    <div>
      <as-worktable-plate-96-hole comp-mark="details-worktable-map-19"></as-worktable-plate-96-hole>
    </div>
    <div>
      <as-worktable-plate-26-hole comp-mark="details-worktable-map-20"></as-worktable-plate-26-hole>
    </div>
    <div>
      <as-worktable-plate-54-hole comp-mark="details-worktable-map-21"></as-worktable-plate-54-hole>
    </div>
    <div>
      <as-worktable-plate-54-hole comp-mark="details-worktable-map-22"></as-worktable-plate-54-hole>
    </div>
    <div>
      <as-worktable-plate-46-hole comp-mark="details-worktable-map-23"></as-worktable-plate-46-hole>
    </div>
    <div>
      <as-worktable-plate-46-hole comp-mark="details-worktable-map-24"></as-worktable-plate-46-hole>
    </div>
  </div>
</template>

<script>
export default {
  name: "t-worktable-detail-worktable2"
}
</script>

<style>
.t-worktable-detail-worktable-area2{
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.t-worktable-detail-worktable-area2>div{
  width: 22%;
  margin-top: 5px;
  margin-bottom: 5px;
}

</style>
Expand Copy