xiugai

src/components/Finance/Cost.vue

@@ -0,0 +1,289 @@
+<template>
+    <div class="cost-all">
+        <div class="cost-box">
+            <div class="cost-haed">
+                <div class="ser-btn">
+                    <div class="ser-btn-li">
+                        <el-select v-model="value" filterable placeholder="请选择">
+                            <el-option
+                            v-for="item in options"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                            </el-option>
+                          </el-select>
+                    </div>
+                    <div  class="ser-btn-li">
+                        <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>
+                    </div>
+                </div>
+                <div class="cost-input">
+                    <el-form :inline="true" :model="formInline" class="demo-form-inline">
+                        <el-form-item label="税率:">
+                            <el-input v-model="formInline.user" placeholder="税率"></el-input>
+                        </el-form-item>
+                        <el-form-item label="货币:">
+                            <el-input v-model="formInline.user" placeholder="货币"></el-input>
+                        </el-form-item>
+                        <el-form-item label="汇率:">
+                            <el-input v-model="formInline.user" placeholder="汇率"></el-input>
+                        </el-form-item>
+                        <div>
+                            <el-form-item label="TBR:">
+                                <el-input v-model="formInline.user" placeholder="TBR"><i slot="suffix" style="font-style:normal;margin-right: 10px;">间</i></el-input>
+                            </el-form-item>
+                            <el-form-item label="SGR:">
+                                <el-input v-model="formInline.user" placeholder="SGR"><i slot="suffix" style="font-style:normal;margin-right: 10px;">间</i></el-input>
+                            </el-form-item>
+                            <el-form-item label="JS/ES:">
+                                <el-input v-model="formInline.user" placeholder="JS/ES"><i slot="suffix" style="font-style:normal;margin-right: 10px;">间</i></el-input>
+                            </el-form-item>
+                            <el-form-item label="SUITE:">
+                                <el-input v-model="formInline.user" placeholder="SUITE"><i slot="suffix" style="font-style:normal;margin-right: 10px;">间</i></el-input>
+                            </el-form-item>
+                        </div>
+                    </el-form>
+                </div>
+                <div class="cost-info">
+                    <div class="cost-info-li">
+                        <label>团 号：</label>
+                        <span>9XGYL</span>
+                    </div>
+                    <div class="cost-info-li">
+                        <label>客 户：</label>
+                        <span>小熟悉熟悉</span>
+                    </div>
+                    <div class="cost-info-li">
+                        <label>出访国家：</label>
+                        <span>新加坡</span>
+                    </div>
+                    <div class="cost-info-li">
+                        <label>起止日期：</label>
+                        <span>2023-05-18 ～ 2023-05-27</span>
+                    </div>
+                    <div class="cost-info-li">
+                        <label>天数/人数：</label>
+                        <span>10天/6人</span>
+                    </div>
+                </div>
+            </div>
+            <div style="color: #606266;font-size: 15px;font-weight: 600;">请选择要显示的项：</div>
+            <el-checkbox-group v-model="checkList">
+                <el-checkbox v-for="(item,index) in checkOptions" :key="index" :label="item"></el-checkbox>
+            </el-checkbox-group>
+            <el-table 
+            :summary-method="getSummaries"
+            show-summary
+            :data="tableData"
+            :border="true"
+            size="small"
+            row-class-name="row"
+            cell-class-name="column"
+            :highlight-current-row="true"
+            fit
+            >
+            <template v-for="(item, index) in tableLabel"  >
+                <el-table-column
+                    :key="index"
+                    :prop="item.prop" 
+                    :width="item.width" 
+                    :label="item.label"
+                    v-if="checkList.includes(item.label)">
+                    <template slot-scope="scope">
+                        <div v-if="item.prop === 'sales'">
+                          <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
+                            :ref="'el-input-' + index"
+                            v-model="scope.row[item.prop]"
+                            type="number"
+                            min="0"/>
+                        </div>
+                        <span v-else :title="scope.row[item.prop]">{{ scope.row[item.prop] }}</span>
+                    </template>
+                </el-table-column>
+            </template>
+        </el-table>
+        </div>
+    </div>
+</template>
+<script>
+export default {
+    data () {
+      return {
+        checkList: ['DAY','ITIN','VA','VF','VRD','T/G S'],
+        checkOptions:['DAY','DATE','ITIN','VA','VT','VF','VN','VRD','T/G S','T/G N','T/G WH','T/G OF','T/G M','T/G A','T/G TF','T/G EF','C/F M','C/F OF','B','L','D','TBR','SGR','JS/ES','SUITE','ACCO N','T/V','1/L','I/F','EF','B/R/F','TE','T/G T','DRV T','P/C','T/L F','E/C T'],
+        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'}
+        ],
+        statisticsArr: [
+            {label: 'DAY', total: '', individual: ''},
+            {label: 'DATE', total: '', individual: ''},
+            {label: 'ITIN', total: '', individual: ''},
+            {label: 'VA', total: '', individual: ''},
+            {label: 'VT', total: '', individual: ''},
+            {label: 'VF', total: '车费', individual: '车费人均'},
+            {label: 'VN', total: '', individual: ''},
+            {label: 'VRD', total: '', individual: ''},
+            {label: 'T/G S', total: '导游工资', individual: '导游工资人均'},
+            {label: 'T/G N', total: '', individual: ''},
+            {label: 'T/G WH', total: '', individual: ''},
+            {label: 'T/G OF', total: '', individual: ''},
+            {label: 'T/G M', total: '', individual: ''},
+            {label: 'T/G A', total: '', individual: ''},
+            {label: 'T/G TF', total: '', individual: ''}
+            
+        ],
+        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: 5, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 6, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 7, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 8, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 9, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 10, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 11, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05},
+			// {id: 12, date: '2018-07-24', sales: 23.34, sale: 137597.76, const: 102203.71, profit: 35394.05}
+		],
+        options: [{
+          value: '选项1',
+          label: '黄金糕'
+        }, {
+          value: '选项2',
+          label: '双皮奶'
+        }, {
+          value: '选项3',
+          label: '蚵仔煎'
+        }, {
+          value: '选项4',
+          label: '龙须面'
+        }, {
+          value: '选项5',
+          label: '北京烤鸭'
+        }],
+        value: '',
+        formInline: {
+          user: '',
+          region: ''
+        }
+      };
+    },
+    watch:{
+			// 此处监听variable变量，当期有变化时执行
+            checkList(item1,item2){
+                console.log(item1)
+                // console.log(item2)
+                // item1为新值，item2为旧值
+            },
+    },
+    methods:{
+        getSummaries(param) {
+        const { columns, data } = param;
+        const sums = [];
+        columns.forEach((column, index) => {
+          if (index === 0) {
+            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 {
+                    return prev;
+                }
+                
+            }, 0);
+            sums[index] += ' 元';
+          } else {
+            sums[index] = 'N/A';
+          }
+        });
+        
+
+        return sums;
+      }
+    },
+    mounted(){
+        console.log(this.checkList.includes("A"));
+        console.log(this.checkList.includes("1"));
+    }
+}
+</script>
+<style>
+    .cost-box {
+        background-color: #fff;
+        padding: 10px;
+        box-shadow: 0 0 5px #0005;
+        border-radius: 10px;
+    }
+    .fade-enter-active,
+    .fade-leave-active {
+        transition: opacity 1;
+    }
+    .fade-enter,
+    .fade-leave-to {
+        opacity: 0;
+    }
+    .cost-haed{
+        margin-bottom: 10px;
+    }
+    .ser-btn{
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 10px;
+    }
+    .cost-info{
+        display: flex;
+    }
+    .cost-info-li{
+        margin-right: 30px;
+    }
+    .cost-info-li label{
+        color: #606266;
+        font-size: 15px;
+        font-weight: 600;
+    }
+    .cost-info-li span{
+        color: #606266;
+        font-size: 14px;
+    }
+    .cost-box .el-checkbox-group{
+        margin: 5px 0;
+    }
+    .cost-box .el-checkbox{
+        width: 100px;
+        margin: 5px 0;
+    }
+</style>

