|
|
@@ -0,0 +1,179 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-tabs tabPosition="left" v-model="activeName">
|
|
|
+
|
|
|
+ <el-tab-pane label="上传附件" name="first">
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ stripe
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ label="上传日期"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="预览"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="文件地址">
|
|
|
+ <template slot="header" slot-scope="scope">
|
|
|
+ <el-button size="mini" type="primary">上传附件</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="问题附件" name="second">
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ stripe
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ label="上传日期"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="预览"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="文件地址">
|
|
|
+ <template slot="header" slot-scope="scope">
|
|
|
+ <!--<el-button size="mini" type="primary">点击上传</el-button>-->
|
|
|
+ <el-button size="mini" type="primary" @click="datadialogVisible=true">上传问题附件</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+ <!--新增、编辑附件信息-->
|
|
|
+ <el-dialog title="附件信息" :visible.sync="datadialogVisible" top="5vh">
|
|
|
+ <el-form :model="attachForm" ref="templateform">
|
|
|
+ <el-form-item label="模板类型" label-width="120px">
|
|
|
+ <el-select v-model="attachForm.Type" style="width:100%" disabled>
|
|
|
+ <el-option label="附件" value="1"></el-option>
|
|
|
+ <el-option label="问题附件" value="2"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="附件名称" prop="Name" label-width="120px">
|
|
|
+ <el-input v-model="attachForm.Name" auto-complete="off" placeholder="请输入附件名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="附件说明" label-width="120px">
|
|
|
+ <el-input type="textarea" v-model="attachForm.Remark" placeholder="请输入附件说明"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="附件地址" prop="FileURL" label-width="120px">
|
|
|
+ <el-input v-model="attachForm.FileURL" placeholder="请输入附件地址"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="附件上传" prop="TemplateInfo" label-width="120px">
|
|
|
+ <el-upload :multiple = "false" action="" :limit="1" ref="refuploadattach"
|
|
|
+ :http-request="uploadrequest" class="attach-uploader" :show-file-list="true" :before-upload="beforeAvatarUpload">
|
|
|
+ <i class="el-icon-upload attach-uploader-icon"></i>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="datadialogVisible = false">取 消</el-button>
|
|
|
+ <el-button v-if="this.service_flag=='add'" type="primary" @click="addmodel()">保 存</el-button>
|
|
|
+ <el-button v-if="this.service_flag=='edit'" type="primary" @click="editmodel()">保 存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ service_flag: 'add',
|
|
|
+ datadialogVisible: false,
|
|
|
+ activeName: 'first',
|
|
|
+ attachForm: {
|
|
|
+ Id: 0,
|
|
|
+ Name: '',
|
|
|
+ Remark: '',
|
|
|
+ FileURL: '',
|
|
|
+ Type: '1',
|
|
|
+
|
|
|
+ },
|
|
|
+ tableData: [{
|
|
|
+ date: '2016-05-02',
|
|
|
+ name: '王小虎',
|
|
|
+ address: '上海市普陀区金沙江路 1518 弄'
|
|
|
+ }, {
|
|
|
+ date: '2016-05-04',
|
|
|
+ name: '王小虎',
|
|
|
+ address: '上海市普陀区金沙江路 1517 弄'
|
|
|
+ }, {
|
|
|
+ date: '2016-05-01',
|
|
|
+ name: '王小虎',
|
|
|
+ address: '上海市普陀区金沙江路 1519 弄'
|
|
|
+ }, {
|
|
|
+ date: '2016-05-03',
|
|
|
+ name: '王小虎',
|
|
|
+ address: '上海市普陀区金沙江路 1516 弄'
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ method: {
|
|
|
+ uploadrequest (option) {
|
|
|
+ let _this = this
|
|
|
+ this.$axios.post(process.env.upfilehost, {})
|
|
|
+ .then(function (res) {
|
|
|
+ if (res.data && res.data.fid && res.data.fid !== '') {
|
|
|
+ option.action = `http://${res.data.url}/${res.data.fid}`
|
|
|
+ _this.waituploads.push({
|
|
|
+ uid: option.file.uid,
|
|
|
+ url: res.data.publicUrl,
|
|
|
+ fid: res.data.fid
|
|
|
+ })
|
|
|
+ uploadajax(option)
|
|
|
+ } else {
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '未上传成功！请刷新界面重新上传！'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(function (error) {
|
|
|
+ console.log(error)
|
|
|
+ _this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '未上传成功！请重新上传！'
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ //判断文件大小
|
|
|
+ beforeAvatarUpload(file) {
|
|
|
+ let isLt50m = file.size / 1024 / 1024 / 50 < 1
|
|
|
+ if (!isLt50m) {
|
|
|
+ this.$message.error('上传文件大小不能超过 50MB!')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ return true
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .attach-uploader .el-upload {
|
|
|
+ border: 1px dashed #63B8FF;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: -20px;
|
|
|
+ }
|
|
|
+</style>
|
yuedefeng