发票详情

src/components/CloudDisk/cellList.vue

@@ -227,6 +227,7 @@
 .CloudDisk-R-Img{
     width: 12.85vw;
     height: 12.85vw;
+    background: #f1f2f4;
     margin-bottom: 9px;
     border-radius: 8px;
     overflow: hidden;

src/components/CloudDisk/index.vue

@@ -73,7 +73,9 @@
                                 <el-image class="row items-center" :src="item.FilePath" style="width: 100%; height: 100%;"
                                 fit="cover">
                                     <template #error>
-                                        <el-image :src="errImg"></el-image>
+                                        <div class="row items-center" style="height: 100%;">
+                                            <el-image :src="errImg"></el-image>
+                                        </div>
                                     </template>
                                 </el-image>
                                 <!-- <el-image
@@ -659,6 +661,7 @@ onBeforeUnmount(() => {
 .CloudDisk-R-Img{
     width: 80px;
     height: 80px;
+    background: #f1f2f4;
     margin-bottom: 9px;
     border-radius: 8px;
     overflow: hidden;

src/components/CloudDisk/list.vue

@@ -8,7 +8,7 @@
             <el-table-column type="selection" width="55"/>
             <el-table-column label="基本信息" show-overflow-tooltip min-width="400">
               <template #default="scope">
-                <div class="row items-center">
+                <div class="row items-center CloudDisk-R-Img">
                         <el-image
                         class="cursor-pointer row items-center"
                         style="width: 50px; height: auto"
@@ -248,4 +248,7 @@
     padding-left: 24px;
     padding-bottom: 20px;
 }
+.CloudDisk-R-Img .el-image{
+    background: #f1f2f4;
+}
 </style>
\ No newline at end of file

src/components/CloudDisk/waterfallFlowList.vue

@@ -234,6 +234,7 @@
 .CloudDisk-R-Img{
     width: 12.85vw;
     height: auto;
+    background: #f1f2f4;
     margin-bottom: 9px;
     border-radius: 8px;
     box-shadow: 0px 0px 13px 0px #eee;

src/router/router.ts

@@ -278,7 +278,7 @@ const routes: RouteRecordRaw[] = [
         }
       },
       {
-        path: '/a/order/:id',
+        path: '/a/order/:id/:isFirm',
         component: () => import('@/views/TeamCenter/OrderDetail.vue'),
         meta:{
           title:'订单详情'
@@ -315,7 +315,7 @@ const routes: RouteRecordRaw[] = [
         }
       },
       {
-        path: '/u/order/:id/:isFirm?',
+        path: '/u/order/:id',
         component: () => import('@/views/UserCenter/OrderDetail.vue'),
         meta:{
           title:'订单详情'

src/views/TeamCenter/Order.vue

 <template>
-   <Order :firm="1"></Order>
+   <Order :firm="type"></Order>
 </template>
 
 <script lang="ts" setup>
 import { ref, reactive, onMounted } from "vue";
 import Order from '../UserCenter/Order.vue'
-
+const type = ref(1)
 </script>
 
 <style scoped>

src/views/TeamCenter/OrderDetail.vue

 <template>
-    <div class="row items-center">
-        <IconLeft :size="18" class="q-mr-md cursor-pointer" @click="forwardOrder"></IconLeft>
-        <div class="text-weight-bold cursor-pointer" @click="forwardOrder">订单/发票</div>
-    </div>
-    <template v-if="order && !loading">
-        <div class="q-mt-xl q-pa-xl rounded bg-info">
-            <el-steps style="max-width: 100%;margin: 0 auto;" :active="3" align-center>
-                <el-step title="选择商品" description="" />
-                <el-step title="确认下单" description="" />
-                <el-step title="支付" description="" />
-                <el-step title="交易完成" description="" />
-            </el-steps>
-            <div class="q-mt-xl text-center text-weight-bold" style="font-size: 18px;">订单状态：待支付</div>
-            <div class="q-mt-md row items-center flex-center" style="font-size: 13px;">
-                <span>请在 </span>
-                <el-countdown title="" format="DD [天] HH:mm:ss" :value="countValue" value-style="font-size:13px;color:#f89c53;"
-                    class="q-mx-md inline" />
-                <span> 内完成转账，超时订单自动取消</span>
-            </div>
-            <div class="row items-center flex-center q-mt-xl">
-                <el-button size="large">取消订单</el-button>
-                <el-button type="primary" size="large">去支付</el-button>
-            </div>
-        </div>
-        <div class="order-bar rounded row q-mt-xl">
-            <div class="item" style="width: 280px !important; min-width: 280px; text-align: left;">商品信息</div>
-            <div class="item col">时长</div>
-            <div class="item col">单价</div>
-            <div class="item col">数量</div>
-            <div class="item none-width">
-                <div style="background-color: rgba(0,0,0,.08);width:1px">&nbsp;</div>
-            </div>
-            <div class="item col">小计</div>
-        </div>
-        <div class="order-body q-mt-lg">
-            <div class="order-item rounded">
-                <div class="title">
-                    <span>{{ order.create }}</span>
-                    <span class="q-ml-md">{{ order.ordernum }}</span>
-                </div>
-                <div class="bg-white rounded row items-center">
-                    <div class="item row items-center"
-                        style="width: 280px !important; min-width: 280px; text-align: left;padding:24px;">
-                        <img :src="order.cover" style="width:72px;" class="rounded">
-                        <div class="q-ml-lg">{{ order.pricetypename }}_{{ order.vipname }}</div>
-                    </div>
-                    <div class="item col">{{ order.productname }}</div>
-                    <div class="item col">¥{{ order.price.toFixed(2) }}</div>
-                    <div class="item col">{{ order.use }}席位</div>
-                    <div class="item none-width">
-                        <div style="background-color: rgba(0,0,0,.08);width:1px;height:72px;">&nbsp;</div>
-                    </div>
-                    <div class="item col">
-                        <div class="text-weight-bold q-mb-sm" style="font-size: 16px">¥{{ order.price.toFixed(2) }}</div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="q-mt-lg text-right">
-            <span style="font-size: 14px;">订单总金额：￥</span>
-            <span style="font-size: 18px" class="text-weight-bold text-dark">{{ order.price.toFixed(2) }}</span>
-        </div>
-        <div class="q-mt-lg text-right" v-if="order.status==2">
-            <span style="font-size: 14px;">实付总金额：￥</span>
-            <span style="font-size: 18px" class="text-weight-bold text-dark text-negative">{{ order.price.toFixed(2) }}</span>
-        </div>
-    </template>
-    <div v-if="loading" style="height: 200px;margin-top: 100px;" v-loading="loading"></div>
-    <div v-if="!order && !loading">
-      <el-empty class="q-ma-xl" description="暂无数据" />
-    </div>
-</template>
-
-<script lang="ts" setup>
-import { ApiResult } from "@/configs/axios"
-import OrderService from "@/services/OrderService"
-import { ref } from "vue"
-import { useRouter } from "vue-router"
-
-const order = ref<any>()
-const loading = ref(false)
-const router = useRouter()
-
-const countValue = ref(Date.now() + 1000 * 60 * 60 * 7)
-const forwardOrder = (id: string) => {
-    router.push('/u/order')
-}
-
-const getOrder = async () => {
-    const orderid = router.currentRoute.value.params.id?.toString()
-    if (!orderid) return
-    loading.value = true
-
-    const response = await OrderService.GetOrder(orderid)
-    if (response.data.resultCode == ApiResult.SUCCESS) {
-        order.value = response.data.data
-        countValue.value = new Date(order.value.create.replaceAll('-','/')).getTime() + 1000 * 60 * 60 * 720
-    }
-
-    loading.value = false
-}
-
-getOrder()
-</script>
-
-<style scoped>
-.order-bar {
-    background: #f6f7f9 !important;
-}
-
-.order-bar .item,
-.order-body .order-item .item {
-    padding: 0 24px;
-    height: 42px;
-    line-height: 42px;
-    font-size: 14px;
-    color: gray;
-    text-align: right;
-    min-width: 108px;
-}
-
-.order-bar .item.none-width,
-.order-body .order-item .item.none-width {
-    min-width: unset;
-}
-
-.order-body {}
-
-.order-body .order-item {
-    background: #f6f7f9;
-    border: 1px solid rgba(0, 0, 0, .08);
-    font-size: 14px;
-
-}
-
-.order-body .order-item .title {
-    padding: 0 24px;
-    height: 45px;
-    line-height: 45px;
-    color: grey;
-    white-space: nowrap;
-    overflow: hidden;
-}
-
-.order-body .order-item .item {
-    height: auto;
-    line-height: 1;
-    color: #000;
-    white-space: nowrap;
-    overflow: hidden;
-}
-</style>
\ No newline at end of file
+    <OrderDetail></OrderDetail>
+ </template>
+ 
+ <script lang="ts" setup>
+ import OrderDetail from '../UserCenter/OrderDetail.vue'
+ </script>
+ 
+ <style scoped>
+ 
+ </style>
\ No newline at end of file

src/views/UserCenter/Order.vue

@@ -45,6 +45,7 @@
           申请时间
         </div>
         <div class="item" style="width: 200px !important; min-width: 200px;">抬头</div>
+        <div class="item col" >开票订单</div>
         <div class="item col" >开票金额</div>
         <div class="item col">税号</div>
         <!-- <div class="item none-width">
@@ -52,6 +53,7 @@
         </div> -->
         <div class="item col">联系邮箱</div>
         <div class="item col">开具方式 </div>
+        <div class="item col">开票状态</div>
         <div class="item row items-center">
           操作
         </div>
@@ -77,7 +79,9 @@
                 <div class="q-ml-lg">{{ x.pricetypename }}_{{ x.vipname }}</div>
               </div>
               <div class="item col">{{ x.productname }}</div>
-              <div class="item col">¥{{ x.price.toFixed(2) }}</div>
+              <div class="item col">
+                ¥{{ x.price.toFixed(2) }}
+              </div>
               <div class="item col">{{ x.use }}席位</div>
               <div class="item none-width">
                 <div style="background-color: rgba(0,0,0,.08);width:1px;height:72px;">&nbsp;</div>
@@ -91,10 +95,11 @@
               </div>
               <div class="item col">
                 <div class="q-mb-sm" :class="{'text-waring':x.status==1,'text-grey-8':x.status==3}">{{ x.statusname }}</div>
-                <el-button  link  @click="forwardOrderDetail(x.orderid)">订单详情</el-button>
+                <el-button link @click="forwardOrderDetail(x.orderid)">订单详情</el-button>
               </div>
               <div class="item column">
                 <el-button type="primary" v-if="x.status==2&&!x.invoiceId" @click="MakeOutInvoice(x)">发票</el-button>
+                <el-button v-if="x.invoiceFile&&x.invoiceFile.length>0" @click="DownloadInvoice(x.invoiceFile[0])">发票</el-button>
                 <br />
                 <el-button type="default" v-if="x.status==2" @click="redicetTo('https://work.weixin.qq.com/kfid/kfc378aada578ca8b0e')">售后</el-button>
                 <el-button type="warning" v-if="x.status==1" @click="goControls(1,x.orderid)">支付</el-button>
@@ -121,7 +126,16 @@
                 {{ x.InvoiceTitle }}
               </div>
               <div class="item col"> 
-                <div class="text-weight-bold q-mb-sm" style="font-size: 16px">¥ {{x.Money.toFixed(2)}}</div>
+                <div class="text-weight-bold q-mb-sm" style="font-size: 16px">
+                  <template v-for="(y,indexs) in x.OrderList">
+                    <el-button link @click="forwardOrderDetail(y.OrderId,1)">{{ y.OrderId }}</el-button>
+                  </template>
+                </div>
+              </div>
+              <div class="item col"> 
+                <div class="text-weight-bold q-mb-sm" style="font-size: 16px">
+                  ¥ {{x.Money.toFixed(2)}}
+                </div>
               </div>
               <div class="item col">{{x.InvoiceTaxNo}}</div>
               <!-- <div class="item none-width">
@@ -133,8 +147,12 @@
               <div class="item col">
                 {{ x.IssuedType==1?'电子普通发票':'增值税专用发票' }}
               </div>
+              <div class="item col">
+                <div class="q-mb-sm" :class="{'text-waring':x.InvoiceState==2,'text-grey-8':x.InvoiceState>2||x.InvoiceState==1}">{{ x.InvoiceState==2?'已开票':'开票中' }}</div>
+                <el-button link @click="getInvoiceDetails(x)">发票详情</el-button>
+              </div>
               <div class="item">
-                <el-button @click="getInvoiceDetails(x)">详情</el-button>
+                <el-button v-if="x.InvoiceFile&&x.InvoiceFile.length>0" @click="DownloadInvoice(x.InvoiceFile[0])">发票</el-button>
               </div>
             </div>
   
@@ -150,7 +168,7 @@
   <openInvoice :show="showOpenInvoice" :InvoiceDatas="InvoiceDatas" 
   @close="showOpenInvoice=false" 
   @success="successInvoice"></openInvoice> 
-  <Invoice :show="showInvoice" :InvoiceDetails="InvoiceDetails" 
+  <Invoice :firm="firm" :show="showInvoice" :InvoiceDetails="InvoiceDetails" 
   @close="showInvoice=false"></Invoice> 
 </template>
 
@@ -198,6 +216,25 @@ const InvoiceDatas = reactive({
 } as any)
 const InvoiceDetails = ref({})
 
+const DownloadInvoice = (x:any) => {
+  let name = x.Content.split('/')
+  const xhr = new XMLHttpRequest()
+  xhr.open('GET', x.Url, true)
+  xhr.responseType = 'blob'
+  xhr.onprogress = (e:any)=>{
+      
+  }
+  xhr.onload = ()=>{
+    var blob = xhr.response;
+    let link = document.createElement('a');
+    link.download = name[name.length-1];
+    link.href = URL.createObjectURL(blob);
+    link.click()
+  }
+  xhr.send()
+  window.open(x.Url)
+  // window.open("https://view.officeapps.live.com/op/view.aspx?src=" + encodeURIComponent(x.Url),'_blank')
+}
 const getInvoiceDetails = (item:any) => {
   InvoiceDetails.value = item
   showInvoice.value = true
@@ -407,9 +444,10 @@ const scrollingHandler = () =>{
     
 }
 
-const forwardOrderDetail = (id:string)=>{
-  if(props.firm) router.push('/u/order/'+encodeURIComponent(id)+'/'+props.firm)
-  else router.push('/u/order/'+encodeURIComponent(id))
+const forwardOrderDetail = (id:string,type:any)=>{
+  let url = props.firm?`/a/order/${encodeURIComponent(id)}/${props.firm}`:`/u/order/${encodeURIComponent(id)}`
+  if(type) openNewBlank(url)
+  else router.push(url)
 }
 
 getOrders()

src/views/UserCenter/OrderDetail.vue

@@ -124,8 +124,8 @@ const CanceltOrders = async ()=>{
 }
 
 const forwardOrder = (id: string) => {
-    if(router.currentRoute.value.params.isFirm) router.push('/a/order')
-    else router.push('/u/order')
+    let url = router.currentRoute.value.params.isFirm&&router.currentRoute.value.params.isFirm==1?'/a/order':'/u/order'
+    router.push(url)
 }
 
 const getOrder = async () => {

src/views/UserCenter/components/InvoiceDetails.vue

@@ -28,7 +28,7 @@
             </div>
         </div>
       </div>
-      <div v-if="Orders.length>0" class="order-body q-pt-md">
+      <div v-if="false" class="order-body q-pt-md">
           <div class="order-item rounded">
             <div class="title row flex-between items-center">
               <span class="">订单</span>
@@ -41,10 +41,12 @@
             <!-- :class="[!isMore||isMore?'animate__fadeInUp':'']" -->
             <div class="animate__animated">
               <div v-for="x in Orders" :key="x.OrderId"
-              class="order-list">
+              class="order-list" @click="forwardOrderDetail(x.OrderId)">
                 <div class="bg-white row flex-between q-px-md q-pt-md text-5B5D62">
                   <span>{{ x.PayTime }}</span>
-                  <span class="q-ml-md">{{ x.OrderNum }}</span>
+                  <span class="q-ml-md">
+                    <el-button link @click="forwardOrderDetail(x.OrderId)">{{ x.OrderNum }}</el-button>
+                  </span>
                 </div>
                 <div class="bg-white rounded row items-center q-pb-md">
                     <div class="item items-center"  style="padding: 5px 10px;">
@@ -59,11 +61,11 @@
           </div>
         </div>
         
-        <!-- <template #footer>
+        <template #footer>
           <div class="dialog-footer">
-            <el-button @click="close">取消</el-button>
+            <el-button type="primary" @click="DownloadInvoice(InvoiceDetails.InvoiceFile[0])">查看发票</el-button>
           </div>
-        </template> -->
+        </template>
       </el-dialog>
   </template>
   
@@ -73,10 +75,15 @@
   import OrderService from '@/services/OrderService'
   import { ref, onMounted, reactive, watch } from 'vue'
   import { ElMessage, FormInstance, FormRules } from 'element-plus';
+  import { useRouter } from "vue-router";
+  import { openNewBlank } from '@/utils/common';
+
+  const router = useRouter()
   
   const props = defineProps({
     InvoiceDetails: {} as Object,
-    show: true as Boolean
+    show: true as Boolean,
+    firm: 0 as Number
   })
   
   const isMore = ref(false)
@@ -88,6 +95,31 @@
 
   const dialogVisible = ref(false)
 
+  const forwardOrderDetail = (id:string) => {
+    let url = props.firm?`/a/order/${encodeURIComponent(id)}/${props.firm}`:`/u/order/${encodeURIComponent(id)}`
+    // router.push(url)
+    openNewBlank(url)
+  }
+  const DownloadInvoice = (x:any) => {
+    // let name = x.Content.split('/')
+    // const xhr = new XMLHttpRequest()
+    // xhr.open('GET', x.Url, true)
+    // xhr.responseType = 'blob'
+    // xhr.onprogress = (e:any)=>{
+        
+    // }
+    // xhr.onload = ()=>{
+    //   var blob = xhr.response;
+    //   let link = document.createElement('a');
+    //   link.download = name[name.length-1];
+    //   link.href = URL.createObjectURL(blob);
+    //   link.click()
+    // }
+    // xhr.send()
+    window.open(x.Url)
+    // window.open("https://view.officeapps.live.com/op/view.aspx?src=" + encodeURIComponent(x.Url),'_blank')
+}
+
   const MoreData = () => {
     isMore.value = !isMore.value
     if(isMore.value) Orders.value = JSON.parse(JSON.stringify(props.InvoiceDetails.OrderList))

src/views/UserCenter/components/openInvoice.vue

@@ -28,9 +28,9 @@
                             <el-radio :label="1" class="row items-center">
                                 <span class="text-black">
                                     <span>电子普通发票</span>
-                                    <el-icon color="#9BA1AA" style="position: relative;top: 2px;left: 2px;">
+                                    <!-- <el-icon color="#9BA1AA" style="position: relative;top: 2px;left: 2px;">
                                         <Warning style="transform: rotate(180deg);"/>
-                                    </el-icon>
+                                    </el-icon> -->
                                 </span>
                             </el-radio>
                             <el-radio :label="2">