src/components/child/Controltree.vue

@@ -16,7 +16,7 @@
                                 <div>{{seconditem.expectBeginDt.split(" ")[0]}}~{{seconditem.expectEndDt.split(" ")[0]}}</div>
                                 <div>{{seconditem.expectEndDt.split(" ")[0]}}</div>
                             </div>
-                            <div @click="addfigures(item)" class="addonebtn">
+                            <div ref="btnB" @click="addfigures(item)" class="addonebtn">
                                 <i class="el-icon-edit"></i>
                                 编 辑
                             </div>
@@ -66,9 +66,6 @@
                           <el-option v-for="(item,index) in employeeColumn" :key="index" :label="item.sysUserName" :value="item.sysUserId"></el-option>
                         </el-select>
                       </el-form-item>
-                      <!-- <el-form-item label="指派员工" label-width="80px" prop="duty">
-                          <el-input v-model="ruleForm.duty"></el-input>
-                      </el-form-item> -->
                       <el-form-item label="操作名称" label-width="80px" prop="JobContent">
                           <el-input v-model="ruleForm.JobContent"></el-input>
                       </el-form-item>
@@ -90,7 +87,7 @@
                   <el-input type="textarea" v-model="ruleForm.Remark"></el-input>
                 </el-form-item>
                 <div>
