<template>
  <div>
    <div class="cardgroup">
      <div class="card" v-show="proListShow">
        <div class="cardheader">
          <span class="s1">待检验产品列表</span>
        </div>
        <div class="cardtable">
          <el-table
            :header-cell-style="{ background: '#E4E9F1' }"
            :cell-style="tableRowClassName"
            :data="productData"
            style="width: 96%; margin-left: 2%"
          >
            <el-table-column
              prop="fileName"
              label="文件名称"
              align="center"
              show-overflow-tooltip
            >
            </el-table-column>
            <el-table-column prop="fileSize" label="文件大小" align="center">
              <template slot-scope="scope">
                {{ scope.row.fileSize | transformByte }}
              </template>
            </el-table-column>
            <el-table-column
              prop="uploadDate"
              label="上传时间"
              align="center"
              show-overflow-tooltip
            >
              <template slot-scope="scope">
                {{ scope.row.uploadDate | formatDate }}
              </template>
            </el-table-column>
            <el-table-column prop="proClass" label="产品类型" align="center">
              <template slot-scope="scope">
                {{ scope.row.proClass | cldCategoryFilter }}
              </template>
            </el-table-column>
            <el-table-column prop="fileFormat" label="文件格式" align="center">
            </el-table-column>
            <el-table-column label="元数据" align="center">
              <el-button type="primary" @click="cardshow">添加</el-button>
            </el-table-column>
          </el-table>
        </div>
        <div class="cardbtngroup">
          <el-button
            type="primary"
            @click="openSearchPanal"
            :disabled="btn_gldmclsj"
            >关联地面测量数据</el-button
          >
          <el-button type="primary" :disabled="btn_tjjydd" @click="clickbtntj"
            >提交检验订单</el-button
          >
        </div>
      </div>
      <el-form
        :model="pData"
        ref="pData"
        class="card"
        v-show="showcard"
        style="overflow: hidden; overflow-y: auto; max-height: 420px"
      >
        <div class="cardheader2">
          <span class="s3">待检验产品列表元数据-添加</span>
          <el-button
            type="text"
            icon="el-icon-close"
            class="s4"
            @click="closecard"
          ></el-button>
        </div>
        <div class="cardline">
          <span class="radiolabel">级别</span>
          <el-radio-group
            v-model="pData.productLevel"
            class="radiogroup"
            :disabled="true"
          >
            <el-radio :label="3">3</el-radio>
            <el-radio :label="4">4</el-radio>
            <el-radio :label="5">5</el-radio>
            <!-- <el-radio :label="99">其他</el-radio> -->
          </el-radio-group>
        </div>
        <div class="showcard">
          <div class="left">
            <div class="line">
              <span class="sp1">空间分辨率</span>
              <el-input
                class="inp1"
                placeholder="0.00025"
                v-model="pData.spaResolution"
                :disabled="true"
              >
              </el-input>
            </div>
          </div>
          <div class="right">
            <div class="line">
              <span class="sp1 imageTime">时间</span>
              <el-form-item
                class="sel1"
                prop="productDate"
                :rules="[{ required: true, message: ' ' }]"
              >
                <el-date-picker
                  v-model="pData.productDate"
                  align="center"
                  type="datetime"
                  placeholder="选择日期"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  :picker-options="pData.pickerOptions"
                >
                </el-date-picker>
              </el-form-item>
            </div>
          </div>
        </div>
        <!-- <div
          class="cardline"
          v-if="showCKPlan && showCKPlan.productParam.cldCategory === 10"
        >
          <span class="cardlinelabel" style="margin-right: 29px">植被类型</span>
          <el-select
            v-model="pData.vegetaVal"
            placeholder="请选择"
            class="cardlineinput2"
          >
            <el-option
              v-for="item in vegetaOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div> -->
        <!-- <div class="cardline">
                  <span class="cardlinelabel">云量</span>
                  <el-slider v-model="cloud" class="slidercloud" range></el-slider>
                </div> -->
        <div class="showcard">
          <div class="left">
            <div class="line">
              <span class="sp1">卫星</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.satellite"
                :disabled="true"
              >
              </el-input>
            </div>
            <div class="line">
              <span class="sp1">坐标系统</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.coordinateSys"
                :disabled="true"
              >
              </el-input>
            </div>
            <div class="line">
              <span class="sp1">最大纬度</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.maxLat"
                :disabled="true"
              >
              </el-input>
            </div>
            <div class="line">
              <span class="sp1">最大经度</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.maxLon"
                :disabled="true"
              >
              </el-input>
            </div>
          </div>
          <div class="right">
            <div class="line">
              <span class="sp1">载荷</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.load"
                :disabled="true"
              >
              </el-input>
            </div>
            <div class="line">
              <span class="sp1">中心点位置</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.centerPos"
                :disabled="true"
              >
              </el-input>
            </div>
            <div class="line">
              <span class="sp1">最小纬度</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.minLat"
                :disabled="true"
              >
              </el-input>
            </div>
            <div class="line">
              <span class="sp1">最小经度</span>
              <el-input
                class="inp1"
                placeholder="请输入内容"
                v-model="pData.minLon"
                :disabled="true"
              >
              </el-input>
            </div>
          </div>
        </div>
        <div
          class="groudClassChk"
          v-if="
            showCKPlan &&
            (showCKPlan.productParam.cldCategory === 6 ||
              showCKPlan.productParam.cldCategory === 12)
          "
        >
          <div class="cardheader2">
            <span class="s3">{{ groundFeature | groundFeatureFilter }}</span>
            <el-button type="text" class="s4" @click="addLaCovT"
              >添加</el-button
            >
          </div>
          <div class="cardtable">
            <el-table
              :data="pData.grdCoverData"
              style="width: 96%; margin-left: 2%"
            >
              <el-table-column
                label="序号"
                width="60"
                align="center"
                type="index"
              >
              </el-table-column>
              <el-table-column
                prop="groClaName"
                :label="groundFeature | groundFeatureFilter"
                align="center"
              >
                <template slot-scope="{ row, $index }">
                  <div
                    @click.stop="
                      {
                        {
                          changeNum($index, 'editGroClaNameInput');
                        }
                      }
                    "
                  >
                    <el-select
                      v-if="editable[$index]"
                      v-model="row.groClaName"
                      placeholder="请选择"
                      size="mini"
                      class="editGroClaNameInput"
                    >
                      <el-option
                        v-for="item in groTypeName"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                    <span v-else>{{ row.groClaName }}</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="pixelNum"
                label="像素实际值"
                align="center"
              >
                <template slot-scope="{ row, $index }">
                  <div
                    @click.stop="
                      {
                        {
                          changeNum($index, 'editPixelInput');
                        }
                      }
                    "
                  >
                    <el-input
                      v-if="editable[$index]"
                      v-model="row.pixelNum"
                      size="mini"
                      class="editPixelInput"
                    ></el-input>
                    <span v-else>{{ row.pixelNum }}</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="操作" align="center">
                <template slot-scope="scope">
                  <el-button
                    style="height: 25px"
                    type="danger"
                    size="small"
                    icon="el-icon-minus"
                    @click="removeLaCovT(scope.$index, scope.row)"
                  ></el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <div class="btngr">
          <el-button type="primary" @click="open2">保存并提交</el-button>
          <el-button type="primary" @click="closecard">取消</el-button>
        </div>
      </el-form>
    </div>
    <div class="searchParams">
      <el-dialog title="样本筛选" :visible.sync="dialogOfSampleP" width="35%">
        <div class="box1">
          <span class="sp1">地面数据时间设置</span>
        </div>
        <div style="padding-left: 10px">
          <span class="sp2">时间范围:</span>
          <el-date-picker
            v-model="dateOfGetSamples"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </div>
        <!-- <div
          style="margin-top: 10px"
          v-if="showCKPlan && showCKPlan.productParam.cldCategory === 7"
        >
          <div class="box1">
            <span class="sp1">土壤采样深度筛选</span>
          </div>
          <div>
            <span class="sp2">采样深度范围</span>
            <el-input v-model="depthVal1"></el-input>
            <span style="margin: 3px">一</span>
            <el-input v-model="depthVal2"></el-input>
          </div>
        </div> -->
        <div
          class="polarization"
          style="margin-top: 10px"
          v-if="showCKPlan && showCKPlan.productParam.cldCategory === 3"
        >
          <div class="box1">
            <span class="sp1">极化方式选择</span>
          </div>
          <div style="padding-left: 10px">
            <span class="sp2">样本极化方式:</span>
            <el-select
              v-model="polarizationMode"
              clearable
              placeholder="请选择"
            >
              <el-option
                v-for="item in polarizationModeOpt"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="dialogOfSampleP = false"
            >取消</el-button
          >
          <el-button type="primary" @click="cardbottomshow">确定</el-button>
        </div>
      </el-dialog>
    </div>
    <div class="cardbottom" v-show="showcardbottom">
      <div class="cardheader">
        <span class="s1">关联地面数据检索</span>
        <el-button
          type="text"
          icon="el-icon-close"
          class="s3"
          @click="closecardbottom"
        ></el-button>
      </div>
      <div class="table">
        <el-table
          ref="singleTable"
          :header-cell-style="{ background: '#E4E9F1' }"
          :cell-style="tableRowClassName"
          :data="simpleDataList"
          style="width: 98%; margin-left: 1%"
          @select="selectItem"
          @select-all="selectAll"
        >
          <el-table-column
            type="selection"
            width="60"
            align="center"
          ></el-table-column>
          <el-table-column label="序号" width="60" align="center" type="index">
          </el-table-column>
          <el-table-column
            prop="uploadDate"
            label="发布时间"
            sortable
            align="center"
          >
          </el-table-column>
          <el-table-column prop="listCode" label="数据编号" align="center">
          </el-table-column>
          <el-table-column prop="collector" label="采集仪器" align="center">
          </el-table-column>
          <el-table-column prop="sampleNum" label="数据条数" align="center">
          </el-table-column>
          <el-table-column
            prop="dateSection"
            label="采集时间区间"
            align="center"
          >
          </el-table-column>
        </el-table>
        <div class="block">
          <Pagination
            :page-sizes="[5, 10, 15]"
            :total="sampleForm.total"
            :page.sync="sampleForm.page"
            :limit.sync="sampleForm.limit"
            @pagination="fakePaging"
          />
        </div>
        <div class="btndiv">
          <el-button type="primary" @click="cancelSamples">取消</el-button>
          <el-button type="primary" @click="submitSamples" :disabled="multiple"
            >确定</el-button
          >
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getProductMsg, getProductMetaMsg } from "@/api/pendingOrder";
import { addOrder, updateProduct } from "@/api/creatOrder";
import {
  getStarSamples,
  insertSampleList,
  addCoverTypeBatch,
  initOrderStage,
  getOtgSamples,
  getLcSamples,
  getSolSamples,
} from "@/api/home";
import Pagination from "@/components/Pagination";
import cu from "@/lib/cesiumUtils";
import qs from "qs";

