表单样式宽度调整

src/main/webapp/resources/js/usercenter/controllers/forstore/buyer_invoice_ctrl.js

@@ -47,58 +47,11 @@ define(['app/app'], function(app) {
 
         $scope.bill = {};
         $scope.bill.address = {};
-        // $scope.bill.is_agree = true;
-        // $scope.linkError = false;
-        // $scope.addressError = false;
-        // $scope.saveInvoice = function() {
-        //     $scope.bill.area = $scope.bill.address.province + "," + $scope.bill.address.city + "," + $scope.bill.address.district;
-        //     var file = null;
-        //     if($scope.bill.billInfo&&$scope.bill.billInfo[0]) {
-        //         file = $scope.bill.billInfo[0];
-        //     }
-        //     $upload.upload({
-        //         url: 'trade/bill/save',
-        //         file: file,
-        //         method: 'POST',
-        //         data: {
-        //             bill: $scope.bill
-        //         }
-        //     }).success(function(data){
-        //         toaster.pop('success', '保存成功');
-        //         sessionStorage.setItem('invoiceType', $scope.bill.kind);
-        //         $state.reload();
-        //     }).error(function(data){
-        //         toaster.pop('error', data);
-        //     });
-        // };
 
-            // $scope.linkmanLen = function()　{
-            //     var size = $scope.bill.name.length;
-            //     // if (num == 1){
-            //     //     size = document.getElementById("mpbillname").value.length;
-            //     // }else if (num == 2){
-            //     //     size = document.getElementById("mzbillname").value.length;
-            //     // }
-            //     if (size > 10) {
-            //         $scope.linkError = true;
-            //         return;
-            //     }
-            //     $scope.linkError = false;
-            // };
-            //
-            // $scope.addressLen = function()　{
-            //     var size = $scope.bill.detailAddress.length;
-            //     // if (num == 1){
-            //     //     size = document.getElementById("mpaddress").value.length;
-            //     // }else if (num == 2){
-            //     //     size = document.getElementById("mzaddress").value.length;
-            //     // }
-            //     if (size > 30) {
-            //         $scope.addressError = true;
-            //         return;
-            //     }
-            //     $scope.addressError = false;
-            // };
+        //许可证上传
+        $scope.onFileUpload = function () {
+            console.log(event.target.files[0]);
+        }
             //保存发票信息
             $scope.saveBill = function() {
                 $scope.bill.kind = $scope.billType
@@ -130,10 +83,6 @@ define(['app/app'], function(app) {
                 });
             }
 
-            $scope.onPermissionUpload = function () {
-                console.log(1)
-            }
-
 
         //设置新增栏目切换发票类型
         $scope.billType = 1206

src/main/webapp/resources/view/usercenter/forstore/buyer_invoice.html

@@ -210,6 +210,7 @@
     #bill-info label {
         font-size: 14px;
         line-height: 1.429;
+        font-weight: normal;
     }
     #bill-info label.disable {
         color: rgb(153, 153, 153);
@@ -319,6 +320,9 @@
     .form-area .row {
         padding-top: 15px;
     }
+    .form-area .address .row {
+        padding-top: 0px;
+    }
     .form-area form {
         padding-top: 15px;
     }
@@ -332,6 +336,31 @@
     .ticket_record_list dl dt span {
         font-weight: normal;
     }
+    /*radio*/
+    .radioLabel {
+        line-height: 20px;
+        cursor: pointer;
+        color: #666;
+    }
+    .radioLabel label{
+        width: 16px;
+        height: 16px;
+        background: url(static/img/user/images/radio.png);
+        background-position: 0 -1px;
+        margin-right: 2px;
+        vertical-align: middle;
+        margin-bottom: 0 !important;
+        margin-right: 0 !important;
+    }
+    .radioLabel input[type="radio"]:checked + label {
+        background-position: -19px -1px;
+    }
+    .radioLabel input[type="radio"]:checked + label + span{
+        color: #5078cb;
+    }
+    .radioLabel input[type="radio"]{
+        display: none;
+    }
 </style>
 <!--右侧主体部分-->
 <div class="user_right fr u_c_invoice">
@@ -402,82 +431,93 @@
                     <label class="col-md-2 normal-control-label"><b class="text-inverse">*</b>发票类型：</label>
                     <div class="radio col-md-10">
                         <label class="radio-inline">
-                            <label class="padding-top-5" ng-click="setBillType(1206)"><input type="radio" ng-model="billType" value="1206" ng-disabled="!isNormal"></label>
+                            <label class="padding-top-5"><input type="radio" ng-click="setBillType(1206)" ng-model="billType" value="1206" ng-disabled="!isNormal"></label>
                             <label ng-class="{'disable':!isNormal, '':isNormal}" class="padding-left-0">增值税普通发票（不可抵扣）</label>
                         </label>
                         <label class="radio-inline">
-                            <label class="padding-top-5" ng-click="setBillType(1205)"><input type="radio" ng-model="billType" value="1205" ng-disabled="!isSpecial"></label>
+                            <label class="padding-top-5"><input type="radio" ng-click="setBillType(1205)" ng-model="billType" value="1205" ng-disabled="!isSpecial"></label>
                             <label ng-class="{'disable':!isSpecial, '':isSpecial}" class="padding-left-0">增值税专用发票（可抵扣） </label>
                         </label>
+                        <!--<label for="1206" class="radio-inline radioLabel">
+                            <input type="radio" name="bill" value="1206" ng-click="setBillType(1206)" ng-model="billType" id="1206">
+                            <label for="1206" class="txtContact"></label>
+                            <span ng-class="{'disable':!isNormal, '':isNormal}">增值税普通发票（不可抵扣）</span>
+                        </label>
+                        <label for="1205" class="radio-inline radioLabel">
+                            <input type="radio" name="bill" value="1205" ng-click="setBillType(1205)" ng-model="billType" id="1205">
+                            <label for="1205" class="txtContact"></label>
+                            <span ng-class="{'disable':!isNormal, '':isNormal}">增值税专用发票（可抵扣）</span>
+                        </label>-->
                     </div>
                 </div>
                 <form class="form-horizontal" novalidate="novalidate" name="form">
                     <div class="form-group">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>发票抬头：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-model="bill.head" ng-focus="form.billHead.$touched = false" ng-blur="form.billHead.$touched = true" name="billHead" ng-maxlength="100" required="required" placeholder="请输入发票抬头">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.billHead.$touched&&form.billHead.$invalid" ng-bind="form.billHead.$error.required?'请填写发票抬头':'请勿超过50个字'"></div>
                     </div>
                     <div class="form-group" ng-if="billType == 1205">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>单位地址：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-model="bill.companyAddress" ng-focus="form.companyAddr.$touched = false" ng-blur="form.companyAddr.$touched = true" name="companyAddr" ng-maxlength="100" required="required" placeholder="请输入单位地址">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.companyAddr.$touched&&form.companyAddr.$invalid" ng-bind="form.companyAddr.$error.required?'请填写单位地址':'请勿超过50个字'"></div>
                     </div>
                     <div class="form-group"  ng-if="billType == 1205">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>单位电话：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-focus="form.companyPhone.$touched = false" ng-blur="form.companyPhone.$touched = true" placeholder="区号和号码使用 '-' 隔开,或者不填区号" name="companyPhone" ng-model="bill.companyPhone" ng-maxlength="20" required="required">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.companyPhone.$touched&&form.companyPhone.$invalid" ng-bind="form.companyPhone.$error.required?'请填写单位电话':'请勿超过20个字符'"></div>
                     </div>
                     <div class="form-group"  ng-if="billType == 1205">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>税务登记号：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-model="bill.companyTaxNumber" ng-focus="form.companyTaxNum.$touched = false" ng-blur="form.companyTaxNum.$touched = true" name="companyTaxNum" required="true" ng-maxlength="20" ng-minlength="15" ng-pattern="/^[0-9a-zA_Z]+$/" placeholder="请输入税务登记号">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.companyTaxNum.$touched&&(form.companyTaxNum.$invalid)" ng-bind="form.companyTaxNum.$error.required?'请填写税务登记号':'请填写15-20位数字或字母'"></div>
                     </div>
                     <div class="form-group"  ng-if="billType == 1205">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>开户银行：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-model="bill.bankName" ng-focus="form.bankName.$touched = false" ng-blur="form.bankName.$touched = true" name="bankName" required="required" ng-maxlength="60" placeholder="请输入开户银行">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.bankName.$touched&&form.bankName.$invalid" ng-bind="form.bankName.$error.required?'请填写开户银行':'请勿超过30个字'"></div>
                     </div>
                     <div class="form-group"  ng-if="billType == 1205">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>开户银行账户：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-model="bill.bankAccount" name="account" ng-focus="form.account.$touched = false" ng-blur="form.account.$touched = true" ng-pattern="/^[0-9]*$/" required ng-maxlength="30" placeholder="请输入开户银行账号">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.account.$touched&&(form.account.$invalid)" ng-bind="form.account.$error.required?'请填写开户银行账号':'请填写30位以内的数字'"></div>
                     </div>
                     <div class="form-group"  ng-if="billType == 1205">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>上传开户许可证：</label>
-                        <div class="col-md-6">
-                            <input type="file" ng-file-select class="form-control" ng-model="bill.permission" name="permission" ng-change="onPermissionUpload()" ng-multiple="false" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg,application/pdf,*.pdf" required>
+                        <div class="col-md-4">
+                            <input type="text" class="form-control" readonly style="background: #fff">
                         </div>
+                        <div class="col-md-1"><input type="file" ng-model="bill.permission" ng-change="onFileUpload()" name="permission" ng-change="onPermissionUpload()" ng-multiple="false" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg,application/pdf,*.pdf" required></div>
                         <div class="text-inverse error col-md-3" ng-show="(bill.permission||form.permission.$touched)&&(form.permission.$invalid)">请上传开户许可证</div>
                     </div>
                     <div class="form-group">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>收票人：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input id="mzbillname" type="text" class="form-control" ng-focus="form.billName.$touched = false" ng-blur="form.billName.$touched = true" ng-model="bill.name" name="billName" required="required" ng-maxlength="20" placeholder="请输入收票人">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.billName.$touched&&(form.billName.$invalid)" ng-bind="form.billName.$error.required?'请填写收票人姓名':'请勿超过10个字'"></div>
                     </div>
                     <div class="form-group">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>联系电话：</label>
-                        <div class="col-md-6">
+                        <div class="col-md-5">
                             <input type="text" class="form-control" ng-model="bill.telephone" ng-focus="form.billTel.$touched = false" ng-blur="form.billTel.$touched = true" name="billTel"
                                    ng-pattern="/^[0-9]*$/" ng-maxlength="11" ng-minlength="8" required="required" placeholder="请输入联系电话">
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.billTel.$touched&&form.billTel.$invalid" ng-bind="form.billTel.$error.required?'请填写联系电话':'请输入8-11位数字'"></div>
                     </div>
                     <div class="form-group address">
-                        <label class="col-md-2 control-label" style="position: relative;top: 20px;"><b class="text-inverse">*</b>所在地区：</label>
+                        <label class="col-md-2 control-label"><b class="text-inverse">*</b>所在地区：</label>
                         <div class="row checkbox">
                             <div class="col-md-3">
                                 <select required="required" class="select-adder form-control"
@@ -504,8 +544,8 @@
                     </div>
                     <div class="form-group">
                         <label class="col-md-2 control-label"><b class="text-inverse">*</b>详细地址：</label>
-                        <div class="col-md-6">
-                            <input id="mzaddress" type="text" class="form-control" required="required" name="billDetail" ng-model="bill.detailAddress" ng-maxlength="60"
+                        <div class="col-md-5">
+                            <input id="mzaddress" type="text" class="form-control" required="required" name="billDetail" ng-model="bill.detailAddress" ng-maxlength="60" title="建议您填写详细发件地址，如街道名，门牌号，楼层和房间号等信息"
                             placeholder="建议您填写详细发件地址，如街道名，门牌号，楼层和房间号等信息" ng-focus="form.billDetail.$touched = false" ng-blur="form.billDetail.$touched = true" >
                         </div>
                         <div class="text-inverse error col-md-3" ng-show="form.billDetail.$touched&&form.billDetail.$invalid" ng-bind="form.billDetail.$error.required?'请填写详细地址':'请勿超过30个字'"></div>