Merge branch 'master' of http://132.232.92.186:3000/XinXiBu/oa-system

src/components/Finance/Cost.vue

@@ -81,7 +81,7 @@
                 </div>
             </div>
             <div style="color: #606266;font-size: 15px;font-weight: 600;">请选择要显示的项：</div>
-            <el-checkbox-group v-model="checkList">
+            <el-checkbox-group class="form-ss" v-model="checkList">
                 <el-checkbox v-for="(item,index) in  checkOptions" :key="index" :title="item.tips" :label="item.label"></el-checkbox>
             </el-checkbox-group>
             <el-table 
@@ -102,32 +102,47 @@
                     :width="item.width" 
                     :label="item.label"
                     v-if="checkList.includes(item.label)">
-                    <!-- eslint-disable-next-line -->
-                    <template slot="header" slot-scope="scope">
-                        <el-tooltip effect="dark" :content="item.label" placement="top">
-                            <span class="rapAddress">{{item.label}}</span>
-                        </el-tooltip>
-                    </template>
-                    <template slot-scope="scope">
+                        <!-- eslint-disable-next-line -->
+                        <template slot="header" slot-scope="scope">
+                            <el-tooltip effect="dark" :content="item.describe" placement="top">
+                                <span class="rapAddress">{{item.label}}</span>
+                            </el-tooltip>
+                        </template>
+                        <template slot-scope="scope">
                             <div v-if="item.prop === 'sales'">
-                            <el-input
+                                <el-input
                                 :ref="'el-input-' + index"
                                 v-model="scope.row[item.prop]"
-                                maxlength="100"
                                 show-word-limit/>
                             </div>
                             <div v-else-if="item.prop === 'id'">
-                            <el-input
+                                <el-input
                                 :ref="'el-input-' + index"
                                 v-model="scope.row[item.prop]"
                                 type="number"
                                 min="0"/>
                             </div>
+                            <div v-else-if="item.prop === 'sale'">
+                                <el-row class="figures-btn">
+                                    <el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">司兼导</el-button>
+                                    <el-button size="mini" type="primary">导 游</el-button>
+                                    <el-button size="mini" type="primary">车数据</el-button>
+                                    <el-button size="mini" type="primary">景 点</el-button>
+                                </el-row>
+                            </div>
                             <span v-else :title="scope.row[item.prop]">{{ scope.row[item.prop] }}</span>
                         </template>
                     </el-table-column>
                 </template>
+                <el-table-column
+                label="操作">
+                    <!-- eslint-disable-next-line -->
+                    <template slot-scope="scope">
+                        <el-button size="mini" @click="handleDelete(scope.$index, scope.row,tableData)" type="danger"><i class="el-icon-delete"></i></el-button>
+                    </template>
+                </el-table-column>
             </el-table>
+            <div style="text-align: center;padding: 10px 0;"><el-button @click="addStrip" type="primary">添 加 <i class="el-icon-plus"></i></el-button></div>
             <div class="sheet-box">
                 <div class="sheet-li">
                     <div style="color: #606266;font-size: 15px;font-weight: 600;">请选择要显示的项：</div>
@@ -145,6 +160,60 @@
                                 :key="index"
                                 :prop="itemsheetone.prop"
                                 :label="itemsheetone.childLabel">
