aiot-app/pages/pda/feeding/details.vue

<template>
  <view class="content-box">
    <uni-nav-bar
      fixed="true"
      statusBar="true"
      left-icon="back"
      :title="title"
      background-color="#F7F9FA"
      color="#000"
      @clickLeft="back"
      right-icon="scan"
      @clickRight="handlScanCode"
    ></uni-nav-bar>
    <!-- 投料 -->
    <view class="list_box">
      <u-list @scrolltolower="scrolltolower">
        <view v-for="(item, index) in List" :key="index" class="card_box">
          <!-- 工单信息 -->

          <workOrderBom
            :item="item"
            pType="feed"
            :taskType="item.currentTaskDiagram.type"
            @handleScan="handleScan"
          ></workOrderBom>

          <paramBom
            v-if="item.paramDetailList.length != 0"
            :list="item.paramDetailList"
          ></paramBom>

          <!-- //设备信息 -->

          <deviceBom
            v-if="item.equipmentList.length != 0"
            :workOrderId="item.workOrderId"
            :wordItem="item"
            :list="item.equipmentList"
            :turnover="item.turnover"
            @scanIt="scanIt"
            :type="type"
          ></deviceBom>

          <!-- //在制品 -->
          <view
            v-if="
              item.product && item.product.length != 0 && item.singleReport == 0
            "
          >
            <workInProgressList
              :itemData="item"
              :equipmentList="item.equipmentList"
            ></workInProgressList>
          </view>
          <!-- 	<productsBom v-if="item.product != null && item.product != '{}'" :itemObj="item"
						:productsObj="item.product">
					</productsBom> -->
          <!-- feedNeedMould -->

          <modelBom
            v-if="item.modelList.length != 0"
            :workOrderId="item.workOrderId"
            :list="item.modelList"
            @scanIt="scanIt"
            :pattern="'feed'"
          >
          </modelBom>

          <instanceBom
            v-if="item.instanceList.length != 0"
            :workOrderId="item.workOrderId"
            :list="item.instanceList"
            :equipmentList="item.equipmentList"
            :currentTaskDiagram="item.currentTaskDiagram"
            :workInfo="item"
          >
          </instanceBom>
          <!-- 物料明细 -->

          <semiProductBom
            v-if="item.semiProductList.length != 0"
            :workOrderId="item.workOrderId"
            :list="item.semiProductList"
            :equipmentList="item.equipmentList"
            :currentTaskDiagram="item.currentTaskDiagram"
            :workInfo="item"
          ></semiProductBom>

          <!-- 11					周转车 -->
          <turnoverBom
            v-if="item.turnover.length != 0"
            :list="item.turnover"
            :wordItem="item"
            pattern="feed"
            @handleScan="handleScan"
            @handleDel="handleDel"
            :productsObj="item.product"
          ></turnoverBom>

          <aridRegion
            v-if="item.aridRegionList.length != 0"
            :list="item.aridRegionList"
            @handleScan="handleScan"
          ></aridRegion>

          <palletBom
            v-if="item.palletList.length != 0"
            :palletList="item.palletList"
          ></palletBom>

          <revolvingDiskBom
            v-if="item.revolvingDiskList.length != 0"
            :revolvingDiskList="item.revolvingDiskList"
          ></revolvingDiskBom>

          <!-- 包装投料 -->
          <packingBom
            v-if="item.packingList.length != 0"
            :list="item.packingList"
          ></packingBom>

          <view :class="[operateBtn ? 'flex_btn' : 'flex_btn2']">
            <image
              v-if="operateBtn"
              class="jiantou"
              src="../../../static/rightJt.png"
              @click="operateBtn = false"
            >
            </image>

            <view class="close_box" @click="operateBtn = true">
              <image
                v-if="!operateBtn"
                class="close"
                src="../../../static/close.png"
              ></image>
            </view>

            <view v-if="!operateBtn" @click="openDetails(item.workOrderId)"
              >出库单</view
            >
            <view v-if="!operateBtn" @click="removeCacheFn()">清空缓存</view>
          </view>

          <view :class="[idsList.length == 1 ? 'operate_box' : 'operate_box2']">
            <u-button
              size="small"
              class="u-reset-button"
              type="success"
              @click="handAdd(item.workOrderId)"
              >手动添加</u-button
            >

            <u-button
              size="small"
              class="u-reset-button"
              type="success"
              @click="scanIt(item.workOrderId)"
              >扫一扫</u-button
            >
          </view>
        </view>
      </u-list>
    </view>

    <view class="bottom-wrapper">
      <view class="btn_box" @click="save(1)">缓存</view>
      <view class="btn_box" @click="save(2)">一键投料</view>
    </view>
  </view>
