同步

src/components/Finance/ConferenceCost.vue

@@ -12,7 +12,7 @@
                 </div>
                 <div class="conferencecost-header-left-item">
                     <label style="width:80px;">服务地区: </label>
-                    <el-input size="small" placeholder="请输入内容" v-model="input" clearable>
+                    <el-input size="small" placeholder="请输入内容" v-model="conferenceAffairsCost.city" clearable>
                     </el-input>
                 </div>
             </div>
@@ -37,51 +37,62 @@
                 <el-table-column prop="name" label="类型" width="120">
                     <template slot-scope="scope">
                         <el-select size="small" v-model="scope.row.priceType" clearable placeholder="请选择">
-                            <el-option v-for="item in options" :key="item.id" :label="item.text"
+                            <el-option v-for="item in typearr" :key="item.id" :label="item.text"
                                 :value="item.id">
                             </el-option>
                         </el-select>
                     </template>
                 </el-table-column>
-                <el-table-column prop="name" label="单项内容" width="120">
+                <el-table-column prop="name" label="单项内容" width="160">
                     <template slot-scope="scope">
                         <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="scope.row.priceName"></el-input>
                     </template>
                 </el-table-column>
-                <el-table-column prop="name" label="成本单价" width="120">
+                <el-table-column prop="name" label="成本单价" width="100">
                     <template slot-scope="scope">
-                        <el-input-number :precision="2" size="mini" :controls="false" v-model="scope.row.costPrice"></el-input-number>
+                        <el-input-number @change="calculateQuotation(scope.row)" :precision="2" size="mini" :controls="false" v-model="scope.row.costPrice"></el-input-number>
                     </template>
                 </el-table-column>
-                <el-table-column prop="name" label="币种" width="80">
+                <el-table-column prop="name" label="币种" width="100">
                     <template slot-scope="scope">
-                        <el-select size="small" v-model="scope.row.currency" clearable placeholder="请选择">
-                            <el-option v-for="item in options" :key="item.value" :label="item.label"
-                                :value="item.value">
+                        <el-select size="small" @change="currencychange(scope.row)" v-model="scope.row.currency" clearable>
+                            <el-option v-for="item in options" :key="item.currencyId" :label="item.currencyCode"
+                                :value="item.currencyId">
                             </el-option>
                         </el-select>
                     </template>
                 </el-table-column>
-                <el-table-column prop="name" label="数量" width="100">
+                <el-table-column prop="name" label="当时汇率" width="100">
                     <template slot-scope="scope">
-                        <el-input-number :precision="2" size="mini" :controls="false" v-model="scope.row.count"></el-input-number>
+                        <el-input-number @change="calculateQuotation(scope.row)" :precision="4" size="mini" :controls="false" v-model="scope.row.rate"></el-input-number>
                     </template>
                 </el-table-column>
-                <el-table-column prop="name" label="单位" width="100">
+                <el-table-column prop="name" label="数量" width="80">
                     <template slot-scope="scope">
-                        <el-input size="mini" v-model="scope.row.unit" placeholder="请输入内容"></el-input>
+                        <el-input-number @change="calculateQuotation(scope.row)" :precision="2" size="mini" :controls="false" v-model="scope.row.count"></el-input-number>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="name" label="单位" width="80">
+                    <template slot-scope="scope">
+                        <el-select size="small" v-model="scope.row.unit" placeholder="" clearable>
+                            <el-option v-for="item in units" :key="item.id" :label="item.text"
+                                :value="item.id">
+                            </el-option>
+                        </el-select>
                     </template>
                 </el-table-column>
                 <el-table-column prop="name" label="系数" width="100">
                     <template slot-scope="scope">
-                        <el-input-number :precision="2" size="mini" :controls="false" v-model="scope.row.coefficient"></el-input-number>
+                        <el-input-number @change="calculateQuotation(scope.row)" :precision="2" size="mini" :controls="false" v-model="scope.row.coefficient"></el-input-number>
                     </template>
                 </el-table-column>
                 <el-table-column prop="name" label="单项报价金额" width="100">
                     <template slot-scope="scope">
-                        <el-input-number :precision="2" size="mini" :controls="false" v-model="scope.row.baoJiaPrice"></el-input-number>
+                        {{ townum(scope.row.baoJiaPrice) }}
+                        <!-- <el-input-number :precision="2" size="mini" :controls="false" v-model="scope.row.baoJiaPrice"></el-input-number> -->
                     </template>
                 </el-table-column>
+                
                 <el-table-column prop="name" label="附加值">
                     <template slot-scope="scope">
                         <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="scope.row.addedValue"></el-input>
@@ -106,7 +117,6 @@
                             <el-button size="mini" type="primary">通 过</el-button>
                             <el-button size="mini" type="danger">撤 销</el-button>
                         </div>
-                            
                     <!-- </template> -->
                 </el-table-column>
             </el-table>
@@ -114,12 +124,41 @@
                 <el-button size="small" @click="addlineclick" type="primary">添加一行</el-button>
             </div>
         </div>
