张泽亮 před 1 týdnem
rodič
revize
f30aea011b
7 změnil soubory, kde provedl 985 přidání a 1020 odebrání
  1. +0
    -62
      src/api/business/resourceLand.js
  2. +0
    -62
      src/api/business/resourceOperation.js
  3. +70
    -0
      src/api/resource/land.js
  4. +70
    -0
      src/api/resource/operation.js
  5. +0
    -564
      src/views/business/resourceOperation/index.vue
  6. +218
    -332
      src/views/resource/land/index.vue
  7. +627
    -0
      src/views/resource/operation/index.vue

+ 0
- 62
src/api/business/resourceLand.js Zobrazit soubor

@@ -1,62 +0,0 @@
import request from '@/utils/request'

// 查询地块属性列表
export function listResourceLand(query) {
return request({
url: '/business/resourceLand/list',
method: 'get',
params: query
})
}

// 查询地块属性详细
export function getResourceLand(DKBM) {
return request({
url: '/business/resourceLand/' + DKBM,
method: 'get'
})
}

// 查询地块属性详细
export function getResourceLandDetail(DKBM) {
return request({
url: '/business/resourceLand/detail/' + DKBM,
method: 'get'
})
}


// 新增地块属性
export function addResourceLand(data) {
return request({
url: '/business/resourceLand/add',
method: 'post',
data: data
})
}

// 修改地块属性
export function updateResourceLand(data) {
return request({
url: '/business/resourceLand/update',
method: 'post',
data: data
})
}

// 删除地块属性
export function delResourceLand(DKBM) {
return request({
url: '/business/resourceLand/delete/' + DKBM,
method: 'get'
})
}

// 打印地块属性
export function printResourceLand(query) {
return request({
url: '/business/resourceLand/print',
method: 'get',
params: query
})
}

+ 0
- 62
src/api/business/resourceOperation.js Zobrazit soubor

@@ -1,62 +0,0 @@
import request from '@/utils/request'

// 查询地块经营列表
export function listResourceOperation(query) {
return request({
url: '/business/resourceOperation/list',
method: 'get',
params: query
})
}

// 查询地块经营详细
export function getResourceOperation(id) {
return request({
url: '/business/resourceOperation/' + id,
method: 'get'
})
}

// 查询地块经营详细
export function getResourceOperationDetail(id) {
return request({
url: '/business/resourceOperation/detail/' + id,
method: 'get'
})
}


// 新增地块经营
export function addResourceOperation(data) {
return request({
url: '/business/resourceOperation/add',
method: 'post',
data: data
})
}

// 修改地块经营
export function updateResourceOperation(data) {
return request({
url: '/business/resourceOperation/update',
method: 'post',
data: data
})
}

// 删除地块经营
export function delResourceOperation(id) {
return request({
url: '/business/resourceOperation/delete/' + id,
method: 'get'
})
}

// 打印地块经营
export function printResourceOperation(query) {
return request({
url: '/business/resourceOperation/print',
method: 'get',
params: query
})
}

+ 70
- 0
src/api/resource/land.js Zobrazit soubor

@@ -0,0 +1,70 @@
import request from '@/utils/request'

// 查询地块属性列表
export function listLand(query) {
return request({
url: '/resource/land/list',
method: 'get',
params: query
})
}

// 查询地块属性详细
export function getLand(fid) {
return request({
url: '/resource/land/' + fid,
method: 'get'
})
}

// 查询地块属性详细
export function getLandDetail(fid) {
return request({
url: '/resource/land/detail/' + fid,
method: 'get'
})
}

// 查询地块经营详细
export function getLandDetailByDkbm(dkbm) {
return request({
url: '/resource/land/detailByDkbm/' + dkbm,
method: 'get'
})
}


// 新增地块属性
export function addLand(data) {
return request({
url: '/resource/land/add',
method: 'post',
data: data
})
}

// 修改地块属性
export function updateLand(data) {
return request({
url: '/resource/land/update',
method: 'post',
data: data
})
}

// 删除地块属性
export function delLand(fid) {
return request({
url: '/resource/land/delete/' + fid,
method: 'get'
})
}

// 打印地块属性
export function printLand(query) {
return request({
url: '/resource/land/print',
method: 'get',
params: query
})
}

+ 70
- 0
src/api/resource/operation.js Zobrazit soubor

@@ -0,0 +1,70 @@
import request from '@/utils/request'

// 查询地块经营列表
export function listOperation(query) {
return request({
url: '/resource/operation/list',
method: 'get',
params: query
})
}

// 查询地块经营详细
export function getOperation(id) {
return request({
url: '/resource/operation/' + id,
method: 'get'
})
}

// 查询地块经营详细
export function getOperationDetail(id) {
return request({
url: '/resource/operation/detail/' + id,
method: 'get'
})
}

// 查询地块经营详细
export function getOperationDetailByDkbm(dkbm) {
return request({
url: '/resource/operation/detailByDkbm/' + dkbm,
method: 'get'
})
}


// 新增地块经营
export function addOperation(data) {
return request({
url: '/resource/operation/add',
method: 'post',
data: data
})
}

// 修改地块经营
export function updateOperation(data) {
return request({
url: '/resource/operation/update',
method: 'post',
data: data
})
}

// 删除地块经营
export function delOperation(id) {
return request({
url: '/resource/operation/delete/' + id,
method: 'get'
})
}

// 打印地块经营
export function printOperation(query) {
return request({
url: '/resource/operation/print',
method: 'get',
params: query
})
}

+ 0
- 564
src/views/business/resourceOperation/index.vue Zobrazit soubor

@@ -1,564 +0,0 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="地块代码" prop="dkbm">
<el-input v-model="queryParams.dkbm" placeholder="请输入地块代码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块名称" prop="dkmc">
<el-input v-model="queryParams.dkmc" placeholder="请输入地块名称" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块东至" prop="dkdz">
<el-input v-model="queryParams.dkdz" placeholder="请输入地块东至" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块西至" prop="dkxz">
<el-input v-model="queryParams.dkxz" placeholder="请输入地块西至" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块南至" prop="dknz">
<el-input v-model="queryParams.dknz" placeholder="请输入地块南至" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块北至" prop="dkbz">
<el-input v-model="queryParams.dkbz" placeholder="请输入地块北至" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="经营面积(亩)" prop="jymj">
<el-input v-model="queryParams.jymj" placeholder="请输入经营面积(亩)" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="经营方式" prop="jyfs">
<el-input v-model="queryParams.jyfs" placeholder="请输入经营方式" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="经营对象名称" prop="jydxmc">
<el-input v-model="queryParams.jydxmc" placeholder="请输入经营对象名称" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="经营开始时间" prop="jykssj">
<el-date-picker clearable v-model="queryParams.jykssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营开始时间"></el-date-picker>
</el-form-item>
<el-form-item label="经营结束时间" prop="jyjssj">
<el-date-picker clearable v-model="queryParams.jyjssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营结束时间"></el-date-picker>
</el-form-item>
<el-form-item label="承包金额(元)" prop="cbje">
<el-input v-model="queryParams.cbje" placeholder="请输入承包金额(元)" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="备注" prop="bz">
<el-input v-model="queryParams.bz" placeholder="请输入备注" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="实物图" prop="dkImg">
<el-input v-model="queryParams.dkImg" placeholder="请输入实物图" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="调查状态 字典 survey_status" prop="surveyStatus">
<el-select v-model="queryParams.surveyStatus" placeholder="请选择调查状态 字典 survey_status" clearable>
<el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="部门级联代码" prop="importCode">
<el-input v-model="queryParams.importCode" placeholder="请输入部门级联代码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="区域位置名称" prop="deptName">
<el-input v-model="queryParams.deptName" placeholder="请输入区域位置名称" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>