</template>

<script>
import workOrderBom from "./components/workOrderBom.vue"; //gd
import deviceBom from "./components/deviceBom.vue"; //设备信息

import modelBom from "./components/modelBom.vue"; //模具信息

import instanceBom from "./components/instanceBom.vue";
import semiProductBom from "./components/semiProductBom"; //半成品信息
import aridRegion from "./components/aridRegion"; //干燥区
import paramBom from "./components/paramBom.vue"; //
import turnoverBom from "./components/turnoverBom.vue"; //周转车信息
import packingBom from "./components/packingBom.vue"; //包装信息
import productsBom from "./components/productsBom.vue"; //在制品信息
import palletBom from "./components/palletBom"; //舟皿
import revolvingDiskBom from "./components/revolvingDiskBom";
import workInProgressList from "./components/workInProgressList.vue";

import {
  workorderList,
  getByCode,
  scanLedger,
  feedSaveCache,
  feedGetCache,
  removeCache,
} from "@/api/pda/workOrder.js";

import { batchSave } from "@/api/pda/feeding.js";

export default {
  components: {
    workOrderBom,
    deviceBom,
    modelBom,
    instanceBom,
    semiProductBom,
    aridRegion,
    paramBom,
    turnoverBom,
    packingBom,
    productsBom,
    palletBom,
    revolvingDiskBom,
    workInProgressList,
  },
  data() {
    return {
      title: "",
      idsList: [],
      List: [],
      taskId: null,
      type: "",
      clientEnvironmentId: null,
      operateBtn: true,
      cloneListNum: "",
      feedNeedEquipment: null, ////投料是否要添加生产设备1是0否
      taskType: "",
    };
  },
  onLoad(options) {
    console.log(options, "options");
    this.title = options.taskName ? options.taskName + "-投料" : "投料";
    let queryArray = decodeURIComponent(options.arr);
    this.idsList = JSON.parse(queryArray);
    this.taskId = options.taskId;
    this.taskName = options.taskName;
    this.type = options.type;
    // this.feedNeedEquipment = options.feedNeedEquipment;

    console.log(this.idsList, "onLoad");

    this.getList();

    this.clientEnvironmentId =
      uni.getStorageSync("userInfo") &&
      uni.getStorageSync("userInfo").clientEnvironmentId;
  },
  onShow() {
    uni.$off("setSelectList");

    uni.$on("setSelectList", (selectList, id) => {
      this.List.forEach((m) => {
        if (selectList.length) {
          let num = 0;
          selectList.map((v) => {
            if (v.extInfo.positionList && v.extInfo.positionList.length) {
              v.extInfo.positionList.map((d) => {
                if (m.code == d.workOrderCode) {
                  console.log(d);
                  num += d.quantity;
                }
              });
            }
          });
          if (m.product && num != 0) {
            this.cloneListNum = num;
            m.product.feedQuantity = num;
          }
        }

        if (m.workOrderId == id) {
          let modelList = []; // 模具
          let instanceList = []; // 投料
          let aridRegionList = []; // 干燥区
          let equipmentList = []; // 生产设备
          let palletList = []; // 舟皿
          let revolvingDiskList = []; // 周转盘
          let semiProductList = []; // 半成品
          let turnover = []; //周转车

          selectList.forEach((f) => {
            if (f.rootCategoryLevelId == 4) {
              equipmentList = equipmentList.concat(f);
              equipmentList.map((d) => {
                if (d.equipmentLabelJson.length) {
                  d.equipmentLabelJson.map((v) => {
                    if (v.SJSB) {
                      d.isSJSB = v.SJSB;
                    }
                  });
                }
              });
            }
            if (f.rootCategoryLevelId == 5) {
              modelList = modelList.concat(f);
            } else if (f.rootCategoryLevelId == 1) {
              instanceList = instanceList.concat(f);
            } else if (f.rootCategoryLevelId == 11) {
              aridRegionList = aridRegionList.concat(f);
            } else if (f.rootCategoryLevelId == 7) {
              turnover = turnover.concat(f);
            } else if (f.rootCategoryLevelId == 8) {
              palletList = palletList.concat(f);
            } else if (f.rootCategoryLevelId == 26) {
              revolvingDiskList = revolvingDiskList.concat(f);
            } else if ([23, 2, 9, 28].includes(Number(f.rootCategoryLevelId))) {
              semiProductList = semiProductList.concat(f);
            }
          });

          this.$set(m, "modelList", modelList);
          this.$set(m, "instanceList", instanceList);
          this.$set(m, "aridRegionList", aridRegionList);
          this.$set(m, "equipmentList", equipmentList);
          this.$set(m, "turnover", turnover);
          this.$set(m, "palletList", palletList);
          this.$set(m, "revolvingDiskList", revolvingDiskList);
          this.$set(m, "semiProductList", semiProductList);
        }
      });
    });
  },

  methods: {
    scrolltolower() {},

    clonenember(e) {
      return JSON.parse(JSON.stringify(e));
    },

    async save(type) {
      console.log(this.List);

      for (let i = 0; i < this.List.length; i++) {
        if (
          !this.List[i].executorTime &&
          this.List[i].executorTime == undefined
        ) {
          uni.showToast({
            title: `请先选择投料时间`,
            icon: "none",
          });
          return;
        }
      }

      this.List.forEach((f) => {
        this.$isJobExls(2, f);
      });

      this.List.forEach((f) => {
        f.instanceList.forEach((e) => {
          if (Object.prototype.hasOwnProperty.call(e, "type")) {
            e.extInfo["type"] = e.type;
          }
          e.extInfo["isConsumable"] = e.isConsumable;
        });
      });

      const isCache = await this.checkCache(type);

      if (!isCache) {
        return false;
      }

      if (
        this.clientEnvironmentId == 3 &&
        this.List[0].currentTaskDiagram.type == 1
      ) {
        if (
          this.List[0] &&
          this.List[0].executorTime &&
          this.List[0].executorTime != undefined
        ) {
          // 正则表达式1：匹配 yyyy-MM-dd 格式
          let dateRegex = /^\d{4}-\d{2}-\d{2}$/;
          if (dateRegex.test(this.List[0].executorTime.trimRight())) {
            this.List[0].executorTime = this.List[0].executorTime + " 00:00:00";
          }
        } else {
          uni.showToast({
            title: `请先选择时间投料时间`,
            icon: "none",
          });

          return false;
        }
      }

      if (this.clientEnvironmentId !== 9 && this.feedNeedEquipment == 1) {
        const isDevice = await this.checkdDevice();

        if (!isDevice) {
          return;
        }
      }
      // item.equipmentList

      // 索尔环境下，需要填写炉次号
      if (this.clientEnvironmentId === 2) {
        if (this.List[0].equipmentList.length) {
          if (!this.equipmentListList("heatNumber")) {
            return uni.showToast({
              title: `请填写炉次号`,
              icon: "none",
            });
          }
        }
      }

      batchSave(this.List).then((res) => {
        // 江南环境
        if (this.clientEnvironmentId == 9) {
          uni.redirectTo({
            url: `/pages/pda/workOrder/extrusionMolding/index?id=${this.idsList}`,
          });
        } else {
          uni.redirectTo({
            url: `/pages/pda/feeding/index/index?feedStatus=1`,
          });
        }
      });
    },

    equipmentListList(propertyName) {
      return this.List.every((f) => {
        if (f.equipmentList && f.equipmentList.length > 0) {
          return f.equipmentList.every((obj) => {
            // 检查属性存在且不为空（null, undefined, 空字符串等）
            return (
              obj.extInfo.hasOwnProperty(propertyName) &&
              obj.extInfo[propertyName] !== null &&
              obj.extInfo[propertyName] !== undefined &&
              obj.extInfo[propertyName] !== ""
            );
          });
        }
      });
    },

    checkCache(type) {
      uni.hideLoading();
      return new Promise((resolve) => {
        if (type == 1) {
          feedSaveCache(this.List).then((rr) => {
            uni.showToast({
              title: `已经缓存`,
              icon: "none",
            });
          });
          resolve(false);
        } else if (type == 2) {
          resolve(true);
        }
      });
    },

    getList() {
      workorderList({
        ids: this.idsList,
        taskId: this.taskId,
      })
        .then((res) => {
          this.List = res.map((m) => {
            m.workOrderId = m.id;

            m.instanceList = []; // 物料
            // m.equipmentList = [] // 设备
            m.modelList = []; // 模具
            m.aridRegionList = []; // 干燥区
            m.packingList = []; // 包装
            m.palletList = []; // 舟皿
            m.revolvingDiskList = []; // 周转盘
            m.semiProductList = []; //半成品

            if (m.pickOutInList.length > 0) {
              m.pickOutInList.forEach((f) => {
                if (f.rootCategoryLevelId == 1) {
                  m.instanceList.push(f);
                } else if (f.rootCategoryLevelId == 4) {
                  m.modelList.push(f);
                } else if (f.rootCategoryLevelId == 5) {
                  m.modelList.push(f);
                } else if (f.rootCategoryLevelId == 11) {
                  m.aridRegionList.push(f);
                } else if (f.rootCategoryLevelId == 13) {
                  m.packingList.push(f);
                } else if (f.rootCategoryLevelId == 8) {
                  m.palletList.push(f);
                } else if (f.rootCategoryLevelId == 26) {
                  m.revolvingDiskList.push(f);
                } else if (
                  [23, 2, 9, 28].includes(Number(f.rootCategoryLevelId))
                ) {
                  m.semiProductList.push(f);
                }
              });
            }

            // 处理字段
            m.quality == "" ? (m.quality = {}) : "";

            if (!Object.prototype.hasOwnProperty.call(m, "product")) {
              m.product = "{}";
            }

            delete m.id;
            if (this.taskId) {
              m.taskId = this.taskId;
              m.taskName = this.taskName;
            }
            return {
              ...m,
            };
          });

          this.cloneList = JSON.parse(JSON.stringify(this.List));
          this.feedNeedEquipment =
            this.List[0].currentTaskDiagram.feedNeedEquipment;
        })
        .finally(() => {
          this.getCacheFn();
        });
    },

    handleScan(id, type) {
      uni.scanCode({
        success: (res) => {
          this.scanData(res.result, type, id);
        },
      });
    },

    scanData(result, type, id) {
      if (type == "wordOrder") {
        let isFals = this.List.some((m) => m.code == result);
        if (isFals) {
          uni.showToast({
            title: "工单已存在",
            icon: "none",
          });
          return false;
        }

        getByCode(result).then((res) => {
          let _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id && res) {
              _arr[index] = res;
            }
          });

          this.List = _arr;
          this.$forceUpdate();
        });
      }
    },
    scanIt(id) {
      uni.scanCode({
        success: (res) => {
          this.scanItData(res.result, id);
        },
      });
    },

    scanItData(result, id) {
      scanLedger(result).then((res) => {
        let _arr = [];
        if (res.length == 1 && res[0].rootCategoryLevelId == 4) {
          // 设备
          _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id) {
              _arr[index].equipmentList = _arr[index].equipmentList.concat(res);
            }
          });
          this.List = _arr;
          this.$forceUpdate();
        } else if (res.length >= 1 && res[0].rootCategoryLevelId == 5) {
          // 模具

          _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id) {
              _arr[index].modelList = res;
            }
          });
          this.List = _arr;
          this.$forceUpdate();
        } else if (
          res.length >= 1 &&
          [1].includes(Number(res[0].rootCategoryLevelId))
        ) {
          // 物料
          _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id) {
              _arr[index].instanceList = _arr[index].instanceList.concat(res);
            }
          });
          this.List = _arr;

          this.$forceUpdate();
        } else if (
          res.length >= 1 &&
          [23, 2, 9, 28].includes(Number(res[0].rootCategoryLevelId))
        ) {
          _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id) {
              _arr[index].semiProductList =
                _arr[index].semiProductList.concat(res);
            }
          });
          this.List = _arr;

          this.$forceUpdate();
        } else if (res.length >= 1 && res[0].rootCategoryLevelId == 11) {
          // 干燥区
          _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id) {
              let isFals = _arr[index].aridRegionList.some(
                (m) => m.code == res[0].aridRegionList[0].code
              );
              if (isFals) {
                uni.showToast({
                  title: "干燥区已存在",
                  icon: "none",
                });
                return false;
              }
              let _obj = res[0].aridRegionList[0];
              if (_obj.status == 0) {
                _obj["name"] = res[0].name;
                _obj["region"] = res[0].extInfo.region;
                _arr[index].aridRegionList = _arr[index].aridRegionList.concat(
                  res[0].aridRegionList
                );
              } else {
                uni.showToast({
                  title: "干燥区已占用",
                  icon: "none",
                });
              }
            }
          });
          this.List = _arr;

          this.$forceUpdate();
        } else if (res.length >= 1 && res[0].rootCategoryLevelId == 7) {
          // 周转车
          _arr = this.List;
          _arr.forEach((e, index) => {
            if (e.workOrderId == id) {
              let isFals = _arr[index].turnover.some(
                (m) => m.code == res[0].code
              );
              if (isFals) {
                uni.showToast({
                  title: "周转车已存在",
                  icon: "none",
                });
                return false;
              }

              _arr.forEach((e, index) => {
                if (e.workOrderId == id) {
                  _arr[index].turnover = _arr[index].turnover.concat(res);
                }
              });
              this.List = _arr;
              this.$forceUpdate();
            }
          });
        }
      });
    },

    // 全部扫一扫
    handlScanCode() {
      uni.scanCode({
        success: (res) => {
          this.scanItAllData(res.result);
        },
      });
    },

    scanItAllData(result) {
      scanLedger(result).then((res) => {
        let _arr = [];
        if (res.length == 1 && res[0].rootCategoryLevelId == 4) {
          // 设备
          _arr = this.List;
          _arr.forEach((e, index) => {
            res["extInfo"].fixCode = res.fixCode;
            e.equipmentList = e.equipmentList.concat(res);
          });
          this.List = _arr;
          this.$forceUpdate();
        } else if (res.length >= 1 && res[0].rootCategoryLevelId == 5) {
          // 模具

          _arr = this.List;
          _arr.forEach((e, index) => {
            e.modelList = res;
          });
          this.List = _arr;
          this.$forceUpdate();
        } else if (
          res.length >= 1 &&
          [1].includes(Number(res[0].rootCategoryLevelId))
        ) {
          _arr = this.List;
          _arr.forEach((e, index) => {
            e.instanceList = e.instanceList.concat(res);
          });
          this.List = _arr;

          this.$forceUpdate();
        } else if (
          res.length >= 1 &&
          [23, 2, 9, 28].includes(Number(res[0].rootCategoryLevelId))
        ) {
          _arr = this.List;
          _arr.forEach((e, index) => {
            e.semiProductList = e.semiProductList.concat(res);
          });
          this.List = _arr;

          this.$forceUpdate();
        } else if (res.length >= 1 && res[0].rootCategoryLevelId == 7) {
          // 周转车
          _arr = this.List;
          if (_arr.length == 1) {
            _arr.forEach((e, index) => {
              e.turnover = e.turnover.concat(res);
            });
            this.List = _arr;

            this.$forceUpdate();
          } else if (_arr.length > 1) {
            uni.showToast({
              title: "多个工单通过下面单个扫一扫添加",
              icon: "none",
            });
          }
        }
      });
    },

    getCacheFn() {
      let parma = {
        workOrderIds: this.idsList,
        taskId: this.taskId,
        type: 2,
      };

      feedGetCache(parma).then((res) => {
        if (res.length == 0) {
          return false;
        }
        let objList = res[0].extInfo.objList;
        this.List.forEach((f) => {
          objList.forEach((o) => {
            if (f.workOrderId == o.workOrderId && f.taskId == o.taskId) {
              // f['instanceList'] = o.instanceList || [] // 实例

              f["equipmentList"] = o.equipmentList || []; // 设备

              f["modelList"] = o.modelList || []; // 模具

              f["aridRegionList"] = o.aridRegionList || []; // 干燥区

              f["packingList"] = o.packingList || []; // 包装

              f["palletList"] = o.palletList || []; //舟皿
              f["instanceList"] = o.instanceList || []; // 物料

              f["revolvingDiskList"] = o.revolvingDiskList || []; // 周转盘

              f["semiProductList"] = o.semiProductList || []; // 半成品

              f["turnover"] = o.turnover || []; // 周转车

              this.$forceUpdate();
            }
          });
        });
      });
    },

    removeCacheFn() {
      uni.showModal({
        title: "缓存",
        content: "是否清空缓存！",
        confirmText: "确认", //这块是确定按钮的文字
        success: (rr) => {
          if (rr.confirm) {
            let parma = {
              workOrderIds: this.idsList,
              taskId: this.taskId,
              type: 2,
            };

            removeCache(parma).then((res) => {
              this.getList();
            });
          }
        },
      });
    },

    handAdd(id) {
      const storageKey = Date.now() + "";
      uni.setStorageSync(storageKey, this.List || []);
      uni.navigateTo({
        url: `/pages/pda/workOrder/search/index?id=${id}&storageKey=${storageKey}&isType=feed&taskId=${this.taskId}`,
      });
    },

    openDetails(id) {
      const storageKey = Date.now() + "";
      uni.setStorageSync(storageKey, this.List || []);
      let url = `/pages/pda/feeding/single?id=${id}&taskId=${this.taskId}&storageKey=${storageKey}`;
      uni.navigateTo({
        url,
      });
    },

    checkdDevice() {
      return new Promise((resolve) => {
        console.log(this.List);
        let isFalse = this.List.every((item) => {
          return item.equipmentList && item.equipmentList.length > 0;
        });
        if (isFalse) {
          resolve(true);
        } else {
          uni.showToast({
            title: "请添加设备",
            icon: "none", // 可选值：'success', 'loading', 'none'
            duration: 3000, // 持续时间，单位ms
          });
          resolve(false);

          // uni.showModal({
          // 	title: '提示',
          // 	content: '没有选择设备，是否继续？',
          // 	confirmText: '确认', //这块是确定按钮的文字
          // 	success: function (res) {
          // 		if (res.confirm) {
          // 			resolve(true)
          // 		} else {
          // 			resolve(false)
          // 		}
          // 	}
          // })
        }
      });
    },
  },

  beforeDestroy() {
    uni.hideLoading();
  },
};
</script>

