123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117 |
- <template>
- <div>
- <a-modal
- :title="fileType === 'image' ? '图片上传' : '文件上传'"
- :width="width"
- :visible="visible"
- @ok="ok"
- cancelText="取消"
- @cancel="close">
- <!--style="top: 20px;"-->
- <j-upload :file-type="fileType" :value="filePath" @change="handleChange" :disabled="disabled" :number="number"></j-upload>
- </a-modal>
- </div>
- </template>
- <script>
- import { getFileAccessHttpUrl } from '@/api/manage';
- const getFileName=(path)=>{
- if(path.lastIndexOf("\\")>=0){
- let reg=new RegExp("\\\\","g");
- path = path.replace(reg,"/");
- }
- return path.substring(path.lastIndexOf("/")+1);
- }
- export default {
- name: 'JFilePop',
- components: { },
- props:{
- title:{
- type:String,
- default:'',
- required:false
- },
- position:{
- type:String,
- default:'right',
- required:false
- },
- height:{
- type:Number,
- default:200,
- required:false
- },
- width:{
- type:Number,
- default:520,
- required:false
- },
- popContainer:{
- type:String,
- default:'',
- required:false
- },
- disabled:{
- type:Boolean,
- default:false,
- required:false
- },
- number:{
- type:Number,
- required:false,
- default: 0
- }
- },
- data(){
- return {
- visible:false,
- filePath:'',
- id:'',
- fileType:'file'
- }
- },
- methods:{
- handleChange(value){
- this.filePath = value;
- },
- show(id,value,flag){
- this.id = id;
- this.filePath = value;
- this.visible=true
- if(flag === 'img'){
- this.fileType = 'image'
- }else{
- this.fileType = 'file'
- }
- },
- ok(){
- if(!this.filePath){
- this.$message.error("未上传任何文件")
- return false;
- }
- let arr = this.filePath.split(",")
- let obj = {
- name:getFileName(arr[0]),
- url:getFileAccessHttpUrl(arr[0]),
- path:this.filePath,
- status: 'done',
- id:this.id
- }
- this.$emit('ok',obj)
- this.visible=false
- },
- close(){
- this.visible=false
- }
- }
- }
- </script>
- <style scoped>
- </style>
|