Browse Source

配送规则页面和逻辑

hulh 8 years ago
parent
commit
66796eb4f3

+ 6 - 0
src/main/webapp/resources/js/vendor/app.js

@@ -538,6 +538,12 @@ define([ 'angularAMD', 'ngLocal', 'common/services', 'common/directives', 'commo
 			templateUrl : 'static/view/vendor/forstore/vendor_take_self.html',
 			controller: 'vendorTakeSelfCtrl',
 			controllerUrl: 'app/controllers/forstore/vendor_takeSelf_ctrl'
+		})).state('vendor_deliveryRule_add', angularAMD.route({
+			title : '新增配送规则',
+			url: '/vendor_deliveryRule_add',
+			templateUrl : 'static/view/vendor/forstore/vendor_delivery_add_rule.html',
+			controller: 'vendorDeliveryRuleAddCtrl',
+			controllerUrl: 'app/controllers/forstore/vendor_deliveryRule_add_ctrl'
 		})).state('messagePersonal', angularAMD.route({
 			url: '/messagePersonal',
 			templateUrl: 'static/view/vendor/forstore/messagePersonal.html',

+ 14 - 0
src/main/webapp/resources/js/vendor/controllers/forstore/vendor_deliveryRule_add_ctrl.js

@@ -0,0 +1,14 @@
+define([ 'app/app' ], function(app) {
+    'use strict';
+    app.register.controller('vendorDeliveryRuleAddCtrl', ['$scope','$rootScope', function ($scope, $rootScope) {
+        $rootScope.active = 'vendor_deliveryRule';
+        // $scope.tab = 'deliverRule';
+        $scope.title = '新增配送规则';
+
+        // 切换tab
+        $scope.type = 'style01';
+        $scope.checkTab = function (t) {
+            $scope.type = t;
+        };
+    }]);
+});

+ 55 - 0
src/main/webapp/resources/js/vendor/controllers/forstore/vendor_deliveryRule_ctrl.js

@@ -4,5 +4,60 @@ define([ 'app/app' ], function(app) {
         $rootScope.active = 'vendor_logistics';
         $scope.tab = 'deliverRule';
         $scope.title = '配送规则';
+        $scope.rules = [
+            {
+                id: 1,
+                step: 1,
+                style: 'UU配送',
+                title:'深圳市内满100元包邮,不满1000元邮费20元不满1000元',
+                isEffect: 1
+            },
+            {
+                id: 2,
+                step: 2,
+                style: '第三方配送',
+                title:'不满1000元邮费20元不满1000元',
+                isEffect: 0
+            },
+            {
+                id: 3,
+                step: 3,
+                style: '第三方配送',
+                title:'满1000元包邮,打折8.8',
+                isEffect: 1
+            }
+        ]
+        // 取消
+        $scope.disableTab = function (res) {
+            angular.forEach($scope.rules, function (rule) {
+                if(rule.id == res) {
+                    rule.isEffect = !rule.isEffect;
+                }
+            });
+        };
+        // 激活
+        $scope.activeTab = function (res) {
+            angular.forEach($scope.rules, function (rule) {
+                if(rule.id == res) {
+                    rule.isEffect = !rule.isEffect;
+                }
+            });
+        };
+        //删除地址
+        $scope.deleteRule = function (data) {
+            var index = $scope.rules.indexOf(data);
+            $scope.deleteObject = angular.copy(data);
+            $scope.deleteObject.index = index;
+            $scope.showDeleteFrame = true;
+        };
+        //取消删除
+        $scope.cancelDelete = function () {
+            $scope.showDeleteFrame = false;
+        };
+        //确定删除
+        $scope.ensureDelete = function (index) {
+            $scope.rules.splice(index,1);
+            $scope.showDeleteFrame = false;
+        };
     }]);
 });

+ 543 - 0
src/main/webapp/resources/view/vendor/forstore/vendor_delivery_add_rule.html