<style lang="scss" scoped>
.content-box {
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.list_box {
  flex: 1;
  overflow: hidden;
  padding: 4rpx 0;

  .u-list {
    height: 100% !important;
  }

  .card_box {
    padding: 16rpx;
  }
}

.bottom-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-around;

  .btn_box {
    width: 50%;
    height: 88rpx;
    line-height: 88rpx;
    background: $theme-color;
    text-align: center;
    font-size: 36rpx;
    font-style: normal;
    font-weight: 400;
    color: #fff;

    &:first-child {
      border-right: 2rpx solid #fff;
    }
  }
}

.operate_box {
  position: fixed;
  right: 0;
  top: 400rpx;

  /deep/ .u-button {
    margin-top: 20rpx;
    width: 150rpx;
    border-radius: 22rpx 0 0 22rpx;
    opacity: 0.6;
    font-size: 22rpx;
  }
}

.operate_box2 {
  display: flex;

  /deep/ .u-button {
    margin-top: 20rpx;
    width: 150rpx;
  }
}

.flex_btn {
  position: fixed;
  right: 0;
  bottom: 160rpx;
  width: 40rpx;
  height: 50rpx;
  line-height: 66rpx;
  border-radius: 22rpx 0 0 22rpx;
  background: $theme-color;
  text-align: center;
  font-size: 22rpx;
  font-style: normal;
  font-weight: 400;
  color: #fff;
  opacity: 0.6;

  .jiantou {
    width: 30rpx;
    height: 30rpx;
  }
}

.flex_btn2 {
  position: fixed;
  right: 0;
  bottom: 160rpx;
  width: 126rpx;
  min-height: 140rpx;
  line-height: 62rpx;
  border-radius: 22rpx 0 0 22rpx;
  background: $theme-color;
  text-align: center;
  font-size: 22rpx;
  font-style: normal;
  font-weight: 400;
  color: #fff;
  opacity: 0.7;

  .close_box {
    height: 50rpx;
    line-height: 50rpx;
    width: 126rpx;
    text-align: left;

    .close {
      width: 40rpx;
      height: 40rpx;
      padding: 6rpx 10rpx;
    }
  }
}
</style>