yy_evaluate.html 9.96 KB
<script type="text/javascript" src="__PUBLIC__/js/rem_new.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>预约评价</title>
    <include file="public/header" />
    <link rel="stylesheet" href="__STATIC__/css/public.css?v=__CSSVERSION__">
    <link rel="stylesheet" href="__STATIC__/css/maa_service_css/yy_evaluate.css?v=__CSSVERSION__">
    <script type="text/javascript" src="__STATIC__/js/jquery.js"></script>
    <include file="public/my_msg"/>
</head>
<style>
    .fs24{ font-size: 24px; }
    .star_div{display: flex; justify-content: center; margin-top: 10px}
    .jsstar{list-style: none;
        margin: 0px;padding: 0px;
        height: 30px;
        position: relative;
    }
    .jsstar li{
        padding:0px;float: left; width:30px;height:30px;margin-right: 5px;
        background:url(__STATIC__/images/star_rating.png) 0 0px no-repeat;background-size: auto 60px
    }
    .d-il.label{ margin-right: 0.1rem;min-width: 1rem;text-align: center;padding: 0 0.08rem}
    .text_len{ position: absolute; right: 12%; bottom: 5px}
     .grade{ width: 4rem; margin: 0 auto}
    .label-frame1{height: auto; width: 85%; margin: 0.3rem auto; }
    .label-frame1.txt_center{ text-align: center }
    .service_time,.width{width: 62%;}
    .ubmission.yellow{
        background:#ffb03f ;
    }

</style>
<body>
    <input id="number" value="{$number}" type="hidden"/>
    <input id="fromType" value="{$fromtype}" type="hidden"/>
    <input id="formId" value="{$fromid}" type="hidden"/>

    <div class="top-frame t_c">
        <img class="beautician_img "  src="{$data.PhotoUrl}" onerror="this.src='__WEBPUBLIC__/miniapp/images/no-head.jpg'" >
    </div>

        <div class="details_border">
            <div class="fs026 f-c4 ellipsis-1 width" >服务美容师:{$data.StaffName?$data.StaffName:$data.BeauticianName}</div>
            <div class="fs026 f-c4 ellipsis-1 width">
              &nbsp;&nbsp;服务项目:{$data.ServiceName}
            </div>
            <div class="service_time rel" style="border-bottom:1px dashed #eee;">
                <if condition="$is_pj">
                    <div class="fs026 f-c4  ellipsis-1">&nbsp;&nbsp;服务时间:{$data.WriteTime}</div>
                    <div class="fs026 f-c4  ellipsis-1">&nbsp; 评价时间:{$data.EvaluateDatetime}</div>
                 <else/>
                    <if condition="$fromtype eq 2">
                        <div class="fs026 f-c4  ellipsis-1">&nbsp;&nbsp;服务时间:{$data.ArrangeTime}</div>
                     <else/>
                        <div class="fs026 f-c4  ellipsis-1">&nbsp;&nbsp;服务时间:{$data.BillDate}</div>
                    </if>
                </if>
            </div>
        </div>

        <div class="star_div">
            <ul class="jsstar" >
                <input id="rank" name="rank" value="0" type="hidden">
                <li title="1" <if condition="$data.Star egt 1">style="background-position:left bottom"</if> ></li>
                <li title="2" <if condition="$data.Star egt 2">style="background-position:left bottom"</if>></li>
                <li title="3" <if condition="$data.Star egt 3">style="background-position:left bottom"</if>></li>
                <li title="4" <if condition="$data.Star egt 4">style="background-position:left bottom"</if>></li>
                <li title="5" <if condition="$data.Star egt 5">style="background-position:left bottom"</if>></li>
            </ul>
            <div class="clear"></div>
        </div>

    <div class="t_c textarea-frame rel">
         <textarea id="text_area" class="fs024 f-c4 " placeholder="写其他的意见和建议"
            <if condition="$is_pj">readonly</if> <if condition="$is_pj and empty(trim($data.Remark))" > style="display:none"</if>
                maxlength="100" onkeyup="set_len(this)"><if condition="$is_pj">{:trim($data.Remark)}</if></textarea>
         <span class="text_len"  <if condition="$is_pj and empty($data.remark)" > style="display:none"</if> ><font id="text_len">0</font>/100</span>
    </div>

    <div style="width: 100%">
        <div class="label-frame1 fs023 <if condition="$data.EvaluationList and count($data.EvaluationList) lt 3">txt_center</if>"  />
            <if condition="$is_pj">
                  <foreach name="data.EvaluationList" item="v"> <div class="d-il label sn" >{$v.LabelName}</div> </foreach>
            </if>
            <!--<div class="d-il label" onclick="click_label(this)">{$v.name}</div>-->
        </div>
    </div>