-                  <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
+                  <el-button class="final-btn" type="primary" @click="submitForm('ruleForm')">{{titleName}}</el-button>
                   <el-button @click="resetForm('ruleForm')">重置</el-button>
                 </div>
               </el-form>
@@ -103,7 +100,7 @@
             border
             style="width: 100%">
                 <el-table-column
-                prop="stepName"
+                prop="jobContent"
                 label="步骤名称"
                 width="180">
                 </el-table-column>
@@ -137,7 +134,7 @@
             </el-table>
             <div slot="footer" class="dialog-footer">
               <el-button @click="outerVisible = false">取 消</el-button>
-              <el-button type="primary">确 定</el-button>
+              <!-- <el-button type="primary">确 定</el-button> -->
             </div>
         </el-dialog>
     </div>
@@ -450,7 +447,8 @@ export default {
                 CreateUserId: '',
                 ExpectBeginDt: '',
                 ExpectEndDt: '',
-                Remark: '',
+                SLevel:'',
+                Remark: ''
             },
             //表单数据非空验明
             rules: {
@@ -458,10 +456,10 @@ export default {
                     { required: true, message: '请选择员工', trigger: 'change' }
                 ],
                 ExpectBeginDt: [
-                    { type: 'date', required: true, message: '请选择开始日期', trigger: 'change' }
+                    { required: true, message: '请选择开始日期', trigger: 'change' }
                 ],
                 ExpectEndDt: [
-                    { type: 'date', required: true, message: '请选择结束日期', trigger: 'change' }
+                    { required: true, message: '请选择结束日期', trigger: 'change' }
                 ],
                 JobContent: [
                     { required: true, message: '请输入操作名称', trigger: 'blur' },
@@ -474,7 +472,8 @@ export default {
             //标题名称
             titleName:'',
             stepID:'',
-            OPid:""
+            OPid:"",
+            fullscreenLoading:false
         }
     },
     created(){
@@ -544,6 +543,7 @@ export default {
             this.innerVisible = true;
             this.ruleForm.parentStep=this.addArgument.parentStep;
             this.ruleForm.step=this.addArgument.step;
+            this.ruleForm.SLevel=this.addArgument.SLevel;
             this.ruleForm.duty="";
             this.ruleForm.JobContent="";
             this.ruleForm.ExpectBeginDt="";
@@ -554,15 +554,17 @@ export default {
             console.log(val.childList);
             this.outerVisible = true;
             this.addArgument.parentStep=val.root,
+            this.addArgument.SLevel=val.childList[0].level,
             this.addArgument.step=val.root+"01",
             this.educationalList=val.childList;
         },
         levelAddfigures(val,index){
-            console.log(val);
+            console.log(val.childList);
             console.log(index);
             this.outerVisible = true;
             this.educationalList=val.childList;
             this.addArgument.parentStep=60+((index+1)+"");
+            this.addArgument.SLevel=val.childList[0].level,
             this.addArgument.step=val.step+"1";
             console.log(this.addArgument)
         },
@@ -606,6 +608,9 @@ export default {
                         type: 'success',
                         offset:50
                     });
+                    that.getControl()
+                    that.innerVisible = false;
+                    that.outerVisible = false;
                     that.fullscreenLoading = false;
                 }else{
                     that.$message({
@@ -639,6 +644,7 @@ export default {
                     expectEndDt:that.disposeTime(that.ruleForm.ExpectEndDt) +' '+ "18:00:00",
                     createUserId:that.ruleForm.CreateUserId,
                     remark:that.ruleForm.Remark,
+                    SLevel:that.ruleForm.SLevel
                 }
             }).then(function(res){
                 console.log(res)
@@ -648,6 +654,9 @@ export default {
                         type: 'success',
                         offset:50
                     });
+                    that.getControl()
+                    that.educationalList.push(res.data.data);
+                    that.innerVisible = false;
                     that.fullscreenLoading = false;
                 }else{
                     that.$message({
@@ -687,15 +696,15 @@ export default {
         //编辑
         handleEdit(index, row) {
             console.log(index, row);
-            this.stepID=row.step;
+            this.stepID=row.detailId;
             this.titleName="修 改";
             this.innerVisible = true;
             this.ruleForm.parentStep=row.root;
             this.ruleForm.step=row.step;
             this.ruleForm.JobContent=row.jobContent;
             this.ruleForm.duty=row.duty;
-            this.ruleForm.ExpectEndDt=row.expectEndDt;
-            this.ruleForm.ExpectBeginDt=row.expectBeginDt;
+            this.ruleForm.ExpectEndDt=row.expectEndDt.split(' ')[0];
+            this.ruleForm.ExpectBeginDt=row.expectBeginDt.split(' ')[0];
             this.ruleForm.Remark=row.remark;
         },
         //删除
@@ -712,8 +721,13 @@ export default {
                     'Content-Type':'application/json;charset=UTF-8'
                 },
                 data:{
-                    id:row.step,
-                    duty:that.ruleForm.CreateUserId
+                    id:row.detailId,
+                    duty:that.ruleForm.CreateUserId,
+                    StepStatus:-1,
+                    JobContent:'',
+                    ExpectBeginDt:'',
+                    ExpectEndDt:'',
+                    Remark:''
                 }
             }).then(function(res){
                 console.log(res)
@@ -724,6 +738,7 @@ export default {
                         offset:50
                     });
                     rows.splice(index, 1);
+                    that.getControl()
                     that.fullscreenLoading = false;
                 }else{
                     that.$message({
@@ -965,12 +980,12 @@ export default {
         padding-bottom: 5px;
     }
     .controltree-li:nth-child(2n+1) .addonebtn{
-        top: -52px;
-        right: -94px;
+        top: -76px;
+        right: 0px;
     }
     .controltree-li:nth-child(2n) .addonebtn{
-        top: -52px;
-        left: -94px;
+        top: -76px;
+        left: 0px;
     }
     .flx-box{
         display: flex;
@@ -984,7 +999,26 @@ export default {
         border-radius:  5px; ;
     }
     .onefloor{
-        max-height: 520px;
+        max-height: 460px;
         overflow-y: auto;
     }
+    .onefloor::-webkit-scrollbar {
+        /*滚动条整体样式*/
+        width: 4px;
+        /*高宽分别对应横竖滚动条的尺寸*/
+        height: 4px;
+        border-radius: 2px;
+    }
+    .onefloor::-webkit-scrollbar-thumb {
+        /*滚动条里面小方块*/
+        width: 4px;
+        height: 80px;
+        border-radius: 2px;
+        background: rgba(48, 47, 47, 0.2);
+    }
+    .onefloor::-webkit-scrollbar-track {
+        /*滚动条里面轨道*/
+        background: rgba(255, 255, 255, 0.05);
+        border-radius: 2px;
+    }
 </style>

src/router/index.js

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