electron开发pdf合并工具（二）

efonfighting

发布于 2019-10-24 15:39:39

8610

发布于 2019-10-24 15:39:39

文章被收录于专栏：一番码客一番码客

本文目录：

前言代码实现构建打包实际效果遗留问题一番今日

前言

之前我们做了一个简单的界面，但其实并没有什么功能，今天我们基于前段时间一直在学习的vue相关知识，来实现一些后台逻辑。

代码实现

nodejs调用python：这里我们在按钮中去调用了python程序。
需要注意的是，所有程序运行的主目录都是当前工程的根目录。

<template>
  <div id="wrapper" align="center">
    <img id="logo" src="~@/assets/logo_efonmark.png" alt="electron-vue" align="center">
    <div align="center">
      <h1> Welcome to EfonMark!</h1>
    </div>

    <div align="center">
      <el-input id="input01"
        type="textarea"
        :autosize="{ minRows: 10, maxRows: 40}"
        placeholder="请选择文件"
        v-model="textarea">
      </el-input>
    </div>

    <div align="center">
      <el-button type="primary" v-on:click="openFile()" round>选择文件</el-button>
      <el-button type="primary" v-on:click="pdfmerge()" round>开始合并</el-button>
      <input type="file" id="filename" style="display:none" multiple="multiple" @change="showRealPath"/>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      textarea: '',
      paths: ''
    }
  },
  methods: {
    openFile: function () {
      document.getElementById('filename').click()
    },
    showRealPath: function () {
      var files = document.getElementById('filename').files
      for (var i = 0; i < files.length; i++) {
        this.paths += (files[i].path + '\n')
      }
      document.getElementById('input01').value = this.paths
      // alert(paths)
    },
    pdfmerge: function () {
      const fs = require('fs')
      fs.writeFileSync('filepaths.txt', this.paths)
      require('child_process').spawn('python py/gzh.py', {
        stdio: 'inherit',
        shell: process.platform === 'win32'
      })

      this.$message({
        message: '已完成',
        type: 'success'
      })
    }
  }
}
</script>