Browse Source

供应商维修详情增加

zhengjinyi 4 years ago
parent
commit
802c688e00

+ 4 - 4
src/main/resources/config/dev/application-dev.yml

@@ -53,10 +53,10 @@ logging:
 # 服务域名
 caimei:
   siteEnv: 0 #网站环境,(2:正式环境,1:测试环境,0:开发环境)
-#  spiServer: https://spi-b.caimei365.com
-  spiServer: http://192.168.2.67:8008
-#  coreServer: https://core-b.caimei365.com
-  coreServer: http://192.168.2.67:18002
+  spiServer: https://spi-b.caimei365.com
+#  spiServer: http://192.168.2.67:8008
+  coreServer: https://core-b.caimei365.com
+#  coreServer: http://192.168.2.67:18002
   imageDomain: https://img-b.caimei365.com
   wwwDomain: http:localhost:8009
   destPath: D:/_PLAN_WORKSPACE/test/static

+ 94 - 0
src/main/resources/static/css/supplier-center/repair/detail.css

@@ -0,0 +1,94 @@
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+    /*个人中心右侧*/
+    .navLayout .right{float:right;width:968px}
+    .container{width: 100%;height: auto;background-color: #ffffff;box-sizing: border-box;padding:32px 225px;border-bottom: solid 1px #e2e7ef}
+    .container .formLine{width: 100%;float: left;}
+    .container .formLine.file{margin-top: 16px;}
+    .container .formLine .upload-image{width: 100%;height: 92px;margin: 5px 0;}
+    .container .formLine .upload-file{width: 91px;height: 91px;cursor: pointer; margin-right: 10px;float: left; border: 1px solid #EBEBEB; position: relative; border-radius: 2px;}
+    .container .formLine .upload-file .icon-del{width: 16px;height: 16px;display: block;position: absolute;right:0;top:0;cursor: pointer;background: url("/img/base/icon.png")-118px -140px no-repeat;}
+    .container .formLine .upload-file .file-add{display: block;width:58px ;height:50px;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
+    .container .formLine .upload-file .file-add .icon{display: block;width:23px ;height:23px;margin:0 auto;}
+    .container .formLine .upload-file .file-add .icon:before{width:23px ;height:23px;background-position: -169px -375px;}
+    .container .formLine .upload-file .file-add p{color: #9aa5b5;}
+    .container .formLine .upload-file .input-file{width: 92px;height: 92px;opacity:0;cursor: pointer;}
+    .container .formLine .upload-file .upload-img{width: 100%;height: 100%;display: block;border-radius: 2px;}
+    .container .formLine .upload-tips{width: 100%;height:auto;}
+    .container .formLine .upload-tips p{font-size: 14px;text-align: left;color: #f94b4b;line-height: 24px;}
+    .container .formLine .address.mark textarea{margin-top: 0;}
+    .container .formLine .btn{width: 208px;height: 50px;display: block;font-size: 14px;color: #FFF;text-align: center;line-height: 50px; margin: 0 auto;background-color: #e15616;box-shadow: 0px 3px 6px 0px rgba(249, 75, 75, 0.17);border-radius: 2px;}
+    .container .formLine .btn.disabled{background-color: #999999;}
+
+
+    .release-stepbox .stepSpan{display: inline-block;width: 32%;text-align: center}
+    .stepSpan p{display: inline-block;color: #9aa5b5;}
+    .stepSpan span{width: 20px;height: 20px;background: #9aa5b5;display: inline-block;border-radius: 50%;color: #fff;line-height: 20px;text-align: center}
+    .release-stepbox .stepSpan.active span{color: #fff;background: #E15616}
+    .release-stepbox .stepSpan.active p{color: #e15616}
+    .process p{color: #627386;font-size: 14px;margin-bottom: 35px}
+    .process .feedback span{position: relative;border-radius: 2px; padding: 0 15px 0 28px;height: 30px;line-height: 32px;text-align: center;color: #b8bfca;border: 1px solid #b8bfca;margin-right: 15px;display: inline-block;cursor: pointer;}
+    em{color: #e15616;margin-right: 5px}
+    .process .feedback span.style{border: 1px solid #e15616;color: #e15616}
+    .process textarea{width: 496px;height: 116px;padding: 10px;resize: none;border: solid 1px #b8bfca;}
+    textarea::placeholder{color: #9aa5b5}
+    .process>div span{color:#9aa5b5;    position: absolute;bottom: 10px;right: 10px;font-size: 12px }
+    .process>div{position: relative}
+    .from-button{width: 232px;height: 50px;cursor:pointer;line-height: 50px;text-align: center;color: #fff;background-color: #e15616;box-shadow: 0px 3px 6px 0px rgba(249, 75, 75, 0.17);border-radius: 2px;font-size: 18px;margin: 15px auto;}
+    .mainconten{background: #fff;	box-shadow: 0px 3px 6px 0px rgba(34, 39, 46, 0.07);padding: 20px 0;margin-bottom: 8px}
+    .mainconten form{width: 500px;margin: auto}
+    .sencondCont{background: #fff;	box-shadow: 0px 3px 6px 0px rgba(34, 39, 46, 0.07);padding: 32px 0;}
+    .sencondCont form{width: 500px;margin: auto}
+    .sencondCont p{color: #627386;font-size: 14px;margin-bottom: 32px}
+    .sencondCont p span{color: #22272e;}
+    .process p:nth-child(3){margin-bottom: 10px}
+    .sencondCont .Image img{width: 80px;height: 80px;margin: 0 0px 10px 10px}
+    .icon.solve:before{width: 25px;height: 25px;background-position: -171px -512px;position: absolute;left: 5px}
+    .icon.unsolved:before{width: 25px;height: 25px;background-position: -205px -512px;position: absolute;left: 5px}
+    .icon.stance:before{width: 25px;height: 25px;background-position: -273px -513px;cursor: pointer;}
+    .icon.changestance:before{   width: 25px;height: 25px;background-position: -240px -513px}
+    .sencondCont p.Image{width: 530px}
+    .grade{position: absolute;margin-top: -6px}
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+ .container {    height: 17.6vw;
+    line-height: 24.6vw}
+ .release-stepbox .stepSpan{display: inline-block;width: 32%;text-align: center;position: relative;}
+    .stepSpan p{display: inline-block;color: #9aa5b5;}
+    .stepSpan span{width: 5vw;height: 5vw;background: #9aa5b5;display: inline-block;border-radius: 50%;color: #fff;line-height: 5vw;
+    text-align: center;    position: absolute;top: 3.2vw;left: 13.3vw}
+    .release-stepbox .stepSpan.active span{color: #fff;background: #E15616}
+    .release-stepbox .stepSpan.active p{color: #e15616}
+    .process p{color: #627386;font-size: 3.4vw;}
+    .process .feedback span{position: relative;border-radius: .53vw; padding: 0 4vw 0 7.7vw;height: 7.8vw;line-height: 7.8vw;text-align: center;color: #b8bfca;border: .27vw solid #b8bfca;margin: 4vw 4vw 4vw 0 ;display: inline-block;cursor: pointer;}
+    em{color: #e15616;margin-right: 5px}
+    .process .feedback span.style{border: 1px solid #e15616;color: #e15616}
+    .process textarea{width: 94%;height: 42.4vw;padding: 2.7vw;resize: none;border: solid .27vw #b8bfca;}
+    textarea::placeholder{color: #9aa5b5}
+    .process>div span{color:#9aa5b5;    position: absolute;bottom: 2.7vw;right: 2.7vw;font-size: 3.2vw }
+    .process>div{position: relative}
+    .from-button{width: 93.4vw;height: 11.2vw;cursor: pointer;line-height: 11.2vw;text-align: center;color: #fff;background-color: #e15616;box-shadow: 0px .8vw 1.3vw 0px rgba(249, 75, 75, 0.17);border-radius: 2px;font-size: 3.7vw;margin: 4vw auto;}
+    .mainconten{background: #fff;	box-shadow: 0px .8vw 1.3vw 0px rgba(34, 39, 46, 0.07);padding: 5.6vw 3.5vw}
+    .sencondCont{background: #fff;	box-shadow: 0px .8vw 1.3vw 0px rgba(34, 39, 46, 0.07);padding: 3.5vw;}
+    .sencondCont p{color: #627386;font-size: 3.4vw;margin-bottom: 32px}
+    .sencondCont p span{color: #22272e;}
+    .process p:nth-child(3){margin:2.7vw 0;}
+    .sencondCont .Image img{width:25.9vw;height:25.9vw;margin-left: 2.7vw}
+    .mIcon.solve:before{width: 6.7vw;height: 6.7vw;background-position: 0px -68.8vw;position: absolute;left: 1.3vw;}
+    .mIcon.unsolved:before{ width: 6.7vw;height: 6.7vw;background-position:-30px -68.5vw;position: absolute;left: 1.3vw;}
+    .mIcon.stance:before{width: 6.3vw;height: 7.3vw;background-position:-24.8vw  -68.5vw;cursor: pointer;margin-left: 1.3vw}
+    .mIcon.changestance:before{ width: 6.3vw;height: 7.3vw;background-position: -16.5vw -68.5vw}
+    .process p label{display: block}
+    .grade{position: absolute;margin-top: 0.3vw}
+    .process p:nth-child(2){height: 13vw}
+
+}
+

+ 13 - 0
src/main/resources/static/js/common/serviceapi/repair.service.js

@@ -39,6 +39,19 @@ var RepairApi = {
             .then(function(res){
                 callback(res);
             });
+        },
+         /* 商户维修详情 */
+        CommodityRroductRepair: function (params, callback) {
+            Http.AjaxService({
+                url:'/commodity/product/repair',
+                type:'GET',
+                data:params,
+                json:false,
+                isHost:true
+            })
+            .then(function(res){
+                callback(res);
+            });
         },
         /* 维修详情 提交评论 */
        evaluation: function (params, callback) {

+ 76 - 0
src/main/resources/static/js/supplier-center/repair/detail.js

@@ -0,0 +1,76 @@
+;
+var repairDetailPage = new Vue({
+    el: "#repairDetailPage",
+    data: {
+        userId: 0,
+        currenflag:1,
+        code:'',
+        info:{},
+        params:{
+             id:'',
+             solveStatus:1,// 0未解决 1 已解决
+             serviceRating:'',//服务频分
+             serviceEvaluate:'',//服务频率
+        },
+        spanIndex:[],
+    },
+    computed: {
+
+    },
+    methods: {
+        submit:function(){ //提交评论
+            var _this = this;
+            if( _this.params.serviceRating==0){
+                CAIMEI.Alert('请评价服务态度','确定')
+            }else if( _this.params.serviceEvaluate==''){
+                CAIMEI.Alert('请输入具体评价','确定')
+            }else {
+                 RepairApi.evaluation(_this.params,function (res) {
+                    if (res.code==0){
+                        CAIMEI.dialog('提交成功');
+                        location.reload();
+                    }else {
+                       CAIMEI.Alert(response.msg,'确定',false);
+                    }
+               })
+            }
+
+        },
+        Evaluation:function (index) {
+            var _this = this;
+            _this.currenflag = index;
+            _this.params.solveStatus = index;
+        },
+        currenindex:function(index){
+            var _this = this;
+            var  arrIndex = _this.spanIndex.indexOf(index);
+             if(arrIndex>-1){
+                    _this.spanIndex.splice(arrIndex,1);
+                     _this.params.serviceRating =_this.spanIndex.length;
+                }else{
+                    _this.spanIndex.push(index);
+                    _this.params.serviceRating = _this.spanIndex.length;
+                }
+        },
+      Detailinfo:function () {
+        var _this = this;
+        RepairApi.CommodityRroductRepair({code:_this.code},function (res) {
+           if(res.code==0){
+            console.log(res)
+            _this.info = res.data
+           }
+        })
+      }
+    },
+    mounted: function () {
+        var _self=this;
+        if(globalUserData){
+            _self.userId = globalUserData.userId;
+        }
+        _self.code = CAIMEI.getUrlParam('code');
+        console.log(_self.code);
+        _self.Detailinfo();
+        $('.navLayout').find('.navList').removeClass("on").find('.con').hide().find('a').removeClass("on");
+        $('.navLayout').find('.navList').eq(0).addClass("on").find('.con').show().find('a').eq(1).addClass("on");
+    }
+});

+ 53 - 0
src/main/resources/templates/supplier-center/repair/detail.html

@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:schemaLocation="https://www.thymeleaf.org ">
+<head>
+    <title>采美365网</title>
+    <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/base/center.css(v=${version})}" rel="stylesheet" type="text/css">
+    <link th:href="@{/css/supplier-center/repair/detail.css(v=${version})}" rel="stylesheet" type="text/css">
+
+    <template th:replace="components/analysis"></template>
+</head>
+<body>
+<!-- 引用头部 -->
+<template th:replace="components/header"></template>
+<!--维修详情-->
+<div id="repairDetailPage">
+    <div class="navLayout" v-cloak>
+        <div class="wrap clear">
+            <div class="sencondCont">
+                <form>
+                     <div>
+                        <p><em>*</em>维修订单号:<span>{{info.orderNo}}</span></p>
+                        <p><em>*</em>仪器名称:<span>{{info.instrumentName}}</span></p>
+                        <p><em>*</em>生产厂家:<span>{{info.manufacturer}}</span></p>
+                        <p><em>*</em>联系人:<span>{{info.userContact}}</span></p>
+                        <p><em>*</em>联系电话:<span>{{info.userMobile}}</span></p>
+                        <p><em>*</em>联系地址:<span>{{info.provinceName}}{{info.cityName}}{{info.townName}}{{info.userAddress}}</span></p>
+                        <p class="Image">仪器图片:
+                          <span v-if="info.instrumentArr!=null"><img v-for="item in  info.instrumentArr"  :src="item"/></span>
+                        </p>
+                        <p><em>*</em>问题描述:<span>{{info.problemDescription}}</span></p>
+                        <p><em>*</em>仪器名称品牌/型号:<span>{{info.instrumentBrand}}</span></p>
+                        <p><em>*</em>维修数量:<span>{{info.maintenanceNum}}</span></p>
+                        <p v-if="info.status==3"><em>*</em>服务态度:<span class="grade">
+                                <i class="icon mIcon changestance" v-for="i in info.serviceRating"></i>
+                                 <i class="icon mIcon stance" v-for="i in 5-info.serviceRating"></i>
+                         </span></p>
+                        <p v-if="info.status==3"><em>*</em>您的评价:<span>{{info.serviceEvaluate}}</span></p>
+                     </div>
+                </form>
+                <div class="from-button" @click="submit" v-if="!isPC &&info.status!=3">提交</div>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- 引入底部 -->
+<template th:replace="components/footer"></template>
+<template th:replace="components/foot-link"></template>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/center.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/repair.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/supplier-center/repair/detail.js(v=${version})}"></script>
+</body>
+</html>