代码上传

src/DRP/SDrpManagement/dispatchMxAgent/index.vue

@@ -26,8 +26,6 @@
   let columns = ref([])
   let dataSource = ref([])
   let searchType = ref([
-    // {label:'状态',key:'status',type:'select',dataSource:[{remarks:'新建',value:'新建'},{remarks:'预提交',value:'预提交'},{remarks:'确认',value:'确认'},{remarks:'提交',value:'提交'},{remarks:'审核',value:'审核'},{remarks:'关闭',value:'关闭'}]},
-    // {label:'订单类型',key:'type',type:'select',dataSource:[{remarks:'标准订单',value:'标准订单'},{remarks:'促销订单',value:'促销订单'},{remarks:'特殊订单',value:'特殊订单'}]},
     {label:'时间范围',key:'dateRange',type:'datepickerRange',objKeys:['begindate','enddate']},
     {label:'搜索',key:'condition',type:'input'},
   ])

src/components/upload/index.vue

@@ -0,0 +1,154 @@
+<template>
+<a-button type="primary" @click="onShow">上传文件</a-button>
+<a-drawer
+    v-model:visible="visible"
+    class="custom-class"
+    title="文件上传"
+    placement="right"
+    width="700px"
+    @close="onClose"
+  >
+  <div style="height:200px">
+    <a-upload-dragger
+      name="file"
+      :multiple="true"
+      :showUploadList="false"
+      :customRequest="onUpload"
+      :beforeUpload="beforeUpload">
+      <p class="ant-upload-drag-icon">
+        <inbox-outlined></inbox-outlined>
+      </p>
+      <p class="ant-upload-text">将文件拖到此处，或<em>点击上传</em></p>
+      <p class="ant-upload-hint">
+        支持单次或批量上传。
+      </p>
+    </a-upload-dragger>
+    <div v-for="item in filelist" :key="item.index" >
+      <div class="flex-between">
+        <span>{{item.name}}</span>
+        <a-badge color="green" text="上传成功" />
+      </div>
+      <a-progress :percent="item.percent" />
+    </div>
+  </div>
+</a-drawer>
+</template>
+<script setup>
+import Api from '@/api/api'
+import Up from '@/api/upload'
+import { InboxOutlined } from '@ant-design/icons-vue';
+import { message } from 'ant-design-vue';
+import { defineProps,defineEmits, ref } from 'vue';
+const props = defineProps({
+  id:String,
+  bindData:Object
+})
+const emit = defineEmits(['uploadSuccess'])
+const visible = ref(false)
+
+const onUpload = ()=>{
+
+}
+let filelist = ref([])
+const beforeUpload = file=>{
+  filelist.value.push({
+    uid:file.uid,
+    name:file.name,
+    percent:0
+  })
+  let index = file.name.lastIndexOf(".");
+  let type = file.name.substr(index + 1);
+
+  getUploadUrl(file.name, type,file)
+  
+}
+
+const getUploadUrl = async (filename,type,file)=>{
+  const res = await Api.requested({
+    "classname": "system.attachment.huawei.OBS",
+    "method": "getFileName",
+    "content": {
+      "filename": filename,
+      "filetype": type,
+      "parentid": appfolderid.value//归属文件夹ID
+    }
+  })
+  let url = res.data.uploadurl
+
+  let obsfilename = res.data.serialfilename
+
+  upoladFileToServer(url, file, type, obsfilename)
+}
+const setProgress = (percent)=>{
+  return {
+    strokeColor: {
+      '0%': '#108ee9',
+      '100%': '#87d068',
+    },
+    strokeWidth: 3,
+    format: percent => `${parseFloat(percent.toFixed(2))}%`,
+    class: 'test',
+  };
+}
+const upoladFileToServer = async (url, file, ext, obsfilename)=> {
+  let config = {
+    headers: ext === 'pdf' ? { 'Content-Type': 'application/pdf' } : ext === 'svg'?{ 'Content-Type': 'image/svg+xml' } : { 'Content-Type': 'application/octet-stream' },
+    onUploadProgress: function (progressEvent) {
+      let percent = progressEvent.loaded / progressEvent.total * 100
+      filelist.value = filelist.value.map((e,index) => {
+        if (e.uid === file.uid) {
+          e = { ...e, percent: percent.toFixed(0) }
+        }
+        return e
+      })
+    },
+  }
+  await Up.upload(url, file, config)
+  createFileRecord(obsfilename)
+}
+// 上传成功以后生成附件记录
+const createFileRecord = async (obsfilename)=> {
+  let obj = {
+    "serialfilename": obsfilename
+  }
+  obj = Object.assign({},obj,props.bindData)
+  let param = {
+    "classname": "system.attachment.huawei.OBS",
+    "method": "uploadSuccess",
+    "content":obj
+  }
+  const res = await Api.requested(param)
+  console.log(res.code)
+  if (res.code ===  1) {
+    emit('uploadSuccess',res)
+  }
+}
+const onShow = ()=>{
+  visible.value = true
+  querySite_Parameter()
+}
+
+
+const appfolderid = ref('')
+const salematerialfolderid = ref('')
+const querySite_Parameter = async ()=> {
+  const res = await Api.requested({
+    "classname": "webmanage.site.site",
+    "method": "querySite_Parameter",
+    "content": {}
+  })
+  appfolderid.value = res.data.appfolderid, // 应用附件文件夹ID
+  salematerialfolderid.value = res.data.salematerialfolderid // 营销物文件夹ID
+}
+const onClose = ()=>{
+  filelist.value = []
+}
+</script>
+
+<style scoped>
+.flex-between{
+  display: flex;
+  justify-content: space-between;
+  padding: 20px 15px 0 0;
+}
+</style>