@@ -0,0 +1,543 @@
+<style>
+	.count .count01 {
+		display: block;
+	}
+	/*新增规则*/
+	.addRule-menu{
+		width: 100%;
+		height: 20px;
+		line-height: 20px;
+		position: absolute;
+		top: 40px;
+	}
+	.addRule-menu span{
+		display: inline-block;
+		text-align: center;
+		width: 112px;
+		height: 20px;
+		background: #eee;
+		border-top-left-radius: 3px;
+		border-top-right-radius: 3px;
+		margin-left: 518px;
+		line-height: 19px;
+		position: relative;
+		bottom: 20px;
+	}
+	.addRule-menu span a{
+		font-size: 12px;
+		color: #999;
+		display: inline-block;
+		height: 20px;
+		width: 75px;
+	}
+	.addRule-menu span.active{
+		background: #fff;
+		border: #82d2fa 1px solid;
+		border-bottom: #fff 1px solid;
+	}
+	.addRule-menu span.active a{
+		color: #666;
+	}
+	.addRule-menu span i{
+		font-size: 14px;
+		color: #999;
+	}
+	.addRule-menu span i:hover,.addRule-menu span a:hover{
+		color: #5078cb;
+	}
+	.com_tab.rule-act ul {
+		border-bottom: #82d2fa 1px solid;
+	}
+	.com_tab.rule-act{
+		margin-bottom: 0;
+	}
+
+	/*内容开始*/
+	.rule-main{
+		width: 100%;
+		margin: 0 auto;
+		background: #fff;
+		padding-bottom: 20px;
+	}
+	.rule-main .rule-title{
+		width: 100%;
+		margin: 0 auto;
+		height: 40px;
+		line-height: 50px;
+		font-size: 14px;
+		color: #5078cb;
+		padding-left: 35px;
+		font-weight: bold;
+	}
+	.rule-main .rule-content{
+		width: 97%;
+		margin: 0 auto;
+		background: #f5f8fe;
+		padding: 10px 20px;
+	}
+	.rule-main .rule-content .row{
+		margin: 0;
+		font-size: 14px;
+		color: #666;
+		line-height: 26px;
+		margin-bottom: 10px;
+	}
+	.rule-main .rule-content .row span{
+		font-size: 14px;
+		line-height: 26px;
+		margin-right: 15px;
+	}
+	.rule-main .rule-content .row span,.rule-main .rule-content .row select,.rule-main .rule-content .row input,.rule-main .rule-content .row label{
+		float: left;
+	}
+	.rule-main .rule-content .row input{
+		text-align: center;
+	}
+	.rule-main .rule-content .row strong{
+		color: #f00;
+		margin-right: 3px;
+	}
+	.rule-main .rule-content .row .form-control{
+		border-radius: 0;
+		height: 26px;
+		padding: 0 10px;
+		line-height: 26px;
+		border: #d4d4d4 1px solid;
+		margin-right: 40px;
+		font-size: 12px;
+	}
+	.rule-main .rule-content .row label{
+		font-weight: inherit;
+		margin-right: 40px;
+	}
+	.rule-main .rule-content .row label input{
+		margin: 7px 8px 0;
+	}
+	.rule-main .rule-content .row select.delivery{
+		width: 130px;
+	}
+	.rule-main .rule-content .row input.sort{
+		width: 100px;
+	}
+	.rule-main .rule-content .row input.rule{
+		width: 350px;
+		margin-right: 0;
+	}
+	.rule-main .rule-content .row select.for-people{
+		width: 220px;
+	}
+	.rule-main .rule-content .row button{
+		width: 70px;
+		height: 22px;
+		line-height: 22px;
+		text-align: center;
+		color: #fff;
+		background: #ff8522;
+		border: none;
+	}
+	.rule-main .rule-content .row .check-act input{
+		display: none;
+	}
+	.rule-main .rule-content .check-act label{
+		width: 12px;
+		height: 12px;
+		margin-right: 5px;
+		display: inline-block;
+		background: url(static/img/icon/check-rule.png) no-repeat;
+		position: relative;
+		top: 7px;
+	}
+	.rule-main .rule-content .radio-1 .check-act label{
+		background-position: 0 0;
+	}
+	.rule-main .rule-content .check-1 .check-act label{
+		background-position: -48px 0;
+	}
+	.rule-main .rule-content .radio-1 input:checked + label{
+		background-position: -15px 0;
+	}
+	.rule-main .rule-content .check-1 input:checked + label{
+		background-position: -31px 0;
+	}
+	.rule-main .rule-content i.notes{
+		font-size: 12px;
+		color: #999;
+	}
+	.rule-main .rule-content .common-style{
+		width: 900px;
+		margin-right: 0 auto;
+	}
+	.rule-main .rule-content .common-style .row{
+		padding: 8px;
+		background: #e8e7e7;
+		min-height: 40px;
+		font-size: 12px;
+	}
+	.rule-main .rule-content .common-style .row span{
+		font-size: 12px;
+	}
+	.rule-main .rule-content .common-style .price-input{
+		min-width: 90px;
+		float: left;
+		position: relative;
+		z-index: 10;
+	}
+	.rule-main .rule-content .common-style .price-input em{
+		float: left;
+		margin: 0 5px;
+	}
+	.rule-main .rule-content .common-style .price-input em i{
+		margin-right: 20px;
+	}
+	.rule-main .rule-content .common-style .price-input i.currency{
+		width: 20px;
+		height: 26px;
+		text-align: center;
+		display: inline-block;
+		background: #b0b0b0;
+		color: #fff;
+		float: left;
+		border-bottom-left-radius: 3px;
+		border-top-left-radius: 3px;
+	}
+	.rule-main .rule-content .common-style .price-input input{
+		max-width: 80px;
+		padding: 0;
+		margin-right: 3px !important;
+		position: relative;
+		/*left: -1px;*/
+		font-size: 12px;
+	}
+	.rule-main .rule-content .common-style .row textarea{
+		width: 600px;
+		height: 84px;
+		font-size: 12px;
+		float: left;
+		margin-right: 0 !important;
+	}
+	.rule-main .rule-content .common-style .row .prompt{
+		float: left;
+		width: 110px;
+		margin-left: 30px;
+		line-height: 20px;
+		color: #999;
+	}
+	.rule-main .rule-content .common-style .row .no-edit{
+		width: 824px;
+		min-height: 40px;
+		background: #e8e7e7;
+		float: right;
+		margin-right: 0 !important;
+		padding-left: 10px;
+		line-height: 40px;
+	}
+	.rule-main .rule-content .common-style .row .edit{
+		width: 824px;
+		margin: 0 auto;
+		float: right;
+	}
+	/*操作取消保存*/
+	.deal-btn{
+		width: 100%;
+		margin: 0 auto;
+		text-align: center;
+		margin-top: 15px;
+	}
+	.deal-btn a{
+		width: 70px;
+		height: 30px;
+		display: inline-block;
+		text-align: center;
+		line-height: 30px;
+		font-size: 14px;
+	}
+	.deal-btn a.off{
+		background: #cdcccc;
+		color: #666;
+		margin-right: 8px;
+	}
+	.deal-btn a.save-other{
+		width: 100px;
+		background: #ff8522;
+		color: #fff;
+		margin-right: 8px;
+	}
+	.deal-btn a.ok{
+		background: #5078cb;
+		color: #fff;
+	}
+	.deal-btn a:hover{
+		background: #337ab7;
+		color: #fff;
+	}
+	/*适用地区*/
+	.rule-main .rule-content .area-content{
+		width: 715px;
+		min-height: 30px;
+		padding: 5px 5px 2px 5px;
+		background: #fff;
+		float: left;
+		margin-right: 30px;
+	}
+	.rule-main .rule-content .area-content a{
+		font-size: 12px;
+		color: #666;
+		display: inline-block;
+		padding: 0 3px;
+		border-radius: 2px;
+		float: left;
+		margin: 1px 1px 6px 1px;
+		margin-right: 3px;
+		height: 22px;
+		background: #e6eefe;
+	}
+	.rule-main .rule-content .area-content a em{
+		display: inline-block;
+		max-width: 150px;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		line-height: 22px;
+		float: left;
+	}
+	.rule-main .rule-content .area-content a i{
+		color: #cddcfb;
+		margin-left: 3px;
+		font-size: 16px;
+		background: #fff;
+		height: 10px;
+		position: relative;
+		border-radius: 100%;
+	}
+	.rule-main .rule-content .area-content a i:before{
+		position: relative;
+		top: -1px;
+	}
+	.rule-main .rule-content .area-content a:hover{
+		background: #8eb0f5;
+	}
+	.rule-main .rule-content .area-content a:hover em{
+		color: #fff;
+	}
+	.rule-main .rule-content .area-content a:hover i{
+		color: #ef4646;
+	}
+	.rule-main .rule-content .common-style.style-price .row{
+		margin-bottom: 0 !important;
+	}
+	.rule-main .rule-content .common-style.style-price .row .no-edit{
+		padding: 8px 10px;
+	}
+	.rule-main .rule-content .common-style.style-price .row .no-edit p{
+		line-height: 25px;
+	}
+	.rule-main .rule-content .common-style .row{
+		position: relative;
+	}
+	.rule-main .rule-content .common-style .row.dot:before{
+		content: "";
+		width: 15px;
+		height: 15px;
+		display: inline-block;
+		background: #e8e7e7;
+		transform: rotate(-45deg);
+		position: absolute;
+		top: -5px;
+		left: 129px;
+		z-index: 1;
+	}
+	.rule-main .rule-content .common-style.style-price .row.dot:before{
+		left: 260px;
+	}
+</style>
+<!--右侧主体部分-->
+<div class="count user_right fr">
+	<div class="count_center">
+		<div class="com_tab rule-act" style="position: relative">
+			<ul class="fl">
+				<li ng-class="{'active': tab=='deliverRule'}"><a ui-sref="vendor_deliveryRule">配送规则</a></li>
+				<li ng-class="{'active': tab=='distributor'}"><a ui-sref="vendor_distributor">配送商</a></li>
+				<li ng-class="{'active': tab=='takeSelf'}"><a ui-sref="vendor_takeSelf">自提点</a></li>
+				<li ng-class="{'active': tab=='logistic'}"><a ui-sref="vendor_logistics">发货地址</a></li>
+			</ul>
+			<!--匹配结果导航-->
+			<div class="addRule-menu">
+                <span class="active">
+                    <a ng-click="">新增配送规则</a>
+                    <i class="fa fa-remove" ng-click="close()"></i>
+                </span>
+			</div>
+		</div>
+		<!--配送规则-->
+		<div class="rule-main">
+			<div class="rule-title">基本信息</div>
+			<div class="rule-content">
+				<div class="row">
+					<span><strong>*</strong>配送方式</span>
+					<select class="select-adder form-control delivery">
+						<option value="1">请选择配送方式</option>
+						<option value="2">第三方配送</option>
+						<option value="3">免邮费</option>
+					</select>
+					<span>优先级排序</span>
+					<input type="text" class="form-control sort">
+					<span><strong>*</strong>规则名称</span>
+					<input type="text" class="form-control rule" style="text-align: left;">
+				</div>
+				<div class="row radio-1">
+					<span>是否生效</span>
+					<label class="check-act">
+						<input type="radio" id="effect" name="radio" checked/>
+						<label for="effect"></label>
+						生效
+					</label>
+					<label class="check-act">
+						<input type="radio" id="no-effect" name="radio"/>
+						<label for="no-effect"></label>
+						暂不生效
+					</label>
+				</div>
+			</div>
+			<!--适用范围-->
+			<div class="rule-title">适用范围</div>
+			<div class="rule-content">
+				<div class="row check-1">
+					<span><strong>*</strong>适用类型</span>
+					<label class="check-act">
+						<input type="checkbox" id="1" checked/>
+						<label for="1"></label>
+						普通订单
+					</label>
+					<label class="check-act">
+						<input type="checkbox" id="2"/>
+						<label for="2"></label>
+						预售订单
+					</label>
+					<label class="check-act">
+						<input type="checkbox" id="3"/>
+						<label for="3"></label>
+						发票
+					</label>
+					<span>适用用户</span>
+					<select class="select-adder form-control for-people">
+						<option value="1">所有用户</option>
+						<option value="2">所有用户</option>
+						<option value="3">所有用户</option>
+					</select>
+				</div>
+				<div class="row">
+					<span>适用地区</span>
+					<div class="area-content">
+						<a href="#"><em>广东省 / 东莞市</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>广东省 / 深圳市 / 南山区</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>四川省 / 成都市</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>广东省 / 东莞市</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>广东省 / 深圳市 / 南山区</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>广东省 / 东莞市</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>广东省 / 东莞市</em><i class="fa fa-minus-circle"></i></a>
+						<a href="#"><em>广东省 / 东莞市</em><i class="fa fa-minus-circle"></i></a>
+					</div>
+					<button>选择地区</button>
+					<!--<i class="notes">默认对全部地区生效</i>-->
+				</div>
+			</div>
+			<!--计费方式-->
+			<div class="rule-title">计费方式</div>
+			<div class="rule-content">
+				<div class="row radio-1">
+					<span>计费方式</span>
+					<label class="check-act" ng-click="checkTab('style01')">
+						<input type="radio" id="style01" name="radio2" checked/>
+						<label for="style01"></label>
+						统一规定运费
+					</label>
+					<label class="check-act" ng-click="checkTab('style02')">
+						<input type="radio" id="style02" name="radio2"/>
+						<label for="style02"></label>
+						按总金额计算
+					</label>
+				</div>
+				<!--统一规定运费-->
+				<div class="style-regulations common-style" ng-if="type=='style01'">
+					<div class="row dot">
+						<span>统一运费</span>
+						<div class="price-input">
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="请输入金额" />
+						</div>
+					</div>
+					<div class="row" style="background: none; padding: 0;">
+						<span class="f14">计算说明</span>
+						<!--可编辑-->
+						<!--<div class="edit">-->
+						<!--<textarea class="form-control" placeholder="全国统一运费 $20"></textarea>-->
+						<!--<div class="prompt"><strong>*</strong>公式说明内容将会在购物车中显示,可自行修改</div>-->
+						<!--</div>-->
+						<!--不可以编辑的状态-->
+						<div class="no-edit">全国统一运费 $20</div>
+					</div>
+				</div>
+				<!--按总金额计算-->
+				<div class="style-price common-style" ng-if="type=='style02'">
+					<div class="row dot">
+						<span>总金额在</span>
+						<div class="price-input">
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="100" />
+							<em>以下,</em>
+						</div>
+						<div class="price-input">
+							<em>运费为</em>
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="100" />
+						</div>
+					</div>
+					<div class="row">
+						<span>总金额在</span>
+						<div class="price-input">
+							<em><i>$1000</i>以上,</em>
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="100" />
+							<em>以下,</em>
+						</div>
+						<div class="price-input">
+							<em>运费为</em>
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="2000" />
+						</div>
+					</div>
+					<div class="row">
+						<span>总金额在</span>
+						<div class="price-input">
+							<em><i>$1000</i>以上,</em>
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="100" />
+							<em>以下,</em>
+						</div>
+						<div class="price-input">
+							<em>运费为</em>
+							<i class="currency">$</i>
+							<input type="text" class="form-control" placeholder="2000" />
+						</div>
+						<button style="margin-left: 20px;">增加范围</button>
+					</div>
+					<!--计算说明-->
+					<div class="row" style="background: none; padding: 0; margin-top: 10px !important;">
+						<span class="f14">计算说明</span>
+						<div class="no-edit">
+							<p>总金额在 $1000 以下,运费为 $500</p>
+							<p>总金额在 $1000  (含$1000) 以上,运费为 $20</p>
+							<p>总金额在 $2000  (含$2000) 以上,运费为 $0</p>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!--操作取消保存-->
+			<div class="deal-btn">
+				<a ng-click="" class="save-other">另存为新规则</a>
+				<a ng-click="" class="off">取消</a>
+				<a ng-click="" class="ok">保存</a>
+			</div>
+		</div>
+	</div>
+</div>