<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['business:resourceOperation:add']">新增</el-button>
</el-col>
<!--
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['business:resourceOperation:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['business:resourceOperation:remove']">删除</el-button>
</el-col>
-->

<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['business:resourceOperation:import']">导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['business:resourceOperation:export']">导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-printer" size="mini" @click="handlePrint()" v-hasPermi="['business:resourceOperation:print']">打印</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>

<!-- 数据列表 列属性 min-width="60" show-overflow-tooltip @selection-change="handleSelectionChange" -->
<el-table v-loading="loading" :data="resourceOperationList" border>
<!--<el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="id" align="center" prop="id" min-width="60"/>
<el-table-column label="地块代码" align="center" prop="dkbm" min-width="60"/>
<el-table-column label="地块名称" align="center" prop="dkmc" />
<el-table-column label="地块东至" align="center" prop="dkdz" />
<el-table-column label="地块西至" align="center" prop="dkxz" />
<el-table-column label="地块南至" align="center" prop="dknz" />
<el-table-column label="地块北至" align="center" prop="dkbz" />
<el-table-column label="经营面积(亩)" align="center" prop="jymj" />
<el-table-column label="经营方式" align="center" prop="jyfs" />
<el-table-column label="经营对象名称" align="center" prop="jydxmc" />
<el-table-column label="经营开始时间" align="center" prop="jykssj" />
<el-table-column label="经营结束时间" align="center" prop="jyjssj" />
<el-table-column label="承包金额(元)" align="center" prop="cbje" />
<el-table-column label="备注" align="center" prop="bz" />
<el-table-column label="实物图" align="center" prop="dkImg" />
<el-table-column label="调查状态 字典 survey_status" align="center" prop="surveyStatus">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.surveyStatus"/>
</template>
</el-table-column>
<el-table-column label="部门级联代码" align="center" prop="importCode" />
<el-table-column label="区域位置名称" align="center" prop="deptName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="250">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-view" @click="handleLook(scope.row)" v-hasPermi="['business:resourceOperation:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['business:resourceOperation:edit']">修改</el-button>
<el-dropdown size="mini" v-hasPermi="['business:resourceOperation:remove']">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-dropdown-menu slot="dropdown" style="padding: 5px">
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['business:resourceOperation:remove']">删除</el-button>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>

<!-- 分页插件 -->
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>

<!-- 导入EXCEL组件 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip text-left" slot="tip">
<div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的地块经营
</div>
<p style="color: red">1、仅允许导入xls、xlsx格式文件;</p>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div>
</el-dialog>

<!-- 查看地块经营对话框 -->
<el-dialog :title="title" :visible.sync="viewOpen" width="800px" append-to-body>
<el-descriptions id="printDetail" :column="descColumn" border :labelStyle="{width: `${descLabelWidth}%`}" :contentStyle="{width: `${(100 / descColumn) - descLabelWidth}%`}">
<el-descriptions-item label="地块名称">{{ form.dkmc }}</el-descriptions-item>
<el-descriptions-item label="地块东至">{{ form.dkdz }}</el-descriptions-item>
<el-descriptions-item label="地块西至">{{ form.dkxz }}</el-descriptions-item>
<el-descriptions-item label="地块南至">{{ form.dknz }}</el-descriptions-item>
<el-descriptions-item label="地块北至">{{ form.dkbz }}</el-descriptions-item>
<el-descriptions-item label="经营面积(亩)">{{ form.jymj }}</el-descriptions-item>
<el-descriptions-item label="经营方式">{{ form.jyfs }}</el-descriptions-item>
<el-descriptions-item label="经营对象名称">{{ form.jydxmc }}</el-descriptions-item>
<el-descriptions-item label="经营开始时间">{{ form.jykssj }}</el-descriptions-item>
<el-descriptions-item label="经营结束时间">{{ form.jyjssj }}</el-descriptions-item>
<el-descriptions-item label="承包金额(元)">{{ form.cbje }}</el-descriptions-item>
<el-descriptions-item label="备注">{{ form.bz }}</el-descriptions-item>
<el-descriptions-item label="实物图">{{ form.dkImg }}</el-descriptions-item>
<el-descriptions-item label="调查状态 字典 survey_status">{{ form.surveyStatus }}</el-descriptions-item>
<el-descriptions-item label="部门级联代码">{{ form.importCode }}</el-descriptions-item>
<el-descriptions-item label="区域位置名称">{{ form.deptName }}</el-descriptions-item>
</el-descriptions>
<!-- 弹框操作按钮 -->
<div slot="footer" class="dialog-footer">
<el-button @click="doPrint">打 印</el-button>
<el-button @click="cancelDetail">关 闭</el-button>
</div>
</el-dialog>

<!-- 添加或修改地块经营对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="地块名称" prop="dkmc">
<el-input v-model="form.dkmc" placeholder="请输入地块名称" show-word-limit :maxlength="50"/>
</el-form-item>
<el-form-item label="地块东至" prop="dkdz">
<el-input v-model="form.dkdz" placeholder="请输入地块东至" show-word-limit :maxlength="50"/>
</el-form-item>
<el-form-item label="地块西至" prop="dkxz">
<el-input v-model="form.dkxz" placeholder="请输入地块西至" show-word-limit :maxlength="50"/>
</el-form-item>
<el-form-item label="地块南至" prop="dknz">
<el-input v-model="form.dknz" placeholder="请输入地块南至" show-word-limit :maxlength="50"/>
</el-form-item>
<el-form-item label="地块北至" prop="dkbz">
<el-input v-model="form.dkbz" placeholder="请输入地块北至" show-word-limit :maxlength="50"/>
</el-form-item>
<el-form-item label="经营面积(亩)" prop="jymj">
<el-input-number v-model="form.jymj" placeholder="请输入经营面积(亩)" controls-position="right" :precision="2"/>
</el-form-item>
<el-form-item label="经营方式" prop="jyfs">
<el-input v-model="form.jyfs" placeholder="请输入经营方式" show-word-limit :maxlength="1"/>
</el-form-item>
<el-form-item label="经营对象名称" prop="jydxmc">
<el-input v-model="form.jydxmc" placeholder="请输入经营对象名称" show-word-limit :maxlength="200"/>
</el-form-item>
<el-form-item label="经营开始时间" prop="jykssj">
<el-date-picker clearable v-model="form.jykssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营开始时间"></el-date-picker>
</el-form-item>
<el-form-item label="经营结束时间" prop="jyjssj">
<el-date-picker clearable v-model="form.jyjssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营结束时间"></el-date-picker>
</el-form-item>
<el-form-item label="承包金额(元)" prop="cbje">
<el-input-number v-model="form.cbje" placeholder="请输入承包金额(元)" controls-position="right" :precision="2"/>
</el-form-item>
<el-form-item label="备注" prop="bz">
<el-input v-model="form.bz" placeholder="请输入备注" show-word-limit :maxlength="255"/>
</el-form-item>
<el-form-item label="实物图" prop="dkImg">
<el-input v-model="form.dkImg" placeholder="请输入实物图" show-word-limit :maxlength="255"/>
</el-form-item>
<el-form-item label="调查状态 字典 survey_status" prop="surveyStatus">
<el-radio-group v-model="form.surveyStatus">
<el-radio v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="部门级联代码" prop="importCode">
<el-input v-model="form.importCode" placeholder="请输入部门级联代码" show-word-limit :maxlength="20"/>
</el-form-item>
<el-form-item label="区域位置名称" prop="deptName">
<el-input v-model="form.deptName" placeholder="请输入区域位置名称" show-word-limit :maxlength="50"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>

<script>
import { listResourceOperation, getResourceOperation, getResourceOperationDetail, delResourceOperation, addResourceOperation, updateResourceOperation, printResourceOperation } from "@/api/business/resourceOperation"
import { getToken } from "@/utils/auth"
export default {
name: "ResourceOperation",
dicts: ['sys_yes_no'],
data() {
return {
// 遮罩层
loading: true,
// 导出遮罩层
exportLoading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 地块经营表格数据
resourceOperationList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 详情组件列数
descColumn: 2,
// 详情组件Label所占百分比, 最大={100 / descColumn}. 内容所占百分比={100 / descColumn - descLabelWidth}
descLabelWidth: 15,
// 对话框显示只读的详情
viewOpen: false,
// 项目路径
baseRoutingUrll: process.env.VUE_APP_BASE_API,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
// 查询排序
//orderByColumn: "id",
//isAsc: "desc",
// 翻译字典
//toTranslateDict: "1",
dkbm: null,
dkmc: null,
dkdz: null,
dkxz: null,
dknz: null,
dkbz: null,
jymj: null,
jyfs: null,
jydxmc: null,
jykssj: null,
jyjssj: null,
cbje: null,
bz: null,
dkImg: null,
surveyStatus: null,
importCode: null,
deptName: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
dkmc: [
{ required: true, message: "地块名称不能为空", trigger: "blur" }
],
surveyStatus: [
{ required: true, message: "调查状态 字典 survey_status不能为空", trigger: "change" }
],
importCode: [
{ required: true, message: "部门级联代码不能为空", trigger: "blur" }
],
createBy: [
{ required: true, message: "创建者不能为空", trigger: "blur" }
],
createTime: [
{ required: true, message: "创建时间不能为空", trigger: "blur" }
],
},
// EXCEL导入
upload: {
// 是否显示弹出层(用户导入)
open: false,
// 弹出层标题(用户导入)
title: "",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + "/business/resourceOperation/importData"
},

}
},
created() {
this.getList()
},
methods: {
/** 查询地块经营列表 */
getList() {
this.loading = true
listResourceOperation(this.queryParams).then(response => {
this.resourceOperationList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
cancelDetail() {
this.viewOpen = false
},
// 表单重置
reset() {
this.form = {
id: null,
dkbm: null,
dkmc: null,
dkdz: null,
dkxz: null,
dknz: null,
dkbz: null,
jymj: null,
jyfs: null,
jydxmc: null,
jykssj: null,
jyjssj: null,
cbje: null,
bz: null,
dkImg: null,
surveyStatus: null,
importCode: null,
deptName: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null
}
this.resetForm("form")
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm")
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
this.open = true
this.title = "添加地块经营"
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.id || this.ids
getResourceOperation(id).then(response => {
this.form = response.data
this.open = true
this.title = "修改地块经营"
})
},
/** 查看按钮操作 */
handleLook(row) {
const id = row.id || this.ids
getResourceOperationDetail(id).then(response => {
this.form = response.data;
this.viewOpen = true;
this.title = "查看地块经营";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateResourceOperation(this.form).then(response => {
this.$modal.msgSuccess("修改成功")
this.open = false
this.getList()
})
} else {
addResourceOperation(this.form).then(response => {
this.$modal.msgSuccess("新增成功")
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids
this.$modal.confirm('是否确认删除地块经营编号为"' + ids + '"的数据项?').then(function() {
return delResourceOperation(ids)
}).then(() => {
this.getList()
this.$modal.msgSuccess("删除成功")
}).catch(() => {})
},
/** 导出按钮操作 */
handleExport() {
this.download('business/resourceOperation/export', {
...this.queryParams
}, `地块经营_${new Date().getTime()}.xlsx`)
},
/** 打印表单 */
doPrint() {
const originalTitle = document.title;
try {
document.title = this.title || '打印详情';
const printElement = document.getElementById('printDetail');
const printFrame = document.createElement('iframe');
printFrame.style.position = 'absolute';
printFrame.style.width = '0';
printFrame.style.height = '0';
printFrame.style.border = 'none';
printFrame.style.left = '-9999px';
printFrame.onload = function() {
try {
const frameDoc = printFrame.contentDocument || printFrame.contentWindow.document;
const contentClone = printElement.cloneNode(true);
const style = document.createElement('style');
style.innerHTML = `
@page {
size: auto;
margin: 10mm;
}
body {
font-family: Arial, sans-serif;
line-height: 1.5;
margin: 0;
padding: 0;
}
.el-descriptions {
width: 100% !important;
}
.el-descriptions-item__label {
width: ${this.descLabelWidth}% !important;
}
.el-descriptions-item__content {
width: ${(100 / this.descColumn) - this.descLabelWidth}% !important;
}
/* 确保图片在打印时显示完整 */
img, .el-image {
max-width: 100% !important;
height: auto !important;
}
`;
frameDoc.head.appendChild(style);
frameDoc.body.appendChild(contentClone);
setTimeout(() => {
printFrame.contentWindow.focus();
printFrame.contentWindow.print();
setTimeout(() => {
document.body.removeChild(printFrame);
document.title = originalTitle;
}, 1000);
}, 500);
} catch (e) {
document.body.removeChild(printFrame);
document.title = originalTitle;
this.$message.error('打印过程中发生错误');
}
};
document.body.appendChild(printFrame);
} catch (e) {
document.title = originalTitle;
this.$message.error('打印过程中发生错误');
}
},
/** 打印按钮操作 */
handlePrint() {
printResourceOperation(this.queryParams).then(response => {})
},
/* 导入EXCEL组件 */
handleImport() {
this.upload.title = "地块经营导入"
this.upload.open = true
},
/** 下载模板操作 */
importTemplate() {
this.download('business/resourceOperation/importTemplate', {
}, `地块经营_template.xlsx`)
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.upload.open = false
this.upload.isUploading = false
this.$refs.upload.clearFiles()
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })
this.getList()
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit()
},


}
}
</script>

src/views/business/resourceLand/index.vue → src/views/resource/land/index.vue Zobrazit soubor

@@ -8,7 +8,7 @@
<div class="head-container">
<el-input v-model="deptName" placeholder="请输入区划名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px" />
</div>
<div class="head-container">
<div class="head-container container_main">
<el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current @node-click="handleNodeClick" />
</div>
</el-col>
@@ -16,17 +16,15 @@
<!--用户数据-->
<pane size="84">
<el-col>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="标识码" prop="bsm">
<el-input v-model="queryParams.bsm" placeholder="请输入标识码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="要素代码" prop="ysdm">
<el-input v-model="queryParams.ysdm" placeholder="请输入要素代码" clearable @keyup.enter.native="handleQuery"/>

<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="地块代码" prop="dkbm">
<el-input v-model="queryParams.dkbm" placeholder="请输入地块代码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块名称" prop="dkmc">
<el-input v-model="queryParams.dkmc" placeholder="请输入地块名称" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="所有权性质" prop="syqxz">
<!--<el-form-item label="所有权性质" prop="syqxz">
<el-select v-model="queryParams.syqxz" placeholder="请选择所有权性质" clearable>
<el-option v-for="dict in dict.type.ownership_type" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
@@ -51,19 +49,19 @@
<el-option v-for="dict in dict.type.land_use_type" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="是否基本农田" prop="sfjbnt">
<el-form-item label="基本农田" prop="sfjbnt">
<el-select v-model="queryParams.sfjbnt" placeholder="请选择是否基本农田" clearable>
<el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value"/>
<el-option v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<!-- <el-form-item label="指界人姓名" prop="zjrxm">
<el-input v-model="queryParams.zjrxm" placeholder="请输入指界人姓名" clearable @keyup.enter.native="handleQuery"/>
</el-form-item> -->
</el-form-item>-->
<el-form-item label="调查状态" prop="surveyStatus">
<el-select v-model="queryParams.surveyStatus" placeholder="请选择调查状态" clearable>
<el-option v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="级联代码" prop="importCode">
<el-input v-model="queryParams.importCode" placeholder="请输入部门级联代码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -72,44 +70,35 @@

<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['business:resourceLand:add']">新增</el-button>
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['resource:land:add']">新增</el-button>
</el-col>
<!--
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['business:resourceLand:edit']">修改</el-button>
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['resource:land:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['business:resourceLand:remove']">删除</el-button>
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['resource:land:remove']">删除</el-button>
</el-col>
-->

<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['business:resourceLand:import']">导入</el-button>
<el-button type="success" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['resource:land:import']">导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['business:resourceLand:export']">导出</el-button>
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['resource:land:export']">导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-printer" size="mini" @click="handlePrint()" v-hasPermi="['business:resourceLand:print']">打印</el-button>
<el-button type="info" plain icon="el-icon-printer" size="mini" @click="handlePrint()" v-hasPermi="['resource:land:print']">打印</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>

<!-- 数据列表 列属性 min-width="60" show-overflow-tooltip @selection-change="handleSelectionChange" -->
<el-table v-loading="loading" :data="resourceLandList" >
<el-table-column label="区域位置名称" align="center" prop="deptName" />
<el-table v-loading="loading" :data="landList" border>
<!--<el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="标识码" align="center" prop="bsm" />
<el-table-column label="要素代码" align="center" prop="ysdm" />
<el-table-column label="fid " align="center" prop="fid" min-width="60"/>
<el-table-column label="地块代码" align="center" prop="dkbm" />
<el-table-column label="地块名称" align="center" prop="dkmc" />
<el-table-column label="地块四至" align="center">
<el-table-column label="东至" align="center" prop="dkdz" />
<el-table-column label="西至" align="center" prop="dkxz" />
<el-table-column label="南至" align="center" prop="dknz" />
<el-table-column label="北至" align="center" prop="dkbz" />
</el-table-column>
<!-- <el-table-column label="所有权性质" align="center" prop="syqxz">
<el-table-column label="所有权性质" align="center" prop="syqxz">
<template slot-scope="scope">
<dict-tag :options="dict.type.ownership_type" :value="scope.row.syqxz"/>
</template>
@@ -136,66 +125,124 @@
</el-table-column>
<el-table-column label="是否基本农田" align="center" prop="sfjbnt">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.sfjbnt"/>
<dict-tag :options="dict.type.is_common" :value="scope.row.sfjbnt"/>
</template>
</el-table-column>
<el-table-column label="地块东至" align="center" prop="dkdz" />
<el-table-column label="地块西至" align="center" prop="dkxz" />
<el-table-column label="地块南至" align="center" prop="dknz" />
<el-table-column label="地块北至" align="center" prop="dkbz" />
<el-table-column label="备注信息" align="center" prop="dkbzxx" />
<el-table-column label="指界人姓名" align="center" prop="zjrxm" />
<el-table-column label="空间坐标" align="center" prop="kjzb" />
<el-table-column label="实测面积(㎡)" align="center" prop="scmj" />-->
<el-table-column label="实测面积(亩)" align="center" prop="scmjm" />
<!-- <el-table-column label="地块轮廓坐标" align="center" prop="theGeom" />
<el-table-column label="fid (这个不用管)" align="center" prop="fid" /> -->
<el-table-column label="实测面积( ㎡)" align="center" prop="scmj" />
<el-table-column label="实测面积" align="center" prop="scmjm" />
<el-table-column label="调查状态" align="center" prop="surveyStatus">
<template slot-scope="scope">
<dict-tag :options="dict.type.survey_status" :value="scope.row.surveyStatus"/>
</template>
</el-table-column>
<!-- <el-table-column label="部门级联代码" align="center" prop="importCode" /> -->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column label="部门级联代码" align="center" prop="importCode" />
<el-table-column label="区域位置名称" align="center" prop="deptName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="250">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-view" @click="handleLook(scope.row)" v-hasPermi="['business:resourceLand:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['business:resourceLand:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['business:resourceLand:remove']">删除</el-button>
<el-button size="mini" type="text" icon="el-icon-view" @click="handleLook(scope.row)" v-hasPermi="['resource:land:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-s-promotion" @click="handleMap(scope.row)" v-hasPermi="['resource:land:map']">地图</el-button>
<el-dropdown size="mini" v-hasPermi="['resource:land:remove']">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-dropdown-menu slot="dropdown" style="padding: 5px">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['resource:land:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['resource:land:remove']">删除</el-button>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>

<!-- 分页插件 -->
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>

</el-col>
</pane>
</splitpanes>
</el-row>
<!-- 导入EXCEL组件 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip text-left" slot="tip">
<div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的地块属性
</div>
<p style="color: red">1、仅允许导入xls、xlsx格式文件;</p>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>

<!-- 导入EXCEL组件 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip text-left" slot="tip">
<div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的地块属性
</div>
<p style="color: red">1、仅允许导入xls、xlsx格式文件;</p>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div>
</el-dialog>

<!-- 查看地块属性对话框 -->
<el-dialog :title="title" :visible.sync="viewOpen" width="800px" append-to-body>
<el-descriptions title="地块信息" border :column="2" class="margin-top">
<el-descriptions-item label="区域位置名称">{{ form.deptName }}</el-descriptions-item>
<el-descriptions-item label="标识码">{{ form.bsm }}</el-descriptions-item>
<el-descriptions-item label="要素代码">{{ form.ysdm }}</el-descriptions-item>
<el-descriptions-item label="地块代码">{{ form.dkbm }}</el-descriptions-item>
<el-descriptions-item label="地块名称">{{ form.dkmc }}</el-descriptions-item>
<el-descriptions-item label="所有权性质">{{ form.syqxz }}</el-descriptions-item>
<el-descriptions-item label="地块类别">{{ form.dklb }}</el-descriptions-item>
<el-descriptions-item label="土地利用类型">{{ form.tdlylx }}</el-descriptions-item>
<el-descriptions-item label="地力等级">{{ form.dldj }}</el-descriptions-item>
<el-descriptions-item label="土地用途">{{ form.tdyt }}</el-descriptions-item>
<el-descriptions-item label="是否基本农田">{{ form.sfjbnt }}</el-descriptions-item>
<el-descriptions-item label="地块东至">{{ form.dkdz }}</el-descriptions-item>
<el-descriptions-item label="地块西至">{{ form.dkxz }}</el-descriptions-item>
<el-descriptions-item label="地块南至">{{ form.dknz }}</el-descriptions-item>
<el-descriptions-item label="地块北至">{{ form.dkbz }}</el-descriptions-item>
<el-descriptions-item label="备注信息">{{ form.dkbzxx }}</el-descriptions-item>
<el-descriptions-item label="指界人姓名">{{ form.zjrxm }}</el-descriptions-item>
<el-descriptions-item label="实测面积(㎡)">{{ form.scmj }}</el-descriptions-item>
<el-descriptions-item label="实测面积(亩)">{{ form.scmjm }}</el-descriptions-item>
</el-descriptions>

<el-descriptions title="经营数据" border :column="2" class="margin-top">
<el-descriptions-item label="经营面积(亩)">{{ form.jymj }}</el-descriptions-item>
<el-descriptions-item label="经营方式">{{ form.jyfs }}</el-descriptions-item>
<el-descriptions-item label="经营对象名称">{{ form.jydxmc }}</el-descriptions-item>
<el-descriptions-item label="经营开始时间">{{ form.jykssj }}</el-descriptions-item>
<el-descriptions-item label="经营结束时间">{{ form.jyjssj }}</el-descriptions-item>
<el-descriptions-item label="承包金额(元)">{{ form.cbje }}</el-descriptions-item>
<el-descriptions-item label="备注">{{ form.bz }}</el-descriptions-item>
<el-descriptions-item label="调查状态">{{ form.surveyStatus }}</el-descriptions-item>
<el-descriptions-item label="实物图">
<div v-if="!!form.dkImg">
<el-tooltip effect="light" :content="item" placement="bottom" v-for="(item, index) in form.dkImg.split(',')" :key="index">
<el-image style="height: 64px; width: 64px; margin: 2px; display: inline-block;" fit="scale-down" :src="this.baseRoutingUrll + item" :preview-src-list="form.dkImg.split(',').map((x) => this.baseRoutingUrll + x)"/>
</el-tooltip>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div>
</el-dialog>
</el-descriptions-item>
</el-descriptions>

<!-- 弹框操作按钮 -->
<div slot="footer" class="dialog-footer">
<el-button @click="doPrint">打 印</el-button>
<el-button @click="cancelDetail">关 闭</el-button>
</div>
</el-dialog>

<!-- 添加或修改地块属性对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" :inline="true" label-width="120px">
<el-form-item label="标识码" prop="bsm">
<el-input-number v-model="form.bsm" placeholder="请输入标识码" controls-position="right" />
</el-form-item>
<el-form-item label="要素代码" prop="ysdm">
<el-input v-model="form.ysdm" placeholder="请输入要素代码" show-word-limit :maxlength="6"/>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">

<el-form-item label="区域位置" prop="deptName">
<el-input v-model="form.deptName" placeholder="请输入区域位置名称" show-word-limit :maxlength="100"/>
</el-form-item>
<el-form-item label="地块代码" prop="dkbm">
<el-input v-model="form.dkbm" placeholder="<自动生成>" show-word-limit :maxlength="50" disabled/>
<el-input v-model="form.dkbm" placeholder="地块代码不输入时,系统自动分配" show-word-limit :maxlength="19"/>
</el-form-item>
<el-form-item label="地块名称" prop="dkmc">
<el-input v-model="form.dkmc" placeholder="请输入地块名称" show-word-limit :maxlength="50"/>
@@ -226,9 +273,9 @@
</el-select>
</el-form-item>
<el-form-item label="是否基本农田" prop="sfjbnt">
<el-select v-model="form.sfjbnt" placeholder="请选择是否基本农田">
<el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
</el-select>
<el-radio-group v-model="form.sfjbnt">
<el-radio v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="地块东至" prop="dkdz">
<el-input v-model="form.dkdz" placeholder="请输入地块东至" show-word-limit :maxlength="50"/>
@@ -242,30 +289,27 @@
<el-form-item label="地块北至" prop="dkbz">
<el-input v-model="form.dkbz" placeholder="请输入地块北至" show-word-limit :maxlength="50"/>
</el-form-item>
<el-form-item label="备注信息" prop="dkbzxx">
<el-input v-model="form.dkbzxx" placeholder="请输入备注信息" show-word-limit :maxlength="254"/>
</el-form-item>
<el-form-item label="指界人姓名" prop="zjrxm">
<el-input v-model="form.zjrxm" placeholder="请输入指界人姓名" show-word-limit :maxlength="100"/>
</el-form-item>
<el-form-item label="空间坐标" prop="kjzb">
<el-input v-model="form.kjzb" placeholder="请输入空间坐标" show-word-limit :maxlength="254"/>
</el-form-item>
<el-form-item label="实测面积( ㎡)" prop="scmj">
<el-input-number v-model="form.scmj" placeholder="请输入实测面积( ㎡)" controls-position="right" :precision="2"/>
</el-form-item>
<el-form-item label="实测面积" prop="scmjm">
<el-input-number v-model="form.scmjm" placeholder="请输入实测面积" controls-position="right" :precision="3"/>
</el-form-item>
<el-form-item label="备注信息" prop="dkbzxx">
<el-input v-model="form.dkbzxx" type="textarea" :autosize="{ minRows: 2, maxRows: 3}" :maxlength="200" show-word-limit placeholder="请输入内容" />
</el-form-item>
<el-form-item label="调查状态" prop="surveyStatus">
<el-radio-group v-model="form.surveyStatus">
<el-radio v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<MapField style="height: 550px;" :allowDraw="true" v-model="form.theGeomJson" :coord="mapCenterLocation" type="1"/>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" v-if="diglogStatus" @click="submitForm">确 定</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
@@ -273,24 +317,22 @@
</template>

<script>
import { listResourceLand, getResourceLand, delResourceLand, addResourceLand, updateResourceLand, printResourceLand } from "@/api/business/resourceLand"
import { listLand, getLand, getLandDetail, getLandDetailByDkbm, delLand, addLand, updateLand, printLand } from "@/api/resource/land"
import { getToken } from "@/utils/auth"
import { deptTreeSelect } from "@/api/system/user"
import Treeselect from "@riophae/vue-treeselect"
import "@riophae/vue-treeselect/dist/vue-treeselect.css"
import Treeselect from "@riophae/vue-treeselect";
import { Splitpanes, Pane } from "splitpanes"
import "@riophae/vue-treeselect/dist/vue-treeselect.css"
import "splitpanes/dist/splitpanes.css"
import MapField from "@/components/house/MapField";
import { deptTreeSelect } from "@/api/system/user"

export default {
name: "ResourceLand",
dicts: ['ownership_type', 'land_use_type', 'survey_status', 'land_grade_type', 'sys_yes_no', 'land_type', 'land_use'],
components: { Treeselect, Splitpanes, Pane,MapField },
name: "Land",
dicts: ['ownership_type', 'land_use_type', 'survey_status', 'is_common', 'land_grade_type', 'land_type', 'land_use'],
components: { Treeselect, Splitpanes, Pane },
data() {
return {
// 遮罩层
loading: true,
// 遮罩按钮新增点击状态
diglogStatus: true,
// 导出遮罩层
exportLoading: false,
// 选中数组
@@ -304,7 +346,7 @@ export default {
// 总条数
total: 0,
// 地块属性表格数据
resourceLandList: [],
landList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
@@ -313,8 +355,22 @@ export default {
descColumn: 2,
// 详情组件Label所占百分比, 最大={100 / descColumn}. 内容所占百分比={100 / descColumn - descLabelWidth}
descLabelWidth: 15,
// 对话框显示只读的详情
viewOpen: false,
// 项目路径
baseRoutingUrl: process.env.VUE_APP_BASE_API,
baseRoutingUrll: process.env.VUE_APP_BASE_API,
// 所有部门树选项
deptOptions: undefined,
// 过滤掉已禁用部门树选项
enabledDeptOptions: undefined,
// 筛选部门名称
deptName: undefined,
// 选中的部门
selectDeptName: null,
defaultProps: {
children: "children",
label: "label"
},
// 查询参数
queryParams: {
pageNum: 1,
@@ -324,8 +380,7 @@ export default {
//isAsc: "desc",
// 翻译字典
//toTranslateDict: "1",
bsm: null,
ysdm: null,
dkbm: null,
dkmc: null,
syqxz: null,
dklb: null,
@@ -333,39 +388,11 @@ export default {
dldj: null,
tdyt: null,
sfjbnt: null,
dkdz: null,
dkxz: null,
dknz: null,
dkbz: null,
dkbzxx: null,
zjrxm: null,
kjzb: null,
scmj: null,
scmjm: null,
theGeom: null,
fid: null,
surveyStatus: null,
importCode: null,
deptName: null,
},
// 表单参数
form: {},
// 遮罩按钮新增点击状态
diglogStatus: true,
// 部门名称
deptName: undefined,
// 所有部门树选项
deptOptions: undefined,
// 过滤掉已禁用部门树选项
enabledDeptOptions: undefined,
defaultProps: {
children: "children",
label: "label"
},
map: "", // 地图
mapGeoServerUrl: "", // geoserver地址
mapCenterLocation: [], // 地图中心坐标
landLayerName: "", // 地块图层名称
// 表单校验
rules: {
dkmc: [
@@ -374,12 +401,7 @@ export default {
scmjm: [
{ required: true, message: "实测面积不能为空", trigger: "blur" }
],
surveyStatus: [
{ required: true, message: "调查状态不能为空", trigger: "change" }
],
importCode: [
{ required: true, message: "部门级联代码不能为空", trigger: "blur" }
],

},
// EXCEL导入
upload: {
@@ -394,7 +416,7 @@ export default {
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + "/business/resourceLand/importData"
url: process.env.VUE_APP_BASE_API + "/resource/land/importData"
},

}
@@ -406,130 +428,54 @@ export default {
}
},
created() {
this.getList();
this.getDeptTree();
// 获取geoserver的地址
this.getGeoServerUrl();
// 获取地块图层名称
this.getLandLayerName();
// 获取村边界的图层名称
// this.getVillageBorderLayerName();
// 获取当前部门的位置
this.getCurrentDeptLocation();
this.getDeptTree()
this.getList()
},
methods: {
/** 查询地块属性列表 */
getList() {
this.loading = true
listResourceLand(this.queryParams).then(response => {
this.resourceLandList = response.rows
listLand(this.queryParams).then(response => {
this.landList = response.rows
this.total = response.total
this.loading = false
})
},
// 获取geoserver的地址
getGeoServerUrl() {
getConfigKey("system.geoServer.url").then(response => {
this.mapGeoServerUrl = response.msg;
});
},
// 获取地块图层名称
getLandLayerName() {
getConfigKey("geoserver.layer.dk").then(response => {
this.landLayerName = response.msg;
});
},
// 获取村边界的图层名称
/* getVillageBorderLayerName() {
getConfigKey("geoserver.layer.villageBorder").then(response => {
this.villageBorderLayerName = response.msg;
});
}, */
// 获取当前部门的位置
getCurrentDeptLocation() {
getCurrentDept().then(response => {
let dept = response.data;
if (dept.lng && dept.lat) {
this.mapCenterLocation = [dept.lng, dept.lat];
} else {
this.mapCenterLocation = [116.391458, 39.902377];
}
});
},
/** 查询部门下拉树结构 */
getDeptTree() {
deptTreeSelect().then(response => {
this.deptOptions = response.data
this.enabledDeptOptions = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)))
})
},
// 过滤禁用的部门
filterDisabledDept(deptList) {
return deptList.filter(dept => {
if (dept.disabled) {
return false
}
if (dept.children && dept.children.length) {
dept.children = this.filterDisabledDept(dept.children)
}
return true
})
},
// 筛选节点
filterNode(value, data) {
if (!value) return true
return data.label.indexOf(value) !== -1
},
// 节点单击事件
handleNodeClick(data) {
this.queryParams.deptId = data.id
this.handleQuery()
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
cancelDetail() {
this.open = false
this.viewOpen = false
},
// 表单重置
reset() {
this.form = {
bsm: null,
ysdm: null,
ysdm: '211011',
dkbm: null,
dkmc: null,
syqxz: null,
dklb: null,
tdlylx: null,
dldj: null,
tdyt: null,
sfjbnt: null,
syqxz: '30',
dklb: '22',
tdlylx: '011',
dldj: '01',
tdyt: '1',
sfjbnt: '1',
dkdz: null,
dkxz: null,
dknz: null,
dkbz: null,
dkbzxx: null,
zjrxm: null,
kjzb: null,
scmj: null,
scmjm: null,
theGeom: null,
fid: null,
surveyStatus: null,
surveyStatus: '1',
importCode: null,
deptName: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
theGeom: null,
theGeomJson: null
}
this.resetForm("form")
// 防止表单提交失败再次打开按钮隐藏
this.diglogStatus = true;
},
/** 搜索按钮操作 */
handleQuery() {
@@ -539,27 +485,31 @@ export default {
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm")
this.queryParams.deptId = undefined
this.$refs.tree.setCurrentKey(null)
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.dkbm)
this.ids = selection.map(item => item.fid)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
if(this.selectDeptName == null || this.selectDeptName == ''){
this.$modal.msgWarning("请先选择村/组行政区划!")
return
}
this.reset()
this.form.deptId = this.queryParams.deptId;
this.form.deptName = this.selectDeptName;
this.open = true
this.title = "添加地块属性"
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const dkbm = row.dkbm || this.ids
getResourceLand(dkbm).then(response => {
const fid = row.fid || this.ids
getLand(fid).then(response => {
this.form = response.data
this.open = true
this.title = "修改地块属性"
@@ -567,11 +517,9 @@ export default {
},
/** 查看按钮操作 */
handleLook(row) {
this.diglogStatus = false;
const dkbm = row.dkbm || this.ids
getResourceLand(dkbm).then(response => {
getLandDetailByDkbm(row.dkbm).then(response => {
this.form = response.data;
this.open = true;
this.viewOpen = true;
this.title = "查看地块属性";
});
},
@@ -579,33 +527,27 @@ export default {
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.theGeomJson && this.form.theGeomJson.startsWith('[')) {
this.form.theGeom = this.form.theGeomJson;
}
this.diglogStatus = false;
if (this.form.dkbm != null) {
updateResourceLand(this.form).then(response => {
if (this.form.fid != null) {
updateLand(this.form).then(response => {
this.$modal.msgSuccess("修改成功")
this.open = false
this.getList()
this.diglogStatus = true;
}).catch(() => this.diglogStatus = true);
})
} else {
addResourceLand(this.form).then(response => {
addLand(this.form).then(response => {
this.$modal.msgSuccess("新增成功")
this.open = false
this.getList()
this.diglogStatus = true;
}).catch(() => this.diglogStatus = true);
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const dkbms = row.dkbm || this.ids
this.$modal.confirm('是否确认删除地块属性编号为"' + dkbms + '"的数据项?').then(function() {
return delResourceLand(dkbms)
const fids = row.fid || this.ids
this.$modal.confirm('是否确认删除地块属性编号为"' + fids + '"的数据项?').then(function() {
return delLand(fids)
}).then(() => {
this.getList()
this.$modal.msgSuccess("删除成功")
@@ -613,7 +555,7 @@ export default {
},
/** 导出按钮操作 */
handleExport() {
this.download('business/resourceLand/export', {
this.download('resource/land/export', {
...this.queryParams
}, `地块属性_${new Date().getTime()}.xlsx`)
},
@@ -684,7 +626,7 @@ export default {
},
/** 打印按钮操作 */
handlePrint() {
printResourceLand(this.queryParams).then(response => {})
printLand(this.queryParams).then(response => {})
},
/* 导入EXCEL组件 */
handleImport() {
@@ -693,8 +635,8 @@ export default {
},
/** 下载模板操作 */
importTemplate() {
this.download('business/resourceLand/importTemplate', {
}, `resourceLand_template.xlsx`)
this.download('resource/land/importTemplate', {
}, `地块属性_template.xlsx`)
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
@@ -712,99 +654,43 @@ export default {
submitFileForm() {
this.$refs.upload.submit()
},
handleMap(row) {
this.openMap = true;
this.map = "";
setTimeout(() => {
this.drawMap(row.theGeomJson);
}, 500);
/** 查询部门下拉树结构 */
getDeptTree() {
deptTreeSelect().then(response => {
this.deptOptions = response.data
this.enabledDeptOptions = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)))
})
},
drawMap(theGeomJson) {
document.getElementById("landMapWrap").innerHTML = "";
// 定义地图投影
let projection = new ol.proj.Projection({
code: "EPSG:3857",
units: "degrees",
});
// 定义地图图层
let aerial = new ol.layer.Tile({
source: new ol.source.XYZ({
url: "http://t{0-7}.tianditu.com/img_w/wmts?" +
"SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
"&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
}),
isGroup: true,
name: "卫星影像图",
});
let yingxzi = new ol.layer.Tile({
source: new ol.source.XYZ({
url: "http://t{0-7}.tianditu.com/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
}),
isGroup: true,
name: "天地图文字标注--卫星影像图",
});
//加载地图
this.map = new ol.Map({
controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]),
layers: [aerial, yingxzi],
projection: projection,
target: "landMapWrap",
view: new ol.View({
center: ol.proj.fromLonLat(this.mapCenterLocation), // 地图中心坐标
zoom: 13.5,
minZoom: 1, //地图缩小限制
maxZoom: 18, //地图放大限制
// extent: [13481224.75161,5667110.83528,13811063.06278,5880284.11416]
}),
});
// 添加全部的地块图层
const deptId = this.$store.state.user.loginDeptId;
this.addLandLayer(deptId);
// 添加选中的地块图层
this.addSelectedLandLayer(theGeomJson);
// 过滤禁用的部门
filterDisabledDept(deptList) {
return deptList.filter(dept => {
if (dept.disabled) {
return false
}
if (dept.children && dept.children.length) {
dept.children = this.filterDisabledDept(dept.children)
}
return true
})
},
// 添加全部的地块图层
addLandLayer(deptId) {
const landLayer = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: this.mapGeoServerUrl + '/wms',
params: {
LAYERS: this.landLayerName,
cql_filter: "dept_id = '" + deptId + "'",
SRID: 3857,
}
}),
name: 'landLayer'
});
this.map.getLayers().insertAt(3, landLayer);
// this.map.addLayer(landLayer);
// 筛选节点
filterNode(value, data) {
if (!value) return true
return data.label.indexOf(value) !== -1
},
// 节点单击事件
handleNodeClick(data) {
this.queryParams.deptId = data.id
this.selectDeptName = data.label
this.handleQuery()
},
// 添加选中的地块图层
addSelectedLandLayer(theGeomJson) {
if (theGeomJson) {
const selectedLandLayer = new ol.layer.Vector({
source: new ol.source.Vector({
features: new ol.format.GeoJSON().readFeatures(theGeomJson),
}),
name: 'selectedLandLayer',
style: new ol.style.Style({
fill: new ol.style.Fill({
//矢量图层填充颜色,以及透明度
color: "rgba(255, 84, 87, 0.3)",
}),
stroke: new ol.style.Stroke({
//边界样式
color: "#ff5457",
width: 3,
}),
})
});
this.map.getLayers().insertAt(4, selectedLandLayer);
this.map.getView().setCenter(ol.extent.getCenter(selectedLandLayer.getSource().getExtent()));
this.map.getView().setZoom(18);
}
}

}
}
</script>
<style scoped type="scss">
.container_main{
height: 75vh;
overflow-y: scroll;
}
</style>

+ 627
- 0
src/views/resource/operation/index.vue Zobrazit soubor

@@ -0,0 +1,627 @@
<template>
<div class="app-container">
<el-row :gutter="20">
<splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
<!--部门数据-->
<pane size="16">
<el-col>
<div class="head-container">
<el-input v-model="deptName" placeholder="请输入区划名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px" />
</div>
<div class="head-container container_main">
<el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current @node-click="handleNodeClick" />
</div>
</el-col>
</pane>
<!--用户数据-->
<pane size="84">
<el-col>

<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="地块代码" prop="dkbm">
<el-input v-model="queryParams.dkbm" placeholder="请输入地块代码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="地块名称" prop="dkmc">
<el-input v-model="queryParams.dkmc" placeholder="请输入地块名称" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="调查状态" prop="surveyStatus">
<el-select v-model="queryParams.surveyStatus" placeholder="请选择调查状态" clearable>
<el-option v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="级联代码" prop="importCode">
<el-input v-model="queryParams.importCode" placeholder="请输入部门级联代码" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>

<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['resource:operation:add']">新增</el-button>
</el-col>
<!--
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['resource:operation:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['resource:operation:remove']">删除</el-button>
</el-col>
-->
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['resource:operation:import']">导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['resource:operation:export']">导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-printer" size="mini" @click="handlePrint()" v-hasPermi="['resource:operation:print']">打印</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>

<!-- 数据列表 列属性 min-width="60" show-overflow-tooltip @selection-change="handleSelectionChange" -->
<el-table v-loading="loading" :data="operationList" border>
<!--<el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="id" align="center" prop="id" min-width="60"/>
<el-table-column label="地块代码" align="center" prop="dkbm" />
<el-table-column label="地块名称" align="center" prop="dkmc" />
<el-table-column label="地块东至" align="center" prop="dkdz" />
<el-table-column label="地块西至" align="center" prop="dkxz" />
<el-table-column label="地块南至" align="center" prop="dknz" />
<el-table-column label="地块北至" align="center" prop="dkbz" />
<el-table-column label="经营面积(亩)" align="center" prop="jymj" />
<el-table-column label="经营方式" align="center" prop="jyfs" />
<el-table-column label="经营对象名称" align="center" prop="jydxmc" />
<el-table-column label="经营开始时间" align="center" prop="jykssj" />
<el-table-column label="经营结束时间" align="center" prop="jyjssj" />
<el-table-column label="承包金额(元)" align="center" prop="cbje" />
<el-table-column label="调查状态" align="center" prop="surveyStatus">
<template slot-scope="scope">
<dict-tag :options="dict.type.survey_status" :value="scope.row.surveyStatus"/>
</template>
</el-table-column>
<el-table-column label="部门级联代码" align="center" prop="importCode" />
<el-table-column label="区域位置名称" align="center" prop="deptName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="250">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-view" @click="handleLook(scope.row)" v-hasPermi="['resource:operation:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['resource:operation:edit']">修改</el-button>
<el-dropdown size="mini" v-hasPermi="['resource:operation:remove']">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-dropdown-menu slot="dropdown" style="padding: 5px">
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['resource:operation:remove']">删除</el-button>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>

<!-- 分页插件 -->
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>

</el-col>
</pane>
</splitpanes>
</el-row>

<!-- 导入EXCEL组件 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip text-left" slot="tip">
<div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的地块经营
</div>
<p style="color: red">1、仅允许导入xls、xlsx格式文件;</p>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div>
</el-dialog>

<!-- 查看地块经营对话框 -->
<el-dialog :title="title" :visible.sync="viewOpen" width="800px" append-to-body>
<el-descriptions title="地块信息" border :column="2" class="margin-top">
<el-descriptions-item label="区域位置名称">{{ form.deptName }}</el-descriptions-item>
<el-descriptions-item label="标识码">{{ form.bsm }}</el-descriptions-item>
<el-descriptions-item label="要素代码">{{ form.ysdm }}</el-descriptions-item>
<el-descriptions-item label="地块代码">{{ form.dkbm }}</el-descriptions-item>
<el-descriptions-item label="地块名称">{{ form.dkmc }}</el-descriptions-item>
<el-descriptions-item label="所有权性质">{{ form.syqxz }}</el-descriptions-item>
<el-descriptions-item label="地块类别">{{ form.dklb }}</el-descriptions-item>
<el-descriptions-item label="土地利用类型">{{ form.tdlylx }}</el-descriptions-item>
<el-descriptions-item label="地力等级">{{ form.dldj }}</el-descriptions-item>
<el-descriptions-item label="土地用途">{{ form.tdyt }}</el-descriptions-item>
<el-descriptions-item label="是否基本农田">{{ form.sfjbnt }}</el-descriptions-item>
<el-descriptions-item label="地块东至">{{ form.dkdz }}</el-descriptions-item>
<el-descriptions-item label="地块西至">{{ form.dkxz }}</el-descriptions-item>
<el-descriptions-item label="地块南至">{{ form.dknz }}</el-descriptions-item>
<el-descriptions-item label="地块北至">{{ form.dkbz }}</el-descriptions-item>
<el-descriptions-item label="备注信息">{{ form.dkbzxx }}</el-descriptions-item>
<el-descriptions-item label="指界人姓名">{{ form.zjrxm }}</el-descriptions-item>
<el-descriptions-item label="实测面积(㎡)">{{ form.scmj }}</el-descriptions-item>
<el-descriptions-item label="实测面积(亩)">{{ form.scmjm }}</el-descriptions-item>
</el-descriptions>

<el-descriptions title="经营数据" border :column="2" class="margin-top">
<el-descriptions-item label="经营面积(亩)">{{ form.jymj }}</el-descriptions-item>
<el-descriptions-item label="经营方式">{{ form.jyfs }}</el-descriptions-item>
<el-descriptions-item label="经营对象名称">{{ form.jydxmc }}</el-descriptions-item>
<el-descriptions-item label="经营开始时间">{{ form.jykssj }}</el-descriptions-item>
<el-descriptions-item label="经营结束时间">{{ form.jyjssj }}</el-descriptions-item>
<el-descriptions-item label="承包金额(元)">{{ form.cbje }}</el-descriptions-item>
<el-descriptions-item label="备注">{{ form.bz }}</el-descriptions-item>
<el-descriptions-item label="调查状态">{{ form.surveyStatus }}</el-descriptions-item>
<el-descriptions-item label="实物图">
<div v-if="!!form.dkImg">
<el-tooltip effect="light" :content="item" placement="bottom" v-for="(item, index) in form.dkImg.split(',')" :key="index">
<el-image style="height: 64px; width: 64px; margin: 2px; display: inline-block;" fit="scale-down" :src="baseRoutingUrll + item" :preview-src-list="form.dkImg.split(',').map((x) => baseRoutingUrll + x)"/>
</el-tooltip>
</div>
</el-descriptions-item>
</el-descriptions>

<!-- 弹框操作按钮 -->
<div slot="footer" class="dialog-footer">
<el-button @click="doPrint">打 印</el-button>
<el-button @click="cancelDetail">关 闭</el-button>
</div>
</el-dialog>

<!-- 添加或修改地块经营对话框 -->
<el-dialog :title="title" :visible.sync="open" width="820px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">

<el-form-item label="区域位置名称" prop="deptName">
<el-input v-model="form.deptName" placeholder="请输入区域位置名称" show-word-limit :maxlength="100" readOnly/>
</el-form-item>
<el-form-item label="地块代码" prop="dkbm">
<el-input v-model="form.dkbm" placeholder="请输入地块代码,跟地块属性中的地块编码一致" show-word-limit :maxlength="19" readOnly/>
</el-form-item>
<el-form-item label="地块名称" prop="dkmc">
<el-input v-model="form.dkmc" placeholder="请输入地块名称" show-word-limit :maxlength="50" readOnly/>
</el-form-item>
<el-form-item label="地块东至" prop="dkdz">
<el-input v-model="form.dkdz" placeholder="请输入地块东至" show-word-limit :maxlength="50" readOnly/>
</el-form-item>
<el-form-item label="地块西至" prop="dkxz">
<el-input v-model="form.dkxz" placeholder="请输入地块西至" show-word-limit :maxlength="50" readOnly/>
</el-form-item>
<el-form-item label="地块南至" prop="dknz">
<el-input v-model="form.dknz" placeholder="请输入地块南至" show-word-limit :maxlength="50" readOnly/>
</el-form-item>
<el-form-item label="地块北至" prop="dkbz">
<el-input v-model="form.dkbz" placeholder="请输入地块北至" show-word-limit :maxlength="50" readOnly/>
</el-form-item>
<el-form-item label="经营面积(亩)" prop="jymj">
<el-input-number v-model="form.jymj" placeholder="请输入经营面积(亩)" controls-position="right" :precision="3"/>
</el-form-item>
<el-form-item label="经营方式" prop="jyfs">
<el-input v-model="form.jyfs" placeholder="请输入经营方式" show-word-limit :maxlength="1"/>
</el-form-item>
<el-form-item label="经营对象名称" prop="jydxmc">
<el-input v-model="form.jydxmc" placeholder="请输入经营对象名称" show-word-limit :maxlength="200"/>
</el-form-item>
<el-form-item label="经营开始时间" prop="jykssj">
<el-date-picker clearable v-model="form.jykssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营开始时间"></el-date-picker>
</el-form-item>
<el-form-item label="经营结束时间" prop="jyjssj">
<el-date-picker clearable v-model="form.jyjssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营结束时间"></el-date-picker>
</el-form-item>
<el-form-item label="承包金额(元)" prop="cbje">
<el-input-number v-model="form.cbje" placeholder="请输入承包金额(元)" controls-position="right" :precision="2"/>
</el-form-item>
<el-form-item label="备注" prop="bz">
<el-input v-model="form.bz" placeholder="请输入备注" show-word-limit :maxlength="255"/>
</el-form-item>
<el-form-item label="实物图" prop="dkImg">
<image-upload v-model="form.dkImg"/>
</el-form-item>
<el-form-item label="调查状态" prop="surveyStatus">
<el-radio-group v-model="form.surveyStatus">
<el-radio v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>

<script>
import { listOperation, getOperation, getOperationDetail, getOperationDetailByDkbm, delOperation, addOperation, updateOperation, printOperation } from "@/api/resource/operation"
import { getToken } from "@/utils/auth"
import Treeselect from "@riophae/vue-treeselect";
import { Splitpanes, Pane } from "splitpanes"
import "@riophae/vue-treeselect/dist/vue-treeselect.css"
import "splitpanes/dist/splitpanes.css"
import { deptTreeSelect } from "@/api/system/user"

export default {
name: "Operation",
dicts: ['survey_status'],
components: { Treeselect, Splitpanes, Pane },
data() {
return {
// 遮罩层
loading: true,
// 导出遮罩层
exportLoading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 地块经营表格数据
operationList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 详情组件列数
descColumn: 2,
// 详情组件Label所占百分比, 最大={100 / descColumn}. 内容所占百分比={100 / descColumn - descLabelWidth}
descLabelWidth: 15,
// 对话框显示只读的详情
viewOpen: false,
// 项目路径
baseRoutingUrll: process.env.VUE_APP_BASE_API,
// 所有部门树选项
deptOptions: undefined,
// 过滤掉已禁用部门树选项
enabledDeptOptions: undefined,
// 筛选部门名称
deptName: undefined,
// 选中的部门
selectDeptName: null,
defaultProps: {
children: "children",
label: "label"
},
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
// 查询排序
//orderByColumn: "id",
//isAsc: "desc",
// 翻译字典
//toTranslateDict: "1",
dkbm: null,
dkmc: null,
surveyStatus: null,
importCode: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
dkbm: [
{ required: true, message: "地块代码不能为空", trigger: "blur" }
],
dkmc: [
{ required: true, message: "地块名称不能为空", trigger: "blur" }
],
jymj: [
{ required: true, message: "经营面积(亩)不能为空", trigger: "blur" }
],
jyfs: [
{ required: true, message: "经营方式不能为空", trigger: "blur" }
],
jydxmc: [
{ required: true, message: "经营对象名称不能为空", trigger: "blur" }
],
jykssj: [
{ required: true, message: "经营开始时间不能为空", trigger: "blur" }
],
jyjssj: [
{ required: true, message: "经营结束时间不能为空", trigger: "blur" }
],
cbje: [
{ required: true, message: "承包金额(元)不能为空", trigger: "blur" }
],

},
// EXCEL导入
upload: {
// 是否显示弹出层(用户导入)
open: false,
// 弹出层标题(用户导入)
title: "",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + "/resource/operation/importData"
},

}
},
watch: {
// 根据名称筛选部门树
deptName(val) {
this.$refs.tree.filter(val)
}
},
created() {
this.getDeptTree()
this.getList()
},
methods: {
/** 查询地块经营列表 */
getList() {
this.loading = true
listOperation(this.queryParams).then(response => {
this.operationList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
cancelDetail() {
this.viewOpen = false
},
// 表单重置
reset() {
this.form = {
id: null,
dkbm: null,
dkmc: null,
dkdz: null,
dkxz: null,
dknz: null,
dkbz: null,
jymj: null,
jyfs: null,
jydxmc: null,
jykssj: null,
jyjssj: null,
cbje: null,
bz: null,
dkImg: null,
surveyStatus: '2',
importCode: null,
deptName: null,
}
this.resetForm("form")
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm")
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
if(this.selectDeptName == null || this.selectDeptName == ''){
this.$modal.msgWarning("请先选择村/组行政区划!")
return
}

this.reset()
this.form.deptId = this.queryParams.deptId;
this.form.deptName = this.selectDeptName;
this.open = true
this.title = "添加地块经营"
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.id || this.ids
getOperation(id).then(response => {
this.form = response.data
this.open = true
this.title = "修改地块经营"
})
},
/** 查看按钮操作 */
handleLook(row) {
getOperationDetailByDkbm(row.dkbm).then(response => {
this.form = response.data;
this.viewOpen = true;
this.title = "查看地块经营";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateOperation(this.form).then(response => {
this.$modal.msgSuccess("修改成功")
this.open = false
this.getList()
})
} else {
addOperation(this.form).then(response => {
this.$modal.msgSuccess("新增成功")
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids
this.$modal.confirm('是否确认删除地块经营编号为"' + ids + '"的数据项?').then(function() {
return delOperation(ids)
}).then(() => {
this.getList()
this.$modal.msgSuccess("删除成功")
}).catch(() => {})
},
/** 导出按钮操作 */
handleExport() {
this.download('resource/operation/export', {
...this.queryParams
}, `地块经营_${new Date().getTime()}.xlsx`)
},
/** 打印表单 */
doPrint() {
const originalTitle = document.title;
try {
document.title = this.title || '打印详情';
const printElement = document.getElementById('printDetail');
const printFrame = document.createElement('iframe');
printFrame.style.position = 'absolute';
printFrame.style.width = '0';
printFrame.style.height = '0';
printFrame.style.border = 'none';
printFrame.style.left = '-9999px';
printFrame.onload = function() {
try {
const frameDoc = printFrame.contentDocument || printFrame.contentWindow.document;
const contentClone = printElement.cloneNode(true);
const style = document.createElement('style');
style.innerHTML = `
@page {
size: auto;
margin: 10mm;
}
body {
font-family: Arial, sans-serif;
line-height: 1.5;
margin: 0;
padding: 0;
}
.el-descriptions {
width: 100% !important;
}
.el-descriptions-item__label {
width: ${this.descLabelWidth}% !important;
}
.el-descriptions-item__content {
width: ${(100 / this.descColumn) - this.descLabelWidth}% !important;
}
/* 确保图片在打印时显示完整 */
img, .el-image {
max-width: 100% !important;
height: auto !important;
}
`;
frameDoc.head.appendChild(style);
frameDoc.body.appendChild(contentClone);
setTimeout(() => {
printFrame.contentWindow.focus();
printFrame.contentWindow.print();
setTimeout(() => {
document.body.removeChild(printFrame);
document.title = originalTitle;
}, 1000);
}, 500);
} catch (e) {
document.body.removeChild(printFrame);
document.title = originalTitle;
this.$message.error('打印过程中发生错误');
}
};
document.body.appendChild(printFrame);
} catch (e) {
document.title = originalTitle;
this.$message.error('打印过程中发生错误');
}
},
/** 打印按钮操作 */
handlePrint() {
printOperation(this.queryParams).then(response => {})
},
/* 导入EXCEL组件 */
handleImport() {
this.upload.title = "地块经营导入"
this.upload.open = true
},
/** 下载模板操作 */
importTemplate() {
this.download('resource/operation/importTemplate', {
}, `地块经营_template.xlsx`)
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.upload.open = false
this.upload.isUploading = false
this.$refs.upload.clearFiles()
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })
this.getList()
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit()
},
/** 查询部门下拉树结构 */
getDeptTree() {
deptTreeSelect().then(response => {
this.deptOptions = response.data
this.enabledDeptOptions = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)))
})
},
// 过滤禁用的部门
filterDisabledDept(deptList) {
return deptList.filter(dept => {
if (dept.disabled) {
return false
}
if (dept.children && dept.children.length) {
dept.children = this.filterDisabledDept(dept.children)
}
return true
})
},
// 筛选节点
filterNode(value, data) {
if (!value) return true
return data.label.indexOf(value) !== -1
},
// 节点单击事件
handleNodeClick(data) {
this.queryParams.deptId = data.id
this.selectDeptName = data.label
this.handleQuery()
},

}
}
</script>
<style scoped type="scss">
.container_main{
height: 75vh;
overflow-y: scroll;
}
</style>

Načítá se…
Zrušit
Uložit