zhouzhendong
/
baoshi-was


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267
							<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>table</title>
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.0-beta2/css/bootstrap-grid.css" rel="stylesheet">
    <style type="text/css">
        #test th{
            position: sticky;
            position: -webkit-sticky;
            top: 0;
            z-index:999;
            background-color: white;
        }
    </style>
    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
</head>
<body onload="a()">
<button></button>
<table id="table" cellspacing="0" cellpadding="2" width="100%" border="1">
    <tr id="test" style="white-space: nowrap !important;">
        <th >用户编号</th>
        <th>试用时间</th>
        <th>转正时间</th>
        <th>生日时间</th>
        <th>民族</th>
        <th>身高</th>
    </tr>
    <tr>
        <td style="overflow-x: hidden">200004512312312321321</td>
        <td><div>2001-2-15</div></td>
        <td><div>2001-2-15</div></td>
        <td>1978-8-5</td>
        <td>汉</td>
        <td>162</td>
    </tr>
</table>
<div class="modal fade" tabindex="-1" role="dialog" id="auditOrRecover">
    <div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <label class="col-3 text-right h4"><span class="badge badge-success">新增</span></label>
                    <label class="col-1 h3 text-success" style="bottom: 0.25rem">
                        <span class="fa fa-long-arrow-right"></span>
                    </label>
                    <div class="col-8 border-bottom border-success">
                        <div v-if="selectedAudit=='storage'" v-for="s in auditList.storage.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(@{{ s.counting_type }}-@{{ s.using_type }})</span></div>
                        </div>
                        <div v-if="selectedAudit=='operation'" v-for="s in auditList.operation.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(@{{ s.operation_type }}-@{{ s.strategy }})</span></div>
                        </div>
                        <div v-if="selectedAudit=='express'" v-for="s in auditList.express.C">
                            <div><b>@{{ s.name }}</b></div>
                        </div>
                        <div v-if="selectedAudit=='logistic'" v-for="s in auditList.logistic.C">
                            <div><b>@{{ s.name }}</b></div>
                        </div>
                        <div v-if="selectedAudit=='directLogistic'" v-for="s in auditList.directLogistic.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(起步：@{{ s.base_km }}KM)</span></div>
                        </div>
                        <div v-if="selectedAudit=='system'" v-for="s in auditList.system.C">
                            <div>使用费：￥<b>@{{ s.usage_fee }}</b></div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <label class="col-3 text-right h4"><span class="badge badge-danger">删除</span></label>
                    <label class="col-1 h3 text-danger" style="bottom: 0.25rem">
                        <span class="fa fa-long-arrow-right"></span>
                    </label>
                    <div class="col-8 border-bottom border-danger">
                        <div v-if="selectedAudit=='storage'" v-for="s in auditList.storage.D">
                            <table class="table table-sm">
                                <tr class="text-center">
                                    <th>名称</th>
                                    <th>计费类型</th>
                                    <th>用仓类型</th>
                                    <th>最低起租面积</th>
                                    <th>减免类型</th>
                                    <th>减免值</th>
                                    <th>单位</th>
                                    <th>计时单位</th>
                                    <th>数量-单价</th>
                                    <th>税率</th>
                                </tr>
                                <tr>
                                    <td>@{{ s.name }}</td>
                                    <td>@{{ s.counting_type }}</td>
                                    <td>@{{ s.using_type }}</td>
                                    <td>@{{ s.minimum_area }}</td>
                                    <td>@{{ s.discount_type }}</td>
                                    <td>@{{ s.discount_value }}</td>
                                    <td>@{{ s.unit_id }}</td>
                                    <td>@{{ s.time_unit_id }}</td>
                                    <td>
                                        <div>
                                            <div class="float-left">
                                                <small v-for="(a,i) in s.amount_interval" v-if="i!=s.amount_interval.length-1">@{{ a }}-@{{ s.amount_interval[i+1] }}（@{{ s.price[i] }}元）<br></small>
                                                <small>@{{ s.amount_interval[s.amount_interval.length-1] }}&nbsp;+<br></small>
                                            </div>
                                            <div class="float-left">
                                                <span class="float-left fa fa-long-arrow-right" style="margin-top: 1em"></span>
                                                <div class="float-left">
                                                    <small v-for="(a,i) in s.amount_interval" v-if="i!=s.amount_interval.length-1">@{{ a }}-@{{ s.amount_interval[i+1] }}（@{{ s.price[i] }}元）<br></small>
                                                    <small>@{{ s.amount_interval[s.amount_interval.length-1] }}&nbsp;+<br></small>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                    <td>@{{ s.tax_rate_id }}%</td>
                                </tr>
                            </table>
                        </div>
                        <div v-if="selectedAudit=='operation'" v-for="s in auditList.operation.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(@{{ s.operation_type }}-@{{ s.strategy }})</span></div>
                        </div>
                        <div v-if="selectedAudit=='express'" v-for="s in auditList.express.C">
                            <div><b>@{{ s.name }}</b></div>
                        </div>
                        <div v-if="selectedAudit=='logistic'" v-for="s in auditList.logistic.C">
                            <div><b>@{{ s.name }}</b></div>
                        </div>
                        <div v-if="selectedAudit=='directLogistic'" v-for="s in auditList.directLogistic.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(起步：@{{ s.base_km }}KM)</span></div>
                        </div>
                        <div v-if="selectedAudit=='system'" v-for="s in auditList.system.C">
                            <div>使用费：<b>@{{ s.usage_fee }}</b></div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <label class="col-3 text-right h4"><span class="badge badge-primary">修改</span></label>
                    <label class="col-1 h3 text-primary" style="bottom: 0.25rem">
                        <span class="fa fa-long-arrow-right"></span>
                    </label>
                    <div class="col-8">
                        <div v-if="selectedAudit=='storage'" v-for="s in auditList.storage.U">
                            <table class="table table-sm">
                                <tr>
                                    <th v-for="(key,val) in auditList.mapping.storage">@{{ val }}</th>
                                </tr>
                                <tr>
                                    <td v-for="(key,val) in auditList.mapping.storage" v-html="s[key]"></td>
                                </tr>
                            </table>
                        </div>
                        <div v-if="selectedAudit=='operation'" v-for="s in auditList.operation.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(@{{ s.operation_type }}-@{{ s.strategy }})</span></div>
                        </div>
                        <div v-if="selectedAudit=='express'" v-for="s in auditList.express.C">
                            <div><b>@{{ s.name }}</b></div>
                        </div>
                        <div v-if="selectedAudit=='logistic'" v-for="s in auditList.logistic.C">
                            <div><b>@{{ s.name }}</b></div>
                        </div>
                        <div v-if="selectedAudit=='directLogistic'" v-for="s in auditList.directLogistic.C">
                            <div><b>@{{ s.name }}</b><span class="text-muted">(起步：@{{ s.base_km }}KM)</span></div>
                        </div>
                        <div v-if="selectedAudit=='system'" v-for="s in auditList.system.C">
                            <div>使用费：<b>@{{ s.usage_fee }}</b></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="{{mix("js/app.js")}}"></script>
