zhangzl
/
rongxin.dashboard
1
0
Bifurcation 0
Code Tickets 0 Demandes d'ajout 0 Versions 0 Wiki Activité
管理系统PC端
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
48 Révisions
1 Branche
5.5 MiB
 
 
 
 
Aborescence: 8f41c9b78a
Branches Tags
${ item.name }
Créer la branche ${ searchTerm }
de '8f41c9b78a'
${ noResults }
rongxin.dashboard/src/views/resource/operation/index.vue

701 lignes
32 KiB
Brut Annotations Historique 

  1. <template>

  2.   <div class="app-container">

  3.     <el-row :gutter="20">

  4.       <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">

  5.         <!--部门数据-->

  6.         <pane size="16">

  7.           <el-col>

  8.             <div class="head-container">

  9.               <el-input v-model="deptName" placeholder="请输入区划名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px" />

  10.             </div>

  11.             <div class="head-container container_main">

  12.               <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" />

  13.             </div>

  14.           </el-col>

  15.         </pane>

  16.         <!--用户数据-->

  17.         <pane size="84">

  18.           <el-col>

  19. 

  20.             <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">

  21.               <el-form-item label="地块编码" prop="dkbm">

  22.                 <el-input v-model="queryParams.dkbm" placeholder="请输入地块编码" clearable @keyup.enter.native="handleQuery"/>

  23.               </el-form-item>

  24.               <el-form-item label="地块名称" prop="dkmc">

  25.                 <el-input v-model="queryParams.dkmc" placeholder="请输入地块名称" clearable @keyup.enter.native="handleQuery"/>

  26.               </el-form-item>

  27.               <el-form-item label="经营方式" prop="jyfs">

  28.                 <el-select v-model="queryParams.jyfs" placeholder="请选择经营方式" clearable>

  29.                   <el-option v-for="dict in dict.type.jyfs" :key="dict.value" :label="dict.label" :value="dict.value"/>

  30.                 </el-select>

  31.               </el-form-item>

  32.               <el-form-item label="经营对象" prop="jydxmc">

  33.                 <el-input v-model="queryParams.jydxmc" placeholder="请输入经营对象名称" clearable @keyup.enter.native="handleQuery"/>

  34.               </el-form-item>

  35.               <el-form-item label="对象类型" prop="jydxlx">

  36.                 <el-select v-model="queryParams.jydxlx" placeholder="请选择经营对象类型" clearable>

  37.                   <el-option v-for="dict in dict.type.jydxlx" :key="dict.value" :label="dict.label" :value="dict.value"/>

  38.                 </el-select>

  39.               </el-form-item>

  40.               <el-form-item label="证件类型" prop="jydxzjlx">

  41.                 <el-select v-model="queryParams.jydxzjlx" placeholder="请选择经营对象证件类型" clearable>

  42.                   <el-option v-for="dict in dict.type.zjlx" :key="dict.value" :label="dict.label" :value="dict.value"/>

  43.                 </el-select>

  44.               </el-form-item>

  45.               <el-form-item label="证件号码" prop="jydxzjhm">

  46.                 <el-input v-model="queryParams.jydxzjhm" placeholder="请输入经营对象证件号码" clearable @keyup.enter.native="handleQuery"/>

  47.               </el-form-item>

  48.               <el-form-item label="签订合同" prop="sfqdht">

  49.                 <el-select v-model="queryParams.sfqdht" placeholder="请选择是否签订合同" clearable>

  50.                   <el-option v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.label" :value="dict.value"/>

  51.                 </el-select>

  52.               </el-form-item>

  53.               <el-form-item label="调查状态" prop="surveyStatus">

  54.                 <el-select v-model="queryParams.surveyStatus" placeholder="请选择调查状态" clearable>

  55.                   <el-option v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.label" :value="dict.value"/>

  56.                 </el-select>

  57.               </el-form-item>

  58.               <el-form-item>

  59.                 <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>

  60.                 <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>

  61.               </el-form-item>

  62.             </el-form>

  63. 

  64.             <el-row :gutter="10" class="mb8">

  65.               <el-col :span="1.5">

  66.                 <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['resource:operation:add']">新增</el-button>

  67.               </el-col>

  68.               <!--

  69.               <el-col :span="1.5">

  70.                 <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['resource:operation:edit']">修改</el-button>

  71.               </el-col>

  72.               <el-col :span="1.5">

  73.                 <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['resource:operation:remove']">删除</el-button>

  74.               </el-col>

  75.               -->

  76.               <el-col :span="1.5">

  77.                   <el-button type="success" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['resource:operation:import']">导入</el-button>

  78.               </el-col>

  79.               <el-col :span="1.5">

  80.                 <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['resource:operation:export']">导出</el-button>

  81.               </el-col>

  82.               <el-col :span="1.5">

  83.                   <el-button type="info" plain icon="el-icon-printer" size="mini" @click="handlePrint()" v-hasPermi="['resource:operation:print']">打印</el-button>

  84.               </el-col>

  85.               <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>

  86.             </el-row>

  87. 

  88.               <!-- 数据列表  列属性 min-width="60" show-overflow-tooltip  @selection-change="handleSelectionChange" -->

  89.             <el-table v-loading="loading" :data="operationList" border>

  90.                 <!--<el-table-column type="selection" width="55" align="center" />-->

  91.               <el-table-column label="地块编码" align="center" prop="dkbm" />

  92.               <el-table-column label="地块名称" align="center" prop="dkmc" />

  93.               <el-table-column label="地块东至" align="center" prop="dkdz" />

  94.               <el-table-column label="地块西至" align="center" prop="dkxz" />

  95.               <el-table-column label="地块南至" align="center" prop="dknz" />

  96.               <el-table-column label="地块北至" align="center" prop="dkbz" />

  97.               <el-table-column label="经营面积(亩)" align="center" prop="jymj" />

  98.               <el-table-column label="经营方式" align="center" prop="jyfs">

  99.                 <template slot-scope="scope">

  100.                   <dict-tag :options="dict.type.jyfs" :value="scope.row.jyfs"/>

  101.                 </template>

  102.               </el-table-column>

  103.               <el-table-column label="经营对象名称" align="center" prop="jydxmc" />

  104.               <el-table-column label="经营对象证件号码" align="center" prop="jydxzjhm" />

  105.               <el-table-column label="是否签订合同" align="center" prop="sfqdht">

  106.                 <template slot-scope="scope">

  107.                   <dict-tag :options="dict.type.is_common" :value="scope.row.sfqdht"/>

  108.                 </template>

  109.               </el-table-column>

  110.               <el-table-column label="承包金额(元)" align="center" prop="cbje" />

  111.               <el-table-column label="年收益" align="center" prop="nsy" />

  112.               <el-table-column label="调查状态" align="center" prop="surveyStatus">

  113.                 <template slot-scope="scope">

  114.                   <dict-tag :options="dict.type.survey_status" :value="scope.row.surveyStatus"/>

  115.                 </template>

  116.               </el-table-column>

  117.               <el-table-column label="区域位置名称" align="center" prop="deptName" />

  118.               <el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="250">

  119.                 <template slot-scope="scope">

  120.                   <el-button size="mini" type="text" icon="el-icon-view" @click="handleLook(scope.row)" v-hasPermi="['resource:operation:query']">查看</el-button>

  121.                   <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['resource:operation:edit']">修改</el-button>

  122.                   <el-dropdown size="mini" v-hasPermi="['resource:operation:remove']">

  123.                     <el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>

  124.                     <el-dropdown-menu slot="dropdown" style="padding: 5px">

  125.                         <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['resource:operation:remove']">删除</el-button>

  126.                     </el-dropdown-menu>

  127.                   </el-dropdown>

  128.                 </template>

  129.               </el-table-column>

  130.             </el-table>

  131. 

  132.             <!-- 分页插件 -->

  133.             <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>

  134. 

  135.           </el-col>

  136.         </pane>

  137.       </splitpanes>

  138.     </el-row>

  139. 

  140.      <!-- 导入EXCEL组件 -->

  141.       <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>

  142.           <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>

  143.               <i class="el-icon-upload"></i>

  144.               <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>

  145.               <div class="el-upload__tip text-left" slot="tip">

  146.                   <div class="el-upload__tip" slot="tip">

  147.                       <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的地块经营

  148.                   </div>

  149.                   <p style="color: red">1、仅允许导入xls、xlsx格式文件；</p>

  150.                   <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>

  151.               </div>

  152.           </el-upload>

  153.           <div slot="footer" class="dialog-footer">

  154.               <el-button type="primary" @click="submitFileForm">确 定</el-button>

  155.               <el-button @click="upload.open = false">取 消</el-button>

  156.           </div>

  157.       </el-dialog>

  158. 

  159.       <!-- 查看地块经营对话框 -->

  160.       <el-dialog :title="title" :visible.sync="viewOpen" width="800px" append-to-body>

  161.         <el-descriptions title="地块信息" border :column="2" class="margin-top">

  162.           <el-descriptions-item label="区域位置名称">{{ form.deptName }}</el-descriptions-item>

  163.           <el-descriptions-item label="标识码">{{ form.bsm }}</el-descriptions-item>

  164.           <el-descriptions-item label="要素代码">{{ form.ysdm }}</el-descriptions-item>

  165.           <el-descriptions-item label="地块代码">{{ form.dkbm }}</el-descriptions-item>

  166.           <el-descriptions-item label="地块名称">{{ form.dkmc }}</el-descriptions-item>

  167.           <el-descriptions-item label="所有权性质">{{ form.syqxz }}</el-descriptions-item>

  168.           <el-descriptions-item label="地块类别">{{ form.dklb }}</el-descriptions-item>

  169.           <el-descriptions-item label="土地利用类型">{{ form.tdlylx }}</el-descriptions-item>

  170.           <el-descriptions-item label="地力等级">{{ form.dldj }}</el-descriptions-item>

  171.           <el-descriptions-item label="土地用途">{{ form.tdyt }}</el-descriptions-item>

  172.           <el-descriptions-item label="是否基本农田">{{ form.sfjbnt }}</el-descriptions-item>

  173.           <el-descriptions-item label="地块东至">{{ form.dkdz }}</el-descriptions-item>

  174.           <el-descriptions-item label="地块西至">{{ form.dkxz }}</el-descriptions-item>

  175.           <el-descriptions-item label="地块南至">{{ form.dknz }}</el-descriptions-item>

  176.           <el-descriptions-item label="地块北至">{{ form.dkbz }}</el-descriptions-item>

  177.           <el-descriptions-item label="备注信息">{{ form.dkbzxx }}</el-descriptions-item>

  178.           <el-descriptions-item label="指界人姓名">{{ form.zjrxm }}</el-descriptions-item>

  179.           <el-descriptions-item label="实测面积(㎡)">{{ form.scmj }}</el-descriptions-item>

  180.           <el-descriptions-item label="实测面积(亩)">{{ form.scmjm }}</el-descriptions-item>

  181.         </el-descriptions>

  182. 

  183.          <el-descriptions title="经营数据" border :column="2" class="margin-top">

  184.           <el-descriptions-item label="经营面积(亩)">{{ form.jymj }}</el-descriptions-item>

  185.           <el-descriptions-item label="经营方式">{{ form.jyfs }}</el-descriptions-item>

  186.           <el-descriptions-item label="经营对象名称">{{ form.jydxmc }}</el-descriptions-item>

  187.           <el-descriptions-item label="经营开始时间">{{ form.jykssj }}</el-descriptions-item>

  188.           <el-descriptions-item label="经营结束时间">{{ form.jyjssj }}</el-descriptions-item>

  189.           <el-descriptions-item label="承包金额(元)">{{ form.cbje }}</el-descriptions-item>

  190.           <el-descriptions-item label="备注">{{ form.bz }}</el-descriptions-item>

  191.            <el-descriptions-item label="调查状态">{{ form.surveyStatus }}</el-descriptions-item>

  192.           <el-descriptions-item label="实物图">

  193.             <div v-if="!!form.dkImg">

  194.               <el-tooltip effect="light" :content="item" placement="bottom" v-for="(item, index) in form.dkImg.split(',')" :key="index">

  195.                 <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)"/>

  196.               </el-tooltip>

  197.             </div>

  198.           </el-descriptions-item>

  199.          </el-descriptions>

  200. 

  201.           <!-- 弹框操作按钮 -->

  202.          <div slot="footer" class="dialog-footer">

  203.              <el-button @click="doPrint">打 印</el-button>

  204.              <el-button @click="cancelDetail">关 闭</el-button>

  205.          </div>

  206.       </el-dialog>

  207. 

  208.     <!-- 添加或修改地块经营对话框 -->

  209.     <el-dialog :title="title" :visible.sync="open" width="820px" append-to-body>

  210.       <el-form ref="form" :model="form" :rules="rules" label-width="120px">

  211. 

  212.         <el-form-item label="区域位置名称" prop="deptName">

  213.           <el-input v-model="form.deptName" placeholder="请输入区域位置名称"  show-word-limit :maxlength="100" readOnly/>

  214.         </el-form-item>

  215.         <el-form-item label="地块编码" prop="dkbm">

  216.           <el-input v-model="form.dkbm" placeholder="请输入地块代码，跟地块属性中的地块编码一致"  show-word-limit :maxlength="19" readOnly/>

  217.         </el-form-item>

  218.         <el-form-item label="地块名称" prop="dkmc">

  219.           <el-input v-model="form.dkmc" placeholder="请输入地块名称"  show-word-limit :maxlength="50" readOnly/>

  220.         </el-form-item>

  221.         <el-form-item label="地块东至" prop="dkdz">

  222.           <el-input v-model="form.dkdz" placeholder="请输入地块东至"  show-word-limit :maxlength="50" readOnly/>

  223.         </el-form-item>

  224.         <el-form-item label="地块西至" prop="dkxz">

  225.           <el-input v-model="form.dkxz" placeholder="请输入地块西至"  show-word-limit :maxlength="50" readOnly/>

  226.         </el-form-item>

  227.         <el-form-item label="地块南至" prop="dknz">

  228.           <el-input v-model="form.dknz" placeholder="请输入地块南至"  show-word-limit :maxlength="50" readOnly/>

  229.         </el-form-item>

  230.         <el-form-item label="地块北至" prop="dkbz">

  231.           <el-input v-model="form.dkbz" placeholder="请输入地块北至"  show-word-limit :maxlength="50" readOnly/>

  232.         </el-form-item>

  233.         <el-form-item label="经营面积(亩)" prop="jymj">

  234.           <el-input-number v-model="form.jymj" placeholder="请输入经营面积(亩)" controls-position="right"   :precision="3"/>

  235.         </el-form-item>

  236.         <el-form-item label="经营方式" prop="jyfs">

  237.           <el-select v-model="form.jyfs" placeholder="请选择经营方式">

  238.             <el-option v-for="dict in dict.type.jyfs" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>

  239.           </el-select>

  240.         </el-form-item>

  241.         <el-form-item label="经营对象类型" prop="jydxlx">

  242.           <el-select v-model="form.jydxlx" placeholder="请选择经营对象类型">

  243.             <el-option v-for="dict in dict.type.jydxlx" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>

  244.           </el-select>

  245.         </el-form-item>

  246.         <el-form-item label="经营对象名称" prop="jydxmc">

  247.           <el-input v-model="form.jydxmc" placeholder="请输入经营对象名称"  show-word-limit :maxlength="100"/>

  248.         </el-form-item>

  249.         <el-form-item label="对象证件类型" prop="jydxzjlx">

  250.           <el-select v-model="form.jydxzjlx" placeholder="请选择经营对象证件类型">

  251.             <el-option v-for="dict in dict.type.zjlx" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>

  252.           </el-select>

  253.         </el-form-item>

  254.         <el-form-item label="对象证件号码" prop="jydxzjhm">

  255.           <el-input v-model="form.jydxzjhm" placeholder="请输入经营对象证件号码"  show-word-limit :maxlength="30"/>

  256.         </el-form-item>

  257.         <el-form-item label="是否签订合同" prop="sfqdht">

  258.           <el-radio-group v-model="form.sfqdht">

  259.             <el-radio v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>

  260.           </el-radio-group>

  261.         </el-form-item>

  262.         <el-form-item label="经营开始时间" prop="jykssj">

  263.           <el-date-picker clearable v-model="form.jykssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营开始时间"></el-date-picker>

  264.         </el-form-item>

  265.         <el-form-item label="经营结束时间" prop="jyjssj">

  266.           <el-date-picker clearable v-model="form.jyjssj" type="date" value-format="yyyy-MM-dd" placeholder="请选择经营结束时间"></el-date-picker>

  267.         </el-form-item>

  268.         <el-form-item label="承包金额(元)" prop="cbje">

  269.           <el-input-number v-model="form.cbje" placeholder="请输入承包金额(元)" controls-position="right"   :precision="2"/>

  270.         </el-form-item>

  271.         <el-form-item label="兑现金额" prop="dxje">

  272.           <el-input-number v-model="form.dxje" placeholder="请输入兑现金额" controls-position="right"   :precision="2"/>

  273.         </el-form-item>

  274.         <el-form-item label="尚欠金额" prop="sqje">

  275.           <el-input-number v-model="form.sqje" placeholder="请输入尚欠金额" controls-position="right"   :precision="2"/>

  276.         </el-form-item>

  277.         <el-form-item label="年收益" prop="nsy">

  278.           <el-input-number v-model="form.nsy" placeholder="请输入年收益" controls-position="right"   :precision="2"/>

  279.         </el-form-item>

  280.         <el-form-item label="备注" prop="bzxx">

  281.           <el-input v-model="form.bzxx" placeholder="请输入备注"  show-word-limit :maxlength="255"/>

  282.         </el-form-item>

  283.         <el-form-item label="实物图" prop="dkImg">

  284.           <image-upload v-model="form.dkImg"/>

  285.         </el-form-item>

  286.         <el-form-item label="调查状态" prop="surveyStatus">

  287.           <el-radio-group v-model="form.surveyStatus">

  288.             <el-radio v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>

  289.           </el-radio-group>

  290.         </el-form-item>

  291. 

  292.       </el-form>

  293.       <div slot="footer" class="dialog-footer">

  294.         <el-button type="primary" @click="submitForm">确 定</el-button>

  295.         <el-button @click="cancel">取 消</el-button>

  296.       </div>

  297.     </el-dialog>

  298.   </div>

  299. </template>

  300. 

  301. <script>

  302. import { listOperation, getOperation, getOperationDetail, getOperationDetailByDkbm, delOperation, addOperation, updateOperation, printOperation } from "@/api/resource/operation"

  303. import { getToken } from "@/utils/auth"

  304. import Treeselect from "@riophae/vue-treeselect";

  305. import { Splitpanes, Pane } from "splitpanes"

  306. import "@riophae/vue-treeselect/dist/vue-treeselect.css"

  307. import "splitpanes/dist/splitpanes.css"

  308. import { deptTreeSelect } from "@/api/system/user"

  309. 

  310. export default {

  311.   name: "Operation",

  312.   dicts: ['zjlx', 'survey_status', 'is_common', 'jydxlx', 'jyfs'],

  313.   components: { Treeselect, Splitpanes, Pane },

  314.   data() {

  315.     return {

  316.       // 遮罩层

  317.       loading: true,

  318.       // 导出遮罩层

  319.       exportLoading: false,

  320.       // 选中数组

  321.       ids: [],

  322.       // 非单个禁用

  323.       single: true,

  324.       // 非多个禁用

  325.       multiple: true,

  326.       // 显示搜索条件

  327.       showSearch: true,

  328.       // 总条数

  329.       total: 0,

  330.       // 地块经营表格数据

  331.       operationList: [],

  332.       // 弹出层标题

  333.       title: "",

  334.       // 是否显示弹出层

  335.       open: false,

  336.       // 详情组件列数

  337.       descColumn: 2,

  338.       // 详情组件Label所占百分比, 最大={100 / descColumn}. 内容所占百分比={100 / descColumn - descLabelWidth}

  339.       descLabelWidth: 15,

  340.       // 对话框显示只读的详情

  341.       viewOpen: false,

  342.       // 项目路径

  343.       baseRoutingUrll: process.env.VUE_APP_BASE_API,

  344.       // 所有部门树选项

  345.       deptOptions: undefined,

  346.       // 过滤掉已禁用部门树选项

  347.       enabledDeptOptions: undefined,

  348.       // 筛选部门名称

  349.       deptName: undefined,

  350.       // 选中的部门

  351.       selectDeptName: null,

  352.       defaultProps: {

  353.         children: "children",

  354.         label: "label"

  355.       },

  356.       // 查询参数

  357.       queryParams: {

  358.         pageNum: 1,

  359.         pageSize: 10,

  360.        // 查询排序

  361.        //orderByColumn: "id",

  362.        //isAsc: "desc",

  363.        // 翻译字典

  364.        //toTranslateDict: "1",

  365.         dkbm: null,

  366.         dkmc: null,

  367.         jyfs: null,

  368.         jydxlx: null,

  369.         jydxmc: null,

  370.         jydxzjlx: null,

  371.         jydxzjhm: null,

  372.         sfqdht: null,

  373.         surveyStatus: null,

  374.         importCode: null,

  375.       },

  376.       // 表单参数

  377.       form: {},

  378.       // 表单校验

  379.       rules: {

  380.         dkbm: [

  381.           { required: true, message: "地块代码不能为空", trigger: "blur" }

  382.         ],

  383.         dkmc: [

  384.           { required: true, message: "地块名称不能为空", trigger: "blur" }

  385.         ],

  386.         jymj: [

  387.           { required: true, message: "经营面积(亩)不能为空", trigger: "blur" }

  388.         ],

  389.         jyfs: [

  390.           { required: true, message: "经营方式不能为空", trigger: "blur" }

  391.         ],

  392.         jydxmc: [

  393.           { required: true, message: "经营对象名称不能为空", trigger: "blur" }

  394.         ],

  395.         jykssj: [

  396.           { required: true, message: "经营开始时间不能为空", trigger: "blur" }

  397.         ],

  398.         jyjssj: [

  399.           { required: true, message: "经营结束时间不能为空", trigger: "blur" }

  400.         ],

  401.         cbje: [

  402.           { required: true, message: "承包金额(元)不能为空", trigger: "blur" }

  403.         ],

  404. 

  405.       },

  406.       // EXCEL导入

  407.       upload: {

  408.           // 是否显示弹出层（用户导入）

  409.           open: false,

  410.           // 弹出层标题（用户导入）

  411.           title: "",

  412.           // 是否禁用上传

  413.           isUploading: false,

  414.           // 是否更新已经存在的用户数据

  415.           updateSupport: 0,

  416.           // 设置上传的请求头部

  417.           headers: { Authorization: "Bearer " + getToken() },

  418.           // 上传的地址

  419.           url: process.env.VUE_APP_BASE_API + "/resource/operation/importData"

  420.       },

  421. 

  422.     }

  423.   },

  424.   watch: {

  425.     // 根据名称筛选部门树

  426.     deptName(val) {

  427.       this.$refs.tree.filter(val)

  428.     }

  429.   },

  430.   created() {

  431.     this.getDeptTree()

  432.     this.getList()

  433.   },

  434.   methods: {

  435.     /** 查询地块经营列表 */

  436.     getList() {

  437.       this.loading = true

  438.       listOperation(this.queryParams).then(response => {

  439.         this.operationList = response.rows

  440.         this.total = response.total

  441.         this.loading = false

  442.       })

  443.     },

  444.     // 取消按钮

  445.     cancel() {

  446.       this.open = false

  447.       this.reset()

  448.     },

  449.     cancelDetail() {

  450.         this.viewOpen = false

  451.     },

  452.     // 表单重置

  453.     reset() {

  454.       this.form = {

  455.         id: null,

  456.         dkbm: null,

  457.         dkmc: null,

  458.         dkdz: null,

  459.         dkxz: null,

  460.         dknz: null,

  461.         dkbz: null,

  462.         jymj: null,

  463.         jyfs: '200',

  464.         jydxlx: '1',

  465.         jydxmc: null,

  466.         jydxzjlx: '1',

  467.         jydxzjhm: null,

  468.         sfqdht: '1',

  469.         jykssj: null,

  470.         jyjssj: null,

  471.         cbje: null,

  472.         dxje: null,

  473.         sqje: null,

  474.         nsy: null,

  475.         bzxx: null,

  476.         dkImg: null,

  477.         surveyStatus: '2',

  478.         importCode: null,

  479.         deptName: null,

  480.       }

  481.       this.resetForm("form")

  482.     },

  483.     /** 搜索按钮操作 */

  484.     handleQuery() {

  485.       this.queryParams.pageNum = 1

  486.       this.getList()

  487.     },

  488.     /** 重置按钮操作 */

  489.     resetQuery() {

  490.       this.resetForm("queryForm")

  491.       this.handleQuery()

  492.     },

  493.     // 多选框选中数据

  494.     handleSelectionChange(selection) {

  495.       this.ids = selection.map(item => item.id)

  496.       this.single = selection.length!==1

  497.       this.multiple = !selection.length

  498.     },

  499.     /** 新增按钮操作 */

  500.     handleAdd() {

  501.       if(this.selectDeptName == null || this.selectDeptName == ''){

  502.         this.$modal.msgWarning("请先选择村/组行政区划！")

  503.         return

  504.       }

  505. 

  506.       this.reset()

  507.       this.form.deptId = this.queryParams.deptId;

  508.       this.form.deptName = this.selectDeptName;

  509.       this.open = true

  510.       this.title = "添加地块经营"

  511.     },

  512.     /** 修改按钮操作 */

  513.     handleUpdate(row) {

  514.       this.reset()

  515.       const id = row.id || this.ids

  516.       getOperation(id).then(response => {

  517.         this.form = response.data

  518.         this.open = true

  519.         this.title = "修改地块经营"

  520.       })

  521.     },

  522.     /** 查看按钮操作 */

  523.     handleLook(row) {

  524.       getOperationDetailByDkbm(row.dkbm).then(response => {

  525.           this.form = response.data;

  526.           this.viewOpen = true;

  527.           this.title = "查看地块经营";

  528.       });

  529.     },

  530.     /** 提交按钮 */

  531.     submitForm() {

  532.       this.$refs["form"].validate(valid => {

  533.         if (valid) {

  534.           if (this.form.id != null) {

  535.             updateOperation(this.form).then(response => {

  536.               this.$modal.msgSuccess("修改成功")

  537.               this.open = false

  538.               this.getList()

  539.             })

  540.           } else {

  541.             addOperation(this.form).then(response => {

  542.               this.$modal.msgSuccess("新增成功")

  543.               this.open = false

  544.               this.getList()

  545.             })

  546.           }

  547.         }

  548.       })

  549.     },

  550.     /** 删除按钮操作 */

  551.     handleDelete(row) {

  552.       const ids = row.id || this.ids

  553.       this.$modal.confirm('是否确认删除地块经营编号为"' + ids + '"的数据项？').then(function() {

  554.         return delOperation(ids)

  555.       }).then(() => {

  556.         this.getList()

  557.         this.$modal.msgSuccess("删除成功")

  558.       }).catch(() => {})

  559.     },

  560.     /** 导出按钮操作 */

  561.     handleExport() {

  562.       this.download('resource/operation/export', {

  563.         ...this.queryParams

  564.       }, `地块经营_${new Date().getTime()}.xlsx`)

  565.     },

  566.     /** 打印表单 */

  567.     doPrint() {

  568.         const originalTitle = document.title;

  569.         try {

  570.             document.title = this.title || '打印详情';

  571.             const printElement = document.getElementById('printDetail');

  572.             const printFrame = document.createElement('iframe');

  573.             printFrame.style.position = 'absolute';

  574.             printFrame.style.width = '0';

  575.             printFrame.style.height = '0';

  576.             printFrame.style.border = 'none';

  577.             printFrame.style.left = '-9999px';

  578.             printFrame.onload = function() {

  579.                 try {

  580.                     const frameDoc = printFrame.contentDocument || printFrame.contentWindow.document;

  581.                     const contentClone = printElement.cloneNode(true);

  582.                     const style = document.createElement('style');

  583.                     style.innerHTML = `

  584.                       @page {

  585.                         size: auto;

  586.                         margin: 10mm;

  587.                       }

  588.                       body {

  589.                         font-family: Arial, sans-serif;

  590.                         line-height: 1.5;

  591.                         margin: 0;

  592.                         padding: 0;

  593.                       }

  594.                       .el-descriptions {

  595.                         width: 100% !important;

  596.                       }

  597.                       .el-descriptions-item__label {

  598.                         width: ${this.descLabelWidth}% !important;

  599.                       }

  600.                       .el-descriptions-item__content {

  601.                         width: ${(100 / this.descColumn) - this.descLabelWidth}% !important;

  602.                       }

  603.                       /* 确保图片在打印时显示完整 */

  604.                       img, .el-image {

  605.                         max-width: 100% !important;

  606.                         height: auto !important;

  607.                       }

  608.                     `;

  609.                     frameDoc.head.appendChild(style);

  610.                     frameDoc.body.appendChild(contentClone);

  611.                     setTimeout(() => {

  612.                         printFrame.contentWindow.focus();

  613.                         printFrame.contentWindow.print();

  614.                         setTimeout(() => {

  615.                             document.body.removeChild(printFrame);

  616.                             document.title = originalTitle;

  617.                         }, 1000);

  618.                     }, 500);

  619.                 } catch (e) {

  620.                     document.body.removeChild(printFrame);

  621.                     document.title = originalTitle;

  622.                     this.$message.error('打印过程中发生错误');

  623.                 }

  624.             };

  625.             document.body.appendChild(printFrame);

  626.         } catch (e) {

  627.             document.title = originalTitle;

  628.             this.$message.error('打印过程中发生错误');

  629.         }

  630.     },

  631.     /** 打印按钮操作 */

  632.     handlePrint() {

  633.         printOperation(this.queryParams).then(response => {})

  634.     },

  635.     /* 导入EXCEL组件 */

  636.     handleImport() {

  637.         this.upload.title = "地块经营导入"

  638.         this.upload.open = true

  639.     },

  640.     /** 下载模板操作 */

  641.     importTemplate() {

  642.         this.download('resource/operation/importTemplate', {

  643.         }, `地块经营_template.xlsx`)

  644.     },

  645.     // 文件上传中处理

  646.     handleFileUploadProgress(event, file, fileList) {

  647.         this.upload.isUploading = true

  648.     },

  649.     // 文件上传成功处理

  650.     handleFileSuccess(response, file, fileList) {

  651.         this.upload.open = false

  652.         this.upload.isUploading = false

  653.         this.$refs.upload.clearFiles()

  654.         this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })

  655.         this.getList()

  656.     },

  657.     // 提交上传文件

  658.     submitFileForm() {

  659.         this.$refs.upload.submit()

  660.     },

  661.     /** 查询部门下拉树结构 */

  662.     getDeptTree() {

  663.       deptTreeSelect().then(response => {

  664.         this.deptOptions = response.data

  665.         this.enabledDeptOptions = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)))

  666.       })

  667.     },

  668.     // 过滤禁用的部门

  669.     filterDisabledDept(deptList) {

  670.       return deptList.filter(dept => {

  671.         if (dept.disabled) {

  672.           return false

  673.         }

  674.         if (dept.children && dept.children.length) {

  675.           dept.children = this.filterDisabledDept(dept.children)

  676.         }

  677.         return true

  678.       })

  679.     },

  680.     // 筛选节点

  681.     filterNode(value, data) {

  682.       if (!value) return true

  683.       return data.label.indexOf(value) !== -1

  684.     },

  685.     // 节点单击事件

  686.     handleNodeClick(data) {

  687.       this.queryParams.deptId = data.id

  688.       this.selectDeptName = data.label

  689.       this.handleQuery()

  690.     },

  691. 

  692.   }

  693. }

  694. </script>

  695. <style scoped type="scss">

  696.   .container_main{

  697.     height: 75vh;

  698.     overflow-y: scroll;

  699.   }

  700. </style>