1. 完成表格模块的功能迁移； 2. 完成表格、折线图、地图标记三者点击联动

riku

2024-05-08 f16acb06ab278cdcb1d39a29680634010638326d

 src/components/SliderBar.vue

@@ -3,6 +3,7 @@
    <el-form-item label="数据量">
      <el-select
        v-model="pageSize"
        @change="handleSizeChange"
        placeholder="数据量"
        size="small"
        class="w-60"
@@ -12,16 +13,22 @@
      </el-select>
    </el-form-item>
    <div class="slider-wrap m-l-16">
      <el-slider v-model="progress" :marks="marks" />
      <el-slider :model-value="progress" :marks="marks" @input="handleInput" />
    </div>
  </el-row>
</template>
<script>
export default {
  props: {
    progress: {
      type: Number,
      default: 0
    }
  },
  emits: ['update:progress', 'sizeChange'],
  data() {
    return {
      pageSize: 200,
      progress: 0,
      marks: {
        0: {
          style: {
@@ -37,6 +44,15 @@
        }
      }
    };
  },
  methods: {
    handleInput(e) {
      // console.log(e);
      this.$emit('update:progress', e);
    },
    handleSizeChange(e) {
      this.$emit('sizeChange', e);
    }
  }
};
</script>