<script type="text/javascript">
    function a(){
        $("#auditOrRecover").modal("show");
    }
    new Vue({
        el:"#auditOrRecover",
        data:{
            auditList:{
                storage:{
                    "C":[{name:"笕尚退货",counting_type:"包仓",using_type:"恒温"},{name:"笕尚退货",counting_type:"包仓",using_type:"恒温"}],
                    "U":[{name:"笕尚退货",counting_type:"包仓",using_type:"恒温",
                        minimum_area:"200",price:["0.2"],discount_type:"无减免",target_id:"10",
                        discount_value:"20",unit_id:"m²",time_unit_id:"日",tax_rate_id:"3",amount_interval:["2"]}],
                    "D":[{name:"笕尚退货",counting_type:"包仓",using_type:"恒温",
                        minimum_area:"200",price:["0.2","0.1"],discount_type:"无减免",
                        discount_value:"20",unit_id:"m²",time_unit_id:"日",tax_rate_id:"3",amount_interval:["2","5"]}],
                    "H":{10:{name:"笕尚退货",counting_type:"包仓",using_type:"恒温",
                            minimum_area:"200",price:["0.1","0.2"],discount_type:"无减免",
                            discount_value:"20",unit_id:"m²",time_unit_id:"日",tax_rate_id:"3",amount_interval:["2","5"]}},
                },
                operation:{
                    "C":[{name:"笕尚入库",operation_type:"入库",strategy:"特征"},{name:"笕尚入库",operation_type:"入库",strategy:"特征"}],
                },
                express:{
                    "C":[{name:"笕尚快递"}],
                },
                logistic:{
                    "C":[{name:"笕尚物流"}],
                },
                directLogistic:{
                    "C":[{name:"笕尚直发",base_km:"10"}],
                },
                system:{
                    "C":[{usage_fee:"500"}],
                },
                mapping:{
                    "storage":{
                        "name":"名称",
                        "counting_type":"计费类型",
                        "using_type":"用仓类型",
                        "minimum_area":"最低起租面积",
                        "discount_type":"减免类型",
                        "discount_value":"减免值",
                        "unit_id":"单位",
                        "time_unit_id":"计时单位",
                        "amount_interval":"数量-单价",
                        "tax_rate_id":"税率",
                    }
                },
            },
            selectedAudit:"storage"
        },
        mounted(){
            let temp = {};
            this.auditList.storage.U.forEach(data=>{
                let tar = this.auditList.storage.H[data.target_id];
                for (let key in this.auditList.mapping.storage){
                    if (data[key]!==tar[key]){
                        if (!temp[key]) temp[key] = this.auditList.mapping.storage[key];
                        data[key] = this.transformData(data[key],key)+this.transformData(tar[key],key);
                    }else data[key] = this.transformData(data[key],key);
                }
                if (data["price"]!==tar["price"]){

                }
            });
            this.auditList.mapping.storage = temp;
        },
        methods:{
            transformData(val,key){
                if (!val)return;
                switch (key) {
                    case 'tax_rate_id':
                        val += "%";
                        break;
                    case "amount_interval":
                        let html = '<div class="float-left">';
                        val.forEach((am,i)=>{
                            html += "<small>"+am+"-"+val[i+1]+"（"+data["price"][i]+"元）</small>";
                        });
                        html += "<small>"+val[val.length-1]+" +（"+data["price"][val.length-1]+"元）</small></div>";
                        val = html;
                }
                return val;
            },
        },
    });
</script>
</body>
</html>