+                                    <template slot-scope="scope">
+                                        <div v-if="itemsheetone.prop === 'costPerson'">
+                                            <el-input
+                                            :ref="'el-input-' + index"
+                                            v-model="scope.row[itemsheetone.prop]"
+                                            show-word-limit/>
+                                        </div>
+                                        <div v-else-if="itemsheetone.prop === 'toll'">
+                                            <el-input
+                                            :ref="'el-input-' + index"
+                                            v-model="scope.row[itemsheetone.prop]"
+                                            show-word-limit/>
+                                        </div>
+                                        <div v-else-if="itemsheetone.prop === 'coefficient'">
+                                            <el-input
+                                            :ref="'el-input-' + index"
+                                            v-model="scope.row[itemsheetone.prop]"
+                                            show-word-limit/>
+                                        </div>
+                                        <span v-else :title="scope.row[itemsheetone.prop]">{{ scope.row[itemsheetone.prop] }}</span>
+                                    </template>
+                                </el-table-column>
+                            </el-table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="cabin-box">
+                <div class="cabin-li">
+                    <div style="color: #606266;font-size: 15px;font-weight: 600;">请选择要显示的项：</div>
+                    <el-checkbox-group v-model="cabinoneList">
+                        <el-checkbox v-for="(item,index) in cabinoneOptions" :key="index" :label="item"></el-checkbox>
+                    </el-checkbox-group>
+                    <div v-for="(cabinitem,index) in cabinDatal" :key="index">
+                        <div class="biaoge" v-if="cabinoneList.includes(cabinitem.label)">
+                            <div style="    color: rgb(96, 98, 102);font-size: 15px;font-weight: 600;">{{cabinitem.label}}</div>
+                            <el-table
+                            :data="cabinitem.sheetInfo"
+                            border
+                            style="width: 100%">
+                                <el-table-column
+                                v-for="(itemcabinone,index) in cabinitem.childList"
+                                :key="index"
+                                :prop="itemcabinone.prop"
+                                :label="itemcabinone.childLabel">
+                                    <template slot-scope="scope">
+                                        <div v-if="itemcabinone.prop === 'toll'">
+                                            <el-input
+                                            :ref="'el-input-' + index"
+                                            v-model="scope.row[itemcabinone.prop]"
+                                            show-word-limit/>
+                                        </div>
+                                        <span v-else :title="scope.row[itemcabinone.prop]">{{ scope.row[itemcabinone.prop] }}</span>
+                                    </template>
                                 </el-table-column>
                             </el-table>
                         </div>
@@ -152,12 +221,26 @@
                 </div>
             </div>
         </div>
