工单图片样式调整、取消考核页面人脸和车辆的公安部按钮

fuliqi

2024-10-15 0e944bfc16136c0a749fc6022e0dfc7f2b4af010

 src/views/system/work-order/detail/index.vue

@@ -156,12 +156,13 @@
      <div class="img-info" v-for="(img, index) in workOrderInfo.imgList" :key="index">
        <div>
          <el-image
            style="width: 160px; height: 100px"
            style="width: 100%; height: auto"
            :src="getImgUrl(img.imgUrl)"
            :preview-src-list="getImgUrl(img.imgUrl)">
            :preview-src-list="workOrderInfo.imgList.map(i => getImgUrl(i.imgUrl))"
            >
          </el-image>
        </div>
        <div style="margin-top: 8px">{{img.createTime}}</div>
        <div style="margin-top: 8px;text-align: center">{{img.createTime}}</div>
      </div>
    </div>

@@ -288,14 +289,15 @@

<style scoped>
.img-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 5px;
  flex: 0 0 calc(20% - 8px); /* 每行五个，所以每个占20%，减去间距 */
  box-sizing: border-box;
}

.work-order-img {
  margin-top: 15px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px; /* 可选：设置图片之间的间距 */
}
.work-order-info {
  width: 100%;