Skip to content

S
SuperMan
Commit 020c65ba authored by 黄媛媛's avatar 黄媛媛
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/luochao/superman

parents e5f20a33 f8a6556d
Show whitespace changes
Inline Side-by-side
Showing with 3712 additions and 305 deletions
src/components/TravelContractConfirm.vue
View file @ 020c65ba
<style>
/* body{
-webkit-text-size-adjust : 100% ;
-moz-text-size-adjust : 100% ;
-ms-text-size-adjust : 100% ;
text-size-adjust : 100%;
} */
*{
*{
margin:0;
padding: 0;
}
.dic_content{
}
.TCdiv_content{
-webkit-text-size-adjust : 100% ;
-moz-text-size-adjust : 100% ;
-ms-text-size-adjust : 100% ;
text-size-adjust : 100%;
}
.dic_content {width:100%;margin:0 auto;background-color: #fff;height:100%;}
.dic_content .contractLeft {width:150px;display:block;border:0;float:left;position:fixed;}
.dic_content .contractRight {width:100%;height:100%;display:block;background-color: #fff;z-index:99;}
.dic_contenttable th{padding: 8px 0;}
.dic_contenttable td{padding: 8px 0;}
.dic_content h1,.dic_content h2,.dic_content p{margin:0 auto;padding:0 10px;}
.dic_content .decoration{text-decoration: underline ;}
.dic_content .leftP{text-align: left;display:inline-block;}
.dic_content .Contract_Depart{margin:30px 0;}
}
.TCdiv_content {width:100%;margin:0 auto;background-color: #fff;height:100%;}
.TCdiv_content .contractLeft {width:150px;display:block;border:0;float:left;position:fixed;}
.TCdiv_content .contractRight {width:100%;height:100%;display:block;background-color: #fff;z-index:99;}
.TCdiv_contenttable th{padding: 8px 0;}
.TCdiv_contenttable td{padding: 8px 0;}
.TCdiv_content h1,.TCdiv_content h2,.TCdiv_content p{margin:0 auto;padding:0 10px;}
.TCdiv_content .decoration{text-decoration: underline ;}
.TCdiv_content .leftP{text-align: left;display:inline-block;}
.TCdiv_content .Contract_Depart{margin:30px 0;}
.dic_content .item_content {width:100%;height:auto;}
.dic_content .item_content .title {width:100%;text-align:center;margin-top:20px;}
.dic_content .item_content>label {width:100%;text-align:left;font-weight:bold;background-color:#F2F2F2;margin:30px 0;padding:8px 0;text-indent:20px;display:inline-block;font-size:16px;}
.dic_content .item_content>span{font-size:1.5rem;line-height:26px;margin-left:10px;}
.dic_content .item_content .content_table {border:1px solid #d1d1d1;margin-top:10px;width:100%;text-align: center;font-size:1.8rem}
.dic_content .item_content .content_table th {background-color:#F2F2F2;}
.dic_content .item_content .content_table th,.dic_content .item_content .content_table td {border:1px solid #808080;text-align:center;padding:10px;}
.dic_content .item_content font {color:blue;display:inline-block;padding:0 10px; font-size: 1.5rem}
.dic_content .content_table font{min-width:0;}
.TCdiv_content .item_content {width:100%;height:auto;}
.TCdiv_content .item_content .title {width:100%;text-align:center;margin-top:20px;}
.TCdiv_content .item_content>label {width:100%;text-align:left;font-weight:bold;background-color:#F2F2F2;margin:30px 0;padding:8px 0;text-indent:20px;display:inline-block;font-size:16px;}
.TCdiv_content .item_content>span{font-size:1.5rem;line-height:26px;margin-left:10px;}
.TCdiv_content .item_content .content_table {border:1px solid #d1d1d1;margin-top:10px;width:100%;text-align: center;font-size:1.8rem}
.TCdiv_content .item_content .content_table th {background-color:#F2F2F2;}
.TCdiv_content .item_content .content_table th,.TCdiv_content .item_content .content_table td {border:1px solid #808080;text-align:center;padding:10px;}
.TCdiv_content .item_content font {color:blue;display:inline-block;padding:0 10px; font-size: 1.8rem}
.TCdiv_content .content_table font{min-width:0;}
.dic_content .float_div {position:fixed;bottom:0;line-height:50px;background-color:#F2F2F2;width:1190px;padding-left:10px;height:50px;display:block;vertical-align:middle;text-align:match-parent;}
.dic_content .leftSign{float:left;width:50%;margin:70px 0;height:auto;line-height:45px;}
.dic_content .rightSign{float:right;width:49%;height:auto;margin:70px 0;line-height:45px;}
.dic_content .leftSign span{display:inline-block;width:170px;text-align:right;}
.dic_content .rightSign span{display:inline-block;width:170px;text-align:right;}
.dic_content .addressCommon{display:inline-block;width:300px; display:inline-block; vertical-align:top;text-align:left;}
.dic_content .shouquanNum{font-weight:bold;}
.dic_content .zhangTitle{height:90px;font-size:16px;font-weight:bold;line-height:90px!important;}
.dic_content .toTopDistance{margin-top:15px;}
.dic_content .travelDan td{border:none!important;text-align:left;text-indent:20px;padding:10px 0;}
.dic_content .travelDan{padding:50px 0;}
.dic_content .zhangOne{position:absolute;width:200px;top:-83px;left:160px;}
.dic_content .zhangTwo{position:absolute;width:200px;top:-60px;left:80px;}
.dic_content .comonTb td{padding:15px 0;}
.dic_content .remindInfo{position:absolute;top:42%;left:35%;font-size:60px;color:#FF7F7F;letter-spacing:20px;}
.dic_content .signName{position:relative;top:10px;width:140px;}
.dic_content .LRTB td:nth-child(odd){text-align:right;padding:10px;height:50px;border:1px solid #d1d1d1;}
.dic_content .LRTB td:nth-child(even){text-align:left;padding:10px;height:50px;border:1px solid #d1d1d1;}
.dic_content .shouquanNum{
.TCdiv_content .float_div {position:fixed;bottom:0;line-height:50px;background-color:#F2F2F2;width:1190px;padding-left:10px;height:50px;display:block;vertical-align:middle;text-align:match-parent;}
.TCdiv_content .leftSign{float:left;width:50%;margin:70px 0;height:auto;line-height:45px;}
.TCdiv_content .rightSign{float:right;width:49%;height:auto;margin:70px 0;line-height:45px;}
.TCdiv_content .leftSign span{display:inline-block;width:170px;text-align:right;}
.TCdiv_content .rightSign span{display:inline-block;width:170px;text-align:right;}
.TCdiv_content .addressCommon{display:inline-block;width:300px; display:inline-block; vertical-align:top;text-align:left;}
.TCdiv_content .shouquanNum{font-weight:bold;}
.TCdiv_content .TC_ZhangTitle{height:90px;font-size:20rem;font-weight:bold;line-height:90px!important;}
.TCdiv_content .toTopDistance{margin-top:15px;}
.TCdiv_content .travelDan td{border:none!important;text-align:left;text-indent:20px;padding:10px 0;}
.TCdiv_content .travelDan{padding:50px 0;}
.TCdiv_content .zhangOne{position:absolute;width:200px;top:-83px;left:160px;}
.TCdiv_content .zhangTwo{position:absolute;width:200px;top:-60px;left:80px;}
.TCdiv_content .comonTb td{padding:15px 0;}
.TCdiv_content .remindInfo{position:absolute;top:42%;left:35%;font-size:60px;color:#FF7F7F;letter-spacing:20px;}
.TCdiv_content .signName{position:relative;top:10px;width:140px;}
.TCdiv_content .LRTB td:nth-child(odd){text-align:right;padding:10px;height:50px;border:1px solid #d1d1d1;}
.TCdiv_content .LRTB td:nth-child(even){text-align:left;padding:10px;height:50px;border:1px solid #d1d1d1;}
.TCdiv_content .shouquanNum{
margin:30px 0!important;
font-weight: bold;
}
#canvas {
width: 100%;
height: 100%;
/* position: relative; */
}
#canvas canvas {
display: block;
......@@ -71,7 +63,6 @@
border:1px solid #d1d1d1;
width:100%;
background-color: #fff;
/* height:500px; */
z-index: 999;
margin:auto;
display: block;
......@@ -109,7 +100,7 @@
.ClientTravelTable td{
border:1px solid #d1d1d1;
}
.dic_content .TipsDiv {
.TCdiv_content .TipsDiv {
background: #fff;
width: 75%;
margin: 0 auto;
......@@ -117,7 +108,7 @@
padding: 2rem 0;
margin-top:20rem;
}
.dic_content .TipsDiv .readSpan{
.TCdiv_content .TipsDiv .readSpan{
display: inline-block;
background-color: #24ade5;
border-radius: 5px;
......@@ -129,10 +120,10 @@
margin-top: 1rem;
}
.dic_content .TipsDiv li{
.TCdiv_content .TipsDiv li{
list-style: none;
}
.dic_content .TipTc{
.TCdiv_content .TipTc{
width: 100%;
height: 100%;
position: fixed;
......@@ -141,7 +132,7 @@
left: 0;
z-index: 1000;
}
.dic_content .signSpan{
.TCdiv_content .signSpan{
position: fixed;
bottom: 0;
width: 100%;
......@@ -150,7 +141,7 @@
border-top:1px solid #ccc;
z-index: 1000;
}
.dic_content .signSpan .sign{
.TCdiv_content .signSpan .sign{
width: 75%;
margin:0 auto;
......@@ -159,7 +150,7 @@
cursor: pointer;
}
.dic_content .signSpan .sign .sp1{
.TCdiv_content .signSpan .sign .sp1{
display: inline-block;
width: 25px;
height: 25px;
......@@ -168,22 +159,22 @@
background-position: 52px 29px;
}
.dic_content li{
.TCdiv_content li{
list-style: none;
}
.dic_content .navHidden{
.TCdiv_content .navHidden{
width: 100%;
overflow: hidden;
height:5rem;
}
.dic_content .navHidden .wrap{
.TCdiv_content .navHidden .wrap{
width:100%;
height:6rem;
overflow-x:scroll;
overflow-y:hidden;
}
.dic_content .navHidden .Navul{
.TCdiv_content .navHidden .Navul{
width: 113rem;
padding: 0;
display:flex;
......@@ -192,7 +183,7 @@
margin: 0;
border-bottom: 1px solid #ccc;
}
.dic_content .navHidden .Navul li{
.TCdiv_content .navHidden .Navul li{
display: inline-block;
margin-left:1rem;
box-sizing:border-box;
......@@ -200,13 +191,13 @@
font-size: 2rem;
cursor: pointer;
}
.dic_content .SignbgDiv{
.TCdiv_content .SignbgDiv{
position: relative;
width: 100%;
padding-bottom:10rem;
padding-top:10rem;
}
.dic_content .SignbgDiv .signContent{
.TCdiv_content .SignbgDiv .signContent{
overflow: hidden;
position: relative;
height: 100%;
......@@ -214,56 +205,56 @@
.navHidden .ActiveLi{
border-bottom:2px solid #24ade5;
}
.dic_content .guestUl li{
.TCdiv_content .guestUl li{
padding:10px 6px;
box-sizing: border-box;
border-bottom: 1px solid #ddd;
font-size:1.8rem;
}
.dic_content .guestUl li:nth-child(even){
.TCdiv_content .guestUl li:nth-child(even){
background: #f5f5f5;
}
.dic_content .NavFixed{
.TCdiv_content .NavFixed{
position: fixed;
top: 0;
width:100%;
z-index: 200;
background: #fff;
}
.dic_content .gzqzUl li{
.TCdiv_content .gzqzUl li{
border-bottom: 1px solid #ddd;
padding:14px;
position: relative;
box-sizing: border-box;
}
.dic_content .gzqzUl li .signImg{
.TCdiv_content .gzqzUl li .signImg{
position: absolute;
left:45%;
z-index: 200;
}
.dic_content .gzqzUl li .el-col:nth-child(2){
.TCdiv_content .gzqzUl li .el-col:nth-child(2){
text-align: right;
}
.dic_content .gzqzUl .bgli{
.TCdiv_content .gzqzUl .bgli{
background: #eee;
width: 100%;
padding: 0!important;
height:20px;
}
.dic_content .SignbgDiv p{
.TCdiv_content .SignbgDiv p{
font-size:1.8rem;
}
.dic_content .gzqzUl li{
.TCdiv_content .gzqzUl li{
font-size:1.8rem;
}
.dic_content .TcTravel_Table{
.TCdiv_content .TcTravel_Table{
width: 100%;
border: none;
border-collapse: collapse;
border-spacing: 0;
font-size: 1.8rem;
}
.dic_content .TcTravel_Table td{
.TCdiv_content .TcTravel_Table td{
border: 1px solid rgb(0, 0, 0);
word-break: break-all;
padding:5px;
......@@ -329,12 +320,16 @@
top: 50%;
font-size: 2rem;
}
.TouristTable td{
text-align: center;
}
</style>
<template>
<div>
<template v-if="CtObj.CType==1">
<div class="dic_content" :class="dialogVisible?'CisHideen':''">
<div class="TCdiv_content" :class="dialogVisible?'CisHideen':''">
<!-- 签字 -->
<div class="signSpan">
<div @click="dialogVisible=true" :class="dialogVisible?'CisHideen':''" class="sign">
......@@ -715,7 +710,7 @@
</div>
</template>
<template v-if="CtObj.CType==2">
<div class="dic_content" :class="dialogVisible?'CisHideen':''">
<div class="TCdiv_content" :class="dialogVisible?'CisHideen':''">
<!-- 签字 -->
<div class="signSpan">
<div @click="dialogVisible=true" :class="dialogVisible?'CisHideen':''" class="sign">
......@@ -779,7 +774,7 @@
</p>
<p>旅行社：<font>{{dataList.company}}</font></p>
<p>旅行社业务经营许可证编号：<font>{{dataList.businessCertificate}}</font></p>
<h3><p class="zhangTitle">第一章&nbsp;&nbsp;术语和定义</p></h3>
<h3><p class="TC_ZhangTitle">第一章&nbsp;&nbsp;术语和定义</p></h3>
<h3><p>第一条&nbsp;&nbsp;本合同术语和定义</p></h3>
<p>1、团队境内旅游服务，指旅行社依据《中华人民共和国旅游法》、《旅行社条例》等法律、法规，组织旅游者在中华 人民共和国境内（不含香港、澳门、台湾地区）旅游，代订公共交通客票，提供餐饮、住宿、游览等两项以上服务活动。</p>
<p>2、旅游费用，指旅游者支付给旅行社，用于购买本合同约定的旅游服务的费用。</p>
......@@ -809,7 +804,7 @@
<p>14、已尽合理注意义务仍不能避免的事件，指因当事人故意或者过失以外的客观因素引发的事件，包括但不限于重大 礼宾活动导致的交通堵塞，飞机、火车、班轮、城际客运班车等公共客运交通工具延误或者取消，景点临时不开放。</p>
<p>15、必要的费用，指旅行社履行合同已经发生的费用以及向地接社或者履行辅助人支付且不可退还的费用，包括乘坐 飞机（车、船）等交通工具的费用（含预订金）、饭店住宿费用（含预订金）、旅游观光汽车的人均车租等。</p>
<p>16、公共交通经营者，指航空、铁路、航运客轮、城市公交、地铁等公共交通工具经营者。</p>
<h3><p class="zhangTitle">第二章&nbsp;&nbsp;合同的订立</p></h3>
<h3><p class="TC_ZhangTitle">第二章&nbsp;&nbsp;合同的订立</p></h3>
<h3><p>第二条&nbsp;&nbsp;旅游行程单</p></h3>
<p>旅行社应当提供带团号的《旅游行程单》（以下简称《行程单》），经双方签字或者盖章确认后作为本合同的组成部 分。《行程单》应当对如下内容作出明确的说明：</p>
<p>（1）旅游行程的出发地、途经地、目的地、结束地，线路行程时间和具体安排（按自然日计算，含乘飞机、车、船等 在途时间，不足24小时以一日计）；</p>
......@@ -826,7 +821,7 @@
<p>由旅游者的代理人订立合同的，代理人需要出具被代理的旅游者的授权委托书。</p>
<h3><p class="toTopDistance">第四条&nbsp;&nbsp;旅游广告及宣传品</p></h3>
<p>旅行社的旅游广告及宣传品应当遵循诚实信用的原则，其内容符合《中华人民共和国合同法》要约规定的，视为本合 同的组成部分，对旅行社和旅游者双方具有约束力。</p>
<h3><p class="zhangTitle">第三章&nbsp;&nbsp;合同双方的权利义务</p></h3>
<h3><p class="TC_ZhangTitle">第三章&nbsp;&nbsp;合同双方的权利义务</p></h3>
<h3><p>第五条&nbsp;&nbsp;旅行社的权利</p></h3>
<p>1、根据旅游者的身体健康状况及相关条件决定是否接纳旅游者报名参团；</p>
<p>2、核实旅游者提供的相关信息资料；</p>
......@@ -867,7 +862,7 @@
<p>6、妥善保管自己的行李物品，随身携带现金、有价证券、贵重物品，不在行李中夹带；</p>
<p>7、在旅游活动中或者在解决纠纷时，应采取措施防止损失扩大，不损害当地居民的合法权益；不干扰他人的旅游活 动；不损害旅游经营者和旅游从业人员的合法权益，不采取拒绝上、下机（车、船）、拖延行程或者脱团等不当行为；</p>
<p>8、自行安排活动期间，应当在自己能够控制风险的范围内选择活动项目，遵守旅游活动中的安全警示规定，并对自己 的安全负责。</p>
<h3><p class="zhangTitle">第四章&nbsp;&nbsp;合同的变更与转让</p></h3>
<h3><p class="TC_ZhangTitle">第四章&nbsp;&nbsp;合同的变更与转让</p></h3>
<h3><p>第九条&nbsp;&nbsp;合同的变更</p></h3>
<p>1、旅行社与旅游者双方协商一致，可以变更本合同约定的内容，但应当以书面形式由双方签字确认。由此增加的旅游 费用及给对方造成的损失，由变更提出方承担；由此减少的旅游费用，旅行社应当退还旅游者。</p>
<p>2、行程开始前遇到不可抗力或者旅行社、履行辅助人已尽合理注意义务仍不能避免的事件的，双方经协商可以取消行 程或者延期出行。取消行程的，按照本合同第十四条处理；延期出行的，增加的费用由旅游者承担，减少的费用退还旅游 者。</p>
......@@ -882,7 +877,7 @@
<p>当旅行社组团未达到约定的成团人数不能成团时，旅游者可以与旅行社就如下安排在本合同第二十三条中做出约定。</p>
<p>1、转团：旅行社可以在保证所承诺的服务内容和标准不降低的前提下，经事先征得旅游者书面同意，委托其他旅行社 履行合同，并就受委托出团的旅行社违反本合同约定的行为先行承担责任，再行追偿。旅游者和受委托出团的旅行社另行 签订合同的，本合同的权利义务终止。</p>
<p>2、延期出团和改变线路出团：旅行社经征得旅游者书面同意，可以延期出团或者改变其他线路出团，因此增加的费用 由旅游者承担，减少的费用旅行社予以退还。需要时可以重新签订旅游合同。</p>
<h3><p class="zhangTitle">第五章&nbsp;&nbsp;合同的解除</p></h3>
<h3><p class="TC_ZhangTitle">第五章&nbsp;&nbsp;合同的解除</p></h3>
<h3><p>第十二条&nbsp;&nbsp;旅行社解除合同</p></h3>
<p>1、未达到约定的成团人数不能成团时，旅行社解除合同的，应当采取书面等有效形式。旅行社在行程开始前7日（按 照出发日减去解除合同通知到达日的自然日之差计算，下同）以上（含第7日，下同）提出解除合同的，不承担违约责任， 旅行社向旅游者退还已收取的全部旅游费用；旅行社在行程开始前7日以内（不含第7日，下同）提出解除合同的，除向旅 游者退还已收取的全部旅游费用外，还应当按本合同第十七条第1款的约定，承担相应的违约责任。</p>
<p>2、旅游者有下列情形之一的，旅行社可以解除合同：</p>
......@@ -910,7 +905,7 @@
<p>解除合同的，旅行社扣除必要的费用后，应当在解除合同通知到达日起5个工作日内为旅游者办结退款手续。</p>
<h3><p class="toTopDistance">第十六条&nbsp;&nbsp;旅行社协助旅游者返程及费用承担</p></h3>
<p>旅游行程中解除合同的，旅行社应协助旅游者返回出发地或者旅游者指定的合理地点。因旅行社或者履行辅助人的原 因导致合同解除的，返程费用由旅行社承担；行程中按照本合同第十二条第2款，第十三条第2款约定解除合同的，返程费 用由旅游者承担；按照本合同第十四条约定解除合同的，返程费用由双方分担。</p>
<h3><p class="zhangTitle">第六章&nbsp;&nbsp;违约责任</p></h3>
<h3><p class="TC_ZhangTitle">第六章&nbsp;&nbsp;违约责任</p></h3>
<h3><p>第十七条&nbsp;&nbsp;旅行社的违约责任</p></h3>
<p>1、旅行社在行程开始前7日以内提出解除合同的，或者旅游者在行程开始前7日以内收到旅行社不能成团通知，不同意 转团、延期出行和改签线路解除合同的，旅行社向旅游者退还已收取的全部旅游费用，并按下列标准向旅游者支付违约 金：</p>
<p>行程开始前6日至4日，支付旅游费用总额10% 的违约金；</p>
......@@ -936,7 +931,7 @@
<p>2、旅游者在自行安排活动期间人身、财产权益受到损害的，旅行社在事前已尽到必要警示说明义务且事后已尽到必要 救助义务的，旅行社不承担赔偿责任。</p>
<p>3、由于第三方侵害等不可归责于旅行社的原因导致旅游者人身、财产权益受到损害的，旅行社不承担赔偿责任。但因 旅行社不履行协助义务致使旅游者人身、财产权益损失扩大的，旅行社应当就扩大的损失承担赔偿责任。</p>
<p>4、由于公共交通经营者的原因造成旅游者人身损害、财产损失依法应承担责任的，旅行社应当协助旅游者向公共交通 经营者索赔。</p>
<h3><p class="zhangTitle">第七章&nbsp;&nbsp;协议条款</p></h3>
<h3><p class="TC_ZhangTitle">第七章&nbsp;&nbsp;协议条款</p></h3>
<h3><p>第二十条&nbsp;&nbsp;线路行程时间</p></h3>
<p>
出发时间 <font>{{getDate(CtObj.C_StartDate)}}</font>
......@@ -1294,7 +1289,7 @@
</div>
</template>
<template v-if="CtObj.CType==3">
<div class="dic_content" :class="dialogVisible?'CisHideen':''">
<div class="TCdiv_content" :class="dialogVisible?'CisHideen':''">
<!-- 签字 -->
<div class="signSpan">
<div @click="dialogVisible=true" :class="dialogVisible?'CisHideen':''" class="sign">
......@@ -1496,7 +1491,7 @@
消费者协会投诉电话{{CtObj.C_XFZXHTSTel}}。
</p>
<p>协商或投诉调解不成的，按下列第 <font>{{CtObj.C_SolveType}}</font>种方式解决：</p>
<p>1.将争议提交<span>&nbsp;&nbsp;\&nbsp;&nbsp;</span>仲裁委员会仲裁；</p>
<p>1.将争议提交<font>{{CtObj.C_SolveRemark}}</font>仲裁委员会仲裁；</p>
<p>2.依法向人民法院提起民事诉讼。</p>
<h3>其他约定</h3>
<div style="border: 1px solid #000;min-height: 300px;padding:5px; ">
......@@ -1616,14 +1611,14 @@
</div>
<!--游客名单-->
<div v-show="ActiveTab==5" class="item_content">
<h3>游客名单</h3>
<table class="ZTable">
<h3 style="font-size:2rem;margin:1rem;">游客名单</h3>
<table class="ZTable TouristTable" style="width:100%;font-size:1.8rem;">
<tbody>
<tr>
<td width="10%">序号</td>
<td width="15%">姓名</td>
<td width="8%">序号</td>
<td width="10%">姓名</td>
<td width="10%">性别</td>
<td width="10%">证件类型</td>
<td width="12%">证件类型</td>
<td width="20%">证件号码</td>
<td width="20%">联系方式</td>
<td width="15%">身体状况</td>
......@@ -1654,16 +1649,16 @@
</div>
<!-- 团队行程 -->
<div v-show="ActiveTab==6" class="item_content">
<h3>团队行程</h3>
<table class="ZTable">
<h3 style="font-size:2rem;margin:1rem;">团队行程</h3>
<table class="ZTable" style="width:100%;font-size:1.8rem;">
<tbody>
<tr>
<td width="10%">团号</td>
<td width="36%"><span>{{CtObj.C_TCNUM}}</span></td>
<td width="15%">团号</td>
<td width="25%"><span>{{CtObj.C_TCNUM}}</span></td>
<td width="12%">出团日期</td>
<td width="15%"><span>{{CtObj.C_StartDate}}</span></td>
<td width="18%"><span>{{getDate(CtObj.C_StartDate)}}</span></td>
<td width="12%">返回日期</td>
<td width="15%"><span>{{CtObj.C_EndDate}}</span></td>
<td width="15%"><span>{{getDate(CtObj.C_EndDate)}}</span></td>
</tr>
<tr>
<td>线路名称</td>
......@@ -1705,7 +1700,7 @@
<td>{{item.TouristsSignAgree}}</td>
</tr>
</table>
<div style="font-size:1.5rem;">
<div style="font-size:1.8rem;margin:1rem 0;">
旅行社经办人签名：<font>{{CtObj.Tourists_Name}}</font>
</div>
</div>
......@@ -1754,7 +1749,7 @@
<p>旅行社业务经营许可证编号：<font>{{dataList.businessCertificate}}</font>
</p>
<h3>
<p class="zhangTitle">第一章&nbsp;&nbsp;术语和定义</p>
<p class="TC_ZhangTitle">第一章&nbsp;&nbsp;术语和定义</p>
</h3>
<h3>
<p>第一条&nbsp;&nbsp;本合同术语和定义</p>
......@@ -1804,7 +1799,7 @@
包括乘坐飞机（车、船）等交通工具的费用（含预订金）、旅游签证/签注费用、饭店住宿费用（含预订金）、旅游观光汽车的人均车租等。</p>
<p>16.公共交通经营者，指航空、铁路、航运客轮、城市公交、地铁等公共交通工具经营者。</p>
<h3>
<p class="zhangTitle">第二章&nbsp;&nbsp;合同的订立</p>
<p class="TC_ZhangTitle">第二章&nbsp;&nbsp;合同的订立</p>
</h3>
<h3>
<p>第二条&nbsp;&nbsp;旅游行程单</p>
......@@ -1831,7 +1826,7 @@
</h3>
<p>出境社的旅游广告及宣传品应当遵循诚实信用的原则，其内容符合《中华人民共和国合同法》要约规定的，视为本合同的组成部分，对出境社和旅游者双方具有约束力。</p>
<h3>
<p class="zhangTitle">第三章&nbsp;&nbsp;合同双方的权利义务</p>
<p class="TC_ZhangTitle">第三章&nbsp;&nbsp;合同双方的权利义务</p>
</h3>
<h3>
<p>第五条&nbsp;&nbsp;出境社的权利</p>
......@@ -1893,7 +1888,7 @@
</p>
<p>10.在自行安排活动期间，应当在自己能够控制风险的范围内选择活动项目，遵守旅游活动中的安全警示规定，对自己的安全负责。</p>
<h3>
<p class="zhangTitle">第四章&nbsp;&nbsp;合同的变更与转让</p>
<p class="TC_ZhangTitle">第四章&nbsp;&nbsp;合同的变更与转让</p>
</h3>
<h3>
<p>第九条&nbsp;&nbsp;合同的变更</p>
......@@ -1920,7 +1915,7 @@
</p>
<p>2.延期出团或者改签线路出团：出境社经征得旅游者书面同意，可以延期出团或者改签其他线路出团，因此增加的费用由旅游者承担，减少的费用出境社予以退还。需要时可以重新签订旅游合同。</p>
<h3>
<p class="zhangTitle">第五章&nbsp;&nbsp;合同的解除</p>
<p class="TC_ZhangTitle">第五章&nbsp;&nbsp;合同的解除</p>
</h3>
<h3>
<p>第十二条&nbsp;&nbsp;出境社解除合同</p>
......@@ -1972,7 +1967,7 @@
旅游行程中解除合同的，出境社应协助旅游者返回出发地或者旅游者指定的合理地点。因旅行社或者履行辅助人的原因导致合同解除的，返程费用由出境社承担；行程中按照本合同第十二条第2款，第十三条第2款约定解除合同的，返程费用由旅游者承担；按照本合同第十四条约定解除合同的，返程费用由双方分担。
</p>
<h3>
<p class="zhangTitle">第六章&nbsp;&nbsp;违约责任</p>
<p class="TC_ZhangTitle">第六章&nbsp;&nbsp;违约责任</p>
</h3>
<h3>
<p>第十七条&nbsp;&nbsp;出境社的违约责任</p>
......@@ -2018,7 +2013,7 @@
<p>4.由于第三方侵害等不可归责于出境社的原因导致旅游者人身、财产权益受到损害的，出境社不承担赔偿责任。但因出境社不履行协助义务致使旅游者人身、财产权益损失扩大的，应当就扩大的损失承担赔偿责任。</p>
<p>5.由于公共交通经营者的原因造成旅游者人身损害、财产损失依法应承担责任的，出境社应当协助旅游者向公共交通经营者索赔。</p>
<h3>
<p class="zhangTitle">第七章&nbsp;&nbsp;协议条款</p>
<p class="TC_ZhangTitle">第七章&nbsp;&nbsp;协议条款</p>
</h3>
<h3>
<p>第二十条&nbsp;&nbsp;线路行程时间</p>
......@@ -2679,7 +2674,7 @@
dialogVisible:false,
showCanvas:false,
linewidth: 3, //线条粗细，选填
linewidth: 10, //线条粗细，选填
color: "black", //线条颜色，选填
background: "#fff", //线条背景，选填
dataList:[],
......@@ -3227,7 +3222,8 @@
el.appendChild(canvas);
canvas.width = el.clientWidth;
canvas.height = el.clientHeight;
cxt.fillStyle = this.background; //填充绘图的背景颜色
//cxt.fillStyle = this.background; //填充绘图的背景颜色
cxt.fillStyle='rgba(255, 255, 255, 0)';
cxt.fillRect(0, 0, canvas.width, canvas.height); //绘制“已填色”的矩形
cxt.strokeStyle = this.color; //笔触的颜色
cxt.lineCap = "round"; //线条末端线帽的样式
......@@ -3279,6 +3275,7 @@
if (res.data.resultCode == 1) {
this.dialogVisible=false;
this.getList();
this.handelClearEl();
}
},
err => {}
......
src/components/TravelContractView.vue 0 → 100644
View file @ 020c65ba
This source diff could not be displayed because it is too large. You can view the blob instead.
src/components/activity/pushManagement.vue
View file @ 020c65ba
......@@ -194,11 +194,11 @@ export default {
return {
modeList: [
{
name: "小程序",
name: "APP",
id: 1
},
{
name: "APP",
name: "小程序",
id: 2
}
],
......
src/components/administrative/ContractManage.vue
View file @ 020c65ba
......@@ -87,10 +87,10 @@
<el-select v-model="msg.Status" :placeholder="$t('pub.pleaseSel')">
<el-option label="请选择" :value="-1" :key="-1"> </el-option>
<el-option label="草稿" :value="0" :key="0"> </el-option>
<el-option label="已取消" :value="1" :key="1"> </el-option>
<el-option label="已提交" :value="2" :key="2"> </el-option>
<el-option label="已盖章" :value="3" :key="3"> </el-option>
<el-option label="已签字" :value="4" :key="4"> </el-option>
<el-option label="提交审核" :value="1" :key="1"> </el-option>
<el-option label="审核通过" :value="2" :key="2"> </el-option>
<el-option label="驳回" :value="3" :key="3"> </el-option>
<el-option label="取消" :value="4" :key="4"> </el-option>
</el-select>
</span>
</li>
......@@ -118,12 +118,6 @@
</el-dropdown-menu>
</el-dropdown>
</li>
<!-- <li>
<input type="button" @click="goContract('onedayTripContract', 0, '一日游合同')" class="normalBtn" value="一日游合同" />
<input type="button" @click="goContract('DomesticTravelcontract', 0, '境内旅游合同')" class="normalBtn"
value="境内旅游合同" />
<input type="button" @click="goContract('SingleContract', 0, '单项委托合同')" class="normalBtn" value="单项委托合同" />
</li> -->
</ul>
</div>
<table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
......@@ -165,7 +159,7 @@
<td>{{ item.CreateByName }}</td>
<td>{{ item.CreateTimeStr }}</td>
<td>
<el-tooltip class="item" effect="dark" content="修改" placement="top-start">
<el-tooltip class="item" effect="dark" content="修改" placement="top-start" v-if="item.Status==0||item.Status==3">
<template v-if="item.CType == 3">
<el-button type="primary" icon="el-icon-edit" circle
@click="goContract('onedayTripContract', item.ID, '一日游合同')"></el-button>
......@@ -184,19 +178,23 @@
<el-button type="warning" icon="iconfont icon-copy" circle @click="CopyContract(item)" style="padding:4px;">
</el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="下载" placement="top-start">
<el-tooltip class="item" effect="dark" content="下载" placement="top-start" v-if="item.Status==2">
<el-button type="success" icon="el-icon-download" circle @click="DownLoadContract(item)"></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="提交并盖章" placement="top-start">
<el-tooltip class="item" effect="dark" content="提交审核" placement="top-start" v-if="item.Status==0">
<el-button type="info" icon="el-icon-upload2" circle @click="SubmitContract(item)"></el-button>
</el-tooltip>
<el-tooltip class="item" v-if="item.Status==2" effect="dark" content="复制链接发送给客户" placement="top-start">
<el-tooltip class="item" v-if="item.Status==2" effect="dark" content="复制链接发送给客户">
<el-button type="info" icon="iconfont icon-copy-l" circle @click="CopyUrl(item)" style="padding:4px;background-color:#9266f9;border-color:#9266f9;"></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="取消" placement="top-start">
<el-tooltip class="item" effect="dark" content="取消" placement="top-start" v-if="item.Status==0">
<el-button type="danger" icon="el-icon-close" circle @click="DeleteContract(item)"></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="查看" placement="top-start">
<el-button type="danger" icon="iconfont icon-chakan" circle @click="ViewContract(item)" style="padding:4px;"></el-button>
</el-tooltip>
</td>
</tr>
</table>
......@@ -257,7 +255,7 @@
that.apipost(
"travelcontract_post_UpdateTravelContractStatusService", {
ID: item.ID,
Status: 2
Status: 1
},
res => {
if (res.data.resultCode == 1) {
......@@ -351,7 +349,7 @@
this.Confirm("是否取消此合同?", function () {
var msg = {
ID: item.ID,
Status: 1
Status: 4
};
that.apipost(
"travelcontract_post_UpdateTravelContractStatusService",
......@@ -404,6 +402,17 @@
this.msg.pageIndex = val;
this.getList();
},
ViewContract(item)
{
this.$router.push({
name: "TravelContractView",
query: {
id: item.ID,
blank: "y",
tab: '预览合同'
}
});
},
goContract(path, Id, title) {
var nId = 0;
if (Id && Id > 0) {
......
src/components/administrative/ElectronicAudit.vue
View file @ 020c65ba
<style>
.ElectronicAudit .icon-shenhebohui{
color:#fff;
}
.ElectronicAudit .icon-shenhebohui {
color: #fff;
}
.ContractManage .query-box .el-button--primary {
background-color: #fff !important;
color: #e95252 !important;
border-color: #e95252 !important;
}
.ContractManage .query-box .el-button--primary:focus,
.query-box .el-button--primary:hover {
background-color: #fff !important;
color: #e95252 !important;
border-color: #e95252 !important;
}
.ContractManage .query-box .el-button {
border-radius: 16px;
height: 30px;
position: relative;
top: 5px;
}
.ContractManage .query-box .el-button i {
color: #e95252;
}
.ContractManage .query-box .el-button span {
position: relative;
top: -3px;
}
.ContractManage .el-button+.el-button {
margin-left: 0 !important;
}
.newContract .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
border-bottom-color: #f5f5f5;
}
</style>
<template>
<div class="flexOne ElectronicAudit">
<div class="flexOne newContract">
<el-tabs v-model="activeName" type="card" @tab-click="getSwitch">
<el-tab-pane label="出境游合同" name="1"></el-tab-pane>
<el-tab-pane label="其他合同" name="2"></el-tab-pane>
</el-tabs>
<template v-if="activeName==1">
<div class="ElectronicAudit">
<div class="query-box">
<ul>
<li>
<span>
<em>合同编号</em>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.contractNum" @keyup.native.enter="getList" class="w210"></el-input>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.contractNum" @keyup.native.enter="getList"
class="w210"></el-input>
</span>
</li>
<li>
<span>
<em>产品名称</em>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.productName" @keyup.native.enter="getList" class="w210"></el-input>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.productName" @keyup.native.enter="getList"
class="w210"></el-input>
</span>
</li>
<li>
<span>
<em>订单号</em>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.orderID" @keyup.native.enter="getList" class="w210"></el-input>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.orderID" @keyup.native.enter="getList"
class="w210"></el-input>
</span>
</li>
<li>
<span>
<em>团号</em>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.tcid" @keyup.native.enter="getList" class="w210"></el-input>
<el-input :placeholder="$t('system.ph_in')" v-model="msg.tcid" @keyup.native.enter="getList"
class="w210"></el-input>
</span>
</li>
<li>
......@@ -58,7 +106,7 @@
</li>
</ul>
</div>
<div class="commonContent" v-loading="loading">
<div class="commonContent" v-loading="loadingOut">
<table class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>合同编号</th>
......@@ -70,7 +118,7 @@
<th>状态</th>
<th width="200">操作</th>
</tr>
<tr v-for="item in dataList">
<tr v-for="item in dataListOut">
<td>{{item.contractNum}}</td>
<td>{{item.orderId}}</td>
<td>{{item.tcid}}</td>
......@@ -96,7 +144,8 @@
<el-button type="primary" icon="iconfont icon-shenpi" @click="AuditElec(item,2)" circle></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="驳回" placement="top-start">
<el-button type="danger" v-if="item.auditContract!=3" icon="iconfont icon-shenhebohui" @click="AuditElec(item,3)" circle></el-button>
<el-button type="danger" v-if="item.auditContract!=3" icon="iconfont icon-shenhebohui"
@click="AuditElec(item,3)" circle></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="查看" placement="top-start">
<el-button type="danger" icon="iconfont icon-chakan" @click="goToDetail(item)" circle></el-button>
......@@ -105,30 +154,172 @@
</td>
</tr>
</table>
<div class="noData" v-show="dataList.length<1">
<div class="noData" v-show="dataListOut.length<1">
<i class="iconfont icon-kong" style="font-size:100px;"></i>
<p>{{$t("active.ld_noData")}}</p>
</div>
</div>
</div>
</template>
<template v-else>
<div class="ContractManage">
<div class="query-box">
<ul>
<li>
<span><em>合同编号</em>
<el-input class="w210" v-model="msg.T_ContractNum" placeholder="请输入合同编号" @keyup.enter.native="getList">
</el-input>
</span>
</li>
<li>
<span><em>合同类型</em>
<el-select v-model="msg.CType" :placeholder="$t('pub.pleaseSel')">
<el-option label="请选择" :value="0" :key="0"> </el-option>
<el-option label="单向委托合同" :value="1" :key="1"> </el-option>
<el-option label="境内旅游合同" :value="2" :key="2"> </el-option>
<el-option label="一日游合同" :value="3" :key="3"> </el-option>
</el-select>
</span>
</li>
<li>
<span><em>甲方名称</em>
<el-input class="w210" v-model="msg.Tourists_Name" placeholder="请输入客户名称" @keyup.enter.native="getList">
</el-input>
</span>
</li>
<li>
<span><em>客户电话</em>
<el-input class="w210" v-model="msg.Tourists_Tel" placeholder="请输入客户电话" @keyup.enter.native="getList">
</el-input>
</span>
</li>
<li>
<span><em>团号</em>
<el-input class="w210" v-model="msg.C_TCNUM" placeholder="请输入团号" @keyup.enter.native="getList">
</el-input>
</span>
</li>
<li>
<span><em>线路名称</em>
<el-input class="w210" v-model="msg.C_ProductName" placeholder="请输入线路名称" @keyup.enter.native="getList">
</el-input>
</span>
</li>
<li>
<span><em>经办人</em>
<el-input class="w210" v-model="msg.TravelAgency_DealMan" placeholder="请输入经办人"
@keyup.enter.native="getList">
</el-input>
</span>
</li>
<li>
<span><em>合同状态</em>
<el-select v-model="msg.Status" :placeholder="$t('pub.pleaseSel')">
<el-option label="请选择" :value="-1" :key="-1"> </el-option>
<el-option label="待审" :value="1" :key="1"> </el-option>
<el-option label="审核通过" :value="2" :key="2"> </el-option>
<el-option label="驳回" :value="3" :key="3"> </el-option>
</el-select>
</span>
</li>
<li>
<span><em>{{ $t("sm.Date") }}</em>
<el-date-picker v-model="msg.StartDate" class="w135" value-format="yyyy-MM-dd" type="date"
:picker-options="pickerBeginDateBefore2"></el-date-picker>
-
<el-date-picker v-model="msg.EndDate" class="w135" value-format="yyyy-MM-dd" type="date"
:picker-options="pickerBeginDateAfter2"></el-date-picker>
</span>
</li>
<li>
<input type="button" class="normalBtn" :value="$t('pub.searchBtn')" @click="
getList();
resetPageIndex();
" />
</li>
</ul>
</div>
<table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
<tr>
<th width="50">编号</th>
<th width="80">合同类型</th>
<th width="100">合同编号</th>
<th width="100">甲方名称</th>
<th width="120">乙方名称</th>
<th width="100">经办人</th>
<th width="100">团号</th>
<th width="150">产品名称</th>
<th width="100">合同状态</th>
<th width="100">创建人</th>
<th width="120">创建时间</th>
<th width="130">操作</th>
</tr>
<tr v-for="(item, index) in dataList" :key="index">
<td>{{ item.ID }}
</td>
<td>
<template v-if="item.CType == 2">
境内旅游合同
</template>
<template v-else-if="item.CType == 3">
一日游合同
</template>
<template v-else-if="item.CType == 1">
单向委托合同
</template>
</td>
<td>{{ item.T_ContractNum }}</td>
<td>{{ item.Tourists_Name }}</td>
<td>{{ item.TravelAgency_Name }}</td>
<td>{{ item.TravelAgency_DealMan }}</td>
<td>{{ item.C_TCNUM }}</td>
<td>{{ item.C_ProductName }}</td>
<td>
<span v-if="item.Status==3" style="color:red;">已驳回</span>
<span v-if="item.Status==1" style="color:blue;">待审核</span>
<span v-if="item.Status==2" style="color:green;">审核通过</span>
</td>
<td>{{ item.CreateByName }}</td>
<td>{{ item.CreateTimeStr }}</td>
<td>
<el-tooltip class="item" effect="dark" content="审核通过" placement="top-start" v-if="item.Status==1">
<el-button type="info" icon="iconfont icon-shenpi" circle @click="SubmitContract(item,2)"></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="驳回" placement="top-start" v-if="item.Status==1">
<el-button type="info" icon="iconfont icon-shenhebohui" circle @click="SubmitContract(item,3)">
</el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="查看" placement="top-start">
<el-button type="danger" icon="iconfont icon-chakan" circle @click="ViewContract(item)"
style="padding:4px;"></el-button>
</el-tooltip>
</td>
</tr>
</table>
<el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
layout="total,prev, pager, next, jumper" :page-size="msg.pageSize" :total="total">
</el-pagination>
</div>
</template>
</div>
</template>
<script>
import moment from 'moment'
export default {
import moment from 'moment'
export default {
data() {
return {
msg: {
contractNum:'',
productName:'',
orderID:'',
tcid:'',
startDate:'',
returnDate:'',
auditContract:''
},
dataList:[],
loading:false,
msgOut: {
contractNum: '',
productName: '',
orderID: '',
tcid: '',
startDate: '',
returnDate: '',
auditContract: ''
},
dataListOut: [],
loadingOut: false,
pickerBeginDateBefore: {
disabledDate: time => {
if (this.msg.returnDate == null) {
......@@ -144,57 +335,175 @@ export default {
let startTime = new Date(this.msg.startDate)
return startTime.getTime() >= time.getTime()
}
},
//切换出境游合同
activeName: '1',
//ContractMange参数
total: 0,
currentPage: 1,
dataList: [],
loading: false, //页面加载
msg: {
T_ContractNum: "", //合同编号
CType: 0, //合同类型
Tourists_Name: "", //客户名称
Tourists_Tel: "", //客户电话
StartDate: "", //开始日期
EndDate: "", //结束日期
Status: -1, //合同状态
pageIndex: 1,
pageSize: 15,
TravelAgency_DealMan: "", //经办人
C_TCNUM: "", //团号
C_ProductName: "", //线路名称
IsAduitPage: 1, //是否是审核页面
},
pickerBeginDateBefore2: {
disabledDate: time => {
if (this.msg.EndDate == null) {
return false;
} else {
let endTime = new Date(this.msg.EndDate);
return endTime.getTime() < time.getTime();
}
}
},
pickerBeginDateAfter2: {
disabledDate: time => {
let startTime = new Date(this.msg.StartDate);
return startTime.getTime() >= time.getTime();
}
}
};
},
methods: {
dateChange(val){
if(val){
this.msg.startDate=val[0];
this.msg.returnDate=val[1];
//切换
getSwitch() {
if (this.active == 1) {
this.getListOutTract();
} else {
this.getList();
}
},
dateChange(val) {
if (val) {
this.msg.startDate = val[0];
this.msg.returnDate = val[1];
}
},
//跳转至详情
goToDetail(item){
goToDetail(item) {
this.$router.push({
name: 'TravelContractDetail',
query: {
TCID: item.tcid,
guestId:item.guestId,
guestId: item.guestId,
orderID: item.orderId,
blank: "y",
}
});
},
getList() {
this.loading=true;
this.apiJavaPost("/api/contract/auditContract",this.msg,res => {
this.loading=false;
getListOutTract() {
this.loadingOut = true;
this.apiJavaPost("/api/contract/auditContract", this.msgOut, res => {
this.loadingOut = false;
if (res.data.resultCode === 1) {
this.dataList = res.data.data;
this.dataListOut = res.data.data;
} else {
this.Error(res.data.message);
}
},null);
}, null);
},
//审核通过或者驳回
AuditElec(item,type){
item.auditContract=type;
this.apiJavaPost("/api/contract/dosaveOrUpdate",item,res => {
AuditElec(item, type) {
item.auditContract = type;
this.apiJavaPost("/api/contract/dosaveOrUpdate", item, res => {
if (res.data.resultCode === 1) {
this.Success(res.data.message);
this.getList();
} else {
this.Error(res.data.message);
}
},null);
}, null);
},
getDate(date) {
return moment(date).format("YYYY-MM-DD");
},
//提交并盖章
SubmitContract(item,status) {
var that = this;
var message="审核通过";
if(status==3)
{
message="驳回";
}
this.Confirm("是否【"+message+"】此合同?", function () {
that.apipost(
"travelcontract_post_UpdateTravelContractStatusService", {
ID: item.ID,
Status: status
},
mounted() {
res => {
if (res.data.resultCode == 1) {
that.Success(res.data.message);
that.getList();
} else {
that.Error(res.data.message);
}
},
err => {}
);
});
},
getList() {
this.loading = true;
//获取列表数据
this.apipost(
"travelcontract_get_GetPageListService",
this.msg,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.dataList = res.data.data.pageData;
this.dataList.forEach(x => {
let Url = "";
if (this.isOnline()) {
Url = window.location.hostname + '/#/TravelContractConfirm?ContractId=' + x.ID;
} else {
Url = window.location.hostname + ":8080/" + '#/TravelContractConfirm?ContractId=' + x.ID;
}
x.Url = Url;
})
this.total = res.data.data.count;
} else {
this.Error(res.data.message);
}
},
err => {}
);
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1;
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
ViewContract(item) {
this.$router.push({
name: "TravelContractView",
query: {
id: item.ID,
blank: "y",
tab: '预览合同'
}
};
});
},
},
mounted() {
this.getListOutTract();
}
};
</script>
src/router/config.js
View file @ 020c65ba
......@@ -4267,13 +4267,21 @@ export default {
},
},
{
path: '/TravelContractConfirm', //电子合同签名
path: '/TravelContractConfirm', //其他电子合同签名
name: 'TravelContractConfirm',
component: resolve => require(['@/components/TravelContractConfirm'], resolve),
meta: {
title: '电子合同签名'
},
},
{
path: '/TravelContractView', //其他电子合同签名
name: 'TravelContractView',
component: resolve => require(['@/components/TravelContractView'], resolve),
meta: {
title: '电子合同签名'
},
},
{
path: '/TravelContractDetail', //新电子合同详情
name: 'TravelContractDetail',
......
static/MarkerClusterer.js 0 → 100644
View file @ 020c65ba
/**
* @fileoverview MarkerClusterer标记聚合器用来解决加载大量点要素到地图上产生覆盖现象的问题，并提高性能。
* 主入口类是<a href="symbols/BMapLib.MarkerClusterer.html">MarkerClusterer</a>，
* 基于Baidu Map API 1.2。
*
* @author Baidu Map Api Group
* @version 1.2
*/
/**
* @namespace BMap的所有library类均放在BMapLib命名空间下
*/
var BMapLib = window.BMapLib = BMapLib || {};
(function(){
/**
* 获取一个扩展的视图范围，把上下左右都扩大一样的像素值。
* @param {Map} map BMap.Map的实例化对象
* @param {BMap.Bounds} bounds BMap.Bounds的实例化对象
* @param {Number} gridSize 要扩大的像素值
*
* @return {BMap.Bounds} 返回扩大后的视图范围。
*/
var getExtendedBounds = function(map, bounds, gridSize){
bounds = cutBoundsInRange(bounds);
var pixelNE = map.pointToPixel(bounds.getNorthEast());
var pixelSW = map.pointToPixel(bounds.getSouthWest());
pixelNE.x += gridSize;
pixelNE.y -= gridSize;
pixelSW.x -= gridSize;
pixelSW.y += gridSize;
var newNE = map.pixelToPoint(pixelNE);
var newSW = map.pixelToPoint(pixelSW);
return new BMap.Bounds(newSW, newNE);
};
/**
* 按照百度地图支持的世界范围对bounds进行边界处理
* @param {BMap.Bounds} bounds BMap.Bounds的实例化对象
*
* @return {BMap.Bounds} 返回不越界的视图范围
*/
var cutBoundsInRange = function (bounds) {
var maxX = getRange(bounds.getNorthEast().lng, -180, 180);
var minX = getRange(bounds.getSouthWest().lng, -180, 180);
var maxY = getRange(bounds.getNorthEast().lat, -74, 74);
var minY = getRange(bounds.getSouthWest().lat, -74, 74);
return new BMap.Bounds(new BMap.Point(minX, minY), new BMap.Point(maxX, maxY));
};
/**
* 对单个值进行边界处理。
* @param {Number} i 要处理的数值
* @param {Number} min 下边界值
* @param {Number} max 上边界值
*
* @return {Number} 返回不越界的数值
*/
var getRange = function (i, mix, max) {
mix && (i = Math.max(i, mix));
max && (i = Math.min(i, max));
return i;
};
/**
* 判断给定的对象是否为数组
* @param {Object} source 要测试的对象
*
* @return {Boolean} 如果是数组返回true，否则返回false
*/
var isArray = function (source) {
return '[object Array]' === Object.prototype.toString.call(source);
};
/**
* 返回item在source中的索引位置
* @param {Object} item 要测试的对象
* @param {Array} source 数组
*
* @return {Number} 如果在数组内，返回索引，否则返回-1
*/
var indexOf = function(item, source){
var index = -1;
if(isArray(source)){
if (source.indexOf) {
index = source.indexOf(item);
} else {
for (var i = 0, m; m = source[i]; i++) {
if (m === item) {
index = i;
break;
}
}
}
}
return index;
};
/**
*@exports MarkerClusterer as BMapLib.MarkerClusterer
*/
var MarkerClusterer =
/**
* MarkerClusterer
* @class 用来解决加载大量点要素到地图上产生覆盖现象的问题，并提高性能
* @constructor
* @param {Map} map 地图的一个实例。
* @param {Json Object} options 可选参数，可选项包括：<br />
* markers {Array<Marker>} 要聚合的标记数组<br />
* girdSize {Number} 聚合计算时网格的像素大小，默认60<br />
* maxZoom {Number} 最大的聚合级别，大于该级别就不进行相应的聚合<br />
* minClusterSize {Number} 最小的聚合数量，小于该数量的不能成为一个聚合，默认为2<br />
* isAverangeCenter {Boolean} 聚合点的落脚位置是否是所有聚合在内点的平均值，默认为否，落脚在聚合内的第一个点<br />
* styles {Array<IconStyle>} 自定义聚合后的图标风格，请参考TextIconOverlay类<br />
*/
BMapLib.MarkerClusterer = function(map, options){
if (!map){
return;
}
this._map = map;
this._markers = [];
this._clusters = [];
var opts = options || {};
this._gridSize = opts["gridSize"] || 60;
this._maxZoom = opts["maxZoom"] || 18;
this._minClusterSize = opts["minClusterSize"] || 2;
this._isAverageCenter = false;
if (opts['isAverageCenter'] != undefined) {
this._isAverageCenter = opts['isAverageCenter'];
}
this._styles = opts["styles"] || [];
var that = this;
this._map.addEventListener("zoomend",function(){
that._redraw();
});
this._map.addEventListener("moveend",function(){
that._redraw();
});
var mkrs = opts["markers"];
isArray(mkrs) && this.addMarkers(mkrs);
};
/**
* 添加要聚合的标记数组。
* @param {Array<Marker>} markers 要聚合的标记数组
*
* @return 无返回值。
*/
MarkerClusterer.prototype.addMarkers = function(markers){
for(var i = 0, len = markers.length; i <len ; i++){
this._pushMarkerTo(markers[i]);
}
this._createClusters();
};
/**
* 把一个标记添加到要聚合的标记数组中
* @param {BMap.Marker} marker 要添加的标记
*
* @return 无返回值。
*/
MarkerClusterer.prototype._pushMarkerTo = function(marker){
var index = indexOf(marker, this._markers);
if(index === -1){
marker.isInCluster = false;
this._markers.push(marker);//Marker拖放后enableDragging不做变化，忽略
}
};
/**
* 添加一个聚合的标记。
* @param {BMap.Marker} marker 要聚合的单个标记。
* @return 无返回值。
*/
MarkerClusterer.prototype.addMarker = function(marker) {
this._pushMarkerTo(marker);
this._createClusters();
};
/**
* 根据所给定的标记，创建聚合点，并且遍历所有聚合点
* @return 无返回值
*/
MarkerClusterer.prototype._createClusters = function(){
var mapBounds = this._map.getBounds();
var extendedBounds = getExtendedBounds(this._map, mapBounds, this._gridSize);
for(var i = 0, marker; marker = this._markers[i]; i++){
if(!marker.isInCluster && extendedBounds.containsPoint(marker.getPosition()) ){
this._addToClosestCluster(marker);
}
}
var len = this._markers.length;
for (var i = 0; i < len; i++) {
if(this._clusters[i]){
this._clusters[i].render();
}
}
};
/**
* 根据标记的位置，把它添加到最近的聚合中
* @param {BMap.Marker} marker 要进行聚合的单个标记
*
* @return 无返回值。
*/
MarkerClusterer.prototype._addToClosestCluster = function (marker){
var distance = 4000000;
var clusterToAddTo = null;
var position = marker.getPosition();
for(var i = 0, cluster; cluster = this._clusters[i]; i++){
var center = cluster.getCenter();
if(center){
var d = this._map.getDistance(center, marker.getPosition());
if(d < distance){
distance = d;
clusterToAddTo = cluster;
}
}
}
if (clusterToAddTo && clusterToAddTo.isMarkerInClusterBounds(marker)){
clusterToAddTo.addMarker(marker);
} else {
var cluster = new Cluster(this);
cluster.addMarker(marker);
this._clusters.push(cluster);
}
};
/**
* 清除上一次的聚合的结果
* @return 无返回值。
*/
MarkerClusterer.prototype._clearLastClusters = function(){
for(var i = 0, cluster; cluster = this._clusters[i]; i++){
cluster.remove();
}
this._clusters = [];//置空Cluster数组
this._removeMarkersFromCluster();//把Marker的cluster标记设为false
};
/**
* 清除某个聚合中的所有标记
* @return 无返回值
*/
MarkerClusterer.prototype._removeMarkersFromCluster = function(){
for(var i = 0, marker; marker = this._markers[i]; i++){
marker.isInCluster = false;
}
};
/**
* 把所有的标记从地图上清除
* @return 无返回值
*/
MarkerClusterer.prototype._removeMarkersFromMap = function(){
for(var i = 0, marker; marker = this._markers[i]; i++){
marker.isInCluster = false;
tmplabel = marker.getLabel();
this._map.removeOverlay(marker);
marker.setLabel(tmplabel);
}
};
/**
* 删除单个标记
* @param {BMap.Marker} marker 需要被删除的marker
*
* @return {Boolean} 删除成功返回true，否则返回false
*/
MarkerClusterer.prototype._removeMarker = function(marker) {
var index = indexOf(marker, this._markers);
if (index === -1) {
return false;
}
tmplabel = marker.getLabel();
this._map.removeOverlay(marker);
marker.setLabel(tmplabel);
this._markers.splice(index, 1);
return true;
};
/**
* 删除单个标记
* @param {BMap.Marker} marker 需要被删除的marker
*
* @return {Boolean} 删除成功返回true，否则返回false
*/
MarkerClusterer.prototype.removeMarker = function(marker) {
var success = this._removeMarker(marker);
if (success) {
this._clearLastClusters();
this._createClusters();
}
return success;
};
/**
* 删除一组标记
* @param {Array<BMap.Marker>} markers 需要被删除的marker数组
*
* @return {Boolean} 删除成功返回true，否则返回false
*/
MarkerClusterer.prototype.removeMarkers = function(markers) {
var success = false;
for (var i = 0; i < markers.length; i++) {
var r = this._removeMarker(markers[i]);
success = success || r;
}
if (success) {
this._clearLastClusters();
this._createClusters();
}
return success;
};
/**
* 从地图上彻底清除所有的标记
* @return 无返回值
*/
MarkerClusterer.prototype.clearMarkers = function() {
this._clearLastClusters();
this._removeMarkersFromMap();
this._markers = [];
};
/**
* 重新生成，比如改变了属性等
* @return 无返回值
*/
MarkerClusterer.prototype._redraw = function () {
this._clearLastClusters();
this._createClusters();
};
/**
* 获取网格大小
* @return {Number} 网格大小
*/
MarkerClusterer.prototype.getGridSize = function() {
return this._gridSize;
};
/**
* 设置网格大小
* @param {Number} size 网格大小
* @return 无返回值
*/
MarkerClusterer.prototype.setGridSize = function(size) {
this._gridSize = size;
this._redraw();
};
/**
* 获取聚合的最大缩放级别。
* @return {Number} 聚合的最大缩放级别。
*/
MarkerClusterer.prototype.getMaxZoom = function() {
return this._maxZoom;
};
/**
* 设置聚合的最大缩放级别
* @param {Number} maxZoom 聚合的最大缩放级别
* @return 无返回值
*/
MarkerClusterer.prototype.setMaxZoom = function(maxZoom) {
this._maxZoom = maxZoom;
this._redraw();
};
/**
* 获取聚合的样式风格集合
* @return {Array<IconStyle>} 聚合的样式风格集合
*/
MarkerClusterer.prototype.getStyles = function() {
return this._styles;
};
/**
* 设置聚合的样式风格集合
* @param {Array<IconStyle>} styles 样式风格数组
* @return 无返回值
*/
MarkerClusterer.prototype.setStyles = function(styles) {
this._styles = styles;
this._redraw();
};
/**
* 获取单个聚合的最小数量。
* @return {Number} 单个聚合的最小数量。
*/
MarkerClusterer.prototype.getMinClusterSize = function() {
return this._minClusterSize;
};
/**
* 设置单个聚合的最小数量。
* @param {Number} size 单个聚合的最小数量。
* @return 无返回值。
*/
MarkerClusterer.prototype.setMinClusterSize = function(size) {
this._minClusterSize = size;
this._redraw();
};
/**
* 获取单个聚合的落脚点是否是聚合内所有标记的平均中心。
* @return {Boolean} true或false。
*/
MarkerClusterer.prototype.isAverageCenter = function() {
return this._isAverageCenter;
};
/**
* 获取聚合的Map实例。
* @return {Map} Map的示例。
*/
MarkerClusterer.prototype.getMap = function() {
return this._map;
};
/**
* 获取所有的标记数组。
* @return {Array<Marker>} 标记数组。
*/
MarkerClusterer.prototype.getMarkers = function() {
return this._markers;
};
/**
* 获取聚合的总数量。
* @return {Number} 聚合的总数量。
*/
MarkerClusterer.prototype.getClustersCount = function() {
var count = 0;
for(var i = 0, cluster; cluster = this._clusters[i]; i++){
cluster.isReal() && count++;
}
return count;
};
/**
* @ignore
* Cluster
* @class 表示一个聚合对象，该聚合，包含有N个标记，这N个标记组成的范围，并有予以显示在Map上的TextIconOverlay等。
* @constructor
* @param {MarkerClusterer} markerClusterer 一个标记聚合器示例。
*/
function Cluster(markerClusterer){
this._markerClusterer = markerClusterer;
this._map = markerClusterer.getMap();
this._minClusterSize = markerClusterer.getMinClusterSize();
this._isAverageCenter = markerClusterer.isAverageCenter();
this._center = null;//落脚位置
this._markers = [];//这个Cluster中所包含的markers
this._gridBounds = null;//以中心点为准，向四边扩大gridSize个像素的范围，也即网格范围
this._isReal = false; //真的是个聚合
this._clusterMarker = new BMapLib.TextIconOverlay(this._center, this._markers.length, {"styles":this._markerClusterer.getStyles()});
//this._map.addOverlay(this._clusterMarker);
}
/**
* 向该聚合添加一个标记。
* @param {Marker} marker 要添加的标记。
* @return 无返回值。
*/
Cluster.prototype.addMarker = function(marker){
if(this.isMarkerInCluster(marker)){
return false;
}//也可用marker.isInCluster判断,外面判断OK，这里基本不会命中
if (!this._center){
this._center = marker.getPosition();
this.updateGridBounds();//
} else {
if(this._isAverageCenter){
var l = this._markers.length + 1;
var lat = (this._center.lat * (l - 1) + marker.getPosition().lat) / l;
var lng = (this._center.lng * (l - 1) + marker.getPosition().lng) / l;
this._center = new BMap.Point(lng, lat);
this.updateGridBounds();
}//计算新的Center
}
marker.isInCluster = true;
this._markers.push(marker);
};
/**
* 进行dom操作
* @return 无返回值
*/
Cluster.prototype.render = function(){
var len = this._markers.length;
if (len < this._minClusterSize) {
for (var i = 0; i < len; i++) {
this._map.addOverlay(this._markers[i]);
}
} else {
this._map.addOverlay(this._clusterMarker);
this._isReal = true;
this.updateClusterMarker();
}
}
/**
* 判断一个标记是否在该聚合中。
* @param {Marker} marker 要判断的标记。
* @return {Boolean} true或false。
*/
Cluster.prototype.isMarkerInCluster= function(marker){
if (this._markers.indexOf) {
return this._markers.indexOf(marker) != -1;
} else {
for (var i = 0, m; m = this._markers[i]; i++) {
if (m === marker) {
return true;
}
}
}
return false;
};
/**
* 判断一个标记是否在该聚合网格范围中。
* @param {Marker} marker 要判断的标记。
* @return {Boolean} true或false。
*/
Cluster.prototype.isMarkerInClusterBounds = function(marker) {
return this._gridBounds.containsPoint(marker.getPosition());
};
Cluster.prototype.isReal = function(marker) {
return this._isReal;
};
/**
* 更新该聚合的网格范围。
* @return 无返回值。
*/
Cluster.prototype.updateGridBounds = function() {
var bounds = new BMap.Bounds(this._center, this._center);
this._gridBounds = getExtendedBounds(this._map, bounds, this._markerClusterer.getGridSize());
};
/**
* 更新该聚合的显示样式，也即TextIconOverlay。
* @return 无返回值。
*/
Cluster.prototype.updateClusterMarker = function () {
if (this._map.getZoom() > this._markerClusterer.getMaxZoom()) {
this._clusterMarker && this._map.removeOverlay(this._clusterMarker);
for (var i = 0, marker; marker = this._markers[i]; i++) {
this._map.addOverlay(marker);
}
return;
}
if (this._markers.length < this._minClusterSize) {
this._clusterMarker.hide();
return;
}
this._clusterMarker.setPosition(this._center);
this._clusterMarker.setText(this._markers.length);
var thatMap = this._map;
var thatBounds = this.getBounds();
this._clusterMarker.addEventListener("click", function(event){
thatMap.setViewport(thatBounds);
});
};
/**
* 删除该聚合。
* @return 无返回值。
*/
Cluster.prototype.remove = function(){
for (var i = 0, m; m = this._markers[i]; i++) {
tmplabel = this._markers[i].getLabel();
this._markers[i].getMap() && this._map.removeOverlay(this._markers[i])
this._markers[i].setLabel(tmplabel)
}//清除散的标记点
this._map.removeOverlay(this._clusterMarker);
this._markers.length = 0;
delete this._markers;
}
/**
* 获取该聚合所包含的所有标记的最小外接矩形的范围。
* @return {BMap.Bounds} 计算出的范围。
*/
Cluster.prototype.getBounds = function() {
var bounds = new BMap.Bounds(this._center,this._center);
for (var i = 0, marker; marker = this._markers[i]; i++) {
bounds.extend(marker.getPosition());
}
return bounds;
};
/**
* 获取该聚合的落脚点。
* @return {BMap.Point} 该聚合的落脚点。
*/
Cluster.prototype.getCenter = function() {
return this._center;
};
})();
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment