diff --git a/src/api/evaluation.js b/src/api/evaluation.js
new file mode 100644
index 0000000..6202b12
--- /dev/null
+++ b/src/api/evaluation.js
@@ -0,0 +1,7 @@
+export default {
+    // -- 领取优惠券 --
+    add: {
+        url: "/mall/web/evaluation/add",
+        method: "post"
+    }
+};
diff --git a/src/models/evaluation-model.js b/src/models/evaluation-model.js
new file mode 100644
index 0000000..9e67858
--- /dev/null
+++ b/src/models/evaluation-model.js
@@ -0,0 +1,13 @@
+import utilsModel from "./utils-model";
+import evaluation from "../api/evaluation.js";
+
+export default {
+    // 获取优惠券信息
+    add: (data, token) =>
+        utilsModel.config(evaluation.add).request({
+            data: data,
+            headers: {
+                "encodeToken": token
+            }
+        })
+};
diff --git a/src/view/service-evaluation-status.vue b/src/view/service-evaluation-status.vue
index ac2a092..4386a90 100644
--- a/src/view/service-evaluation-status.vue
+++ b/src/view/service-evaluation-status.vue
@@ -2,9 +2,9 @@
 <template>
     <div class="service-evaluation-status">
         <div class="page-top">
-			<a><img src="../assets/images/my-money/left.png"/></a>
-			<span>服务评价</span>
-		</div>
+            <a><img src="../assets/images/my-money/left.png" /></a>
+            <span>服务评价</span>
+        </div>
         <div class="page-content">
             <div class="evaluation-status-box">
                 <!--
@@ -17,9 +17,24 @@
                     //账号不一致
                     ../assets/images/service-evaluation/evaluation-status-3.png
                 -->
-                <img src="../assets/images/service-evaluation/evaluation-status-0.png" class="evaluation-status-icon">
-                <span>评价成功</span>
+                <img v-show="code==0" src="../assets/images/service-evaluation/evaluation-status-0.png" class="evaluation-status-icon">
+                <img v-show="code==1" src="../assets/images/service-evaluation/evaluation-status-1.png" class="evaluation-status-icon">
+                <img v-show="code==2" src="../assets/images/service-evaluation/evaluation-status-2.png" class="evaluation-status-icon">
+                <img v-show="code==3" src="../assets/images/service-evaluation/evaluation-status-3.png" class="evaluation-status-icon">
+                <span v-show="code==0">评价成功</span>
+                <span v-show="code==1">不可重复评价</span>
+                <span v-show="code==2">已过期</span>
+                <span v-show="code==3">账号不一致</span>
             </div>
         </div>
     </div>
-</template>
\ No newline at end of file
+</template>
+<script>
+export default {
+    props: {
+        code: {
+            type: Number
+        }
+    }
+};
+</script>
diff --git a/src/view/service-evaluation.vue b/src/view/service-evaluation.vue
index 36ba103..668c411 100644
--- a/src/view/service-evaluation.vue
+++ b/src/view/service-evaluation.vue
@@ -2,56 +2,47 @@
 <template>
     <div class="service-evaluation">
         <div class="page-top">
-			<a><img src="../assets/images/my-money/left.png"/></a>
-			<span>服务评价</span>
-		</div>
+            <a><img src="../assets/images/my-money/left.png" /></a>
+            <span>服务评价</span>
+        </div>
         <div class="page-content">
             <!--保洁师信息-->
             <div class="line"></div>
             <div class="cleaners-news">
-                <p>保洁师：<span>林同学</span></p>
-                <p>服务日期：<span>2018-10-01 08:00-12:00</span></p>
+                <p>保洁师：
+                    <span>林同学</span>
+                </p>
+                <p>服务日期：
+                    <span>2018-10-01 08:00-12:00</span>
+                </p>
             </div>
             <div class="line"></div>
             <!--服务评价-->
             <div class="evaluate">
-                <span class="evaluate-question-btn"></span>
+                <span class="evaluate-question-btn" @click="showTips"></span>
                 <div class="evaluate-tab">
                     <label>准时到达</label>
                     <ul>
-                        <li></li>
-                        <li></li>
-                        <li></li>
-                        <li></li>
-                        <li></li>
+                        <li v-for="item in 5" :key="item" :class="{ative:item<=timeScore}" @click="timeScore=item"></li>
                     </ul>
                 </div>
                 <div class="evaluate-tab">
                     <label>洁净标准</label>
                     <ul>
-                        <li class="ative"></li>
-                        <li></li>
-                        <li></li>
-                        <li></li>
-                        <li></li>
+                        <li v-for="item in 5" :key="item" :class="{ative:item<=serviceScore}" @click="serviceScore=item"></li>
                     </ul>
                 </div>
                 <div class="evaluate-tab">
                     <label>专业高效</label>
                     <ul>