+ 285 - 5
src/main/webapp/resources/view/vendor/forstore/vendor_delivery_rule.html

@@ -1,22 +1,302 @@
 <style>
-	.count .count01 {
+	.delivery-list{
+		width: 1026px;
+		background: #fff;
+	}
+	.delivery-list .content-header{
+		padding-top: 30px;
+		overflow: hidden;
+	}
+	.delivery-list .content-header span{
+		padding-left: 23px;
+		font-size: 14px;
+		color: #333;
+	}
+	.delivery-list .content-header a{
+		float: right;
+		margin-right: 16px;
+		color: #333;
+		font-size: 14px;
+	}
+	.delivery-list .content-header i{
+		color: #32b500;
+		font-size: 16px;
+	}
+	.delivery-list .content-body {
+		width: 1000px;
+		margin: 0 auto;
+		text-align: center;
+	}
+	.delivery-list .content-body table{
+		box-sizing: border-box;
+		margin-top: 15px;
+	}
+	.delivery-list .content-body thead{
+		height: 40px;
+		width: 100%;
+		background: #89aefa;
+	}
+	.delivery-list .content-body thead th{
+		color: #fff;
+		font-weight: normal;
+		font-size: 14px;
+		text-align: center;
+	}
+	.delivery-list .content-body tbody td{
+		font-size: 14px;
+		color: #666;
+		border: 1px solid #dae5fd;
+		height: 45px;
+		vertical-align: middle;
+	}
+	.delivery-list .content-body tbody td a{
+		text-decoration: none;
+		color: #5078cb;
+		font-size: 12px;
+		cursor: pointer;
+	}
+	.delivery-list .content-body tbody td.address {
+		text-align: left;
+	}
+	.delivery-list .content-body tbody td p.switch{
+		margin: 5px 0;
+		padding-left: 10px;
+	}
+	.delivery-list .content-body tbody td p.switch .checkbox {
+		width: 54px;
+		margin: 0 auto;
+		text-align: center;
+		position: relative;
 		display: block;
 	}
+	.delivery-list .content-body tbody td p.switch .checkbox span {
+		width: 46px;
+		height: 12px;
+		display: inline-block;
+		border-radius: 18px;
+		border: #e4e4e4 1px solid;
+		cursor: pointer;
+		position: relative;
+		box-shadow: 1px 1px 5px #eee;
+		background: -webkit-gradient(linear,0% 0%, 0% 100%, from(#E0E0E0), to(#E8E8E8), color-stop(0.5,#F2F2F2));
+		transition: background-color .1s ease-out;
+	}
+	.delivery-list .content-body tbody tr:hover{
+		background: #f1f5ff;
+	}
+	.delivery-list .content-body tbody td p.switch .checkbox.active span{
+		background: #b9cffa;
+	}
+	.delivery-list .content-body tbody td p.switch .checkbox.active span em{
+		left: 34px;
+	}
+	.checkbox span em{
+		position: absolute;
+		width: 16px;
+		top: -4px;
+		left: 0;
+		height: 16px;
+		line-height: 16px;
+		background-color: #fff;
+		border: #eee 1px solid;
+		border-radius: 50%;
+		box-shadow: -1px 2px 1px #999;
+		transition: background-color .1s ease-out;
+		color: #666;
+		font-size: 12px;
+	}
+	.checkbox span em:after{
+		content: '';
+		width: 6px;
+		height: 6px;
+		display: inline-block;
+		background: #dedcdc;
+		border-radius: 100%;
+		position: absolute;
+		top: 4px;
+		left: 4px;
+	}
+	.delivery-list .content-body .count-tip{
+		float: right;
+		font-size: 12px;
+		color: #333;
+	}
+	.table>thead>tr>th{
+		border-bottom: none;
+	}
+	/*防误删*/
+	.com-del-box{
+		position: fixed;
+		z-index: 22;
+		height: 152px;
+		opacity: 1;
+		background-color: white;
+		width: 310px;
+		-webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
+		box-shadow: 0 5px 15px rgba(0,0,0,.5);
+		margin: -155px 0 0 -75px;
+		top: 55%;
+		left: 50%;
+	}
+	.com-del-box .title{
+		height: 30px;
+		background-color: #5078cb;
+		text-align: right;
+		padding-right: 15px;
+		line-height: 30px;
+	}
+	.com-del-box .title a{
+		color: white;
+		font-size: 16px;
+	}
+	.com-del-box .content{
+		width: 100%;
+		text-align: center;
+		margin: 0 auto;
+	}
+	.com-del-box .content p{
+		line-height: 50px;
+		font-size: 14px;
+		padding-top: 10px;
+	}
+	.com-del-box .content p i{
+		color: #5078cb;
+		font-size: 16px;
+		margin-right: 10px;
+	}
+	.com-del-box .content div{
+		width: 100%;
+		text-align: center;
+		margin: 0 auto;
+	}
+	.com-del-box .content div a{
+		width: 55px;
+		height: 26px;
+		line-height: 26px;
+		display: inline-block;
+		text-align: center;
+		font-size: 14px;
+	}
+	.com-del-box .content div a:first-child{
+		background: #b4b5b9;
+		color: #333;
+		margin-right: 10px;
+	}
+	.com-del-box .content div a:last-child{
+		background: #5078cb;
+		color: #fff;
+	}
+	.com-del-box .content div a:hover{
+		background: #3f7ae3;
+		color: #fff;
+	}
+	.table>tbody>tr.record-num td{
+		padding: 0;
+		border: none;
+	}
+	.table>tbody>tr.record-num:hover{
+		background: none;
+	}
+	.table>tbody+tbody{
+		border-top: 0;
+	}
+	.table>tbody+tbody.no-record-list tr td{
+		border: none;
+	}
 </style>
 <!--右侧主体部分-->
 <div class="count user_right fr">
 	<div class="count_center">
-		<div class="com_tab">
+		<div class="com_tab" style="position: relative">
 			<ul class="fl">
+				<!--<li ng-class="{'active': tab=='deliverRule'}"><a ui-sref="vendor_deliveryRule">配送规则</a></li>-->
 				<li ng-class="{'active': tab=='deliverRule'}"><a ui-sref="vendor_deliveryRule">配送规则</a></li>
 				<li ng-class="{'active': tab=='distributor'}"><a ui-sref="vendor_distributor">配送商</a></li>
 				<li ng-class="{'active': tab=='takeSelf'}"><a ui-sref="vendor_takeSelf">自提点</a></li>
 				<li ng-class="{'active': tab=='logistic'}"><a ui-sref="vendor_logistics">发货地址</a></li>
 			</ul>
+			<!--匹配结果导航-->
+			<!--<div class="addRule-menu">-->
+			<!--<span class="active">-->
+			<!--<a ng-click="">新增配送规则</a>-->
+			<!--<i class="fa fa-remove" ng-click="close()"></i>-->
+			<!--</span>-->
+			<!--</div>-->
 		</div>
-		<!--配送规则-->
-		<div>
-			<h1>配送规则界面{{title}}</h1>
+		<!--配送规则列表-->
+		<div class="delivery-list">
+			<div class="content-header">
+				<a ui-sref="vendor_deliveryRule_add"><i class="fa fa-plus-circle"></i>&nbsp;新增配送规则</a>
+				<span>已设置的配送规则</span>
+			</div>
+			<div class="content-body">
+				<table class="table">
+					<thead>
+					<tr>
+						<th width="80">优先级</th>
+						<th width="120">配送方式</th>
+						<th width="340">规则名称</th>
+						<th width="120">是否生效</th>
+						<th width="120">操作</th>
+					</tr>
+					</thead>
+					<tbody>
+					<tr ng-repeat="rule in rules">
+						<td ng-bind="rule.step">22</td>
+						<td ng-bind="rule.style">第三方配送</td>
+						<td ng-bind="rule.title">深圳市内满100元包邮,不满1000元邮费20元不满1000元</td>
+						<td>
+							<p class="switch">
+									<span class="checkbox" ng-click="disableTab(rule.id)" ng-if="rule.isEffect==0">
+										<span><em></em></span>
+									</span>
+								<span class="checkbox active" ng-click="activeTab(rule.id)" ng-if="rule.isEffect==1">
+										<span><em></em></span>
+									</span>
+							</p>
+						</td>
+						<td>
+							<a ui-sref="vendor_deliveryRule_add">修改</a> | <a ng-click="deleteRule(rule)">删除</a>
+						</td>
+					</tr>
+					<!--<tr>-->
+					<!--<td>23</td>-->
+					<!--<td>第三方配送</td>-->
+					<!--<td>深圳市内满100元包邮,不满1000元邮费20元不满1000元</td>-->
+					<!--<td>-->
+					<!--<p class="switch">-->
+					<!--<span class="checkbox active">-->
+					<!--<span><em></em></span>-->
+					<!--</span>-->
+					<!--</p>-->
+					<!--</td>-->
+					<!--<td>-->
+					<!--<a href="">修改</a> | <a href="">删除</a>-->
+					<!--</td>-->
+					<!--</tr>-->
+					<tr class="record-num" ng-if="rules.length >0">
+						<td colspan="5">
+							<span class="count-tip">显示1-10条,共<em ng-bind="rules.length" style="color: #5078cb">2506</em>条</span>
+						</td>
+					</tr>
+					</tbody>
+					<tbody class="no-record-list" ng-if="rules.length == 0">
+					<tr class="height200">
+						<td colspan="10"><img src="static/img/all/empty-cart.png"><span>暂无配送规则信息!</span></td>
+					</tr>
+					</tbody>
+				</table>
+			</div>
 		</div>
 	</div>
 </div>
+<!--防误删-->
+<div class="com-del-box" ng-if="showDeleteFrame">
+	<div class="title">
+		<a ng-click="cancelDelete()"><i class="fa fa-close fa-lg"></i></a>
+	</div>
+	<div class="content">
+		<p><i class="fa fa-exclamation-circle"></i>是否要删除此规则?</p>
+		<div><a ng-click="cancelDelete()">取消</a><a ng-click="ensureDelete(deleteObject.index)">确认</a></div>
+	</div>
+</div>