+        <div class="conferencecost-foot">
+            <div class="conferencecost-foot-rateSummary">
+                <div class="conferencecost-rateSummary-title">使用的币种及汇率：</div>
+                <div v-for="(item,index)  in rateStatistics" :key="index">
+                    <span>{{item.currencyCode}} : {{item.rate}} 、</span>
+                </div>
+            </div>
+            <div class="conferencecost-foot-totalcost">
+                成本总计：{{ conferenceAffairsCost.costAll }} {{ danwei }}
+            </div>
+            <div class="conferencecost-foot-totalquotations">
+                报价总计：{{ conferenceAffairsCost.baoJiaAll }} {{ danwei }}
+            </div>
+        </div>
     </div>
 </template>
 <script>
 export default {
     data() {
         return {
+            danwei: '',
+            conferenceAffairsCost:{
+                city:'',//服务地区
+                diid:'',//团组Id
+                allocationAmount:'',//分配金额
+                allocationCurrency:'',//分配币种
+                allocationRate:'',//分配时汇率
+                allocationGroupId:'',//分配团组Id
+                id:'',
+                remark:'',
+                costAll:'',//成本总计
+                baoJiaAll:'',//报价总计
+            },
+            units:[],
+            typearr:[],
             tableDatas: [
                 // {
                 //     priceType:'',//费用类型
@@ -147,6 +186,8 @@ export default {
             token:'',
             userId: '',
             restriction:true,
+            rateStatistics:[],
+
         }
     },
     updated() {
@@ -159,7 +200,38 @@ export default {
     destroyed() {
         this.$emit('transfer', false)
     },
+    watch: {
+        tableDatas: {
+            handler (val) {
+                var _this=this
+                _this.rateStatistics=[];
+                var obj = {}
+                obj = _this.options.find(function (i) {
+                    val.forEach((item, index) => {
+                        if (i.currencyId === item.currency) {
+                             _this.rateStatistics.push(i);
+                        }
+                    });
+                });
+                _this.rateStatistics = _this.rateStatistics.filter((value, index, self) => {
+                    return self.indexOf(value) === index;
+                });
+                if (_this.rateStatistics.length > 1) {
+                    _this.danwei = 'CNY';
+                }else {
+                    _this.danwei = _this.rateStatistics[0].currencyCode;
+                }
+                _this.updateTotals();
+            },
+            deep: true
+        }
+    },
     methods: {
+        //保留两位小数
+        townum(val){
+            val=Number(val);
+            return val.toFixed(2);
+        },
         handleSelectionChange(val) {
             this.multipleSelection = val;
         },
@@ -199,9 +271,23 @@ export default {
                     groupId: that.conferenceid,
                 }
             }).then(function (res) {
-                
+                let AffairsInIt=res.data.data;
+                that.options=AffairsInIt.currenyList.teamRates;
+                that.tableDatas=AffairsInIt.conferenceAffairsCostChi;
+                that.typearr=AffairsInIt.typeData;
+                that.units=AffairsInIt.units;
             })
         },
+        //币种切换
+        currencychange(val){
+            var obj = this.options.find(function (i) {
+                return i.currencyId === val.currency;
+            });
+            if (obj) {
+                val.rate = obj.rate;
+                this.calculateQuotation(val);
+            }
+        },
         //会务切换
         conferenceidchange(val) {
             this.ConferenceAffairsInIts();
@@ -226,6 +312,40 @@ export default {
                 id:0,//主表Id
                 remark:'',//备注
             });
+            this.updateTotals();
+        },
+        calculateQuotation(row) {
+            // Ensure all values are numbers and not null/undefined
+            const costPrice = Number(row.costPrice) || 0;
+            const rate = Number(row.rate) || 0;
+            const count = Number(row.count) || 0;
+            const coefficient = Number(row.coefficient) || 0;
+
+            row.baoJiaPrice = parseFloat((costPrice * rate * count * coefficient).toFixed(2));
+
+            // Update totals
+            this.updateTotals();
+        },
+
+        updateTotals() {
+            // Calculate cost total
+            this.conferenceAffairsCost.costAll = this.tableDatas.reduce((sum, item) => {
+                if (this.rateStatistics.length>1) {
+                    return sum + (Number(item.costPrice) || 0) * (Number(item.count) || 0)* (Number(item.rate) || 0);
+                }else{
+                    return sum + (Number(item.costPrice) || 0) * (Number(item.count) || 0);
+                }
+            }, 0).toFixed(2);
+
+            // Calculate quotation total
+            this.conferenceAffairsCost.baoJiaAll = this.tableDatas.reduce((sum, item) => {
+                if (this.rateStatistics.length>1) {
+                    return sum + (Number(item.costPrice) || 0) * (Number(item.count) || 0)* (Number(item.rate) || 0)* (Number(item.coefficient) || 0);
+                }else{
+                    return sum + (Number(item.costPrice) || 0) * (Number(item.count) || 0)* (Number(item.coefficient) || 0);
+                }
+                // return sum + (Number(item.baoJiaPrice) || 0);
+            }, 0).toFixed(2);
         }
     },
     mounted(){
@@ -281,4 +401,13 @@ export default {
 .conferencecost-header-right>div,button{
     margin-bottom: 15px;
 }
+.conferencecost-foot-rateSummary{
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    margin-top: 10px;
+}
+.conferencecost-all .conferencecost-content .el-table__header-wrapper,.el-table__body-wrapper{
+    font-size:12px
+}
 </style>