+        <el-dialog title="外层 Dialog" :visible.sync="outerVisible">
+            <el-dialog
+              width="30%"
+              title="内层 Dialog"
+              :visible.sync="innerVisible"
+              append-to-body>
+            </el-dialog>
+            <div slot="footer" class="dialog-footer">
+              <el-button @click="outerVisible = false">取 消</el-button>
+              <el-button type="primary" @click="innerVisible = true">打开内层 Dialog</el-button>
+            </div>
+        </el-dialog>
     </div>
 </template>
 <script>
 export default {
     data () {
       return {
+        outerVisible: false,
+        innerVisible: false,
         checkList: ['DAY','ITIN','VA','VF','VRD','T/G S'],
         checkOptions:[
             {label:'DAY',tips:'时间(DATE)'},
@@ -199,21 +282,43 @@ export default {
             {label:'E/C T',tips:'会务费(EXPO/CONFERENCE TICKET)'}
         ],
         tableLabel: [
-            {label: 'DAY', width: '90', prop: 'id'},
-            {label: 'DATE', width: '', prop: 'date'},
-            {label: 'ITIN', width: '', prop: 'sales'},
-            {label: 'VA', width: '', prop: 'sale'},
-            {label: 'VT', width: '', prop: 'const'},
-            {label: 'VF', width: '', prop: 'profit'},
-            {label: 'VN', total: '', prop: 'profit'},
-            {label: 'VRD', width: '', prop: 'profit'},
-            {label: 'T/G S', width: '', prop: 'profit'},
-            {label: 'T/G N', width: '', prop: 'profit'},
-            {label: 'T/G WH', width: '', prop: 'profit'},
-            {label: 'T/G OF', width: '', prop: 'profit'},
-            {label: 'T/G M', width: '', prop: 'profit'},
-            {label: 'T/G A', width: '', prop: 'profit'},
-            {label: 'T/G TF', width: '', prop: 'profit'}
+            {label: 'DAY', width: '90', prop: 'id',describe:'时间(DATE)'},
+            {label: 'DATE', width: '', prop: 'date',describe:'行程描述(ITINERARY)'},
+            {label: 'ITIN', width: '', prop: 'sales',describe:'行程描述(ITINERARY)'},
+            {label: 'VA', width: '', prop: 'sale',describe:'车服务区域(Vehicle Area)'},
+            {label: 'VT', width: '', prop: 'const',describe:'车型(VEHICLE TYPE)'},
+            {label: 'VF', width: '', prop: 'profit',describe:'车费用(VEHICLE FEES)'},
+            {label: 'VN', total: '', prop: 'profit',describe:'车数量(VEHICLE Number)'},
+            {label: 'VRD', width: '', prop: 'profit',describe:'用车时间(VEHICLE RENTAL DURATION)'},
+            {label: 'T/G S', width: '', prop: 'profit',describe:'导游工资(TOUR GUIDE SALARY)'},
+            {label: 'T/G N', width: '', prop: 'profit',describe:'导游数量(TOUR GUIDE Number'},
+            {label: 'T/G WH', width: '', prop: 'profit',describe:'导游工作时间(导游工作时间)'},
+            {label: 'T/G OF', width: '', prop: 'profit',describe:'导游超时费用(TOUR GUIDE OVERTIME FEES)'},
+            {label: 'T/G M', width: '', prop: 'profit',describe:'导游餐补(TOUR GUIDE MEALS)'},
+            {label: 'T/G A', width: '', prop: 'profit',describe:'导游房补(TOUR GUIDE ACCOMMODATION)'},
+            {label: 'T/G TF', width: '', prop: 'profit',describe:'导游交通费(TOUR GUIDE TRANSPORATION FEES)'},
+            {label: 'T/G EF', width: '', prop: 'profit',describe:'导游景点费(TOUR GUIDE ENTRANCE FEES)'},
+            {label: 'C/F M', width: '', prop: 'profit',describe:'司机餐补(CHAUFFEUR MEALS)'},
+            {label: 'C/F OF', width: '', prop: 'profit',describe:'司机超时费用(CHAUFFEUR OVERTIME FEES)'},
+            {label: 'B', width: '', prop: 'profit',describe:'早餐(BREAKFAST) #个人成本'},
+            {label: 'L', width: '', prop: 'profit',describe:'午餐(LUNCH) #个人成本'},
+            {label: 'D', width: '', prop: 'profit',describe:'晚餐(DINNER) #个人成本'},
+            {label: 'TBR', width: '', prop: 'profit',describe:'双人间(TWIN BED ROOM) #个人成本'},
+            {label: 'SGR', width: '', prop: 'profit',describe:'单间(SINGLE ROOM) #个人成本'},
+            {label: 'JS/ES', width: '', prop: 'profit',describe:'小套房/豪华套房(JUNIOR SUITE/EXECUTIVE SUITE) #个人成本'},
+            {label: 'SUITE', width: '', prop: 'profit',describe:'套房(SUITE) #个人成本'},
+            {label: 'ACCO N', width: '', prop: 'profit',describe:'住宿地名称(ACCOMMODATION NAME)'},
+            {label: 'T/V', width: '', prop: 'profit',describe:'公务活动费用(T/V)'},
+            {label: '1/L', width: '', prop: 'profit',describe:'公务活动费用(1/L)'},
+            {label: 'I/F', width: '', prop: 'profit',describe:'公务翻译费用(INTERPRETER FEES)'},
+            {label: 'EF', width: '', prop: 'profit',describe:'景点门票(ENTRANCE FEE) #个人成本'},
+            {label: 'B/R/F', width: '', prop: 'profit',describe:'饮料零食水果(BEVERAGE/RRESHMENT/FRUIT)'},
+            {label: 'TE', width: '', prop: 'profit',describe:'出行物资(TRAVELLLING ESSENTIALS) #个人成本'},
+            {label: 'T/G T', width: '', prop: 'profit',describe:'导游小费(T/G TIPS) #个人成本'},
+            {label: 'DRV T', width: '', prop: 'profit',describe:'司机小费(DRIVER TIPS #个人成本)'},
+            {label: 'P/C', width: '', prop: 'profit',describe:'零用金(PETTY CASH) #个人成本'},
+            {label: 'T/L F', width: '', prop: 'profit',describe:'领队费(TOUR LEADER FEES)'},
+            {label: 'E/C T', width: '', prop: 'profit',describe:'会务费(EXPO/CONFERENCE TICKET)'}
         ],
         statisticsArr: [
             {label: 'DAY', total: '', individual: ''},
@@ -234,10 +339,8 @@ export default {
             
         ],
         tableData: [
-			{id: 1, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
-			{id: 2, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
-			{id: 3, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
-			{id: 4, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05}
+			{id: 1, date: '2018-07-24', sales: 23.34, sale: 'ass', const: 102203.71, profit: 35394.05,a:"12"},
+			{id: 2, date: '2018-07-24', sales: 23.34, sale: 'z', const: 102203.71, profit: 35394.05}
 		],
         options: [{
           value: '选项1',
@@ -575,19 +678,268 @@ export default {
                 ]
             }
         ],
-        
+        cabinoneList: ['经济舱 TBR','经济舱 SGR','核酸检测','团组预算明细'],
+        cabinoneOptions:['经济舱 TBR','经济舱 SGR','公务舱 SGR','公务舱 JS/ES','公务舱 SUITE'],
+        cabinDatal:[
+            {
+                label:'经济舱 TBR',
+                childList:[
+                    {
+                        childLabel:'单人成本(CNY)',
+                        prop:'costPerson'
+                    },
+                    {
+                        childLabel:'人数',
+                        prop:'toll'
+                    },
+                    {
+                        childLabel:'总成本(CNY)',
+                        prop:'totalCost'
+                    },
+                    {
+                        childLabel:'单人报价(CNY)',
+                        prop:'singleQuote'
+                    },
+                    {
+                        childLabel:'总报价(CNY)',
+                        prop:'totalQuote'
+                    },
+                    {
+                        childLabel:'单人利润(CNY)',
+                        prop:'singleProfit'
+                    },
+                    {
+                        childLabel:'总利润(CNY)',
+                        prop:'totalProfit'
+                    },
+                ],
+                sheetInfo:[
+                    { 
+                        costPerson: 1, 
+                        toll: 11, 
+                        totalCost: 137597.76, 
+                        singleQuote: 102203.71, 
+                        totalQuote: 35394.05, 
+                        singleProfit: 35394.05, 
+                        totalProfit: 35394.05 
+                    },
+                ]
+            },
+            {
+                label:'经济舱 SGR',
+                childList:[
+                    {
+                        childLabel:'单人成本(CNY)',
+                        prop:'costPerson'
+                    },
+                    {
+                        childLabel:'人数',
+                        prop:'toll'
+                    },
+                    {
+                        childLabel:'总成本(CNY)',
+                        prop:'totalCost'
+                    },
+                    {
+                        childLabel:'单人报价(CNY)',
+                        prop:'singleQuote'
+                    },
+                    {
+                        childLabel:'总报价(CNY)',
+                        prop:'totalQuote'
+                    },
+                    {
+                        childLabel:'单人利润(CNY)',
+                        prop:'singleProfit'
+                    },
+                    {
+                        childLabel:'总利润(CNY)',
+                        prop:'totalProfit'
+                    },
+                ],
+                sheetInfo:[
+                    { 
+                        costPerson: 1, 
+                        toll: 11, 
+                        totalCost: 137597.76, 
+                        singleQuote: 102203.71, 
+                        totalQuote: 35394.05, 
+                        singleProfit: 35394.05, 
+                        totalProfit: 35394.05 
+                    },
+                ]
+            },
+            {
+                label:'公务舱 SGR',
+                childList:[
+                    {
+                        childLabel:'单人成本(CNY)',
+                        prop:'costPerson'
+                    },
+                    {
+                        childLabel:'人数',
+                        prop:'toll'
+                    },
+                    {
+                        childLabel:'总成本(CNY)',
+                        prop:'totalCost'
+                    },
+                    {
+                        childLabel:'单人报价(CNY)',
+                        prop:'singleQuote'
+                    },
+                    {
+                        childLabel:'总报价(CNY)',
+                        prop:'totalQuote'
+                    },
+                    {
+                        childLabel:'单人利润(CNY)',
+                        prop:'singleProfit'
+                    },
+                    {
+                        childLabel:'总利润(CNY)',
+                        prop:'totalProfit'
+                    },
+                ],
+                sheetInfo:[
+                    { 
+                        costPerson: 1, 
+                        toll: 11, 
+                        totalCost: 137597.76, 
+                        singleQuote: 102203.71, 
+                        totalQuote: 35394.05, 
+                        singleProfit: 35394.05, 
+                        totalProfit: 35394.05 
+                    },
+                ]
+            },
+            {
+                label:'公务舱 JS/ES',
+                childList:[
+                    {
+                        childLabel:'单人成本(CNY)',
+                        prop:'costPerson'
+                    },
+                    {
+                        childLabel:'人数',
+                        prop:'toll'
+                    },
+                    {
+                        childLabel:'总成本(CNY)',
+                        prop:'totalCost'
+                    },
+                    {
+                        childLabel:'单人报价(CNY)',
+                        prop:'singleQuote'
+                    },
+                    {
+                        childLabel:'总报价(CNY)',
+                        prop:'totalQuote'
+                    },
+                    {
+                        childLabel:'单人利润(CNY)',
+                        prop:'singleProfit'
+                    },
+                    {
+                        childLabel:'总利润(CNY)',
+                        prop:'totalProfit'
+                    },
+                ],
+                sheetInfo:[
+                    { 
+                        costPerson: 1, 
+                        toll: 11, 
+                        totalCost: 137597.76, 
+                        singleQuote: 102203.71, 
+                        totalQuote: 35394.05, 
+                        singleProfit: 35394.05, 
+                        totalProfit: 35394.05 
+                    },
+                ]
+            },
+            {
+                label:'公务舱 SUITE',
+                childList:[
+                    {
+                        childLabel:'单人成本(CNY)',
+                        prop:'costPerson'
+                    },
+                    {
+                        childLabel:'人数',
+                        prop:'toll'
+                    },
+                    {
+                        childLabel:'总成本(CNY)',
+                        prop:'totalCost'
+                    },
+                    {
+                        childLabel:'单人报价(CNY)',
+                        prop:'singleQuote'
+                    },
+                    {
+                        childLabel:'总报价(CNY)',
+                        prop:'totalQuote'
+                    },
+                    {
+                        childLabel:'单人利润(CNY)',
+                        prop:'singleProfit'
+                    },
+                    {
+                        childLabel:'总利润(CNY)',
+                        prop:'totalProfit'
+                    },
+                ],
+                sheetInfo:[
+                    { 
+                        costPerson: 1, 
+                        toll: 11, 
+                        totalCost: 137597.76, 
+                        singleQuote: 102203.71, 
+                        totalQuote: 35394.05, 
+                        singleProfit: 35394.05, 
+                        totalProfit: 35394.05 
+                    },
+                ]
+            }
+            ,
+            {
+                label:'团组预算明细',
+                childList:[
+                    {
+                        childLabel:'团组成本(CNY)',
+                        prop:'groupCosts'
+                    },
+                    {
+                        childLabel:'团组报价(CNY)',
+                        prop:'gtroupQuotes'
+                    },
+                    {
+                        childLabel:'团组利润(CNY)',
+                        prop:'groupProfit'
+                    }
+                ],
+                sheetInfo:[
+                    { 
+                        groupCosts: 1, 
+                        gtroupQuotes: 11, 
+                        groupProfit: 137597.76, 
+                    },
+                ]
+            }
+        ]
       };
     },
     watch:{
 			// 此处监听variable变量，当期有变化时执行
             checkList(item1,item2){
-                console.log(item1)
+                // console.log(item1)
                 // console.log(item2)
                 // item1为新值，item2为旧值
             },
     },
     methods:{
         getSummaries(param) {
+            console.log(param)
             const { columns, data } = param;
             const sums = [];
             columns.forEach((column, index) => {
@@ -595,14 +947,14 @@ export default {
                 sums[index] = "总计:";
                 return;
             }
-            
             const values = data.map(item => Number(item[column.property]));
-                if (!values.every(value => isNaN(value))) {
-                    sums[index] = values.reduce((prev, curr) => {
-                        const value = Number(curr);
-                        if (!isNaN(value)) {
-                            return prev + curr;
-                        } else {
+            console.log(values)
+            if (!values.every(value => isNaN(value))) {
+                sums[index] = values.reduce((prev, curr) => {
+                    const value = Number(curr);
+                    if (!isNaN(value)) {
+                        return prev + curr;
+                    } else {
                         return prev;
                     }
                     
@@ -613,11 +965,39 @@ export default {
             }
         });
         return sums;
-      }
+        },
+        handleEdit(index, row) {
+            console.log(index, row);
+            this.outerVisible=true;
+        },
+        handleDelete(index, row,rows) {
+            console.log(index, row,rows);
+            this.$confirm('此操作将删除该条信息, 是否继续?', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+            }).then(() => {
+                this.$message({
+                    message:'已删除' ,
+                    type: 'success',
+                    offset:50
+                });
+                rows.splice(index, 1);
+            }).catch(() => {
+                this.$message({
+                    type: 'info',
+                    message: '已取消删除'
+                });          
+            });
+        },
+        addStrip(){
+            this.tableData.push(
+                {id: '', date: '', sales:'', sale: '', const: '', profit: ''}
+            )
+        }
     },
     mounted(){
-        console.log(this.checkList.includes("A"));
-        console.log(this.checkList.includes("1"));
+        
     }
 }
 </script>
@@ -662,18 +1042,15 @@ export default {
     .cost-box .el-checkbox-group{
         margin: 5px 0;
     }
-    .cost-box .el-checkbox{
+    .form-ss .el-checkbox{
         width: 100px;
         margin: 5px 0;
     }
     .sheet-box{
         margin-top: 30px;
     }
-    .sheet-head{
-        display: flex;
-    }
-    .sheet-head-li{
-        margin-right: 20px;
+    .cabin-box{
+        margin-top: 30px;
     }
     .biaoge{
         margin-bottom: 30px;
@@ -683,4 +1060,20 @@ export default {
         white-space: nowrap;
         text-overflow: ellipsis;
     }
+    .cost-box .cabin-box .cost-box .el-checkbox{
+        margin-right: 20px;
+    }
+    .cost-box .el-table .cell{
+        text-align: center;
+    }
+    .figures-btn{
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+    .figures-btn .el-button--mini{
+        width: 70px;
+        margin: 2px 0;
+        margin-left:0 ;
+    }
 </style>

src/components/OP/OCRIdentify.vue

@@ -0,0 +1,522 @@
+<template>
+    <div class="ocr-all">
+        <div style="color: #606266;font-size: 15px;font-weight: 600;">PS:选择图片后，点击要需要识别类型！</div>
+        <div class="ocr-box">
+            <el-upload
+            action="#"
+            list-type="picture-card"
+            :on-change="handleChangePicture"
+            :auto-upload="false">
+                <i slot="default" class="el-icon-plus"></i>
+                <div slot="file" slot-scope="{file}">
+                <img
+                    class="el-upload-list__item-thumbnail"
+                    :src="file.url" alt=""
+                >
+                <span class="el-upload-list__item-actions">
+                    <span
+                    class="el-upload-list__item-preview"
+                    @click="handlePictureCardPreview(file)"
+                    >
+                        <i class="el-icon-zoom-in"></i>
+                    </span>
+                    <!-- <span
+                    v-if="!disabled"
+                    class="el-upload-list__item-delete"
+                    @click="handleDownload(file)"
+                    >
+                    <i class="el-icon-download"></i>
+                    </span>
+                    <span
+                    v-if="!disabled"
+                    class="el-upload-list__item-delete"
+                    @click="handleRemove(file)"
+                    >
+                    <i class="el-icon-delete"></i>
+                    </span> -->
+                </span>
+                </div>
+            </el-upload>
+            <el-dialog :visible.sync="dialogVisible">
+                <img width="100%" :src="dialogImageUrl" alt="">
+            </el-dialog>
+        </div>
+        <div style="color: #606266;font-size: 15px;font-weight: 600;text-align: center;">上传图片只能是 JPG,PNG,BMP 格式!大小不能超过 7MB!</div>
+        <el-row>
+            <el-button type="primary" @click="license()">营业执照</el-button>
+            <el-button type="primary" @click="IDcardR()">身份证-人像面</el-button>
+            <el-button type="primary" @click="creditCode()">统一信用代码</el-button>
+            <el-button type="primary" @click="IDcardG()">身份证-国徽面</el-button>
+            <el-button type="primary" @click="driving()">行驶证</el-button>
+            <el-button type="primary" @click="household()">户口本</el-button>
+            <el-button type="primary" @click="deed()">房产证</el-button>
+            <el-button type="primary" @click="Marriage()">结婚证</el-button>
+            <el-button type="primary" @click="mainlandPassport()">大陆护照</el-button>
+            <el-button type="primary" @click="universal()">通用印刷体</el-button>
+            <el-button type="primary">营业执照(英文)</el-button>
+            <el-button type="primary">统一信用代码(英文)</el-button>
+            <el-button type="primary">身份证-人像面(英文)</el-button>
+            <el-button type="primary">身份证-国徽面(英文)</el-button>
+            <el-button type="primary">行驶证(英文)</el-button>
+            <el-button type="primary">户口本(英文)</el-button>
+            <!-- <el-button type="primary">户口本-成员页</el-button> -->
+            <!-- <el-button type="primary">户口本-成员页(英文)</el-button> -->
+            <el-button type="primary">房产证(英文)</el-button>
+            <el-button type="primary">结婚证(英文)</el-button>
+            <el-button type="primary">大陆护照(英文)</el-button>
+        </el-row>
+    </div>
+</template>
+
+<script>
+import { el } from '@fullcalendar/core/internal-common';
+export default {
+    data() {
+    return {
+        token:'',
+        userid:'',
+        dialogImageUrl: '',
+        dialogVisible: false,
+        disabled: false,
+        panduan:"",
+        picBase64:''
+  	}
+	},
+    methods: {
+        // handleRemove(file,) {
+        //     console.log(file);
+        //     file.status='cancel'
+        // },
+        handlePictureCardPreview(file) {
+            this.dialogImageUrl = file.url;
+            this.dialogVisible = true;
+        },
+        // handleDownload(file) {
+        //     console.log(file);
+        // },
+        handleChangePicture(file, fileList) {
+            this.beforeAvatarUpload(file)
+            if (fileList.length > 1) {
+                    fileList.splice(0, 1);
+                }
+            if(this.panduan){
+                this.getBase64(file.raw).then(res => {
+                    this.picBase64=res
+                    console.log(res)
+                });
+            }
+        },
+        beforeAvatarUpload(file) {
+            this.panduan=true;
+            const isJPG = file.raw.type === 'image/jpeg';
+            const isPNG = file.raw.type === 'image/png';
+            const isWEBP = file.raw.type === 'image/webp';
+            const isLt2M = file.size / 1024 / 1024 < 7;
+            if (!isJPG&&!isPNG&&!isWEBP) {
+                this.$message.error('上传图片只能是 JPG,PNG,BMP 格式!');
+                this.panduan=false;
+            }
+            if (!isLt2M) {
+                this.$message.error('上传图片大小不能超过 7MB!');
+                this.panduan=false;
+            }
+            return isJPG && isLt2M;
+        },
+        getBase64(file) {
+            return new Promise(function (resolve, reject) {
+                const reader = new FileReader()
+                let imgResult = ''
+                reader.readAsDataURL(file)
+                reader.onload = function () {
+                imgResult = reader.result
+                }
+                reader.onerror = function (error) {
+                reject(error)
+                }
+                reader.onloadend = function () {
+                resolve(imgResult)
+                }
+            })
+        },
+        //身份证人像面
+        IDcardR(){
+            var url="/api/TencentOCR/GetIDCard"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        portType: 1,
+                        userId:that.userid,
+                        language:'zh',
+                        picBase64:that.picBase64,
+                        cardSide:0
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //身份证国徽面
+        IDcardG(){
+            var url="/api/TencentOCR/GetIDCard"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        portType: 1,
+                        userId:that.userid,
+                        picBase64:that.picBase64,
+                        cardSide:1
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //营业执照
+        license(){
+            var url="/api/TencentOCR/GetBizLicenseOCR"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //统一信用代码
+        creditCode(){
+            var url="/api/TencentOCR/GetOrgCodeCertOCR"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //行驶证
+        driving(){
+            var url="/api/TencentOCR/GetVehicleLicense"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                        cardSide:0
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //户口本
+        household(){
+            var url="/api/TencentOCR/GetResidenceBookletOCR"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //房产证
+        deed(){
+            var url="/api/TencentOCR/GetPropOwnerCert"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //结婚证
+        Marriage(){
+            var url="/api/TencentOCR/GetMarriageLicense"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //结婚证
+        mainlandPassport(){
+            var url="/api/TencentOCR/GetPassport"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        },
+        //通用印刷体
+        universal(){
+            var url="/api/TencentOCR/GetGeneralBasic"
+            var that=this
+            if(that.panduan){
+                that.fullscreenLoading = true;
+                this.$axios({
+                    method: 'post',
+                    url:url,
+                    headers:{
+                        Authorization:'Bearer '+this.token
+                    },
+                    data:{
+                        picBase64:that.picBase64,
+                    }
+                }).then(function(res){
+                    if(res.data.code==200){       
+                        console.log(res)
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });           
+                        // window.open(res.data.data.downUrl)
+                    }else{
+                        that.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });       
+                    }
+                })
+            }else{
+                this.$message.error('请检查图片是否为此类型!');
+            }
+        }
+    },
+    mounted(){
+        this.token=JSON.parse(localStorage.getItem('userinif')).token;
+        this.userid=JSON.parse(localStorage.getItem('userinif')).userInfo.userId;
+    }
+}
+</script>
+<style>
+    .ocr-all {
+        background-color: #fff;
+        padding: 10px;
+        box-shadow: 0 0 5px #0005;
+        border-radius: 10px;
+    }
+    .ocr-box .el-upload-list--picture-card .el-upload-list__item{
+        display: inline-flex;
+    }
+    .ocr-box{
+        display: flex;
+        justify-content: center;
+        margin-top: 180px;
+    }
+    .ocr-all .el-button--primary{
+        width: 160px;
+        margin: 0px 5px;
+        margin-bottom: 10px;
+    }
+    .ocr-all .el-row{
+        width: 44%;
+        margin: 0 auto;
+        margin-top: 30px;
+        margin-bottom: 180px;
+    }
+</style>

src/router/index.js

@@ -42,6 +42,7 @@ import SetData from '@/components/system/SetData';
 import CustomerCompany from '@/components/Crm/CustomerCompany';
 import DeleClient from '@/components/Crm/DeleClient';
 import Cost from '@/components/Finance/Cost';
+import OCRIdentify from '@/components/OP/OCRIdentify';
 Vue.use(Router)
 
 export default new Router({
@@ -239,6 +240,11 @@ export default new Router({
           name: 'Cost',
           component: Cost
         },
+        {
+          path: '/home/OCRIdentify',
+          name: 'Cost',
+          component: OCRIdentify
+        },
       ]
     },
     {