export default {
  components: { Pagination },
  filters: {
    cldCategoryFilter(cldCategory) {
      const cldCategoryMap = {
        1: "正射校正",
        2: "高程产品",
        5: "干涉测量形变产品",
        3: "后向散射系数",
        4: "大气延迟校正",
        9: "地表粗糙度",
        6: "地表覆盖类型",
        7: "土壤水分",
        8: "地表盐碱度",
        10: "植被高度",
        11: "叶面积指数",
        12: "植被物候",
      };
      return cldCategoryMap[cldCategory];
    },
    groundFeatureFilter(groundFeature) {
      const cldCategoryMap = {
        6: "地表覆盖类型",
        12: "植被物候类型",
      };
      return cldCategoryMap[groundFeature];
    },
    transformByte(size) {
      if (!size) {
        return "0B";
      }
      var num = 1024.0;
      if (size < num) {
        return size + "B";
      }
      if (size < Math.pow(num, 2)) {
        return (size / num).toFixed(2) + "K";
      }
      if (size < Math.pow(num, 3)) {
        return (size / Math.pow(num, 2)).toFixed(2) + "M";
      }
      if (size < Math.pow(num, 4)) {
        return (size / Math.pow(num, 3)).toFixed(2) + "G";
      }
      return (size / Math.pow(num, 4)).toFixed(2) + "T"; // T
    },
    formatDate(inputTime) {
      if (!inputTime && typeof inputTime !== "number") {
        return "";
      }
      var localTime = "";
      inputTime = new Date(inputTime);
      const offset = new Date().getTimezoneOffset();
      localTime = new Date(inputTime - offset * 60000).toISOString();
      localTime = localTime.substr(0, localTime.lastIndexOf("."));
      localTime = localTime.replace("T", " ");
      return localTime;
    },
  },
  data() {
    return {
      btn_gldmclsj: false,
      btn_tjjydd: true,
      proListShow: true,
      showcard: false,
      showcardbottom: false,
      showCKPlan: "",
      // cloud: 0,
      vegetaOptions: [
        {
          value: "选项1",
          label: "草地",
        },
        {
          value: "选项2",
          label: "林地",
        },
        {
          value: "选项3",
          label: "农作物",
        },
      ],

      pData: {
        pid: "",
        spaResolution: "",
        productLevel: 5,
        pickerOptions: {
          disabledDate(time) {
            return time.getTime() > Date.now();
          },
          shortcuts: [
            {
              text: "今天",
              onClick(picker) {
                picker.$emit("pick", new Date());
              },
            },
            {
              text: "昨天",
              onClick(picker) {
                const date = new Date();
                date.setTime(date.getTime() - 3600 * 1000 * 24);
                picker.$emit("pick", date);
              },
            },
            {
              text: "一周前",
              onClick(picker) {
                const date = new Date();
                date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                picker.$emit("pick", date);
              },
            },
          ],
        },
        productDate: "",
        vegetaVal: "",
        satellite: "1米C-SAR卫星",
        coordinateSys: "WGS84",
        maxLat: "101.34222",
        maxLon: "35.34555",
        load: "超精细条带",
        centerPos: "POINT(101.3522,35.888)",
        minLat: "101.36222",
        minLon: "35.36555",
        grdCoverData: [],
      },
      productData: [],
      dialogOfSampleP: false, //样本筛选条件
      dateOfGetSamples: [], //地面数据时间范围
      depthVal1: "", //土壤采样深度范围
      depthVal2: "", //土壤采样深度范围
      polarizationMode: null, //后向散射系数极化方式
      polarizationModeOpt: [
        {
          value: "HH",
          label: "HH",
        },
        {
          value: "HV",
          label: "HV",
        },
        {
          value: "VH",
          label: "VH",
        },
        {
          value: "VV",
          label: "VV",
        },
      ], //后向散射系数极化方式选项
      simpleAllDataList: [], // 全部数据
      simpleDataList: [], // 接口返回数据
      editable: [],
      sampleForm: {
        total: 0,
        page: 1,
        limit: 5,
      },
      // sampleCheckoutData: [], // 多选框所有选中数据
      sampleCheck: [], // 多选框选中数据-存储所有
      multiple: true,
      isLocal: true,
      grdCoverList: [], // 地表覆盖类型
      allCheck: false,

      tifPath: "",
      isSaveMateData: false,
      groTypeName: [],
      groundFeature: "",
    };
  },
  beforeCreate() {
    this.bus.$on("openMenu", (msg) => {
      // this.showRightcard=msg.ifShow;
      this.showCKPlan = msg;
      // console.log("allMsg", msg);
      const productId = msg.productMsg.productId;
      this.pData.pid = msg.productMsg.productId;
      if (productId == undefined) {
        this.$message.error("产品上传存在问题");
        return false;
      }

      const tempFlag = msg.productMsg.productCldCategory;
      this.groundFeature = tempFlag;
      if (tempFlag === 6) {
        this.groTypeName = this.configration.groTypeName;
      } else if (tempFlag === 12) {
        this.groTypeName = this.configration.vegetationPhenologyGroTypeName;
      }

      const cldpId = msg.productParam.cldCategory;

      if (cldpId === 1 || cldpId === 3) this.pData.productLevel = 4;
      else this.pData.productLevel = 5;

      this.productData = [];
      this.productData.push({
        fileName: this.showCKPlan.productMsg.productName,
        fileSize: this.showCKPlan.productMsg.fileSize,
        uploadDate: this.showCKPlan.productMsg.uploadDate,
        proClass: this.showCKPlan.productParam.cldCategory,
        fileFormat: this.showCKPlan.productMsg.fileFormat,
      });
      getProductMsg(qs.stringify({ productId: productId })).then((res) => {
        if (res || res.length !== 0) {
          const r = res[0];
          this.productData[0].uploadDate = r.uploadDate;
          this.tifPath = r.tifPath;
          getProductMetaMsg(qs.stringify({ dataPath: r.tifPath })).then(
            (res) => {
              if (res !== null) {
                (this.pData.satellite = this.changeSatName(
                  msg.productParam.satellite
                )),
                  (this.pData.spaResolution =
                    res.imageResolution > 0.01
                      ? res.imageResolution
                      : (res.imageResolution * 111194.926).toFixed(3) + "米");
                this.pData.coordinateSys = res.coordinateSystem;
                this.pData.maxLat = res.boundBoxMaxY.toFixed(8);
                this.pData.maxLon = res.boundingBoxMaxX.toFixed(8);
                this.pData.load = msg.productParam.load;
                this.pData.centerPos =
                  // "POINT(" +
                  res.centerPosition.x.toFixed(4) +
                  "," +
                  res.centerPosition.y.toFixed(4);
                // +
                // ")";
                this.pData.minLat = res.boundBoxMinY.toFixed(8);
                this.pData.minLon = res.boundBoxMinX.toFixed(8);
              }
            }
          );
        }
      });
    });
  },
  methods: {
    // 提交订单
    clickbtntj() {
      let self = this;
      if (!this.isSaveMateData) {
        self.$message.error("请先提交添加的元数据");
        return false;
      }
      if (self.pData.productDate === "" && self.pData.productLevel === 0) {
        self.$message.error("请选择产品级别以及成像时间");
        return false;
      }
      if (self.sampleCheck === [] || self.sampleCheck.length == 0) {
        self.$message.error("请关联产品范围内的样本");
        return false;
      }
      self
        .$confirm("订单创建成功，确认是否需要提交订单?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
        })
        .then(() => {
          const loading = self.$loading({
            lock: true,
            text: "提交检验订单中",
            spinner: "el-icon-loading",
            background: "rgba(255, 255, 255, 0.6)",
          });
          this.btn_tjjydd = true;
          const pm = self.showCKPlan.productMsg;
          const pp = self.showCKPlan.productParam;
          // console.log('参数测试',pm,pp);
          const of = {
            userId: pm.userId,
            userName: pm.userName,
            orderResource: Number(pp.proApproach), //订单来源
            productUploadId: pm.productId, //上传产品ID
            productSubId: pm.productCldCategory, //产品子类ID
            productId: pm.productCategory, //产品ID
            satelliteId: Number(pp.satellite), //卫星ID
            satelliteName: self.changeSatName(pp.satellite), //卫星名称
            satelliteLoadName: pp.load, //载荷名称
            simpleStartTime: this.$moment(this.dateOfGetSamples[0]).format(
              "YYYY-MM-DD"
            ),
            simpleEndTime: this.$moment(this.dateOfGetSamples[1]).format(
              "YYYY-MM-DD"
            ),
          };
          //设置订单处理方法ID,订单处理方法描述
          if (pp.pixelDealFun !== "")
            (of.pcMethodId = Number(pp.pixelDealFun)),
              (of.pcMethodDesc = self.transformPcMethod(pp.pixelDealFun));

          // 设置检验方法ID
          if (pp.truthCheckFun.length !== 0)
            of.vlMethodId = JSON.stringify(pp.truthCheckFun);

          // 设置抽样方法ID，抽样方法名
          if (pp.sampleFun !== [] && pp.sampleFun.length !== 0) {
            of.splMethodId = Number(pp.sampleFun[0]);
            of.splMethodName = self.transformSlp(pp.sampleFun[0]);
            if (pp.sampleFun[0] === "1") {
              of.samplingMethodCldId = Number(pp.sampleFun[1]);
            }
          }

          const orderForm = new FormData();
          for (var i in of) {
            orderForm.append(i, of[i]);
          }
          // 提交订单
          addOrder(orderForm).then((res) => {
            if (res.msg === "信息入库成功") {
              const orderId = res.orderId;
              // 添加样本数据
              const sampleF = new FormData();
              sampleF.append("orderId", orderId);
              sampleF.append("sampleList", JSON.stringify(this.sampleCheck));
              sampleF.append("productType", pm.productCldCategory);
              insertSampleList(sampleF).then((res) => {
                // console.log(res);
                if (res.msg === "操作成功") {
                  this.$message({
                    type: "success",
                    message: "订单提交成功",
                  });
                  this.btn_tjjydd = true;
                  this.proListShow = false;
                  loading.close();
                }
              });
              // 添加地表覆盖物类型
              if (this.grdCoverList.length > 0) {
                const temp = this.grdCoverList.map((item) => {
                  return {
                    ...item,
                    orderId,
                  };
                });
                addCoverTypeBatch(temp).then((res) => {
                  // console.log(res);
                  this.grdCoverList = [];
                });
              }

              //初始化订单状态
              const ios = new FormData();
              ios.append("orderId", orderId);
              ios.append("userId", pm.userId);
              initOrderStage(ios);
              this.btn_gldmclsj = true;
              //清除产品图层和样本点
              cu.clearLayers();
              cu.removePoint();
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    // 卫星枚举转换
    changeSatName(satelliteId) {
      const satelliteIdMap = {
        0: "1米C-SAR卫星",
        1: "3米L-SAR卫星",
        2: "5米S-SAR卫星",
        3: "高轨20米SAR卫星",
      };
      return satelliteIdMap[satelliteId];
    },
    // 抽样方法枚举转换
    transformSlp(sampleFun) {
      const sampleFunMap = {
        0: "随机抽样",
        1: "分层抽样",
        2: "等距抽样",
      };
      if (sampleFun == null) return null;
      else return sampleFunMap[sampleFun];
    },
    // 像元级方法枚举转换
    transformPcMethod(pixelDealFun) {
      const pixelDealFunMap = {
        0: "均值法",
        1: "最邻近法",
        2: "克里格法",
        3: "块克里格法",
        4: "MSN法",
      };
      if (pixelDealFun == null) return null;
      else return pixelDealFunMap[pixelDealFun];
    },
    // 选择提交样本数据
    submitSamples() {
      if (this.sampleCheck.length !== 0) {
        if (this.pData.productDate) {
          this.btn_tjjydd = false;
        }
        this.showcardbottom = false;
        this.$message({
          type: "success",
          message: "地面测量数据关联成功",
        });
      }

      // const sampleF = new FormData();
      // sampleF.append("orderId",57);
      // sampleF.append("sampleList",JSON.stringify(this.sampleCheck));
      // sampleF.append("productType",6);
      // insertSampleList(sampleF).then(res=>{
      //   if(res.msg === "操作成功"){
      //     this.$message({
      //       type: "success",
      //       message: "订单提交成功",
      //     });
      //   }
      // })
    },
    // 取消关联地面测量数据
    cancelSamples() {
      this.showcardbottom = false;
      cu.removePoint();
      this.sampleCheck = [];
    },
    openSearchPanal() {
      this.dialogOfSampleP = true;
    },
    // 假分页展示数据
    fakePaging() {
      // console.log(this.sampleForm);
      const start = (this.sampleForm.page - 1) * this.sampleForm.limit;
      this.simpleDataList = this.simpleAllDataList.slice(
        start,
        start + this.sampleForm.limit
      );

      // console.log('当前选中的数据', this.sampleCheck)
      // console.log('当前页面的数据', this.simpleDataList)
      this.$nextTick(() => {
        this.sampleCheck.forEach((item) => {
          // console.log(item)
          this.$refs.singleTable.toggleRowSelection(item, true);
        });
      });
    },
    // 查询样本数据
    cardbottomshow() {
      const self = this;
      const pdId = self.showCKPlan.productMsg.productCldCategory;
      if (self.dateOfGetSamples.length == 0) {
        this.$message({
          type: "warning",
          message: "请输入样本日期范围",
        });
        return false;
      }
      if (!self.polarizationMode && pdId === 3) {
        this.$message({
          type: "warning",
          message: "请选择极化方式",
        });
        return false;
      }
      self.dialogOfSampleP = false;
      let xlPath;
      switch (pdId) {
        case 1:
          xlPath = this.configration.url.otgSamplesPath;
          break;
        case 6:
          xlPath = this.configration.url.lcSamplesPath;
          break;
        case 12:
          xlPath = this.configration.url.vpSamplePath;
          break;
        case 2:
          xlPath = this.configration.url.demSamplePath;
          break;
        case 3:
          xlPath = this.configration.url.bscSamplePath;
          break;
        case 4:
          xlPath = this.configration.url.adcSamplePath;
          break;
        case 5:
          xlPath = this.configration.url.dSamplePath;
          break;
        case 7:
          xlPath = this.configration.url.solSamplesPath;
          break;
        case 8:
          xlPath = this.configration.url.ssiSamplePath;
          break;
        case 9:
          xlPath = this.configration.url.srSamplePath;
          break;
        case 10:
          xlPath = this.configration.url.gvhSamplePath;
          break;
        case 11:
          xlPath = this.configration.url.glaiSamplePath;
          break;
      }
      const st = this.$moment(this.dateOfGetSamples[0]).format("YYYY-MM-DD");
      const et = this.$moment(this.dateOfGetSamples[1]).format("YYYY-MM-DD");
      getStarSamples({
        filePath: xlPath,
        startTime: st,
        endTime: et,
        tifPath: this.tifPath,
        productType: pdId,
      }).then((res) => {
        if (res.code === 500) {
          self.$message({
            message: res.msg,
            type: "error",
          });
          return;
        }
        self.showcardbottom = true;
        // console.log('样本数据',res)
        if (res.data.length !== 0) {
          self.$message({
            message: "查询样本数据成功",
            type: "success",
          });
          // console.log("111111", this.sampleForm);
          self.simpleAllDataList = res.data;
          const start = (this.sampleForm.page - 1) * this.sampleForm.limit;
          self.simpleDataList = self.simpleAllDataList.slice(
            start,
            start + self.sampleForm.limit
          );
          self.sampleForm.total = res.data.length;

          // 二次之后关联 清空选中样本点
          this.sampleCheck = [];
          // 二次之后关联 清空样本点
          cu.removePoint();
        }
      });
      this.bus.$emit("closeleftcard", false);
    },
    // 修改地表覆盖
    changeNum(index, className) {
      // grdCoverData为表格数据
      this.editable = new Array(this.pData.grdCoverData.length);
      this.editable[index] = true;
      this.saveItem = this.pData.grdCoverData[index];
      this.$set(this.editable, index, true);
      //让input自动获取焦点
      this.$nextTick(function () {
        var editInputList = document.getElementsByClassName(className);
        editInputList[0].children[0].focus();
      });
    },
    addLaCovT() {
      const firstLabel = this.groTypeName[0].label;
      this.pData.grdCoverData.push({ groClaName: firstLabel, pixelNum: "1" });
    },
    removeLaCovT(index) {
      this.pData.grdCoverData.splice(index, 1);
    },
    closecardbottom() {
      this.showcardbottom = false;
    },
    // 保存并提交元数据
    open2() {
      this.$refs["pData"].validate((valid) => {
        if (valid) {
          const pid = this.pData.pid;

          if (pid === undefined) {
            {
              this.$message.error("请检查产品数据");
              return false;
            }
          }
          // 重复性校验 地物类型名称、像素实际值各自校验各自
          const gcd = this.pData.grdCoverData;
          if (gcd.length > 0) {
            let coverTypeList = [];
            for (let item of gcd) {
              if (item.pixelNum.length === 0 || Number(item.pixelNum) < 0) {
                this.$message({
                  type: "warning",
                  message: "像素实际值须为大于0的数字",
                });
                return;
              }
              const tempCoverType = coverTypeList.filter(
                (coverType) => coverType.typeName === item.groClaName
              );
              const tempPixel = coverTypeList.filter(
                (coverType) => coverType.typeId === item.pixelNum
              );
              if (tempCoverType.length > 0) {
                this.$message({
                  type: "warning",
                  message: "地物类型名称有重复项，请重新填写",
                });
                return;
              }
              if (tempPixel.length > 0) {
                this.$message({
                  type: "warning",
                  message: "像素实际值有重复项，请重新填写",
                });
                return;
              }
              coverTypeList.push({
                typeName: item.groClaName,
                typeId: item.pixelNum,
              });
            }
            this.grdCoverList = coverTypeList;
          }

          const upf = {
            productId: pid,
            productDate: this.pData.productDate, //订单来源
            productLevel: Number(this.pData.productLevel), //上传产品ID
          };

          const upProductForm = new FormData();
          for (var i in upf) {
            upProductForm.append(i, upf[i]);
          }
          updateProduct(upProductForm).then((res) => {
            if (res.msg === "success") {
              this.showcard = false;
              this.$message({
                message: "参数设置成功",
                type: "success",
              });
              this.isSaveMateData = true;
              if (this.sampleCheck.length !== 0) {
                this.btn_tjjydd = false;
              }
            }
          });
        } else {
          this.$message({
            message: "时间不能为空值！",
            type: "error",
          });
        }
      });
    },

    submitMetaMsg() {
      console.log(this.pData.grdCoverData);
    },
    closecard() {
      this.showcard = false;
    },
    cardshow() {
      this.showcard = true;
    },
    tableRowClassName({ rowIndex }) {
      if ((rowIndex + 1) % 2 !== 0) {
        return "background:#F5F7FA";
      } else {
        return "background:#FFFFFF";
      }
    },
    selectItem(selection, row) {
      // console.log('selection', selection, row)
      // 判断是取消还是选中--length > 0就是取消选中，length === 0就是即将选中
      const tempList = this.sampleCheck.filter(
        (item) => item.listCode === row.listCode
      );
      if (tempList.length > 0) {
        // 取消勾选
        this.sampleCheck = this.sampleCheck.filter(
          (item) => item.listCode !== row.listCode
        );
      } else {
        // 勾选
        this.sampleCheck.push(row);
      }
      // console.log('当前选中的数据', this.sampleCheck)
      this.handleSelectionChange(this.sampleCheck);
    },
    selectAll(selection) {
      // console.log('select-all', selection)
      if (!this.allCheck) {
        this.sampleCheck = this.simpleAllDataList;
        this.allCheck = true;
      } else {
        this.sampleCheck = [];
        this.$refs.singleTable.clearSelection();
        this.allCheck = false;
      }
      this.handleSelectionChange(this.sampleCheck);
    },
    handleSelectionChange(val) {
      this.sampleCheck = val;
      cu.removePoint();
      if (val.length !== 0) {
        this.multiple = false;
        let spa = [];
        for (let i in val) {
          const sp = val[i].sampleList;
          for (let j in sp) {
            const lon = Number(sp[j].lon);
            const lat = Number(sp[j].lat);
            const alt = Number(sp[j].alt);
            spa.push({ lon: lon, lat: lat, alt: alt });
          }
        }
        for (let i in spa) {
          cu.addPoint(spa[i].lon, spa[i].lat, spa[i].alt);
        }
      } else {
        this.multiple = true;
      }
    },
  },
};
</script>
<style scoped lang='less'>
.btndiv {
  // margin-top: 10px;
  margin-bottom: 10px;
  text-align: center;
  /deep/.el-button--primary {
    width: 240px;
    margin: 0 60px;
    color: #fff;
    background-color: #354595;
    border-color: #354595;
  }
  /deep/.el-button--primary:hover {
    color: #fff;
    background-color: #6d7ab6;
    border-color: #6d7ab6;
  }
  /deep/.el-button--primary.is-disabled {
    color: #fff;
    background-color: #6d7ab6;
    border-color: #6d7ab6;
  }
}

.block {
  // margin-top: 10px;
  // margin-bottom: 10px;
  text-align: center;
  /deep/.el-pagination.is-background .el-pager li:not(.disabled).active {
    background-color: #354595;
  }
}
.table {
  border-top: 3px solid gainsboro;
  padding-top: 10px;
  /deep/.el-table th {
    padding: 6px 0;
  }
  /deep/.el-table td {
    padding: 5px 0;
  }
  /deep/.el-checkbox__input.is-checked .el-checkbox__inner {
    background-color: #354595;
    border-color: #354595;
  }
  /deep/.el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: #354595;
    border-color: #354595;
  }
}
.cardbottom {
  width: 100%;
  // height: 300px;
  position: absolute;
  bottom: 0;
  background-color: white;
  z-index: 9;
  border-radius: 4px;
}
/deep/.el-button {
  padding: 8px 15px;
}
.btngr {
  text-align: center;
  padding: 15px;
  /deep/.el-button--primary {
    color: #fff;
    background-color: #354595;
    border-color: #354595;
  }
  /deep/.el-button--primary:hover {
    color: #fff;
    background-color: #6d7ab6;
    border-color: #6d7ab6;
  }
  /deep/.el-button--primary.is-disabled {
    color: #fff;
    background-color: #6d7ab6;
    border-color: #6d7ab6;
  }
}
.line {
  height: 30px;
  line-height: 30px;
  position: relative;
  margin-top: 10px;
  margin-bottom: 10px;
  .sp1 {
    display: inline-block;
    vertical-align: top;
    position: absolute;
    left: 0;
  }
  .inp1 {
    display: inline-block;
    vertical-align: top;
    width: 135px;
    position: absolute;
    right: 0;
    /deep/.el-input__inner {
      height: 30px;
      width: 150px;
    }
  }
  .sel1 {
    display: inline-block;
    vertical-align: top;
    width: 135px;
    position: absolute;
    right: 0;
    /deep/.el-input__inner {
      height: 30px;
      width: 150px;
    }
    border-color: transparent;
  }
}
.showcard {
  margin-left: 15px;
  margin-right: 15px;
  // height: 300px;
  // border-top: 2px solid gainsboro;
  .left {
    display: inline-block;
    vertical-align: top;
    // margin-top: 20px;
    width: 45%;
    // background-color: gold;
  }
  .right {
    display: inline-block;
    vertical-align: top;
    margin-left: 30px;
    // margin-top: 20px;
    width: 45%;
    // background-color: gold;
  }
}
/deep/.el-slider__bar {
  background-color: #354595;
}
/deep/.el-slider__button {
  border-color: #354595;
}
.slidercloud {
  display: inline-block;
  vertical-align: top;
  width: 420px;
}
.line1 {
  display: inline-block;
}
.line2 {
  display: inline-block;
  margin-left: 20px;
}
.timeCardlineinput {
  display: inline-block;
  width: 150px;
  /deep/.el-input__inner {
    height: 30px;
    width: 125px;
  }
  /deep/.el-date-editor.el-input,
  .el-date-editor.el-input__inner {
    margin-left: 45px;
  }
}
/deep/.line2 .el-icon-time:before {
  content: "\e78e";
}

/deep/.el-select .el-input.is-focus .el-input__inner {
  border-color: #354595;
}
.cardlineinput2 {
  display: inline-block;
  width: 200px;
  /deep/.el-input__inner {
    height: 30px;
  }
  /deep/.el-input__inner:focus {
    border-color: #354595;
  }
}

.cardlineinput {
  display: inline-block;
  width: 150px;
  /deep/.el-input__inner {
    height: 30px;
    width: 125px;
    margin-left: 15px;
  }
}

.cardlinelabel {
  display: inline-block;
  // color: #606266;
  // font-size: 14px;
  margin-right: 15px;
}
.cardline {
  margin-left: 15px;
  height: 40px;
  line-height: 40px;
}
// .radiolabel {
//   // color: #606266;
//   // font-size: 14px;
// }
.radiolabel:after {
  // content: "*";
  color: #f56c6c;
  margin-left: 4px;
  margin-right: 20px;
}
.imageTime:after {
  content: "*";
  color: #f56c6c;
  margin-left: 4px;
  margin-right: 20px;
}
.radiogroup {
  margin-left: 60px;
}
/deep/.el-radio__inner {
  border: 1px solid #606266;
}
/deep/.el-radio__inner::after {
  background-color: #354595;
}
/deep/.el-radio__input.is-checked .el-radio__inner {
  border: 2.5px solid #354595;
  background: white;
}
/deep/.el-radio__input.is-checked + .el-radio__label {
  color: #606266;
}
.cardbtngroup {
  padding: 10px;
  text-align: center;
  .el-button {
    margin: 0 30px;
  }
  /deep/.el-button--primary.is-disabled,
  .el-button--primary.is-disabled:active,
  .el-button--primary.is-disabled:focus,
  .el-button--primary.is-disabled:hover {
    color: #fff;
    background-color: gainsboro;
    border-color: gainsboro;
  }
}
/deep/.el-table th > .cell {
  color: #354595;
}
.cardgroup {
  width: 550px;
  position: absolute;
  // height: 300px;
  right: 0;
  top: 70px;
}

/deep/.cardgroup .el-table th > .cell {
  color: #354595;
  font-size: 13px;
}
/deep/.cardgroup .el-table td > .cell {
  font-size: 12px;
}
.card {
  background-color: white;
  z-index: 2;
  border-radius: 4px;
  border: none;
}
.cardtable {
  border-top: 2px solid gainsboro;
  padding-top: 10px;
}
.cardheader {
  height: 44px;
  // margin-top: 10px;
  background-color: white;
  line-height: 44px;
  border-radius: 4px;
  .s1 {
    font-size: 25px;
    font-family: "PingFangSC-Medium", sans-serif;
    color: #354595;
    margin-left: 20px;
    font-weight: 600;
  }
  .s2 {
    position: absolute;
    // top: 10px;
    right: 20px;
    font-size: 15px;
    font-family: "PingFangSC-Medium", sans-serif;
    color: #354595;
    cursor: pointer;
  }
  .s3 {
    position: absolute;
    top: 10px;
    right: 20px;
    color: #354595;
    cursor: pointer;
  }
}
.cardheader2 {
  height: 40px;
  background-color: #e4e9f1;
  line-height: 40px;
  border-radius: 4px;
  position: relative;
  .s3 {
    font-size: 18px;
    font-family: "PingFangSC-Medium", sans-serif;
    color: #354595;
    margin-left: 15px;
    font-weight: bolder;
  }
  .s4 {
    position: absolute;
    top: 5px;
    right: 0px;
    color: #354595;
    cursor: pointer;
  }
}
/deep/.searchParams .el-dialog__body {
  padding: 10px 15px;
}
// /deep/.searchParams .el-range-editor.el-input__inner {
//   width: 240px;
// }
/deep/.searchParams .el-input {
  width: 80px;
}
/deep/.searchParams .el-input__inner {
  height: 35px;
  line-height: 35px;
}
/deep/.searchParams .el-dialog__footer {
  text-align: center;
}
/deep/.polarization .el-input {
  width: 140px;
}
.box1 {
  height: 40px;
  line-height: 40px;
  margin-bottom: 10px;
  .sp1 {
    font-size: 18px;
    margin-left: 10px;
    font-weight: 600;
  }
}
.sp2 {
  font-size: 16px;
  margin-right: 10px;
  margin-left: 10px;
}
/deep/.cardgroup .el-input--suffix .el-input__inner {
  padding-right: 20px;
}
</style>