<if condition="!$is_pj">
    <div class="tips fs026 f-ca3 t_c" >满意的话请打五星噢,谢谢您的支持!</div>
    <div class="determine-frame flex jc_center ai_center" onclick="post_evaluate()">
        <div class="ubmission fc fs030 flex jc_center ai_center">
           确定提交
        </div>
    </div>
    <else/>
    <div id="pj_complete">
        <a href="{:U('Yyservice/yy_order_list',array('state'=>1,'stoid'=>$Think.request.stoid))}">
            <div class="ubmission fc fs030 flex jc_center ai_center" style="margin: auto">评级其他</div>
        </a>
    </div>
</if>



    <include file="public/my_msg"/>
<script>

    var lab_arr={:json_encode($data.evaLabList)};
    //点击星级
    $(document).ready(function(){
        //显示点击领取礼品
        click_gift();
    $("#rank").val("");


    //不是评价的时候才有点击效果
    <if condition="!$is_pj">
        $(".jsstar li").mouseover(function(){
            $(this).parent().find("li").css({"background-position":"left top"});
            for(var i=0; i<$(this).attr("title"); i++){
                $(this).parent().find("li").eq(i).css({"background-position":"left bottom"});
            }
        });
        $(".jsstar li").mouseout(function(){
            $(this).parent().find("li").css({"background-position":"left top"});
            for(var i=0; i<$(this).parent().find("input").val(); i++){
                $(this).parent().find("li").eq(i).css({"background-position":"left bottom"});
            }
        });
        $(".jsstar li").click(function(){
            var star=$(this).attr("title");
            $(this).parent().find("input").val(star);
            $.ajax({
                url:"/index.php/mobile/yyservice/star_lab/stoid/{$Think.request.stoid}",
                data:{Star:star},
                success:function (data) {
                    if(data.code==0){
                        var str="";
                        for(var i in data.data){
                              var item=data.data[i];
                              var is_lab = 0
                              if(lab_arr)  is_lab=lab_arr.indexOf(name);
                              var name=item.LabelName;
                              if(name.length>6)  name=name.substring(0,6);

                              if(is_lab){
                                  str+= '<div class="d-il label sn" onclick="click_label(this)">'+name+'</div>';
                              }else{
                                  str+= '<div class="d-il label" onclick="click_label(this)">'+name+'</div>';
                              }
                        }
                        $(".label-frame1").html(str);
                    }
                }
            })
        });
    </if>

    });

    function click_label(ob) {
        if($(ob).hasClass('sn')){
             $(ob).removeClass('sn');
        }else{
            $(ob).addClass('sn');
        }
    }

    var up_ing=0;
    //---提交评价---
    function post_evaluate() {

        var rank=$("#rank").val();
        if(rank==""){
            layer.open({content:'请给服务评分',time:2});
            return false;
        }
        var text_area=$("#text_area").val();
        text_area=$.trim(text_area);
        if(text_area==""){
            layer.open({content:'请填写评价内容',time:2});
            return false;
        }
        var lab_str="";
        $(".d-il.label.sn").each(function () {
             var title=$(this).text();
            lab_str+=title+"|";
        })

        var dd={};
        var ui= layer.open({type:2,shadeClose: false});

        var number=$("#number").val();
        var formId=$("#formId").val();

        dd.Star=rank;
        dd.fromType=$("#fromType").val();
        if(lab_str) dd.evaLabList=lab_str;
        if(text_area) dd.remark=text_area;

        if(dd.fromType==2) dd.number=number;
        if(dd.fromType==3) dd.number=formId;

        if(up_ing) return false;
        up_ing=1;
        var ui= layer.open({type:2,shadeClose: false});
        $.ajax({
            url:"/index.php/mobile/yyservice/post_evaluate/stoid/{$Think.request.stoid}",
            data:dd,
            success:function (data) {
                up_ing=0
                layer.close(ui);
                if(data.code==0){
                    layer.open({content:"评价成功",time:1})
                    window.location.href="/index.php/mobile/yyservice/yy_order_list/stoid/{$Think.request.stoid}"
                    return false;
                }

                layer.open({content:data.msg,time:3})
            }
        })
    }

    //跟踪文字的多少
    function set_len(ob) {
        var len=$(ob).val(); $("#text_len").text(len.length);
    }

    //显示点击领取礼品
    function click_gift() {
        var user_id="{$user_id}"
        var fromid="{$fromid}"
        $.ajax({
            type: "get",
            url:" /index.php?m=Mobile&c=Userapi&a=click_gift&user_id=" +user_id + "&stoid="+'{$Think.request.stoid}'+"&orderNumber="+fromid,
            dataType:'json',
            success: function (data) {
                if(data.code==0){
                    var html='<a href="__WXD_LB_URL__GiftPackage/EvaluateGift?actId='+data.id+'&actType=2&giftBagId=&storeId='+{$Think.request.stoid}+'&userId='+user_id+'&orderType=2&orderNumber={$number?$number:$fromid}">' +
                        '<div class="ubmission yellow fc fs030 flex jc_center ai_center" style="margin:auto;margin-top: 17px">点击领取礼品</div></a>'
                  $("#pj_complete").append(html);
                }
            }
        })
    }


</script>

</body>

</html>