管道基础大数据平台系统开发-【前端】-新系統界面
surprise
2024-05-09 e897fc3d35f8e5dfa56d5f0c80a655ccf99202cf
src/views/Tools/setPellucidity.vue
@@ -6,19 +6,45 @@
    width="400px"
    @cancel="close(false)"
  >
    <el-input
    <el-row :gutter="20">
      <el-col :span="4">
        <el-button
          @click="alphaChange(1)"
          icon="el-icon-minus"
          size="small"
        ></el-button>
      </el-col>
      <el-col :span="16">
        <el-slider
          v-model="modelForm.alpha"
          :min="0"
          :step="0.1"
          :max="1"
          @change="update()"
        >
        </el-slider>
      </el-col>
      <el-col :span="4">
        <el-button
          @click="alphaChange(2)"
          icon="el-icon-plus"
          size="small"
        ></el-button>
      </el-col>
    </el-row>
    <!-- <el-input
      size="small"
      v-model="modelForm.alpha"
      @input="update"
    ></el-input>
    <el-slider
      v-model="modelForm.alpha"
      @input="update"
      :min="0"
      :step="0.01"
      :max="1"
    ></el-slider>
    </el-form>
      v-model="modelForm.alpha1"
      @input="update2"
    ></el-input> -->
    <!-- <el-slider
      @input="update1"
      show-input
    >
    </el-slider> -->
  </Popup>
</template>
@@ -36,7 +62,8 @@
    return {
      title: "透明度",
      modelForm: {
        alpha: 1
        alpha: 1,
      },
      titleset: null,
      index: null,
@@ -70,10 +97,39 @@
    changeToken(token) {
      this.mapCollection.tokne = token;
    },
    update2() {
      this.modelForm.alpha = this.modelForm.alpha1;
      this.update();
    },
    update1() {
      this.modelForm.alpha1 = this.modelForm.alpha;
      this.update();
    },
    alphaChange(res) {
      switch (res) {
        case 1:
          if (this.modelForm.alpha <= 0) {
            this.modelForm.alpha = 0
          } else {
            this.modelForm.alpha = this.modelForm.alpha - 0.1
          }
          this.update()
          break;
        case 2:
          if (this.modelForm.alpha >= 1) {
            this.modelForm.alpha = 1
          } else {
            this.modelForm.alpha = this.modelForm.alpha + 0.1
          }
          this.modelForm.alpha = this.modelForm.alpha.toFixed(1)
          this.update()
          break;
      }
    },
    update() {
      this.titleset.style = new Cesium.Cesium3DTileStyle({
        color: "color('rgba(255,255,255," + this.modelForm.alpha + ")')",
      });
@@ -98,10 +154,11 @@
      if (this.index != null) {
        this.modelForm.alpha = list[this.index].alpha;
        this.modelForm.alpha1 = list[this.index].alpha;
      } else {
        this.modelForm.alpha = 1;
        this.modelForm.alpha1 = 1;
      }
    },