zhangzl
/
rongxin.dashboard
1
0
Vork 0
Code Kwesties 0 Pull-aanvragen 0 Publicaties 0 Wiki Activiteit
管理系统PC端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
104 Commits
1 Branch
5.5 MiB
 
 
 
 
Tree: 1052297958
Branches Labels
${ item.name }
Maak branch ${ searchTerm }
van '1052297958'
${ noResults }
rongxin.dashboard/src/views/business/import/index.vue

678 regels
28 KiB
Ruw Blame Geschiedenis 

  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. 

  22.               <el-form-item label="文件格式" prop="fileType">

  23.                 <el-select v-model="queryParams.fileType" placeholder="请选择文件格式" clearable>

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

  25.                 </el-select>

  26.               </el-form-item>

  27.               <el-form-item label="导入方式" prop="importType">

  28.                 <el-select v-model="queryParams.importType" placeholder="请选择导入方式" clearable>

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

  30.                 </el-select>

  31.               </el-form-item>

  32.               <el-form-item label="坐标系" prop="coordinateSystem">

  33.                 <el-select v-model="queryParams.coordinateSystem" placeholder="请选择坐标系" clearable>

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

  35.                 </el-select>

  36.               </el-form-item>

  37.               <el-form-item label="任务状态" prop="taskStatus">

  38.                 <el-select v-model="queryParams.taskStatus" placeholder="请选择任务状态" clearable>

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

  40.                 </el-select>

  41.               </el-form-item>

  42.               <el-form-item>

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

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

  45.               </el-form-item>

  46.             </el-form>

  47. 

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

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

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

  51.               </el-col>

  52.               <!--

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

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

  55.               </el-col>

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

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

  58.               </el-col>

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

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

  61.               </el-col>

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

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

  64.               </el-col>

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

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

  67.               </el-col>

  68.               -->

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

  70.             </el-row>

  71. 

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

  73.             <el-table v-loading="loading" :data="importList" border>

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

  75.               <el-table-column label="id" align="center" prop="id" min-width="60"/>

  76.               <el-table-column label="行政区划名称" align="center" prop="deptName" min-width="120"/>

  77.               <el-table-column label="行政区划代码" align="center" prop="orgCode" min-width="150"/>

  78.               <el-table-column label="文件格式" align="center" prop="fileType">

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

  80.                   <dict-tag :options="dict.type.file_type" :value="scope.row.fileType"/>

  81.                 </template>

  82.               </el-table-column>

  83.               <el-table-column label="导入方式" align="center" prop="importType">

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

  85.                   <dict-tag :options="dict.type.import_type" :value="scope.row.importType"/>

  86.                 </template>

  87.               </el-table-column>

  88.               <el-table-column label="坐标系" align="center" prop="coordinateSystem">

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

  90.                   <dict-tag :options="dict.type.coordinate_system" :value="scope.row.coordinateSystem"/>

  91.                 </template>

  92.               </el-table-column>

  93.               <!--<el-table-column label="文件路径" align="center" prop="fileUrl" min-width="300" show-overflow-tooltip/>-->

  94.               <el-table-column label="文件路径" header-align="center" align="left" prop="fileUrl" >

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

  96.                   <div v-if="!!scope.row.fileUrl"><el-tooltip effect="light" :content="item.substr(item.lastIndexOf('/') + 1)" placement="bottom" v-for="(item, index) in scope.row.fileUrl.split(',')" :key="index"><a :href="baseRoutingUrll + item" target="_blank" style="height: 32px; width: 32px; margin: 2px; display: inline-block; text-align: center;"><img :src="getFileIcon(item)" style="height: 100%;"/></a></el-tooltip></div>

  97.                 </template>

  98.               </el-table-column>

  99.               <el-table-column label="任务状态" align="center" prop="taskStatus">

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

  101.                   <dict-tag :options="dict.type.task_status" :value="scope.row.taskStatus"/>

  102.                 </template>

  103.               </el-table-column>

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

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

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

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

  108.                   <el-button size="mini" type="text" icon="el-icon-video-play" @click="handleDo(scope.row)" v-hasPermi="['business:import:do']" v-if="scope.row.taskStatus == '0'">执行</el-button>

  109.                   <el-button size="mini" type="text" icon="el-icon-tickets" @click="openLog(scope.row)" v-hasPermi="['business:import:do']">日志</el-button>

  110. 

  111.                   <el-dropdown size="mini" v-hasPermi="['business:import:remove']">

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

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

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

  115.                     </el-dropdown-menu>

  116.                   </el-dropdown>

  117.                 </template>

  118.               </el-table-column>

  119.             </el-table>

  120. 

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

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

  123. 

  124.           </el-col>

  125.         </pane>

  126.       </splitpanes>

  127.     </el-row>

  128. 

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

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

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

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

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

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

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

  136.                       <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的导入任务

  137.                   </div>

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

  139.                   <p style="color: red">2、覆盖导入：指先将所选区划当前在库数据删除，然后按新数据包解析导入；</p>

  140.                   <p style="color: red">3、增量导入：指按新数据包解析并追加导入；</p>

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

  142.               </div>

  143.           </el-upload>

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

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

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

  147.           </div>

  148.       </el-dialog>

  149. 

  150.       <!-- 查看导入任务对话框 -->

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

  152.          <el-descriptions id="printDetail" :column="descColumn" border :labelStyle="{width: `${descLabelWidth}%`}" :contentStyle="{width: `${(100 / descColumn) - descLabelWidth}%`}">

  153.            <el-descriptions-item label="行政区划名称">{{ form.deptName }}</el-descriptions-item>

  154.            <el-descriptions-item label="行政区划代码">{{ form.orgCode }}</el-descriptions-item>

  155.            <el-descriptions-item label="文件格式">{{ form.fileType }}</el-descriptions-item>

  156.            <el-descriptions-item label="导入方式">{{ form.importType }}</el-descriptions-item>

  157.            <el-descriptions-item label="坐标系">{{ form.coordinateSystem }}</el-descriptions-item>

  158.            <el-descriptions-item label="文件路径">{{ form.fileUrl }}</el-descriptions-item>

  159.            <el-descriptions-item label="任务状态">{{ form.taskStatus }}</el-descriptions-item>

  160.          </el-descriptions>

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

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

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

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

  165.          </div>

  166.       </el-dialog>

  167. 

  168.     <!-- 添加或修改导入任务对话框 -->

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

  170.       <el-form ref="form" :model="form" :rules="rules" label-width="100px">

  171.         <el-form-item label="区划名称" prop="deptName">

  172.             <el-input v-model="form.deptName" placeholder="请输入行政区划名称"  show-word-limit :maxlength="30" readonly/>

  173.         </el-form-item>

  174.         <el-form-item label="文件格式" prop="fileType">

  175.           <el-select v-model="form.fileType" placeholder="请选择文件格式">

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

  177.           </el-select>

  178.         </el-form-item>

  179.         <el-form-item prop="importType">

  180.           <span slot="label">

  181.             导入方式

  182.               <el-tooltip content="覆盖导入：指先将所选区划当前在库数据删除，然后按新数据包解析导入；增量导入：指按新数据包解析并追加导入。" placement="top">

  183.               <i class="el-icon-question"></i>

  184.             </el-tooltip>

  185.           </span>

  186.           <el-select v-model="form.importType" placeholder="请选择导入方式">

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

  188.           </el-select>

  189.         </el-form-item>

  190.         <el-form-item label="坐标系" prop="coordinateSystem">

  191.           <el-select v-model="form.coordinateSystem" placeholder="请选择坐标系">

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

  193.           </el-select>

  194.         </el-form-item>

  195.         <el-form-item label="文件路径" prop="fileUrl">

  196.           <file-upload v-model="form.fileUrl"/>

  197.         </el-form-item>

  198. 

  199.       </el-form>

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

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

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

  203.       </div>

  204.     </el-dialog>

  205. 

  206.     <el-dialog title="任务日志" :visible.sync="log.logOpen" width="800px" append-to-body>

  207.       <div v-html="log.logText">

  208.       </div>

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

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

  211.         <el-button @click="downloadLog">下 载</el-button>

  212.         <el-button @click="closeLog">关 闭</el-button>

  213.       </div>

  214.     </el-dialog>

  215.   </div>

  216. </template>

  217. 

  218. <script>

  219. import {

  220.   listImport,

  221.   getImport,

  222.   getImportDetail,

  223.   delImport,

  224.   addImport,

  225.   updateImport,

  226.   printImport,

  227.   startImport, importLog, downloadLog

  228. } from "@/api/business/import"

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

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

  231. import {Pane, Splitpanes} from "splitpanes";

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

  233. import "splitpanes/dist/splitpanes.css"

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

  235. import {save} from "@/utils";

  236. 

  237. export default {

  238.   name: "Import",

  239.   dicts: ['task_status', 'file_type', 'coordinate_system', 'import_type'],

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

  241.   data() {

  242.     return {

  243.       // 遮罩层

  244.       loading: true,

  245.       // 导出遮罩层

  246.       exportLoading: false,

  247.       // 选中数组

  248.       ids: [],

  249.       // 非单个禁用

  250.       single: true,

  251.       // 非多个禁用

  252.       multiple: true,

  253.       // 显示搜索条件

  254.       showSearch: true,

  255.       // 总条数

  256.       total: 0,

  257.       // 导入任务表格数据

  258.       importList: [],

  259.       // 弹出层标题

  260.       title: "",

  261.       // 是否显示弹出层

  262.       open: false,

  263.       // 详情组件列数

  264.       descColumn: 2,

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

  266.       descLabelWidth: 15,

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

  268.       viewOpen: false,

  269.       // 项目路径

  270.       baseRoutingUrll: process.env.VUE_APP_BASE_API,

  271.       // 所有部门树选项

  272.       deptOptions: undefined,

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

  274.       enabledDeptOptions: undefined,

  275.       // 筛选部门名称

  276.       deptName: undefined,

  277.       // 选中的部门

  278.       selectDeptName: null,

  279.       defaultProps: {

  280.         children: "children",

  281.         label: "label"

  282.       },

  283.       // 查询参数

  284.       queryParams: {

  285.         pageNum: 1,

  286.         pageSize: 10,

  287.        // 查询排序

  288.        //orderByColumn: "id",

  289.        //isAsc: "desc",

  290.        // 翻译字典

  291.        //toTranslateDict: "1",

  292.         deptId: null,

  293.         deptName: null,

  294.         orgCode: null,

  295.         fileType: null,

  296.         importType: null,

  297.         coordinateSystem: null,

  298.         fileUrl: null,

  299.         taskStatus: null,

  300.       },

  301.       // 表单参数

  302.       form: {},

  303.       // 表单校验

  304.       rules: {

  305.         deptName: [

  306.           { required: true, message: "行政区划名称不能为空", trigger: "blur" }

  307.         ],

  308.         fileType: [

  309.           { required: true, message: "文件格式不能为空", trigger: "change" }

  310.         ],

  311.         importType: [

  312.           { required: true, message: "导入方式不能为空", trigger: "change" }

  313.         ],

  314.         coordinateSystem: [

  315.           { required: true, message: "坐标系不能为空", trigger: "change" }

  316.         ],

  317.         /*fileUrl: [

  318.           { required: true, message: "文件路径不能为空", trigger: "blur" }

  319.         ],*/

  320.         taskStatus: [

  321.           { required: true, message: "任务状态不能为空", trigger: "change" }

  322.         ],

  323.       },

  324.       // EXCEL导入

  325.       upload: {

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

  327.           open: false,

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

  329.           title: "",

  330.           // 是否禁用上传

  331.           isUploading: false,

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

  333.           updateSupport: 0,

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

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

  336.           // 上传的地址

  337.           url: process.env.VUE_APP_BASE_API + "/business/import/importData"

  338.       },

  339.       log: {

  340.         taskId: null,

  341.         logOpen: false,

  342.         logText: '',

  343.       },

  344.     }

  345.   },

  346.   watch: {

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

  348.     deptName(val) {

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

  350.     }

  351.   },

  352.   created() {

  353.     this.getDeptTree()

  354.     this.getList()

  355.   },

  356.   methods: {

  357.     /** 查询导入任务列表 */

  358.     getList() {

  359.       this.loading = true

  360.       listImport(this.queryParams).then(response => {

  361.         this.importList = response.rows

  362.         this.total = response.total

  363.         this.loading = false

  364.       })

  365.     },

  366.     // 取消按钮

  367.     cancel() {

  368.       this.open = false

  369.       this.reset()

  370.     },

  371.     cancelDetail() {

  372.         this.viewOpen = false

  373.     },

  374.     // 表单重置

  375.     reset() {

  376.       this.form = {

  377.         id: null,

  378.         deptId: null,

  379.         deptName: null,

  380.         orgCode: null,

  381.         fileType: '1',

  382.         importType: '1',

  383.         coordinateSystem: '1',

  384.         fileUrl: null,

  385.         taskStatus: '1',

  386.       }

  387.       this.resetForm("form")

  388.     },

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

  390.     handleQuery() {

  391.       this.queryParams.pageNum = 1

  392.       this.getList()

  393.     },

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

  395.     resetQuery() {

  396.       this.resetForm("queryForm")

  397.       this.handleQuery()

  398.     },

  399.     // 多选框选中数据

  400.     handleSelectionChange(selection) {

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

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

  403.       this.multiple = !selection.length

  404.     },

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

  406.     handleAdd() {

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

  408.         this.$modal.msgWarning("请先选择县级及以下行政区划！")

  409.         return

  410.       }

  411.       this.reset()

  412.       this.open = true

  413.       this.form.deptId = this.queryParams.deptId;

  414.       this.form.deptName = this.selectDeptName;

  415.       this.title = "添加导入任务"

  416.     },

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

  418.     handleUpdate(row) {

  419.       this.reset()

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

  421.       getImport(id).then(response => {

  422.         this.form = response.data

  423.         this.open = true

  424.         this.title = "修改导入任务"

  425.       })

  426.     },

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

  428.     handleLook(row) {

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

  430.       getImportDetail(id).then(response => {

  431.           this.form = response.data;

  432.           this.viewOpen = true;

  433.           this.title = "查看导入任务";

  434.       });

  435.     },

  436.     /** 提交按钮 */

  437.     submitForm() {

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

  439.         if (valid) {

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

  441.             updateImport(this.form).then(response => {

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

  443.               this.open = false

  444.               this.getList()

  445.             })

  446.           } else {

  447.             addImport(this.form).then(response => {

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

  449.               this.open = false

  450.               this.getList()

  451.             })

  452.           }

  453.         }

  454.       })

  455.     },

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

  457.     handleDelete(row) {

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

  459.       this.$modal.confirm('是否确认删除导入任务编号为"' + ids + '"的数据项？').then(function() {

  460.         return delImport(ids)

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

  462.         this.getList()

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

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

  465.     },

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

  467.     handleExport() {

  468.       this.download('business/import/export', {

  469.         ...this.queryParams

  470.       }, `导入任务_${new Date().getTime()}.xlsx`)

  471.     },

  472.     /** 打印表单 */

  473.     doPrint() {

  474.         const originalTitle = document.title;

  475.         try {

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

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

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

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

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

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

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

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

  484.             printFrame.onload = function() {

  485.                 try {

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

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

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

  489.                     style.innerHTML = `

  490.                       @page {

  491.                         size: auto;

  492.                         margin: 10mm;

  493.                       }

  494.                       body {

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

  496.                         line-height: 1.5;

  497.                         margin: 0;

  498.                         padding: 0;

  499.                       }

  500.                       .el-descriptions {

  501.                         width: 100% !important;

  502.                       }

  503.                       .el-descriptions-item__label {

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

  505.                       }

  506.                       .el-descriptions-item__content {

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

  508.                       }

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

  510.                       img, .el-image {

  511.                         max-width: 100% !important;

  512.                         height: auto !important;

  513.                       }

  514.                     `;

  515.                     frameDoc.head.appendChild(style);

  516.                     frameDoc.body.appendChild(contentClone);

  517.                     setTimeout(() => {

  518.                         printFrame.contentWindow.focus();

  519.                         printFrame.contentWindow.print();

  520.                         setTimeout(() => {

  521.                             document.body.removeChild(printFrame);

  522.                             document.title = originalTitle;

  523.                         }, 1000);

  524.                     }, 500);

  525.                 } catch (e) {

  526.                     document.body.removeChild(printFrame);

  527.                     document.title = originalTitle;

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

  529.                 }

  530.             };

  531.             document.body.appendChild(printFrame);

  532.         } catch (e) {

  533.             document.title = originalTitle;

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

  535.         }

  536.     },

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

  538.     handlePrint() {

  539.         printImport(this.queryParams).then(response => {})

  540.     },

  541.     /* 导入EXCEL组件 */

  542.     handleImport() {

  543.         this.upload.title = "导入任务导入"

  544.         this.upload.open = true

  545.     },

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

  547.     importTemplate() {

  548.         this.download('business/import/importTemplate', {

  549.         }, `import_template.xlsx`)

  550.     },

  551.     // 文件上传中处理

  552.     handleFileUploadProgress(event, file, fileList) {

  553.         this.upload.isUploading = true

  554.     },

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

  556.     handleFileSuccess(response, file, fileList) {

  557.         this.upload.open = false

  558.         this.upload.isUploading = false

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

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

  561.         this.getList()

  562.     },

  563.     // 提交上传文件

  564.     submitFileForm() {

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

  566.     },

  567.     getFileIcon(file) {

  568.       if(!file) return '';

  569.       switch(file.toLowerCase().substr(file.lastIndexOf('.') + 1)) {

  570.         case 'jpg': case 'png': case 'jpeg': case 'bmp': case 'gif':

  571.           return this.baseRoutingUrll + file;

  572.         case 'doc': case 'docx':

  573.           return require('@/assets/images/icon_word.jpg');

  574.         case 'xls': case 'xlsx':

  575.           return require('@/assets/images/icon_excel.jpg');

  576.         case 'pdf':

  577.           return require('@/assets/images/icon_pdf.jpg');

  578.         case 'zip': case 'rar': case '7z': case 'bz2': case 'gz':

  579.           return require('@/assets/images/icon_zip.jpg');

  580.         default:

  581.           return require('@/assets/images/icon_rest.jpg');

  582.       }

  583.     },

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

  585.     getDeptTree() {

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

  587.         this.deptOptions = response.data

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

  589.       })

  590.     },

  591.     // 过滤禁用的部门

  592.     filterDisabledDept(deptList) {

  593.       return deptList.filter(dept => {

  594.         if (dept.disabled) {

  595.           return false

  596.         }

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

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

  599.         }

  600.         return true

  601.       })

  602.     },

  603.     // 筛选节点

  604.     filterNode(value, data) {

  605.       if (!value) return true

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

  607.     },

  608.     // 节点单击事件

  609.     handleNodeClick(data) {

  610.       this.queryParams.deptId = data.id

  611.       this.selectDeptName = data.label

  612.       this.handleQuery()

  613.     },

  614.     /** 开始 */

  615.     handleDo(row) {

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

  617.       this.$modal.confirm('是否确认开始编号为"' + ids + '"的导入任务？').then(function() {

  618.         return startImport(ids)

  619.       }).then((resp) => {

  620.         this.getList()

  621.         this.$modal.msgSuccess(resp.data == 2 ? '正在执行' : '已加入队列, 等待执行')

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

  623.     },

  624.     /** 日志 */

  625.     handleLog(row, offset = 0) {

  626.       if(!this.log.logOpen)

  627.         return;

  628.       importLog(row.id, offset).then(({data}) => {

  629.           if(null == data.text)

  630.           {

  631.               this.log.logText = '';

  632.               return;

  633.           }

  634.         this.log.logText += data.text

  635.         .replaceAll('<', '&lt;')

  636.         .replaceAll('>', '&gt;')

  637.         .replaceAll('\r\n', '<br/>')

  638.         .replaceAll('\r', '<br/>')

  639.         .replaceAll('\n', '<br/>')

  640.         ;

  641.         if(!data.eof && this.log.logOpen && (data.taskStatus === '1' || data.taskStatus === '2'))

  642.         {

  643.           setTimeout(() => {

  644.             this.handleLog(row, data.length);

  645.           }, data.nextPollDelay > 0 ? data.nextPollDelay : 2000);

  646.         }

  647.       });

  648.     },

  649.     /** 日志 */

  650.     downloadLog() {

  651.       if(!this.log.taskId)

  652.           return;

  653.       downloadLog(this.log.taskId).then((resp) => {

  654.         this.$message.success('开始下载......');

  655.         save(`导入任务_${this.log.taskId}.log`, resp);

  656.       });

  657.     },

  658.     openLog(row) {

  659.       this.log.logText = '';

  660.       this.log.logOpen = true;

  661.       this.log.taskId = row.id;

  662.       this.handleLog(row);

  663.     },

  664.     closeLog() {

  665.       this.log.logOpen = false;

  666.       this.log.taskId = null;

  667.       this.log.logText = '';

  668.     },

  669.   }

  670. }

  671. </script>

  672. <style scoped type="scss">

  673.   .container_main{

  674.     height: 75vh;

  675.     overflow-y: scroll;

  676.   }

  677. </style>