Skip to content

C
component
Commit 13eb67b1 authored by erichsieh's avatar erichsieh
Browse files
Options

refactor: 更新lib

parent 701af2f5
Pipeline #4638 passed with stage
    in 12 seconds
    Hide whitespace changes
    Inline Side-by-side
    Showing with 161 additions and 176 deletions
    package-lock.json
    View file @ 13eb67b1
    { {
    "name": "@purplevin/component", "name": "@purplevin/component",
    "version": "0.1.22", "version": "0.1.23",
    "lockfileVersion": 2, "lockfileVersion": 2,
    "requires": true, "requires": true,
    "packages": { "packages": {
    "": { "": {
    "name": "@purplevin/component", "name": "@purplevin/component",
    "version": "0.1.22", "version": "0.1.23",
    "dependencies": { "dependencies": {
    "axios": "^0.27.2", "axios": "^0.27.2",
    "core-js": "^3.6.5", "core-js": "^3.6.5",
    ...@@ -6342,7 +6342,7 @@ ...@@ -6342,7 +6342,7 @@
    }, },
    "node_modules/file-saver": { "node_modules/file-saver": {
    "version": "2.0.5", "version": "2.0.5",
    "resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz", "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
    "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==" "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
    }, },
    "node_modules/file-uri-to-path": { "node_modules/file-uri-to-path": {
    ...@@ -19537,7 +19537,7 @@ ...@@ -19537,7 +19537,7 @@
    }, },
    "file-saver": { "file-saver": {
    "version": "2.0.5", "version": "2.0.5",
    "resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz", "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
    "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==" "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
    }, },
    "file-uri-to-path": { "file-uri-to-path": {
    ......
    package.json
    View file @ 13eb67b1
    { {
    "name": "@purplevin/component", "name": "@purplevin/component",
    "version": "0.1.22", "version": "0.1.23",
    "private": false, "private": false,
    "main": "lib/index.umd.min.js", "main": "lib/index.umd.min.js",
    "scripts": { "scripts": {
    ......
    packages/convertTool/src/components/WordGrabPic.vue
    View file @ 13eb67b1
    <template> <template>
    <div> <div>
    <h3>word抓取图片</h3> <h3>word抓取图片</h3>
    <el-alert title="此功能将协助您将word内的图片进行抓取" type="info" /> <el-alert title="此功能将协助您将word内的图片进行抓取" type="info" />
    <br> <br>
    <el-form ref="visioForm" :model="form" size="small" label-width="160px"> <el-form ref="visioForm" :model="form" size="small" label-width="160px">
    <el-row> <el-row>
    <el-col :span="16"> <el-col :span="16">
    <el-form-item label="文档" prop="file"> <el-form-item label="文档" prop="file">
    <el-upload <el-upload ref="upload" class="upload-demo" drag :limit="1" :file-list="fileList" :action="uploadURL"
    ref="upload" :on-change="handelFileChange" :on-remove="handleFileRemove" :on-exceed="handleExceed" :auto-upload="false"
    class="upload-demo" accept="application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document">
    drag <i class="el-icon-upload" />
    :limit="1" <div class="el-upload__text">
    :file-list="fileList" 将文件拖到此处，或<em>点击上传</em>
    :action="uploadURL" </div>
    :on-change="handelFileChange" </el-upload>
    :on-remove="handleFileRemove" </el-form-item>
    :on-exceed="handleExceed" <el-form-item label="最大宽度：">
    :auto-upload="false" <el-input v-model="form.MaxWidthCm" style="width:358px"></el-input>
    accept="application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" </el-form-item>
    > <el-form-item label="最大高度：">
    <i class="el-icon-upload" /> <el-input v-model="form.MaxHeightCm" style="width:358px"></el-input>
    <div class="el-upload__text"> </el-form-item>
    将文件拖到此处，或<em>点击上传</em> <el-form-item label="Dpi：">
    </div> <el-input v-model="form.Dpi" style="width:358px"></el-input>
    </el-upload> </el-form-item>
    </el-form-item> </el-col>
    <el-form-item label="最大宽度：">
    <el-input v-model="form.MaxWidthCm" style="width:358px" ></el-input>
    </el-form-item>
    <el-form-item label="最大高度：">
    <el-input v-model="form.MaxHeightCm" style="width:358px"></el-input>
    </el-form-item>
    <el-form-item label="Dpi：">
    <el-input v-model="form.Dpi" style="width:358px"></el-input>
    </el-form-item>
    </el-col>
    </el-row> </el-row>
    <el-row> <el-row>
    <el-col :span="12" :offset="10"> <el-col :span="12" :offset="10">
    <el-button <el-button style="margin-left: 10px" size="small" type="success" @click="submitUpload">
    style="margin-left: 10px" 下载档案
    size="small" </el-button>
    type="success" </el-col>
    @click="submitUpload" </el-row>
    > </el-form>
    下载档案 </div>
    </el-button>
    </el-col>
    </el-row>
    </el-form>
    </div>
    </template> </template>
    <script> <script>
    import {fetchWordPic} from "@api/convertApi" import { fetchWordPic } from "@api/convertApi"
    import { saveAs } from 'file-saver' import { saveAs } from 'file-saver'
    export default { export default {
    name: 'GrabPic', name: 'GrabPic',
    data: function() { data: function () {
    return { return {
    form: { form: {
    MaxWidthCm: '', MaxWidthCm: '',
    MaxHeightCm: '', MaxHeightCm: '',
    Dpi: '' Dpi: ''
    }, },
    uploadURL: 'Aspose/GetWordAllPic', uploadURL: 'Aspose/GetWordAllPic',
    fileList: [] fileList: []
    } }
    }, },
    props:{ props: {
    baseUrl:{ baseUrl: {
    type: String type: String
    } }
    }, },
    methods: { methods: {
    // 上传到服务器 // 上传到服务器
    async submitUpload() { async submitUpload() {
    if (this.fileList.length <= 0) { if (this.fileList.length <= 0) {
    this.$message.error('请先选择需要上传的文件！') this.$message.error('请先选择需要上传的文件！')
    return false return false
    } }
    window._paq && window._paq.push(['trackEvent', 'Tool', 'Click', '公式转换图片']) window._paq && window._paq.push(['trackEvent', 'Tool', 'Click', '公式转换图片'])
    const formData = new FormData() const formData = new FormData()
    formData.append('file', this.fileList[0].raw) formData.append('file', this.fileList[0].raw)
    formData.append('MaxWidthCm', this.form.MaxWidthCm) formData.append('MaxWidthCm', this.form.MaxWidthCm)
    formData.append('MaxHeightCm', this.form.MaxHeightCm) formData.append('MaxHeightCm', this.form.MaxHeightCm)
    formData.append('Dpi', this.form.Dpi) formData.append('Dpi', this.form.Dpi)
    await fetchWordPic(this.baseUrl,formData). await fetchWordPic(this.baseUrl, formData).
    then(res=>{ then(res => {
    const blob = new Blob([res]) const blob = new Blob([res])
    saveAs(blob, `${this.fileList[0].name}.zip`) saveAs(blob, `${this.fileList[0].name}.zip`)
    this.$message({ this.$message({
    showClose: true, showClose: true,
    message: `档案下载成功！`, message: `档案下载成功！`,
    type: 'success' type: 'success'
    }) })
    }).catch((r) => { }).catch((r) => {
    console.error(r) console.error(r)
    this.$message({ this.$message({
    showClose: true, showClose: true,
    message: `下载文件出现错误，请联系管理员！`, message: `下载文件出现错误，请联系管理员！`,
    type: 'error' type: 'error'
    }) })
    }) })
    }, },
    // 文件状态改变时的钩子，添加文件、上传成功和上传失败时都会被调用 // 文件状态改变时的钩子，添加文件、上传成功和上传失败时都会被调用
    handelFileChange(file, fileList) { handelFileChange(file, fileList) {
    // 存在文件标识 // 存在文件标识
    let existsFileFlag = false let existsFileFlag = false
    for (let i = 0; i < this.fileList.length; i++) { for (let i = 0; i < this.fileList.length; i++) {
    if ( if (
    file.name === this.fileList[i].name && file.name === this.fileList[i].name &&
    file.size === this.fileList[i].size file.size === this.fileList[i].size
    ) { ) {
    // 如果存在了，赋值true // 如果存在了，赋值true
    existsFileFlag = true existsFileFlag = true
    } }
    } }
    // 遍历的这个文件存在当前列表直接结束 // 遍历的这个文件存在当前列表直接结束
    if (existsFileFlag) { if (existsFileFlag) {
    // 否则不加入 // 否则不加入
    fileList.pop() fileList.pop()
    // console.log(`文件已经存在：${file.name}`) // console.log(`文件已经存在：${file.name}`)
    // this.handleMsg(`文件已经选择过了：${file.name})`); // this.handleMsg(`文件已经选择过了：${file.name})`);
    this.$message({ this.$message({
    showClose: true, showClose: true,
    message: `文件已经选择过了：${file.name})`, message: `文件已经选择过了：${file.name})`,
    type: 'error' type: 'error'
    }) })
    return return
    } }
    this.fileList.push(file) this.fileList.push(file)
    }, },
    handelDetailFileChange(file, fileList) { handelDetailFileChange(file, fileList) {
    // 存在文件标识 // 存在文件标识
    let existsFileFlag = false let existsFileFlag = false
    for (let i = 0; i < this.detailFileList.length; i++) {
    if (
    file.name === this.detailFileList[i].name &&
    file.size === this.detailFileList[i].size
    ) {
    // 如果存在了，赋值true
    existsFileFlag = true
    }
    }
    // 遍历的这个文件存在当前列表直接结束
    if (existsFileFlag) {
    // 否则不加入
    fileList.pop()
    // console.log(`文件已经存在：${file.name}`)
    // this.handleMsg(`文件已经选择过了：${file.name})`);
    this.$message({
    showClose: true,
    message: `文件已经选择过了：${file.name})`,
    type: 'error'
    })
    return
    }
    this.detailFileList.push(file)
    },
    // 文件列表移除文件时的钩子
    handleFileRemove(file, fileList) {
    this.fileList = fileList
    },
    handleDetailFileRemove(file, fileList) {
    this.detailFileList = fileList
    },
    handleExceed(files, fileList) {
    this.$set(fileList[0], 'raw', files[0])
    this.$set(fileList[0], 'name', files[0].name)
    this.$refs['rebateUpload'].clearFiles()// 清除文件
    this.$refs['rebateUpload'].handleStart(files[0])// 选择文件后的赋值方法
    } for (let i = 0; i < this.detailFileList.length; i++) {
    } if (
    file.name === this.detailFileList[i].name &&
    file.size === this.detailFileList[i].size
    ) {
    // 如果存在了，赋值true
    existsFileFlag = true
    }
    }
    // 遍历的这个文件存在当前列表直接结束
    if (existsFileFlag) {
    // 否则不加入
    fileList.pop()
    // console.log(`文件已经存在：${file.name}`)
    // this.handleMsg(`文件已经选择过了：${file.name})`);
    this.$message({
    showClose: true,
    message: `文件已经选择过了：${file.name})`,
    type: 'error'
    })
    return
    }
    this.detailFileList.push(file)
    },
    // 文件列表移除文件时的钩子
    handleFileRemove(file, fileList) {
    this.fileList = fileList
    },
    handleDetailFileRemove(file, fileList) {
    this.detailFileList = fileList
    },
    handleExceed(files, fileList) {
    this.$set(fileList[0], 'raw', files[0])
    this.$set(fileList[0], 'name', files[0].name)
    this.$refs['rebateUpload'].clearFiles()// 清除文件
    this.$refs['rebateUpload'].handleStart(files[0])// 选择文件后的赋值方法
    }
    }
    } }
    </script> </script>
    \ No newline at end of file
    Markdown is supported
    0% or
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment