|
|
@@ -0,0 +1,190 @@
|
|
|
+``````````````````Q<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <customForm ref="formRef" :model="queryParams" :config="FormConfig">
|
|
|
+ <template #link>
|
|
|
+ <el-select
|
|
|
+ v-model="pageObj.query_links"
|
|
|
+ placeholder="请选择实体关系"
|
|
|
+ clearable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in linkList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.value"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ <template #action>
|
|
|
+ <el-button type="primary" icon="Search" @click="handleQuery"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ <el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
|
+ </template>
|
|
|
+ </customForm>
|
|
|
+ <el-table :data="tableData" style="width: 100%">
|
|
|
+ <el-table-column prop="date" label="行政区" width="150" align="center" />
|
|
|
+ <el-table-column label="违法用地" header-align="center">
|
|
|
+ <el-table-column prop="name" label="图斑数" align="center" />
|
|
|
+ <el-table-column label="面积" align="center">
|
|
|
+ <el-table-column prop="state" label="图斑面积" width="120" />
|
|
|
+ <el-table-column prop="city" label="耕地面积" width="120" />
|
|
|
+ <el-table-column prop="zip" label="永久基本农田面积" />
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="商业服务用地">
|
|
|
+ <el-table-column prop="name" label="图斑数" />
|
|
|
+ <el-table-column label="面积">
|
|
|
+ <el-table-column prop="state" label="图斑面积" width="120" />
|
|
|
+ <el-table-column prop="city" label="耕地面积" width="120" />
|
|
|
+ <el-table-column prop="zip" label="永久基本农田面积" />
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="住宅用地">
|
|
|
+ <el-table-column prop="name" label="图斑数" width="120" />
|
|
|
+ <el-table-column label="面积">
|
|
|
+ <el-table-column prop="state" label="图斑面积" width="120" />
|
|
|
+ <el-table-column prop="city" label="耕地面积" width="120" />
|
|
|
+ <el-table-column prop="zip" label="永久基本农田面积" />
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="xx用地">
|
|
|
+ <el-table-column prop="name" label="图斑数" />
|
|
|
+ <el-table-column label="面积">
|
|
|
+ <el-table-column prop="state" label="图斑面积" width="120" />
|
|
|
+ <el-table-column prop="city" label="耕地面积" width="120" />
|
|
|
+ <el-table-column prop="zip" label="永久基本农田面积" />
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 表格数据 -->
|
|
|
+
|
|
|
+ <pagination
|
|
|
+ v-show="total > 0"
|
|
|
+ :total="total"
|
|
|
+ :page="queryParams.pageNum"
|
|
|
+ :limit="queryParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup name="Role">
|
|
|
+import customForm from "@/components/custom-form.vue";
|
|
|
+
|
|
|
+const router = useRouter();
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
|
|
|
+const FormConfig = ref([
|
|
|
+ [
|
|
|
+ {
|
|
|
+ label: "行政区",
|
|
|
+ prop: "state",
|
|
|
+ span: 5,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "监测时相",
|
|
|
+ prop: "time",
|
|
|
+ span: 5,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "action",
|
|
|
+ span: 5,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+]);
|
|
|
+const tableData = ref([
|
|
|
+ {
|
|
|
+ date: "2016-05-03",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-02",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-04",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-01",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-08",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-06",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: "2016-05-07",
|
|
|
+ name: "Tom",
|
|
|
+ state: "California",
|
|
|
+ city: "Los Angeles",
|
|
|
+
|
|
|
+ zip: "CA 90036",
|
|
|
+ },
|
|
|
+]);
|
|
|
+const data = reactive({
|
|
|
+ form: {},
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ roleName: undefined,
|
|
|
+ roleKey: undefined,
|
|
|
+ status: undefined,
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ roleName: [
|
|
|
+ { required: true, message: "角色名称不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ roleKey: [{ required: true, message: "权限字符不能为空", trigger: "blur" }],
|
|
|
+ roleSort: [
|
|
|
+ { required: true, message: "角色顺序不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+});
|
|
|
+
|
|
|
+const { queryParams, form, rules } = toRefs(data);
|
|
|
+
|
|
|
+/** 查询角色列表 */
|
|
|
+function getList() {
|
|
|
+ // loading.value = true;
|
|
|
+ // listRole(proxy.addDateRange(queryParams.value, dateRange.value)).then(
|
|
|
+ // (response) => {
|
|
|
+ // roleList.value = response.rows;
|
|
|
+ // total.value = response.total;
|
|
|
+ // loading.value = false;
|
|
|
+ // }
|
|
|
+ // );
|
|
|
+}
|
|
|
+
|
|
|
+getList();
|
|
|
+</script>
|