-                        <li></li>
-                        <li></li>
-                        <li></li>
-                        <li></li>
-                        <li></li>
+                        <li v-for="item in 5" :key="item" :class="{ative:item<=professionScore}" @click="professionScore=item"></li>
                     </ul>
                 </div>
             </div>
             <div class="line"></div>
             <!--提交意见-->
-            <textarea name="" id="" class="message">您的宝贵意见，将帮助我们提升服务</textarea>
-            <button class="submitBtn">提交</button>
-            
+            <textarea v-model="content" name="" id="" class="message" placeholder="您的宝贵意见，将帮助我们提升服务"></textarea>
+            <button @click="submit" class="submitBtn">提交</button>
         </div>
 
         <!--问题弹出框-->
@@ -63,17 +54,148 @@
                 <button>确定</button>
             </div>
         </div> -->
-        <div class="popup-centent" id="popup-question">
-            <span class="closeBtn"><img src="../assets/images/put-money/close.png" alt=""></span>
-            <div class="popup-body">
-                <p>准时到达：本次保洁师是否如约到达？</p>
-                <p>洁净标准：本次洁净服务质量,是否您满意？</p>
-                <p>专业高效：本次洁净服务速度,是否您满意？</p>
+        <transition name="fade">
+            <div class="popup-centent" id="popup-question" v-show="tipShow">
+                <span class="closeBtn"><img src="../assets/images/put-money/close.png" @click="closeTips"></span>
+                <div class="popup-body">
+                    <p>准时到达：本次保洁师是否如约到达？</p>
+                    <p>洁净标准：本次洁净服务质量,是否您满意？</p>
+                    <p>专业高效：本次洁净服务速度,是否您满意？</p>
+                </div>
             </div>
-        </div>
-
+        </transition>
+        <transition name="alertFade">
+            <div class="tips" v-show="alertShow">
+                请完整填写评价
+            </div>
+        </transition>
+        <status :code="code" v-show="statusShow"></status>
     </div>
 </template>
 <script>
- 
-</script>
\ No newline at end of file
+import { setTimeout } from "timers";
+import model from "../models/evaluation-model.js";
+import status from "./service-evaluation-status.vue";
+export default {
+    data() {
+        return {
+            tipShow: false,
+            timeScore: 0,
+            serviceScore: 0,
+            professionScore: 0,
+            content: "",
+            alertShow: false,
+            code: 4,
+            statusShow: false
+        };
+    },
+    components: {
+        status
+    },
+    methods: {
+        //点击问号
+        showTips() {
+            this.tipShow = true;
+        },
+        //关闭提示
+        closeTips() {
+            this.tipShow = false;
+        },
+        //提示
+        submit() {
+            if (
+                this.timeScore == 0 ||
+                this.serviceScore == 0 ||
+                this.professionScore == 0
+            ) {
+                this.alertShow = true;
+                setTimeout(() => {
+                    this.alertShow = false;
+                }, 3000);
+            } else {
+                var strCookie = document.cookie;
+                var cookieName = "1hjz_mall_login_access_token=";
+                var token = strCookie.slice(cookieName.length);
+
+                model
+                    .add(
+                        {
+                            timeScore: this.timeScore,
+                            serviceScore: this.serviceScore,
+                            professionScore: this.professionScore,
+                            content: this.content,
+                            bookNo: this.getParam("bookNo")
+                        },
+                        token
+                    )
+                    .then(res => {
+                        let code = res.code;
+                        if (code == 0) {
+                            this.code = 0;
+                            this.statusShow = true;
+                        } else if (code == 1) {
+                            let str = res.msg;
+                            switch (str) {
+                                case "已过期":
+                                    this.code = 2;
+                                    this.statusShow = true;
+                                    break;
+                                case "不可重复评价":
+                                    this.code = 1;
+                                    this.statusShow = true;
+                                    break;
+                                case "账号不一致":
+                                    this.code = 3;
+                                    this.statusShow = true;
+                                    break;
+                            }
+                        }
+                    });
+            }
+        },
+        getParam(name) {
+            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
+            var r = window.location.search.substr(1).match(reg);
+            if (r != null) return unescape(r[2]);
+            return null;
+        }
+    }
+};
+</script>
+<style scoped>
+.fade-enter-active {
+    transition: opacity 0.5s;
+}
+.fade-leave-active {
+    transition: opacity 0.5s;
+}
+.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
+    opacity: 0;
+}
+.tips {
+    position: fixed;
+    top: 8rem;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 4.5rem;
+    height: 1rem;
+    background-color: black;
+    opacity: 0.6;
+    border-radius: 0.5rem;
+    font-family: "PingFang-SC-Medium";
+    font-size: 0.36rem;
+    color: white;
+    line-height: 1rem;
+    text-align: center;
+}
+.alertFade-enter-active {
+    transition: opacity 0.5s;
+}
+.alertFade-leave-active {
+    transition: opacity 0.5s;
+}
+.alertFade-enter, .alertFade-leave-to /* .fade-leave-active below version 2.1.8 */ {
+    opacity: 0;
+}
+</style>
+