浏览代码

Merge branch 'master' of http://114.244.114.158:8802/siwei/real3d-portalsite

lkk 11 月之前
父节点
当前提交
9543fa6b4c
共有 2 个文件被更改,包括 139 次插入36 次删除
  1. 93 0
      src/components/mapView/custom-form.vue
  2. 46 36
      src/components/mapView/tablePage.vue

+ 93 - 0
src/components/mapView/custom-form.vue

@@ -0,0 +1,93 @@
+<template>
+  <el-form
+    ref="formRef"
+    class="custom-form"
+    :model="model"
+    inline
+    :rules="rules"
+    v-bind="$attrs"
+  >
+    <div v-for="(row, index) in config" :key="index" class="line">
+      <template v-if="Array.isArray(row)">
+        <el-row :gutter="20">
+          <el-col
+            v-for="(rowItem, ind) in row"
+            :key="rowItem.label || ind"
+            :span="rowItem.span || 24"
+          >
+            <el-form-item
+              :label="rowItem.label"
+              :prop="rowItem.prop"
+              v-if="rowItem.componentIf ? rowItem.componentIf : true"
+            >
+              <slot :name="rowItem.prop" />
+              <component
+                ref="componentRef"
+                :style="{ width: '100%' }"
+                :is="rowItem.component"
+                v-bind="rowItem['componentProps']"
+                v-model="model[rowItem.prop]"
+                :propName="rowItem.prop"
+                @handleChange="handleChange"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </template>
+    </div>
+  </el-form>
+</template>
+
+<script>
+export default {
+  props: {
+    model: Object,
+    rules: Object,
+    config: Array,
+  },
+  data() {
+    return {
+      map: null,
+    };
+  },
+  mounted() {},
+  methods: {
+    handleChange({ propName, value }) {
+      this.model[propName] = value;
+      this.$emit("update:model", this.model);
+      // this.$emit('handleChange', value)
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.custom-form {
+  .line {
+    width: 100%;
+    position: relative;
+  }
+  /deep/.el-form-item {
+    width: 100%;
+  }
+  /deep/.el-form-item__label {
+    font-size: 14px;
+    font-weight: 400;
+    color: #babdc1;
+    height: 39px;
+    line-height: 39px;
+  }
+  /deep/.el-input__inner {
+    // width: 188px;
+    height: 32px;
+    background: #0d264e;
+    border: 1px solid #1a7de3;
+    border-radius: 4px;
+  }
+  /deep/.el-textarea__inner {
+    background: #0d264e;
+    border: 1px solid #1a7de3;
+    border-radius: 4px;
+  }
+}
+</style>

+ 46 - 36
src/components/mapView/tablePage.vue

@@ -1,9 +1,9 @@
 <template>
 <template>
   <div class="cont-table">
   <div class="cont-table">
     <!-- :image="nonedataImg"  -->
     <!-- :image="nonedataImg"  -->
-    <el-empty description=" " v-if="props.table.data.length == 0" />
+    <el-empty description=" " v-if="table.data.length == 0" />
     <el-table
     <el-table
-      :data="props.table.data"
+      :data="table.data"
       v-else
       v-else
       style="width: 100%"
       style="width: 100%"
       :show-overflow-tooltip="true"
       :show-overflow-tooltip="true"
@@ -12,7 +12,7 @@
       fit
       fit
     >
     >
       <el-table-column
       <el-table-column
-        v-for="(item, index) in props.cloumn"
+        v-for="(item, index) in cloumn"
         :prop="item.prop"
         :prop="item.prop"
         :label="item.label"
         :label="item.label"
         :key="index"
         :key="index"
@@ -29,10 +29,10 @@
         </template>
         </template>
       </el-table-column>
       </el-table-column>
     </el-table>
     </el-table>
-    <div class="tabs-pagation" v-if="props.table.data.length">
-      <div class="font">共{{ props.table.total }}条记录</div>
+    <div class="tabs-pagation" v-if="table.data.length">
+      <div class="font">共{{ table.total }}条记录</div>
       <!-- <el-pagination class="tabone-pagination" background layout="prev, pager, next" :current-page="pageNum"
       <!-- <el-pagination class="tabone-pagination" background layout="prev, pager, next" :current-page="pageNum"
-            :pager-count="5" :page-size="5" :total="props.table.total" @current-change="changePage" /> -->
+            :pager-count="5" :page-size="5" :total="table.total" @current-change="changePage" /> -->
       <el-pagination
       <el-pagination
         :current-page="pageNum"
         :current-page="pageNum"
         :page-size="pageSize"
         :page-size="pageSize"
@@ -41,43 +41,53 @@
         :background="true"
         :background="true"
         layout="prev, pager, next, jumper,sizes"
         layout="prev, pager, next, jumper,sizes"
         :page-sizes="[10, 15, 20, 30, 50]"
         :page-sizes="[10, 15, 20, 30, 50]"
-        :total="props.table.total"
+        :total="table.total"
         @size-change="handleSizeChange"
         @size-change="handleSizeChange"
         @current-change="changePage"
         @current-change="changePage"
       />
       />
     </div>
     </div>
   </div>
   </div>
 </template>
 </template>
-  <script lang="ts" setup>
-import { ref } from "vue";
+<script >
+export default {
+  components: {},
+  props: {
+    cloumn: {
+      type: Array,
+      default: [],
+    },
+    table: {
+      type: Object,
+    },
+  },
+  data() {
+    return {
+      pageNum: 1,
+      pageSize: 10,
+    };
+  },
+  mounted() {},
+  methods: {
+    // 搜索
+    searchFun() {
+      this.$emit("search", {
+        pageIndex: this.pageNum,
+        size: this.pageSize,
+      });
+    },
 
 
-const emit = defineEmits(["search"]);
-
-type Props = {
-  cloumn: any;
-  table: any;
-};
-const props = withDefaults(defineProps<Props>(), {});
-
-// 搜索
-const searchFun = () => {
-  emit("search", {
-    pageIndex: pageNum.value,
-    size: pageSize.value,
-  });
-};
-
-let pageNum = ref(1);
-let pageSize = ref(10);
-
-// 修改当前页数
-const changePage = (v: number) => {
-  pageNum.value = v;
-  searchFun();
-};
-const handleSizeChange = (v: number) => {
-  pageSize.value = v;
-  searchFun();
+    // 修改当前页数
+    changePage(v) {
+      this.pageNum = v;
+      this.searchFun();
+    },
+    handleSizeChange(v) {
+      this.pageSize = v;
+      this.searchFun();
+    },
+  },
+  beforeDestroy() {},
+  watch: {},
 };
 };
 
 
 // searchFun()
 // searchFun()