11

WX

2023-07-14 23aac3cf9903d404eb86310d502a0eeb5a68b407

 src/views/layer/attributeList.vue

@@ -2,14 +2,14 @@
  <div v-drag="true" class="spatialBox">
    <!--     v-resizable="'right, bottom'" -->
    <div class="spatialTitle">
      <label>空间查询</label>
      <el-icon @click="setSpatialClose" :size="20">
      <label>属性</label>
      <el-icon @click="setSpatialClose" :size="20" style="cursor: pointer">
        <Close />
      </el-icon>
    </div>
    <div class="spatialContent">
      <div class="spatialTable">
        <el-table :data="tableData" style="width: 100%; height: 73%">
        <el-table :data="tableData" style="width: 100%; height: 82%">
          <el-table-column
            v-for="(item, index) in attributeData"
            :key="index"
@@ -48,6 +48,7 @@
  defineProps,
  defineEmits,
  nextTick,
  watch,
} from "vue";
import config from "@/assets/js/Map/config";
import { User, Lock, Plus } from "@element-plus/icons-vue";
@@ -55,9 +56,9 @@
import { ElMessage } from "element-plus";
import store from "@/store";

const emits = defineEmits(["SETspatialClose"]);
const emits = defineEmits(["spatialClose"]);
const setSpatialClose = () => {
  emits("SETspatialClose", false);
  emits("spatialClose", false);
};
const dialogVisible = ref(false);
const listData = ref({
@@ -79,6 +80,12 @@
  value: "",
  cut: "",
});

//defineProps 来接收组件的传值
const props = defineProps({
  layerData: Object,
});

const handleSizeChange = (res) => {
  listData.value.pageSize = res;
  setQueySpatialData();
@@ -103,10 +110,8 @@
  if (data.code != 200) {
    return ElMessage.error("字段查询失败");
  }
  console.log(data);
  attributeData.value = data.result;

  console.log(attributeData.value);
  attributeData.value = data.result;

  conditionChange(data.result[0]);
  setQueySpatialData();
@@ -144,9 +149,16 @@
  //
  setQueySpatialFields();
};
onMounted(() => {
  startQueryData();
});

watch(
  () => props.layerData,
  (nVal, oVal) => {
    // console.log("值发生了变更", nVal, oVal);
    startQueryData();
  },
  { deep: true }
);
onMounted(() => {});
</script>

<style lang="less" scoped>
@@ -157,7 +169,7 @@
  flex-direction: column;
  position: absolute;
  bottom: 5%;
  right: 5%;
  left: 100%;
  background: rgba(7, 8, 14, 0.8);
  border: 1px solid #d6e4ff;
  z-index: 10;
@@ -276,25 +288,25 @@
}
</style>
<style lang="less">
.el-scrollbar {
  background: rgba(7, 8, 14) !important;
  border: 1px solid #4472cb;
  color: #d6e4ff !important;
  box-shadow: inset 0px 1px 40px 1px rgba(38, 47, 71, 1);
  // .el-dropdown-menu {
  //   background: rgba(7, 8, 14, 0.8) !important;
  // }
  .el-select-dropdown__item {
    color: #d6e4ff;
  }
  .el-select-dropdown__item:hover {
    background: rgba(38, 47, 71, 1) !important;
  }
  .el-select-dropdown__item.hover,
  .el-select-dropdown__item:hover {
    background: rgba(38, 47, 71, 1) !important;
  }
}
// .el-scrollbar {
//   background: rgba(7, 8, 14) !important;
//   border: 1px solid #4472cb;
//   color: #d6e4ff !important;
//   box-shadow: inset 0px 1px 40px 1px rgba(38, 47, 71, 1);
//   // .el-dropdown-menu {
//   //   background: rgba(7, 8, 14, 0.8) !important;
//   // }
//   .el-select-dropdown__item {
//     color: #d6e4ff;
//   }
//   .el-select-dropdown__item:hover {
//     background: rgba(38, 47, 71, 1) !important;
//   }
//   .el-select-dropdown__item.hover,
//   .el-select-dropdown__item:hover {
//     background: rgba(38, 47, 71, 1) !important;
//   }
// }
.el-table__header-wrapper {
  border: 1px siolid #409eff;
}