碼上快樂

相關內容    簡體    繁體

layui table 分頁 記住之前勾選的數據

本文轉載自   查看原文   2019-09-11 18:36   980  
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>添加商品</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="../common/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="../common/bootstrap/css/bootstrap.css" media="all">
    <link rel="stylesheet" type="text/css" href="../common/font/iconfont.css" media="all">
    <link rel="stylesheet" type="text/css" href="../css/pages.css" media="all">

    <style type="text/css">
        .clear {
            clear: both;
            height: 0;
            line-height: 0;
            font-size: 0;
            overflow: hidden;
        }

        .top_title {
            margin-bottom: 20px;
            line-height: 45px;
            font-size: 20px;
            font-weight: 600;
            color: #33A7FD;
            border-bottom: 1px solid #eee;
        }

        .layui-input-block .form_text {
            padding: 0;
            margin: 0;
            line-height: 1.8em;
            font-size: 14px;
            color: #999;
        }

        label.layui-form-label {
            width: 145px !important;
            font-size: 18px !important;
            padding: 8px;
        }

        .layui-input-block {
            margin-left: 145px;
            font-size: 18px;
        }

        .vis_hid {
            visibility: hidden;
        }

        .layui-tab-item {
            padding: 20px 20px 20px 10px;
            background-color: #F7F7F7;
        }

        .layui-input {
            font-size: 16px;
        }

        .layui-input:hover {
            border-color: #33A7FD;
        }

        input.layui-input[disabled="disabled"],
        .input_disabled {
            border: 0 !important;
            background: #eeeeee !important;
        }

        input::-webkit-outer-spin-button,
        input::-webkit-inner-spin-button {
            -webkit-appearance: none !important;
            margin: 0;
        }

        input[type="number"] {
            -moz-appearance: textfield;
        }


        @media only screen and (max-width:1600px) {
            #form_data {
                width: 100%;
            }
        }


        /* 商品頭部 選項卡切換 */
        .pro_top_tab {
            position: relative;
            left: 0;
            height: 40px;
            margin-top: 0;
            margin-bottom: 10px;
            border-bottom: 1px solid #e6e6e6;
            white-space: nowrap;
            font-size: 0;
            transition: all .2s;
            -webkit-transition: all .2s;
        }

        .pro_top_tab li {
            display: inline-block;
            *display: inline;
            *zoom: 1;
            vertical-align: middle;
            font-size: 14px;
            transition: all .2s;
            -webkit-transition: all .2s;
            position: relative;
            line-height: 40px;
            min-width: 65px;
            padding: 0 15px;
            text-align: center;
            cursor: pointer;
        }

        .pro_top_tab li a {
            display: block
        }

        .pro_top_tab .tab_this {
            color: #1E9FFF;
            font-weight: 600;
            border-color: #1E9FFF;
        }

        .pro_top_tab .tab_this:after {
            position: absolute;
            left: 0;
            top: 0;
            content: '';
            width: 100%;
            height: 41px;
            border-bottom: 2px solid #1E9FFF;
            border-radius: 2px 2px 0 0;
            box-sizing: border-box;
            pointer-events: none
        }

        /* 商品名稱 */
        .pro_add_unit {}

        .pro_add_unit>.layui-input {
            width: 65%;
        }

        .pro_add_unit .unit_box {
            width: 25%;
            min-width: 180px;
            height: 38px;
            position: absolute;
            right: 0px;
            top: 0px;
        }

        /* 選擇商品分類 */
        .choose_box {
            position: relative;
        }

        .choose_box .choose_inline {
            min-width: 80px;
            height: 38px;
            position: absolute;
            right: -2px;
            top: 0px;
        }

        .choose_box .choose_inline .choose_button {
            display: inline-block;
            height: 38px;
            line-height: 38px;
            padding: 0 18px;
            margin: 0;
            background-color: #33A7FD;
            color: #fff;
            white-space: nowrap;
            text-align: center;
            font-size: 14px;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }

        /* 商品價格 */
        .pro_price {
            height: 41px;
            border: 1px solid #e6e6e6;
            border-radius: 3px;
        }

        .pro_price {}

        .pro_price .layui-input {
            width: 100%;
            float: left;
            border: 0;
            color: #888;
            text-indent: 1em;
        }

        .pro_price .pro_price_unit {
            float: left;
            display: inline-block;
            width: 16.6%;
            line-height: 38px;
            margin: 0;
            background-color: #f9f9f9;
            border: 1px solid #e6e6e6;
            border-radius: 3px;
            text-align: center;
            font-size: 14px;
        }

        /* 商品圖片 */
        .banner_file {
            position: relative;
        }

        .banner_file .banner_inline {
            min-width: 80px;
            height: 38px;
            position: absolute;
            right: -2px;
            top: 0px;
        }

        .banner_file .banner_inline .button_tb {
            display: inline-block;
            height: 38px;
            line-height: 38px;
            padding: 0 18px;
            margin: 0;
            background-color: #33A7FD;
            color: #fff;
            white-space: nowrap;
            text-align: center;
            font-size: 14px;
            border: none;
            cursor: pointer;
        }

        #file_img_list {
            overflow: hidden;
        }

        #file_img_list .file_img {
            float: left;
            margin-right: 45px;
        }

        .banner_file .file_img {
            width: 274px;
            height: 150px;
            border: 1px solid #ccc;
            margin-right: 30px;
            margin-top: 20px;
            background: #FFFFFF url(../images/file_img.png) no-repeat center;
            position: relative;
            text-align: center;
        }

        .banner_file .file_img img,
        .banner_file .file_img video {
            max-width: 100%;
            height: 100%;
        }

        .banner_file .file_img .file_exit {
            padding: 0;
            margin: 0;
            width: 30px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            font-size: 24px;
            position: absolute;
            top: -1px;
            right: -30px;
            cursor: pointer;
            border: 1px solid #ccc;
        }

        .banner_file .file_img_tishi {
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            color: #999;
        }

        #file_video {
            width: 366px;
            height: 200px;
        }

        /* 商品銷量 */
        .pro_sales {
            position: relative;
        }

        .pro_sales .layui-input {
            width: 50%;
            float: left;
            color: #888;
            text-indent: 0.3em;
        }

        .pro_sales .pro_sales_unit {
            float: left;
            display: inline-block;
            width: 50px;
            line-height: 38px;
            margin: 0 0 0 30px;
            background-color: #fafafa;
            border: 1px solid #e6e6e6;
            border-radius: 3px;
            text-align: center;
            font-size: 14px;
        }

        /* 商品狀態選擇 / 商品標簽選擇  */
        .ifon_checkbox_choose {
            display: inline-block;
            vertical-align: middle;
            position: relative;
            height: 30px;
            line-height: 30px;
            margin-right: 10px;
            margin-top: 4px;
            padding-right: 30px;
            cursor: pointer;
            background-color: #fff;
            font-size: 0;
            -webkit-transition: .1s linear;
            transition: .1s linear;
            box-sizing: border-box;
        }

        .ifon_checkbox_choose span {
            display: inline-block;
            vertical-align: middle;
            padding: 0 10px;
            height: 100%;
            border-radius: 2px 0 0 2px;
            background-color: #d2d2d2;
            color: #fff;
            overflow: hidden;
            font-size: 14px;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .ifon_checkbox_choose i {
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            right: 0;
            top: 0;
            width: 30px;
            height: 30px;
            border: 1px solid #d2d2d2;
            border-left: none;
            border-radius: 0 2px 2px 0;
            color: #fff;
            font-size: 20px;
            text-align: center;
        }

        .ifon_checkbox_choose:hover i {
            border-color: #c2c2c2;
            color: #c2c2c2;
        }

        .ifon_checkbox_choose:hover span {
            background-color: #c2c2c2;
        }

        .ifon_checked span,
        .ifon_checked:hover span {
            background-color: #1E9FFF;
        }

        .ifon_checked i,
        .ifon_checked:hover i {
            color: #1E9FFF;
            border-color: #1E9FFF;
        }

        /* 重量 */
        .pro_weight_box {
            position: relative;
        }

        .pro_weight_box .pro_weight {
            width: 50px;
            height: 36px;
            line-height: 36px;
            background-color: #fafafa;
            border: 1px solid #e6e6e6;
            text-align: center;
            font-size: 14px;
            position: absolute;
            right: 1px;
            top: 1px;
        }

        /* 添加規格 */
        /* 是否啟用添加規格  和是否啟用優惠券 */
        .guige_box,
        .state_box {}

        .guige_box .guige_checked,
        .state_box .state_checked {
            display: inline-block;
            margin-top: 4px;
            padding-left: 26px;
            position: relative;
            height: 30px;
            line-height: 30px;
            cursor: pointer;
            -webkit-transition: .1s linear;
            transition: .1s linear;
            box-sizing: border-box;
        }

        .guige_box .guige_checked span,
        .state_box .state_checked span {
            display: inline-block;
            padding: 0 10px;
            height: 100%;
            font-size: 18px;
            border-radius: 3px;
            color: #999;
            overflow: hidden;
        }

        .guige_box .guige_checked i,
        .state_box .state_checked i {
            position: absolute;
            left: 0;
            top: 0;
            width: 25px;
            height: 25px;
            line-height: 25px;
            margin-top: 2px;
            border: 1px solid #d2d2d2;
            border-radius: 3px;
            color: #fff;
            font-size: 18px;
            text-align: center;
        }

        .guige_box .guige_click span,
        .state_box .state_click span {
            font-weight: 500;
            color: #1E9FFF;
        }

        .guige_box .guige_click i,
        .state_box .state_click i {
            border-color: #1E9FFF;
            color: #1E9FFF;
        }

        #guige_div {
            display: none;
        }

        .pro_guige {}

        .pro_guige .guige_text {
            border: 1px solid #ccc;
            padding: 8px;
            margin: 10px 0;
            position: relative;
        }

        .pro_guige .guige_inline {
            min-width: 80px;
            height: 38px;
            position: absolute;
            right: 8px;
            top: 8px;
        }

        .pro_guige .guige_inline .button_tb {
            float: right;
            display: inline-block;
            height: 38px;
            line-height: 38px;
            padding: 0 18px;
            margin: 0;
            background-color: #33A7FD;
            color: #fff;
            white-space: nowrap;
            text-align: center;
            font-size: 14px;
            border: none;
            cursor: pointer;
        }

        .pro_guige .guige_inline .guige_exit {
            float: right;
            padding: 0;
            margin: 0;
            width: 38px;
            height: 38px;
            line-height: 38px;
            background-color: #EB6160;
            color: #fff;
            text-align: center;
            font-size: 24px;
            cursor: pointer;
        }


        .pro_guige .guige_list {
            margin: 15px;
        }

        .pro_guige .guige_list li {
            display: inline-block;
            width: 295px;
            height: 38px;
            line-height: 38px;
            border: 1px solid #e6e6e6;
            background-color: #fff;
            border-radius: 3px;
            margin: 10px;
        }

        .pro_guige .guige_list li input {
            float: left;
            width: 180px;
            height: 36px;
            padding-left: 10px;
            border: 0;
        }

        .pro_guige .guige_list li .input_guige_checkbox {
            float: left;
            width: 38px;
            height: 100%;
            border-right: 1px solid #e6e6e6;
            text-align: center;
        }

        .pro_guige .guige_list li .input_guige_checkbox i {
            font-size: 16px;
            border: 1px solid #e6e6e6;
        }

        .pro_guige .guige_list li .input_guige_click i {
            color: #fff;
            border-color: #33A7FD;
            background-color: #33A7FD;
        }

        .pro_guige .guige_list li .input_guige_exit,
        .pro_guige .guige_list li .input_guige_mobile {
            float: right;
            padding: 0;
            margin: 0;
            width: 35px;
            height: 100%;
            border-left: 1px solid #e6e6e6;
            text-align: center;
            cursor: pointer;
            -moz-user-select: none;
            /*火狐*/
            -webkit-user-select: none;
            /*webkit瀏覽器*/
            -ms-user-select: none;
            /*IE10*/
            -khtml-user-select: none;
            /*早期瀏覽器*/
            user-select: none;
        }

        .pro_guige .guige_list li .input_guige_exit {
            font-size: 26px;
        }

        .pro_guige .guige_list li .input_guige_mobile {}

        /* 參數 */
        #pro_canshu_list {
            position: relative;
        }

        .pro_canshu {
            font-size: 16px;
            height: 38px;
            line-height: 38px;
            margin-bottom: 18px;
            position: relative;
        }

        .pro_canshu .canshu_left {
            width: 150px;
            height: 100%;
            float: left;
            margin-right: 45px;
        }

        .pro_canshu .canshu_left input {
            width: 100%;
        }

        .pro_canshu .canshu_right {}

        .pro_canshu .canshu_exit,
        .pro_canshu .canshu_mobile {
            float: left;
            margin-left: 60px;
            text-align: center;
            cursor: pointer;
            -moz-user-select: none;
            /*火狐*/
            -webkit-user-select: none;
            /*webkit瀏覽器*/
            -ms-user-select: none;
            /*IE10*/
            -khtml-user-select: none;
            /*早期瀏覽器*/
            user-select: none;
        }

        .pro_canshu .canshu_exit {
            width: 38px;
            height: 38px;
            border: 2px solid #dedede;
            font-size: 24px;
        }

        .pro_canshu .canshu_mobile {
            display: inline-block;
            padding: 0px 15px;
            border: 1px solid #dedede;
            font-size: 14px;
        }

        .pro_canshu input {
            width: 50%;
            height: 38px;
            float: left;
        }

        .pro_buttom {
            display: inline-block;
            height: 38px;
            line-height: 38px;
            padding: 0 18px;
            margin: 0 3px;
            background-color: #33A7FD;
            color: #fff;
            white-space: nowrap;
            text-align: center;
            font-size: 14px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            outline: 0;
            -webkit-appearance: none;
            transition: all .3s;
            -webkit-transition: all .3s;
            box-sizing: border-box;
        }

        .pro_buttom:hover {
            opacity: 0.8;
            filter: alpha(opacity=80);
            color: #fff;
        }


        .pro_time {
            width: 350px;
            font-size: 15px;
        }

        /* 優惠額度 */
        /* .pro_preferential {padding:0 50px 0 65px; width:350px; height:40px; border:1px solid #e6e6e6; border-radius:3px; position: relative; }
        .pro_preferential .layui-input{  border:0; color:#888; }
        .pro_preferential .preferential_box ,.pro_preferential .pro_weight{ height: 38px; line-height:38px; background-color:#fafafa; border:1px solid #e6e6e6; text-align: center; font-size: 14px; position:absolute; top:0px;  }
        .pro_preferential .preferential_box{width:65px; left:0px;  }
        .pro_preferential .pro_weight{width:50px; right:0px;  } */

        /* 獲取積分 */
        .pro_jifen {}

        .pro_jifen dd {
            float: left;
            width: 180px;
            height: 38px;
            line-height: 38px;
            margin-right: 30px;
            font-size: 16px;
        }

        .pro_jifen dd .canshu_exit,
        .pro_jifen dd .hy_canshu_exit {
            width: 38px;
            height: 38px;
            margin: 0;
            border: 5px;
            border: 1px solid #dedede;
            line-height: 38px;
            text-align: center;
            font-size: 24px;
            cursor: pointer;
        }

        .form_select {
            position: relative;
        }

        .form_select_title .layui-input {
            padding-right: 30px;
            cursor: pointer;
        }

        .form_select_title .layui-edge {
            position: absolute;
            right: 10px;
            top: 50%;
            margin-top: -3px;
            cursor: pointer;
            border-width: 6px;
            border-top-color: #c2c2c2;
            border-top-style: solid;
            transition: all .3s;
            -webkit-transition: all .3s;
        }

        .form_select_click .layui-edge {
            margin-top: -9px\0/IE9;
            margin-top: -9px;
            -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
            margin-top: -3px\9;
        }

        .form_select_upbit {
            display: none;
            position: absolute;
            left: 0;
            top: 42px;
            z-index: 899;
            padding: 5px 0;
            min-width: 100%;
            max-height: 300px;
            border: 1px solid #d2d2d2;
            overflow-y: auto;
            background-color: #fff;
            border-radius: 2px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
            box-sizing: border-box;
            -webkit-animation-name: layui-upbit;
            animation-name: layui-upbit;
            -webkit-animation-duration: .3s;
            animation-duration: .3s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
        }

        .form_select_upbit li {
            cursor: pointer;
            padding: 0 10px;
            line-height: 36px;
            font-size: 14px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .form_select_upbit li:hover {
            background-color: #f2f2f2;
            -webkit-transition: .5s all;
            transition: .5s all;
        }

        .form_select_upbit .select_tips {
            color: #999;
        }

        .form_select_upbit .select_this,
        .form_select_upbit .select_this:hover {
            background-color: #1E9FFF;
            color: #fff;
        }

        .jifen_box {
            /* overflow: hidden; */
        }

        .pro_jifen_box {
            margin-bottom: 20px;
        }

        .pro_jifen_box .jifen_box_title {
            float: left;
            display: block;
            width: 245px;
            padding: 8px;
            line-height: 20px;
            font-size: 18px;
            font-weight: 400;
            text-align: right;
        }

        .pro_jifen_box .jifen_box_form {
            float: left;
            display: block;
            margin-left: 10px;
        }

        /* 彈窗樣式 */
        #details_layer {
            z-index: 888;
            width: 100%;
            min-width: 500px;
            position: fixed;
            top: 0;
            left: 0;
            visibility: hidden;
            background-color: rgba(0, 0, 0, 0.2);
        }

        #details_layer .details_export {
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            z-index: 889;
            width: 60%;
            min-height: 360px;
            overflow: auto;
            position: absolute;
            top: 40%;
            left: 50%;
            margin: -180px 0 0 -30%;
            padding: 20px 20px 85px 20px;
            background-color: #fff;
            border-radius: 5px;
        }

        #details_layer .layer_top {
            height: 35px;
            line-height: 35px;
            padding-left: 10px;
            border-left: 4px solid #33A7FD;
            font-size: 18px;
        }

        #details_layer .layer_top span {
            padding: 0px 8px;
            color: #33A7FD;
        }

        #details_layer .tc_button {
            width: 100%;
            height: 70px;
            padding-top: 15px;
            text-align: center;
            font-size: 16px;
            background-color: #fff;
            position: absolute;
            left: 0;
            bottom: 0px;
        }

        #details_layer .tc_button button {
            display: inline-block;
            width: 100px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            border-radius: 5px;
            border: 0;
        }

        #details_layer #tc_determine {
            background-color: #33A7FD;
            color: #fff;
            margin-right: 10%;
        }

        #details_layer #tc_cancel {}

        .details_box {
            height: 246px;
            overflow-x: hidden;
            overflow-y: scroll;
        }

        /* 列表數據樣式 */
        .data_list {
            padding-top: 25px;
        }

        #data_list_info {}

        #data_list_info span {
            display: inline-block;
            min-width: 120px;
            height: 45px;
            padding: 0 5px;
            margin: 0 8px 10px;
            border-radius: 5px;
            border: 1px solid #C1C1C1;
            text-align: center;
            line-height: 45px;
            font-size: 16px;
            cursor: pointer;
        }
    </style>
    <style type="text/css">
        table {
            margin-left: 140px;
            width: 90%;
            border-collapse: collapse;

            /*margin: 0 auto;*/

            text-align: center;

        }

        table td,
        table th {
            text-align: center;
            border: 1px solid #cad9ea;

            color: #666;

            height: 30px;

        }

        table thead th {

            background-color: #CCE8EB;

            width: 100px;

        }

        table tr:nth-child(odd) {

            background: #fff;

        }

        table tr:nth-child(even) {

            background: #F5FAFA;

        }
    </style>
    <script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="../js/jquery.cookie.js"></script>
    <!-- 移動排序
    <script type="text/javascript" src="./drag_sorting/jquery.min.js"></script> -->
    <script type="text/javascript" src="./drag_sorting/drag-arrange.js"></script>


</head>

<body>

    <div class="layui-tab layui-tab-brief" id="product_tab" lay-filter="docDemoTabBrief">
        <ul class="pro_top_tab ">
            <li class="tab_this">基本</li>
            <li>庫存/規格</li>
            <li>參數</li>
            <li>詳情</li>
            <li>購買權限</li>
            <!-- <li>購買權限</li>
            <li>優惠券</li> -->
            <!-- <li id="product_jifen_but">商品積分</li> -->
        </ul>
        <form class="layui-form col-xs-9" id="form_data" enctype="multipart/form-data">
            <div class="layui-tab-content">
                <!-- 基本 -->
                <div class="layui-tab-item layui-show">
                    <div class="layui-form-item">
                        <label class="layui-form-label">排序：</label>
                        <div class="layui-input-block">
                            <input type="number" maxlength="5" name="sqe" autocomplete="off"
                                lay-verify="required|number" class="layui-input sqe" placeholder="排序號">
                            <p class="form_text"> 數字越大，排名越靠前；如果為空，默認排序方式為創建時間。</p>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">款號：</label>
                        <div class="layui-input-block">
                            <input type="text" name="modelNumber" autocomplete="off" lay-verify="required"
                                class="layui-input modelNumber" placeholder="款號">
                        </div>
                    </div>
                    <div class="layui-form-item" style="display: none">
                        <label class="layui-form-label">品牌商code：</label>
                        <div class="layui-input-block">
                            <input maxlength="5" name="merchantCode" autocomplete="off" class="layui-input merchantCode"
                                placeholder="品牌商code">
                        </div>
                    </div>
                    <div class="layui-form-item" style="display: none">
                        <label class="layui-form-label">品牌商名字：</label>
                        <div class="layui-input-block">
                            <input maxlength="5" name="merchantName" autocomplete="off" class="layui-input merchantName"
                                placeholder="品牌商名字">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">商品名稱：</label>
                        <div class="layui-input-block pro_add_unit">
                            <input type="text" name="name" autocomplete="off" lay-verify="required"
                                class="layui-input info_name" placeholder="商品名稱">
                            <div class="unit_box">
                                <input type="text" name="unit" class="layui-input unit" placeholder="單位：如個/件/包">
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">商品分類：</label>
                        <div class="layui-input-block choose_box">
                            <input type="hidden" name="typeId" title="商品分類" value="0" class="typeId" id="typeid">
                            <input type="text" readonly="true" autocomplete="off"
                                class="layui-input input_disabled typeId_text" name="typeid_text" id="typeid_text"
                                placeholder="請選擇商品分類">
                            <div class="choose_inline">
                                <label class="choose_button" id="choose_pro"
                                    style="background-color:#e9e9e9; color:#333;">選擇商品分類</label>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">商品價格：</label>
                        <div class="layui-input-block pro_price">
                            <input type="number" name="price" autocomplete="off" max="9999" min="0"
                                lay-verify="required|number" class="layui-input" placeholder="商品價格(元)">
                            <!-- <p class="pro_price_unit">元&emsp;原價：</p>
                        <input type="number" name="originalPrice" autocomplete="off" max="9999" min="0" lay-verify="required" class="layui-input" placeholder="原價(元)" >
                        <p class="pro_price_unit">元&emsp;</p> -->
                            <!-- <p class="pro_price_unit">元&emsp;會員價：</p> -->
                            <!-- <input type="number" name="memberPrice" autocomplete="off" max="9999" min="0" lay-verify="required|number" class="layui-input" placeholder="會員價(元)" >
                        <p class="pro_price_unit" style="float:right;">元</p> -->
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">原價：</label>
                        <div class="layui-input-block pro_price">
                            <input type="number" name="originalPrice" autocomplete="off" max="9999" min="0"
                                lay-verify="required" class="layui-input" placeholder="原價(元)">
                            <!-- <p class="pro_price_unit">元&emsp;原價：</p>
                            <input type="number" name="originalPrice" autocomplete="off" max="9999" min="0" lay-verify="required" class="layui-input" placeholder="原價(元)" >
                            <p class="pro_price_unit">元&emsp;</p> -->
                            <!-- <p class="pro_price_unit">元&emsp;會員價：</p> -->
                            <!-- <input type="number" name="memberPrice" autocomplete="off" max="9999" min="0" lay-verify="required|number" class="layui-input" placeholder="會員價(元)" >
                            <p class="pro_price_unit" style="float:right;">元</p> -->
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">商品屬性：</label>
                        <div class="layui-input-block form_checkbox" id="product_attribute">
                            <input type="hidden" name="ispromotion" title="促銷商品" value="0" class="ispromotion">
                            <div class="ifon_checkbox_choose ispromotion"><span>促銷商品</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="isreferentia" title="限時促銷" value="0" class="isreferentia">
                            <div class="ifon_checkbox_choose isreferentia"><span>限時促銷</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="isnewProducts" title="新品上架" value="0" class="isnewProducts">
                            <div class="ifon_checkbox_choose isnewProducts"><span>新品上架</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="isrecommend" title="推薦商品" value="0" class="isrecommend">
                            <div class="ifon_checkbox_choose isrecommend"><span>推薦商品</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="ishost" title="熱賣商品" value="0" class="ishost">
                            <div class="ifon_checkbox_choose ishost"><span>熱賣商品</span><i
                                    class="layui-icon layui-icon-ok"></i></div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">商品圖片：</label>
                        <div class="layui-input-block banner_file">
                            <!-- 商品修改  imgFlag 圖片修改標識 0未修改  1重新傳問價留 2 刪除個別鏈接
                        DBImgUrl  刪除幾張圖片后   直接存入數據庫的 鏈接  -->
                            <input type="hidden" name="imgFlag" title="商品圖片修改狀態" value="0" class="imgFlag" id="imgFlag">
                            <input type="text" readonly="true" autocomplete="off" name="productImg" id="productImg"
                                class="layui-input productImg_url input_disabled" title="商品圖片url">
                            <div class="banner_inline">
                                <label class="button_tb" for="female">選擇圖片</label>
                                <input class="layui-upload-file productImg" name="file" type="file" accept="image/*"
                                    id="female" multiple="multiple">
                            </div>
                            <div class="file_img_list" id="file_img_list">
                                <!-- <div class="file_img">
                                <p class="file_exit">&times;</p>
                                <img src="" alt="">
                               </div> -->

                            </div>  
                            <p class="file_img_tishi">縮略圖 尺寸建議寬度640*350，並保持圖片尺寸大小保持一致。</p>
                        </div>
                    </div>

                    <!-- <div class="layui-form-item">
                    <label class="layui-form-label">商品視屏：</label>
                    <div class="layui-input-block banner_file" >
                        <input type="text" readonly="true" autocomplete="off" id="productVideo" class="layui-input input_disabled">
                        <div class="banner_inline">
                            <label class="button_tb" for="female_video" >選擇商品視屏</label>
                            <input class="layui-upload-file" type="file" name="productVideo" id="female_video">
                        </div>
                        <div class="file_img" id="file_video">
                            <p class="file_exit">&times;</p>
                            <video src="" controls="controls">Your browser does not support the video tag.</video>
                        </div>
                        <p class="file_img_tishi">商品視屏 尺寸建議寬度640*350。</p>
                    </div>
                </div> -->

                    <div class="layui-form-item">
                        <label class="layui-form-label">商品銷量：</label>
                        <div class="layui-input-block pro_sales">
                            <input type="number" name="actualsales" autocomplete="off" class="layui-input"
                                placeholder="商品銷量">
                            <div class="pro_sales_unit"> 件 </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">&emsp;</label>
                        <div class="layui-input-block pro_sales_checkbox">
                            <input type="checkbox" lay-skin="primary" title="顯示銷量">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">商品標簽：</label>
                        <div class="layui-input-block form_checkbox">
                            <input type="hidden" name="isgenuine" title="品質保證" value="0" class="isgenuine">
                            <div class="ifon_checkbox_choose isgenuine"><span>品質保證</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="isdaysreturn" title="7天無理由退貨" value="0" class="isdaysreturn">
                            <div class="ifon_checkbox_choose isdaysreturn"><span>7天無理由退貨</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="repidrefund" title="急速退款" value="0" class="repidrefund">
                            <div class="ifon_checkbox_choose repidrefund"><span>急速退款</span><i
                                    class="layui-icon layui-icon-ok"></i></div>

                            <input type="hidden" name="freefreighe" title="贈運險費" value="0" class="freefreighe">
                            <div class="ifon_checkbox_choose freefreighe"><span>贈運險費</span><i
                                    class="layui-icon layui-icon-ok"></i></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                    <label class="layui-form-label">商品狀態：</label>
                    <div class="layui-input-block">
                        <input type="radio" name="status" value="0" title="上架" checked="">
                        <input type="radio" name="status" value="1" title="下架">
                    </div>
                </div>

                    <!-- 下一步操作 -->
                    <div class="layui-form-item" style="margin-top:50px;">
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-lg product_next"
                                box_index="1">&ensp;下一步&ensp;</button>
                        </div>
                    </div>
                </div>
                <!-- 庫存/規格 -->
                <div class="layui-tab-item">

                    <div class="layui-form-item"   style="display: none">
                        <label class="layui-form-label">編碼：</label>
                        <div class="layui-input-block" style="width:50%;">
                            <input type="text" name="productCode" autocomplete="off" class="layui-input"
                                placeholder="商品編碼">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">重量：</label>
                        <div class="layui-input-block pro_weight_box" style="width:40%;">
                            <input type="number" name="weight" autocomplete="off" class="layui-input"
                                placeholder="商品重量">
                            <div class="pro_weight"> 克 </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">最多購買：</label>
                        <div class="layui-input-block pro_weight_box" style="width:50%;">
                            <input type="number" name="buyMax" autocomplete="off" class="layui-input"
                                placeholder="最多購買數">
                            <div class="pro_weight">&emsp;件&emsp;</div>
                            <p class="form_text"> 用戶購買過的此商品數量限制。</p>
                        </div>
                    </div>
                    <!--<div class="layui-form-item">-->
                    <!--<label class="layui-form-label">庫存：</label>-->
                    <!--<div class="layui-input-block" style="width:30%;">-->
                    <!--<input type="number" name="stock" autocomplete="off" class="layui-input" placeholder="商品庫存">-->
                    <!--</div>-->
                    <!--</div>-->
                    <!--藍色分割線
                <hr class="layui-bg-blue" style="width:90%; margin:0 auto 20px;">-->

                    <div class="layui-form-item">
                        <label class="layui-form-label">規格：</label>
                        <div class="layui-input-block guige_box">
                            <div class="guige_checked" checked_id="0"><i
                                    class="layui-icon layui-icon-ok"></i><span>啟用商品規格</span></div>
                            <input type="hidden" id="specification" value="">
                            <div class="pro_buttom" id="guige_but" style="float:right"><i
                                    class="icon iconfont icon-jia2"></i>&ensp;添加規格&ensp;</div>
                            <div class="pro_buttom" id="guige_tegetder" style="float: right;">&ensp;組合&ensp;</div>
                            <div id="guige_div">
                                <dl class="pro_guige" id="pro_guige_list">
                                    <dd class="guige_text">
                                        <input type="text" autocomplete="off" class="layui-input guige_type"
                                            placeholder="請輸入規格類型">
                                        <div class="guige_inline">
                                            <p class="guige_exit">&times;</p>
                                            <label class="button_tb"><i
                                                    class="icon iconfont icon-jia2"></i>&ensp;添加規格項</label>

                                        </div>

                                        <ul class="guige_list">
                                            <p class="clear"></p>
                                            <li>
                                                <div class="input_guige_checkbox input_guige_click" checked_in="1"><i
                                                        class="layui-icon layui-icon-ok"></i></div>
                                                <input type="text" class="input_guige">
                                                <div class="input_guige_mobile"><i
                                                        class="icon iconfont icon-yidong"></i></div>
                                                <div class="input_guige_exit">&times;</div>
                                            </li>
                                        </ul>
                                    </dd>
                                </dl>

                            </div>
                        </div>

                        <script type="text/javascript">




                            var tablearrinfo = {};
                            // 組合
                            $('#guige_tegetder').on('click', function () {
                                $('.tablehead').empty();
                                $('.tablebody').empty();
                                $('.vip').show();
                                // 表頭處理開始
                                $('.tablehead').append('<th>庫存</th><th>價格</th><th>sku規格 Code</th>');
                                $('.guige_type').eq(1).val() != undefined ? $('.tablehead').prepend('<th>' + $('.guige_type').eq(1).val() + '</th> ') : null;
                                $('.tablehead').prepend('<th>' + $('.guige_type').eq(0).val() + '</th> ');
                                // 表頭處理結束
                                // 表體開始
                                let inpu = $('.guige_list').eq(0).find('li');
                                let inpus = $('.guige_list').eq(1).find('li').children('input');
                                console.log(inpus);
                                console.log($('.guige_text').length);
                                for (var i = 0; i < inpu.length; i++) {
                                    if ($('.guige_text').length == 1) {
                                        // $('.tablebody').eq(0).append('<td>'+$('.input_guige').eq(i).val()+'</td>');
                                        $('.tablebody').eq(0).append('<tr>' + '<td class="jq">' + $('.input_guige').eq(i).val() + '</td>' +
                                            '<td><input type="text"></td>>' + '<td><input type="text"></td>>' + '</tr>');
                                    }

                                    if ($('.guige_text').length > 1) {
                                        for (var k = 0; k < inpus.length; k++) {
                                            $('.tablebody').eq(0).append('<tr class="trinfo">' + '<td class="tdinfo">' + $('.input_guige').eq(i).val() + '</td>' + '<td class="td2info">' + inpus.eq(k).val() + '</td>' + '<td><input class="cun" type="text" value="0"></td>>' + '<td><input class="pice" type="text" value="0"></td>>' + '<td><input class="sku_code" type="text" value="0"></td>>' + '</tr>');
                                        }
                                    }
                                }
                                // 表體結束'

                                $('.product_next').click(function () {
                                    var theadarr = []
                                    var tabodyarr = [];
                                    theadarr.push($('.guige_type').eq(0).val(), $('.guige_type').eq(1).val());
                                    for (var j = 0; j < $('.tablebody').children('tr').length; j++) {
                                        var duidui = [];
                                        duidui.push($('.tdinfo').eq(j).text(), $('.td2info').eq(j).text());
                                        tabodyarr.push({
                                            amount: $('.cun').eq(j).val(),
                                            price: $('.pice').eq(j).val(),
                                            mem_price: $('.vips').eq(j).val(),
                                            sku_code: $('.sku_code').eq(j).val(),
                                            standards: duidui
                                        });
                                        tablearrinfo.bundles = theadarr;
                                        tablearrinfo.list = tabodyarr;
                                        console.log(tablearrinfo);

                                    }
                                })
                                // console.log($('.guige_list').eq(0).find('.input_guige').val());
                            })
                            //點擊啟用商品規格
                            $(".guige_box .guige_checked").click(function () {
                                if ($(this).attr('checked_id') == '0') {
                                    $(this).attr('checked_id', '1');
                                    $(this).addClass("guige_click");
                                    $(this).siblings('#guige_div').css('display', 'block');
                                    $(this).siblings('#specification').attr("name", "specification");
                                } else {
                                    $(this).attr('checked_id', '0');
                                    $(this).removeClass("guige_click");
                                    $(this).siblings('#guige_div').css('display', 'none');
                                    $(this).siblings('#specification').removeAttr("name");
                                };
                            });

                            //點擊添加規格類型
                            var canshu_id = 1;
                            $("#guige_but").click(function () {
                                if ($('#pro_guige_list').children().length == 2) {
                                    layer.msg('不能再添加窩~~');
                                    return;
                                }
                                $("#pro_guige_list").append('<dd class="guige_text">' +
                                    '<input type="text" autocomplete="off" class="layui-input guige_type" placeholder="請輸入規格類型">' +
                                    '<div class="guige_inline"><p class="guige_exit" >&times;</p><label class="button_tb"><i class="icon iconfont icon-jia2"></i>&ensp;添加規格項</label></div>' +
                                    '<ul class="guige_list"><p class="clear"></p> <li>' +
                                    '<div class="input_guige_checkbox input_guige_click" checked_in="1"><i class="layui-icon layui-icon-ok"></i></div>' +
                                    '<input type="text" class="input_guige" >' +
                                    '<div class="input_guige_mobile"><i class="icon iconfont icon-yidong"></i></div><div class="input_guige_exit">&times;</div>' +
                                    '</li></ul></dd>');
                                canshu_id++;
                            });
                            //點擊 規格類型 里面的 .canshu_exit 清除整個規格類型
                            $(document).on("click", "#pro_guige_list .guige_exit", function () {
                                //$(this).parent().remove(); parents
                                //alert($(this).parents('.pro_canshu').attr('canshu-id'));
                                //console.log($(this).parents('.pro_canshu').index());
                                $(this).parents('.guige_text').remove();
                            });

                            //點擊 規格類型 里面的 .button_tb 添加規格子類型
                            $(document).on("click", "#pro_guige_list .button_tb", function () {
                                //console.log('添加規格子類型');
                                $(this).parents(".guige_inline").siblings(".guige_list").append('<li>' +
                                    '<div class="input_guige_checkbox input_guige_click" checked_in="1"><i class="layui-icon layui-icon-ok"></i></div>' +
                                    '<input type="text" class="input_guige" >' +
                                    '<div class="input_guige_mobile"><i class="icon iconfont icon-yidong"></i></div><div class="input_guige_exit">&times;</div></li>');
                            });

                            //點擊 子規格的 .input_guige_exit 清除整個 li 規格類型
                            $(document).on("click", "#pro_guige_list .guige_list .input_guige_exit", function () {
                                $(this).parents('li').remove();
                            });

                            //點擊 子規格的 .input_guige_checkbox 勾選 規格類型 或者取消勾選
                            /*$(document).on("click","#pro_guige_list .guige_list .input_guige_checkbox",function(){
                                if ($(this).attr("checked_in")=="0") {
                                    $(this).addClass('input_guige_click');
                                    $(this).attr("checked_in","1");
                                }else if($(this).attr("checked_in")=="1"){
                                    $(this).removeClass('input_guige_click');
                                    $(this).attr("checked_in","0");
                                };
                            });*/

                            //綁定拖動事件  進行排序
                            $(document).on("mousedown", ".guige_list li .input_guige_mobile", function () {
                                $('.guige_list li').arrangeable({ dragSelector: '.input_guige_mobile' });
                            });
                            $(document).on("mousemove", ".guige_list li .input_guige_mobile", function () {
                                $('.guige_list li').arrangeable({ dragSelector: '.input_guige_mobile' });
                            });
                            $(document).on("mouseup", ".guige_list li .input_guige_mobile", function () {
                                $('.guige_list li').arrangeable({ dragSelector: '.input_guige_mobile' });
                            });
                            $(document).on("touchstart", ".guige_list li .input_guige_mobile", function () {
                                $('.guige_list li').arrangeable({ dragSelector: '.input_guige_mobile' });
                            });
                            $(document).on("touchmove", ".guige_list li .input_guige_mobile", function () {
                                $('.guige_list li').arrangeable({ dragSelector: '.input_guige_mobile' });
                            });
                            $(document).on("touchend", ".guige_list li .input_guige_mobile", function () {
                                $('.guige_list li').arrangeable({ dragSelector: '.input_guige_mobile' });
                            });
                        </script>
                    </div>
                    <table class="gridtable">
                        <thead>
                            <tr class="tablehead">
                                <th hidden class="vip">會員</th>
                                <th hidden class="vip">庫存</th>
                                <th hidden class="vip">價格</th>
                            </tr>
                        </thead>
                        <tbody class="tablebody">

                        </tbody>
                    </table>
                    <!-- 下一步操作 -->
                    <div class="layui-form-item" style="margin-top:50px;">
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-lg product_next"
                                box_index="2">&ensp;下一步&ensp;</button>
                        </div>
                    </div>
                </div>
                <!-- 參數 -->
                <div class="layui-tab-item">
                    <div class="layui-form-item">
                        <label class="layui-form-label">參數：</label>
                        <div class="layui-input-block" style="padding-left:20px;">
                            <div class="pro_canshu">
                                <div class="canshu_left"> 參數名稱 </div>
                                <div class="canshu_right"> 參數值 可拖動進行排序 </div>
                                <p class="clear"></p>
                            </div>

                            <div class="pro_canshu_list" id="pro_canshu_list">
                                <input type="hidden" name="productParams" id="productParams" value="">
                                <ul>
                                    <li class="pro_canshu" canshu-id="0">
                                        <div class="canshu_left"><input type="text" class="layui-input canshu_name">
                                        </div>
                                        <input type="text" class="layui-input canshu_value">
                                        <p class="canshu_exit">&times;</p>
                                        <p class="canshu_mobile"><i class="icon iconfont icon-yidong"></i>&ensp;推動排序</p>

                                        <p class="clear"></p>
                                    </li>
                                </ul>
                            </div>

                            <p class="clear"></p>
                            <div class="pro_buttom" id="canshu_but"><i
                                    class="icon iconfont icon-jia2"></i>&ensp;添加參數&ensp;</div>
                            <script type="text/javascript">
                                //點擊添加規格
                                var canshu_id = 1;
                                $("#canshu_but").click(function () {
                                    $("#pro_canshu_list ul").append('<li class="pro_canshu" canshu-id="' + canshu_id + '"><div class="canshu_left"><input type="text" class="layui-input canshu_name"></div><input type="text" class="layui-input canshu_value"><p class="canshu_exit">&times;</p><p class="canshu_mobile"><i class="icon iconfont icon-yidong"></i>&ensp;推動排序</p><p class="clear"></p></li>');
                                    canshu_id++;
                                });
                                //點擊添加規格 里面的 .canshu_exit 清除整個屬性參數
                                $(document).on("click", "#pro_canshu_list .pro_canshu .canshu_exit", function () {
                                    //$(this).parent().remove(); parents
                                    //alert($(this).parents('.pro_canshu').attr('canshu-id'));
                                    //console.log($(this).parents('.pro_canshu').index());
                                    $(this).parents('.pro_canshu').remove();
                                });
                                //綁定拖動事件  進行排序
                                $(document).on("mousedown", "#pro_canshu_list .pro_canshu .canshu_mobile", function () {
                                    $('#pro_canshu_list .pro_canshu').arrangeable({ dragSelector: '.canshu_mobile' });
                                });
                                $(document).on("mousemove", "#pro_canshu_list .pro_canshu .canshu_mobile", function () {
                                    $('#pro_canshu_list .pro_canshu').arrangeable({ dragSelector: '.canshu_mobile' });
                                });
                                $(document).on("mouseup", "#pro_canshu_list .pro_canshu .canshu_mobile", function () {
                                    $('#pro_canshu_list .pro_canshu').arrangeable({ dragSelector: '.canshu_mobile' });
                                });
                                $(document).on("touchstart", "#pro_canshu_list .pro_canshu .canshu_mobile", function () {
                                    $('#pro_canshu_list .pro_canshu').arrangeable({ dragSelector: '.canshu_mobile' });
                                });
                                $(document).on("touchmove", "#pro_canshu_list .pro_canshu .canshu_mobile", function () {
                                    $('#pro_canshu_list .pro_canshu').arrangeable({ dragSelector: '.canshu_mobile' });
                                });
                                $(document).on("touchend", "#pro_canshu_list .pro_canshu .canshu_mobile", function () {
                                    $('#pro_canshu_list .pro_canshu').arrangeable({ dragSelector: '.canshu_mobile' });
                                });
                            </script>
                        </div>
                    </div>

                    <!-- 下一步操作 -->
                    <div class="layui-form-item" style="margin-top:50px;">
                        <div class="layui-input-block" style="padding-left: 20px;">
                            <button type="button" class="layui-btn layui-btn-lg product_next"
                                box_index="3">&ensp;下一步&ensp;</button>
                        </div>
                    </div>
                </div>
                <!-- 詳情 -->
                <div class="layui-tab-item">
                    <div class="layui-form-item">
                        <label class="layui-form-label">詳情：</label>
                        <div class="layui-input-block">
                            <textarea id="details_demo" name="appdetailhtml" style="display: none;"></textarea>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">套餐的使用次數：</label>
                        <div class="layui-input-block" style="width:50%;">
                            <input type="text" name="number" id="info_number" autocomplete="off" class="layui-input"
                                placeholder="套餐的使用次數">
                        </div>
                    </div>
                    <!-- <input type="hidden" class="info_type" id="info_type" name="type" title="商品促銷 類型" value="" />
                    <input type="hidden" class="info_type" id="info_type1" name="type" title="商品促銷 類型" value="" /> -->
                    <!-- 下一步操作 -->
                    <!-- <div class="layui-form-item" style="margin-top:50px;">
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn layui-btn-lg product_next" box_index="4" >&ensp;下一步&ensp;</button>
                    </div>
                </div> -->
                    <!-- 提交添加商品 -->
                    <div class="layui-form-item" style="margin-top:50px;">
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-lg"
                                id="form_add_but">&ensp;添加商品&ensp;</button>
                            <button type="reset"
                                class="layui-btn layui-btn-lg layui-btn-primary">&ensp;重置&ensp;</button>
                        </div>
                    </div>
                </div>
                <!-- 購買權限 -->
                <div class="layui-tab-item">
                    <div>

                    </div>

                    <!-- 下一步操作 -->
                    <div class="layui-form-item" style="margin-top:50px;">
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-lg product_next"
                                box_index="5">&ensp;下一步&ensp;</button>
                        </div>
                    </div>
                </div>
                <!-- 優惠券 -->
                <div class="layui-tab-item">
                    <div class="layui-form-item" style="display: none">
                        <label class="layui-form-label">優惠券狀態：</label>
                        <div class="layui-input-block state_box">
                            <input type="hidden" name="iscoupon" class="iscoupon" value="0">
                            <div class="state_checked" checked_id="1"><i
                                    class="layui-icon layui-icon-ok"></i><span>&ensp;可以使用優惠券&emsp;</span></div>
                            <div class="state_checked state_click" checked_id="0"><i
                                    class="layui-icon layui-icon-ok"></i><span>&ensp;不可使用優惠券&emsp;</span></div>
                        </div>
                    </div>

                    <!-- 提交添加商品 -->
                    <div class="layui-form-item" style="margin-top:50px;">
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-lg"
                                id="form_add_but">&ensp;添加商品&ensp;</button>
                            <button type="reset"
                                class="layui-btn layui-btn-lg layui-btn-primary">&ensp;重置&ensp;</button>
                        </div>
                    </div>

                </div>

            </div>


        </form>
    </div>

    <div class="layui-tab-item product_jifen" id="product_jifen">
        <form class="layui-form" id="product_jifen_data">
            <input type="hidden" name="product_id" id="product_id" value="">
            <!-- 商品積分 -->
            <div class="pro_jifen_box">
                <div class="jifen_box">
                    <p class="jifen_box_title">商品復購積分：</p>
                    <div class="jifen_box_form">
                        <dl class="pro_jifen">
                            <dd> 選擇用戶等級 </dd>
                            <dd> 重消他 </dd>
                            <dd> 重消她 </dd>
                            <!-- <dd> 會員一層獲取積分 </dd>
                            <dd> 會員二層獲取積分 </dd> -->
                            <dd> &nbsp; </dd>
                            <p class="clear"></p>
                        </dl>
                        <div class="jifen_list" id="jifen_list">
                            <dl class="pro_jifen">
                                <dd>
                                    <div class="form_select_title">
                                        <input type="hidden" value="1" class="members_type">
                                        <input type="text" placeholder="用戶等級" value="聽她說品牌VIP" disabled="disabled"
                                            class="members_type_text layui-input">
                                    </div>
                                </dd>
                                <dd><input type="number" class="layui-input non_vip_1" placeholder="非會員一層獲取積分"
                                        value="0"> </dd>
                                <dd><input type="number" class="layui-input non_vip_2" placeholder="非會員二層獲取積分"
                                        value="0"> </dd>
                                <!-- <dd><input type="number" class="layui-input vip_1" placeholder="會員一層獲取積分" value="0"> </dd>
                                <dd><input type="number" class="layui-input vip_2" placeholder="會員二層獲取積分" value="0"> </dd> -->

                                <p class="clear"></p>
                            </dl>
                            <dl class="pro_jifen">
                                <dd>
                                    <div class="form_select_title">
                                        <input type="hidden" value="2" class="members_type">
                                        <input type="text" placeholder="用戶等級" value="聽她說品牌服務社區店" disabled="disabled"
                                            class="members_type_text layui-input">
                                    </div>
                                </dd>
                                <dd><input type="number" class="layui-input non_vip_1" placeholder="非會員一層獲取積分"
                                        value="0"> </dd>
                                <dd><input type="number" class="layui-input non_vip_2" placeholder="非會員二層獲取積分"
                                        value="0"> </dd>
                                <!-- <dd><input type="number" class="layui-input vip_1" placeholder="會員一層獲取積分" value="0"> </dd>
                                <dd><input type="number" class="layui-input vip_2" placeholder="會員二層獲取積分" value="0"> </dd> -->

                                <p class="clear"></p>
                            </dl>
                            <dl class="pro_jifen">
                                <dd>
                                    <div class="form_select_title">
                                        <input type="hidden" value="3" class="members_type">
                                        <input type="text" placeholder="用戶等級" value="豪華服務社區" disabled="disabled"
                                            class="members_type_text layui-input">
                                    </div>
                                </dd>
                                <dd><input type="number" class="layui-input non_vip_1" placeholder="非會員一層獲取積分"
                                        value="0"> </dd>
                                <dd><input type="number" class="layui-input non_vip_2" placeholder="非會員二層獲取積分"
                                        value="0"> </dd>
                                <!-- <dd><input type="number" class="layui-input vip_1" placeholder="會員一層獲取積分" value="0"> </dd>
                                <dd><input type="number" class="layui-input vip_2" placeholder="會員二層獲取積分" value="0"> </dd> -->

                                <p class="clear"></p>
                            </dl>
                            <dl class="pro_jifen">
                                <dd>
                                    <div class="form_select_title">
                                        <input type="hidden" value="4" class="members_type">
                                        <input type="text" placeholder="用戶等級" value="形象中心" disabled="disabled"
                                            class="members_type_text layui-input">
                                    </div>
                                </dd>
                                <dd><input type="number" class="layui-input non_vip_1" placeholder="非會員一層獲取積分"
                                        value="0"> </dd>
                                <dd><input type="number" class="layui-input non_vip_2" placeholder="非會員二層獲取積分"
                                        value="0"> </dd>
                                <!-- <dd><input type="number" class="layui-input vip_1" placeholder="會員一層獲取積分" value="0"> </dd>
                                <dd><input type="number" class="layui-input vip_2" placeholder="會員二層獲取積分" value="0"> </dd> -->

                                <p class="clear"></p>
                            </dl>
                            <dl class="pro_jifen">
                                <dd>
                                    <div class="form_select_title">
                                        <input type="hidden" value="5" class="members_type">
                                        <input type="text" placeholder="用戶等級" value="市S" disabled="disabled"
                                            class="members_type_text layui-input">
                                    </div>
                                </dd>
                                <dd><input type="number" class="layui-input non_vip_1" placeholder="非會員一層獲取積分"
                                        value="0"> </dd>
                                <dd><input type="number" class="layui-input non_vip_2" placeholder="非會員二層獲取積分"
                                        value="0"> </dd>
                                <!-- <dd><input type="number" class="layui-input vip_1" placeholder="會員一層獲取積分" value="0"> </dd>
                                <dd><input type="number" class="layui-input vip_2" placeholder="會員二層獲取積分" value="0"> </dd>
                                 -->
                                <p class="clear"></p>
                            </dl>
                            <dl class="pro_jifen">
                                <dd>
                                    <div class="form_select_title">
                                        <input type="hidden" value="6" class="members_type">
                                        <input type="text" placeholder="用戶等級" value="聽她說品牌消費者" disabled="disabled"
                                            class="members_type_text layui-input">
                                    </div>
                                </dd>
                                <dd><input type="number" class="layui-input non_vip_1" placeholder="非會員一層獲取積分"
                                        value="0"> </dd>
                                <dd><input type="number" class="layui-input non_vip_2" placeholder="非會員二層獲取積分"
                                        value="0"> </dd>
                                <!-- <dd><input type="number" class="layui-input vip_1" placeholder="會員一層獲取積分" value="0"> </dd>
                                <dd><input type="number" class="layui-input vip_2" placeholder="會員二層獲取積分" value="0"> </dd>
                                 -->
                                <p class="clear"></p>
                            </dl>
                        </div>

                    </div>
                    <p class="clear"></p>
                </div>

                <!-- <div class="jifen_box quyu_jifen" style="margin-top:50px;">
                    <p class="jifen_box_title">非會員購買區域重消積分：</p>
                    <div class="jifen_box_form">
                        <div class="layui-form-item">
                            <label class="layui-form-label">區域積分：</label>
                            <div class="layui-input-block">
                                <input type="number" class="layui-input quyu_integral" value="0">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">省積分：</label>
                            <div class="layui-input-block">
                                <input type="number" class="layui-input sheng_integral" value="0">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">市積分：</label>
                            <div class="layui-input-block">
                                <input type="number" class="layui-input shi_integral" value="0">
                            </div>
                        </div>
                    </div>
                    <p class="clear"></p>
                </div> -->

                <div class="jifen_box quyu_jifen" style="margin-top:50px;">
                    <p class="jifen_box_title">區域重消積分：</p>
                    <div class="jifen_box_form">
                        <div class="layui-form-item">
                            <label class="layui-form-label">區縣重消積分：</label>
                            <div class="layui-input-block">
                                <input type="number" class="layui-input vip_quyu_integral" value="0">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">市S重消積分：</label>
                            <div class="layui-input-block">
                                <input type="number" class="layui-input vip_sheng_integral" value="0">
                            </div>
                        </div>

                        <!-- <div class="layui-form-item">
                            <label class="layui-form-label">市積分：</label>
                            <div class="layui-input-block">
                                <input type="number" class="layui-input vip_shi_integral" value="0">
                            </div>
                        </div> -->
                    </div>
                    <p class="clear"></p>
                </div>
                <p class="clear"></p>

            </div>

            <div class="layui-form-item" style="margin-top:50px;">
                <div class="layui-input-block">
                    <button type="button" class="layui-btn layui-btn-lg"
                        id="product_jifen_add">&ensp;設置商品積分&ensp;</button>
                </div>
            </div>
        </form>
    </div>


    <!--  選擇商品分類 列表   -->
    <div id="details_layer">
        <div class="details_export">
            <div class="top_title">&ensp;選擇商品分類</div>

            <!-- 選擇商品分類 數據  -->
            <div class="details_box data_list" id="details_box">
                <div id="data_list_info">
                    <p class="clear"></p>
                </div>

            </div>

            <div class="tc_button">
                <!-- <button id="tc_determine">確定</button> -->
                <button id="tc_cancel">關閉</button>
            </div>
        </div>
    </div>



    <script type="text/javascript" src="../common/layui/layui.js"></script>
    <script type="text/javascript" src="../common/layui/layui.all.js"></script>

    <script type="text/javascript">
        layui.use('table', function () {
            var table = layui.table;
            //監聽表格復選框選擇
            table.on('checkbox(demo)', function (obj) {
                console.log(obj)
            });
            //監聽工具條
            table.on('tool(demo)', function (obj) {
                var data = obj.data;
                if (obj.event === 'detail') {
                    layer.msg('ID：' + data.id + ' 的查看操作');
                } else if (obj.event === 'del') {
                    layer.confirm('真的刪除行么', function (index) {
                        obj.del();
                        layer.close(index);
                    });
                } else if (obj.event === 'edit') {
                    layer.alert('編輯行：<br>' + JSON.stringify(data))
                }
            });

            var $ = layui.$, active = {
                getCheckData: function () { //獲取選中數據
                    var checkStatus = table.checkStatus('idTest')
                        , data = checkStatus.data;
                    layer.alert(JSON.stringify(data));
                }
                , getCheckLength: function () { //獲取選中數目
                    var checkStatus = table.checkStatus('idTest')
                        , data = checkStatus.data;
                    layer.msg('選中了：' + data.length + ' 個');
                }
                , isAll: function () { //驗證是否全選
                    var checkStatus = table.checkStatus('idTest');
                    layer.msg(checkStatus.isAll ? '全選' : '未全選')
                }
            };

            $('.demoTable .layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
        });
        /*
          * （變量、方法所在文件 ./js/jquery.coolei.js）
          * 全局變量介紹
          * 1、url_domain（通用接口域名）
          * 2、token （請求頭 token）
          *
          * 引入公共方法說明
        */
        var url_domain = '';

        $('.file_exit').click(function () {
              console.log(111)
        })
    //         console.log(11)
    //     //$(this).siblings("img").attr('src','');
    //     //$(this).parent(".file_img").css('display','none');
    //     //獲取當前刪除的 圖片的 本地url
    //     var this_img,
    //         this_index = $(this).parent(".file_img").index();
    //     if(this_index==0||this_index=='0') {
    //         this_img = $(this).parent(".file_img").attr("img_url");
    //     }else {
    //         this_img = ','+$(this).parent(".file_img").attr("img_url");
    //     };
    //     //獲取總的 圖片 本地url
    //     var img_val = $("#productImg").val();
    //     // 在總的 圖片url 中刪除 當前圖片的url 再賦值
    //     $('#productImg').val(img_val.replace(this_img, ''));

    //     //$(this).parent(".file_img").css('display','none');
    //     //在數組中刪除  該圖片對象
    //     curFiles.splice(this_index,1);
    //     //刪除 當前圖片容器
    //     $(this).parent(".file_img").remove();
    // });

        //彈出層
        //頁面加載時  設置彈層背景的高度 為可視化窗口的高度
        $(document).ready(function () {
            $('#details_layer').css({ "height": $(window).height() });
        });
        //當頁面窗口改變時 彈層背景的高度也隨之改變
        $(window).resize(function () {
            $('#details_layer').css({ "height": $(window).height() });
        });

        //展開彈窗
        $('#choose_pro').click(function () {
            //分類數據加載
            $.ajax({
                headers: { 'Authorization': token },
                url: url_domain + "/mall-server/api/mall/ShopProductType/queryByLevel", //提交的地址
                type: "post",  //提交方式post|get
                data: { 'level': '1' },
                async: false,
                success: function (msg) {  //指定處理的回調函數
                    var data_length = msg.data.length;
                    var info_html = "";
                    for (var i = 0; i < data_length; i++) {
                        info_html += '<span info_id="' + msg.data[i].id + '">' + msg.data[i].name + '</span>';
                    };
                    $("#data_list_info").html(info_html);
                }
            });// $.ajax 結束

            $('#details_layer').css({ 'visibility': 'visible' });
        });

        // 選擇商品分類id 效果
        $(document).on("click", "#data_list_info span", function () {
            var pro_id = $(this).attr('info_id');
            $("#typeid").val(pro_id);
            console.log($(this).text());
            $("#typeid_text").val($(this).text());

            $("#details_layer").css({ 'visibility': 'hidden' });
        });

        //關閉彈出層  點擊取消 關閉彈出層
        $('#tc_cancel').click(function () {
            $("#details_layer").css({ 'visibility': 'hidden' });
        });
        //彈出層


        var click_index,        //當前點擊tab的 小標
            check_index,        //當前選中的下標
            click_box = $("#product_tab .pro_top_tab li"),    //點擊列表
            content_box = $("#product_tab .layui-tab-content .layui-tab-item");    //顯示盒子
        click_box.click(function () {
            check_index = $("#product_tab .pro_top_tab li.tab_this").index();
            click_index = $(this).index();
            //alert(click_index);
            if (check_index == 6) {

            } else {
                $(this).addClass("tab_this").siblings("li").removeClass("tab_this");
                content_box.eq(click_index).addClass("layui-show").siblings().removeClass("layui-show");
            }
        });
        //點擊 下一步操作 效果
        $("#product_tab .product_next").click(function () {
            var box_index = $(this).attr("box_index");
            $("#product_tab .pro_top_tab li").eq(box_index).addClass("tab_this").siblings("li").removeClass("tab_this");
            $("#product_tab .layui-tab-content .layui-tab-item").eq(box_index).addClass("layui-show").siblings().removeClass("layui-show");
        });


        //商品基本  checkbox 屬性效果
        $(".form_checkbox .ifon_checkbox_choose").click(function () {
            if ($(this).hasClass("ifon_checked")) {
                $(this).removeClass("ifon_checked");
                $(this).prev('input[type="hidden"]').val('0');
            } else {
                $(this).addClass("ifon_checked");
                $(this).prev('input[type="hidden"]').val('1');
            }
        });
        //點擊選擇 是否啟用 優惠券
        $(".state_box .state_checked").click(function () {
            $(this).addClass("state_click").siblings().removeClass("state_click");
            $(this).siblings("input").val($(this).attr('checked_id'));
        });


        // // 圖片上傳
        // //定義一個數組 把文件數組的值給新數組  對新數組進行操作  然后把新數組傳遞給后台
        // var curFiles = [];
        // $('#female').change(function() {
        //     var img_file = $(this).val(), //獲取第一張文件路徑
        //         file_length,  //多張圖片 數
        //         file_list = "";

        //     if (img_file != ""&&img_file!=null) {
        //         //獲取文件
        //         file_list = $(this)[0].files;
        //         file_length = file_list.length;

        //         //把所選的文件對象數組 賦值給 curFiles數組
        //         Array.prototype.push.apply(curFiles, file_list);

        //         //獲取圖片的 文件夾 路徑
        //         var img_url = img_file.replace(file_list[0].name, '');

        //         $("#file_img_list").html("");
        //         for (var i = 0; i < file_length; i++) {
        //             //創建讀取文件的對象
        //             var reader = new FileReader();

        //             //為文件讀取成功設置事件
        //             reader.onload=function(e) {
        //                 //顯示所選擇的 圖片
        //                 $("#file_img_list").append('<div class="file_img" img_url="" style="background:none;"> <p class="file_exit">&times;</p> <img src="'+this.result+'" alt=""> </div>');
        //             };
        //             //正式讀取文件
        //             reader.readAsDataURL(file_list[i]);
        //         };

        //         setTimeout(function(){
        //             for (var j = 0; j < file_length; j++){

        //                 if(j > 0) {
        //                     img_file += ","+img_url+file_list[j].name;
        //                 };

        //                 var img_name = img_url+file_list[j].name;
        //                 //$("#file_img_list .file_exit").eq(i).setAttribute("img_url",img_name);
        //                 console.log(img_name);
        //                 $("#file_img_list .file_img").eq(j).attr("img_url",img_url+file_list[j].name);
        //             };
        //             $("#productImg").val(img_file);
        //         },200);

        //     };
        // });

        // //商品 多圖片上傳的 去掉圖片效果
        // //$("#file_img_list .file_exit").click(function(){
        // $(document).on("click","#file_img_list .file_exit",function(){
        //     //$(this).siblings("img").attr('src','');
        //     //$(this).parent(".file_img").css('display','none');
        //     //獲取當前刪除的 圖片的 本地url
        //     var this_img,
        //         this_index = $(this).parent(".file_img").index();
        //     if(this_index==0||this_index=='0') {
        //         this_img = $(this).parent(".file_img").attr("img_url");
        //     }else {
        //         this_img = ','+$(this).parent(".file_img").attr("img_url");
        //     };
        //     //獲取總的 圖片 本地url
        //     var img_val = $("#productImg").val();
        //     // 在總的 圖片url 中刪除 當前圖片的url 再賦值
        //     $('#productImg').val(img_val.replace(this_img, ''));

        //     //$(this).parent(".file_img").css('display','none');
        //     //在數組中刪除  該圖片對象
        //     curFiles.splice(this_index,1);
        //     //刪除 當前圖片容器
        //     $(this).parent(".file_img").remove();
        // });
        // 圖片上傳
        //定義一個數組 把文件數組的值給新數組  對新數組進行操作  然后把新數組傳遞給后台
        var curFiles = [];
        $('#female').change(function () {
            var FormElement=new FormData();
            var fill=$('.productImg').get(0).files[0];
            console.log(FormElement.append('file',fill));
            console.log(FormElement);
        
            // $.ajax({
            //     // url: "/mall-server/api/mall/B/ShopProduct/updateProduct",
            //     url: "/rule/sys/oss/upload",
            //     headers: {'Authorization': token},
            //     ContentType:'multipart/form-data',
            //     type: "post",
            //     data:FormElement,
            //     dataType: 'JSON',
            //     processData: false,
            //     contentType: false,
            //     success: function (res) {
            //         console.log(res);
            //     },
            //     error: function (returndata) {
            //         // alert(returndata);
            //     }
            // });
            // var img_file = $(this).val(), //獲取第一張文件路徑
            //     file_length,  //多張圖片 數
            //     file_list = "";
            //
            // if (img_file != "" && img_file != null) {
            //     //獲取文件
            //     file_list = $(this)[0].files;
            //     file_length = file_list.length;
            //     //把所選的文件對象數組 賦值給 curFiles數組
            //     Array.prototype.push.apply(curFiles, file_list);
            //
            //     //獲取圖片的 文件夾 路徑
            //     var img_url = img_file.replace(file_list[0].name, '');
            //
            //     $("#file_img_list").html("");
            //     for (var i = 0; i < file_length; i++) {
            //         //創建讀取文件的對象
            //         var reader = new FileReader();
            //
            //         //為文件讀取成功設置事件
            //         reader.onload = function (e) {
            //             //顯示所選擇的 圖片
            //             $("#file_img_list").append('<div class="file_img" img_url="" style="background:none;"> <p class="file_exit">&times;</p> <img src="' + this.result + '" alt=""> </div>');
            //         };
            //         //正式讀取文件
            //         reader.readAsDataURL(file_list[i]);
            //     }
            //     ;
            //
            //     setTimeout(function () {
            //         for (var j = 0; j < file_length; j++) {
            //             if (j > 0) {
            //                 img_file += "," + img_url + file_list[j].name;
            //             }
            //             ;
            //             //var img_name = img_url+file_list[j].name;
            //             //console.log(img_name);
            //             $("#file_img_list .file_img").eq(j).attr("img_url", img_url + file_list[j].name);
            //         }
            //         ;
            //         $("#productImg").val(img_file);
            //         $("#imgFlag").val("1");
            //         $(this).attr("name", "productImg");
            //         $("#productImg").removeAttr("name");
            //     }, 200);
            //
            // }
            // ;
        });

        $('#female').on('change', function () {
            var FormElement = new FormData();
            var fill = $('.productImg').get(0).files[0];
            FormElement.append('file', fill);
            // console.log(FormElement);
            // var  pro_img_html = '';
            $.ajax({
                // url: "/mall-server/api/mall/B/ShopProduct/updateProduct",
                url: "/rule/sys/oss/upload",
                headers: { 'Authorization': token },
                ContentType: 'multipart/form-data',
                type: "post",
                data: FormElement,
                dataType: 'JSON',
                processData: false,
                contentType: false,
                success: function (res) {
                    console.log(res.data.url);
                    var  pro_img_html = '';
                    pro_img_html= '<div class="file_img" img_data="1" img_url="' +res.data.url + '"><p class="file_exit">&times;</p><img src="' +res.data.url + '"> </div>';
                    console.log(pro_img_html);
                    $("#form_data #file_img_list").append(pro_img_html);
                    var  img_url = $("#productImg").val();
                    img_url+= res.data.url+',';
                    $("#productImg").val(img_url);
                },
                error: function (returndata) {
                    // alert(returndata);
                }
            });
            // var img_file = $(this).val(), //獲取第一張文件路徑
            //     file_length,  //多張圖片 數
            //     file_list = "";
            //
            // if (img_file != "" && img_file != null) {
            //     //獲取文件
            //     file_list = $(this)[0].files;
            //     file_length = file_list.length;
            //     //把所選的文件對象數組 賦值給 curFiles數組
            //     Array.prototype.push.apply(curFiles, file_list);
            //
            //     //獲取圖片的 文件夾 路徑
            //     var img_url = img_file.replace(file_list[0].name, '');
            //
            //     $("#file_img_list").html("");
            //     for (var i = 0; i < file_length; i++) {
            //         //創建讀取文件的對象
            //         var reader = new FileReader();
            //
            //         //為文件讀取成功設置事件
            //         reader.onload = function (e) {
            //             //顯示所選擇的 圖片
            //             $("#file_img_list").append('<div class="file_img" img_url="" style="background:none;"> <p class="file_exit">&times;</p> <img src="' + this.result + '" alt=""> </div>');
            //         };
            //         //正式讀取文件
            //         reader.readAsDataURL(file_list[i]);
            //     }
            //     ;
            //
            //     setTimeout(function () {
            //         for (var j = 0; j < file_length; j++) {
            //             if (j > 0) {
            //                 img_file += "," + img_url + file_list[j].name;
            //             }
            //             ;
            //             //var img_name = img_url+file_list[j].name;
            //             //console.log(img_name);
            //             $("#file_img_list .file_img").eq(j).attr("img_url", img_url + file_list[j].name);
            //         }
            //         ;
            //         $("#productImg").val(img_file);
            //         $("#imgFlag").val("1");
            //         $(this).attr("name", "productImg");
            //         $("#productImg").removeAttr("name");
            //     }, 200);
            //
            // }
            // ;
        })

        //商品 多圖片上傳的 去掉圖片效果
        $(document).on("click", "#file_img_list .file_exit", function () {
        //$(this).siblings("img").attr('src','');
        var img_type = $("#imgFlag").val();
        console.log(img_type);
        if (img_type == "0" || img_type == "2") {
            $(this).parent(".file_img").attr('img_data', '0');
            $("#imgFlag").val("2");
            var img_length = $("#file_img_list .file_img[img_data='1']").length;
            //console.log(img_length);
            var img_url_data = "";
            for (var i = 0; i < img_length; i++) {
                img_url_data += $("#file_img_list .file_img[img_data='1']").eq(i).attr("img_url") + ",";
            };
            $("#productImg").val(img_url_data);
        } else if (img_type == "1") {
            //獲取當前刪除的 圖片的 本地url
            var this_img,
                this_index = $(this).parent(".file_img").index();
            if (this_index == 0 || this_index == '0') {
                this_img = $(this).parent(".file_img").attr("img_url");
            } else {
                this_img = ',' + $(this).parent(".file_img").attr("img_url");
            }
            ;
            //獲取總的 圖片 本地url
            var img_val = $("#productImg").val();
            // 在總的 圖片url 中刪除 當前圖片的url 再賦值
            $('#productImg').val(img_val.replace(this_img, ''));

            //$(this).parent(".file_img").css('display','none');
            //在數組中刪除  該圖片對象
            curFiles.splice(this_index, 1);
        }
        ;
        //隱藏 當前圖片
        $(this).parent(".file_img").css('display', 'none');

    });


        //商品視屏 取消展示效果
        $("#file_video .file_exit").click(function () {
            $(this).siblings("video").attr('src', '');
            $(this).parent(".file_img").css('display', 'none');
            $('#productVideo').val("");
        });
        // 視頻上傳
        $('#female_video').change(function () {
            var video_file = $('#female_video').val();
            if (video_file != "" && video_file != null) {
                //獲取文件
                var file = $('#female_video')[0].files[0];
                //console.log(file);
                //創建讀取文件的對象
                var reader = new FileReader();

                $("#productVideo").val(video_file);

                //為文件讀取成功設置事件
                reader.onload = function (e) {
                    //創建文件讀取相關的變量
                    var imgFile = e.target.result;
                    $("#file_video video").attr('src', imgFile);
                    $("#file_video video").css({ "background": "none", 'display': 'block' });
                };

                //正式讀取文件
                reader.readAsDataURL(file);
            };
        });

        //獲取 規格數據
        function guige_info() {
            //規格賦值
            var guige_value = "",  //{規格拼接 容器
                guige_text_demo = $("#guige_div .guige_text"),    //#guige_div 下的 .guige_text 的demo
                guige_length = guige_text_demo.length,    //.guige_text 的demo 的總個數（規格項總個數）
                guige_type_demo,    //.#guige_div 下的 規格類型 .guige_type 的demo
                guige_type_val,        //#guige_div 下的 .guige_type 規格類型 項的值
                guige_list_length,    //.guige_text 下的 子規格項 個數
                input_guige;    //.guige_text 下的 子規格項 的值

            for (var g = 0; g < guige_length; g++) {
                guige_type_demo = $("#guige_div .guige_type").eq(g);  //規格類型 .guige_type 的demo
                guige_type_val = guige_type_demo.val();  //規格類型 .guige_type 的值
                //規格類型 不能為空
                if (guige_type_val != "" || guige_type_val != null) {
                    //規格拼接類型
                    guige_value += guige_type_val + ",";
                    //.guige_text  下的子規格項 個數
                    guige_list_length = guige_text_demo.eq(g).find("li").length;
                    //循環拼接 自規格項的值
                    for (var l = 0; l < guige_list_length; l++) {
                        //子規格項 的值
                        input_guige = guige_text_demo.eq(g).find(".input_guige").eq(l).val();
                        //子規格項 的值 不為空時 拼接，為空時不處理
                        if (input_guige != "" || input_guige != null) {
                            //拼接 子規格項 的值
                            if (l == (guige_list_length - 1)) {
                                guige_value += input_guige + ";";
                            } else {
                                guige_value += input_guige + ",";
                            };
                        };
                    };
                } else {
                    return "g";
                };
            };
            //guige_value += "}";
            //把 規格拼接數據  賦值到 規格隱藏域里
            $("#specification").val(guige_value);
        }

        //獲取 參數數據
        function canshu_info() {
            var canshu_data = [],  //{參數數據 容器
                // canshu_datajson = "",
                canshu_list_demo = $("#pro_canshu_list li"),  //參數列表 demo
                canshu_length = canshu_list_demo.length,  //參數總個數
                canshu_name,   //參數名
                canshu_value;  //參數值
            for (var c = 0; c < canshu_length; c++) {
                canshu_name = canshu_list_demo.eq(c).find(".canshu_name").val();
                canshu_value = canshu_list_demo.eq(c).find(".canshu_value").val();
                if (canshu_name != "" && canshu_value != "") {
                    //拼接參數
                    // canshu_data += canshu_name+",";
                    // canshu_data += canshu_value+";";
                    canshu_data.push({
                        "key": canshu_name,
                        "value": canshu_value
                    });
                };
            };
            var json = JSON.stringify(canshu_data);
            console.log(json);
            //canshu_data += "}";
            //把 規格拼接數據  賦值到 規格隱藏域里
            $("#productParams").val(json);
            //alert(canshu_data);
        }

        //會員積分 拼接
        function product_jifen() {

            var jifen_json = "[",  //{參數數據 容器
                jifen_list_demo = $("#jifen_list dl"),  //參數列表 demo
                jifen_length = jifen_list_demo.length,  //參數總個數
                members_type,   //會員類型
                jifen_product_id = $("#product_id").val();

            for (var j = 0; j < jifen_length; j++) {
                members_type = jifen_list_demo.eq(j).find(".members_type").val();
                /*jifen_name = jifen_list_demo.eq(j).find(".non_vip_1").val();
                jifen_value = jifen_list_demo.eq(j).find(".non_vip_2").val();
                jifen_name = jifen_list_demo.eq(j).find(".vip_1").val();
                jifen_value = jifen_list_demo.eq(j).find(".vip_2").val();*/
                if (members_type != "") {
                    //拼接參數
                    jifen_json += '{"memberLevelId":"' + members_type + '",';
                    jifen_json += '"productId":"' + jifen_product_id + '",';
                    jifen_json += '"awardPointFirst":"' + jifen_list_demo.eq(j).find(".non_vip_1").val() + '",';
                    jifen_json += '"awardPointSecond":"' + jifen_list_demo.eq(j).find(".non_vip_2").val() + '"},';
                    // jifen_json += '"nonmemberAwardPointFirst":"'+jifen_list_demo.eq(j).find(".vip_1").val()+'",';
                    // jifen_json += '"nonmemberAwardPointSecond":"'+jifen_list_demo.eq(j).find(".vip_2").val()+'"},';
                };
            };
            jifen_json = jifen_json.substring(0, jifen_json.length - 1) + "]";
            //return JSON.parse(jifen_json);
            return jifen_json;
            /*var obj = str.parseJSON(); //由JSON字符串轉換為JSON對象
            var obj = JSON.parse(str); //由JSON字符串轉換為JSON對象*/
        }

        layui.use(["jquery", "form", "upload", "table", "layer", "layedit", "laydate", "element"], function () {

            var layer = parent.layer === undefined ? layui.layer : parent.layer,
                laypage = layui.laypage,
                table = layui.table,
                form = layui.form,
                element = layui.element,
                layedit = layui.layedit,
                laydate = layui.laydate;
            $ = layui.jquery;

            //選擇商品分類id
            /*$("#choose_pro").click(function(){
                var index = layer.open({
                    type : 2,
                    title : "選擇分類連接",
                    area : [ '75%', '65%' ],
                    content : './pages/classification_list.html'
                });
            });*/

            // 編輯器 插入圖片接口
            layedit.set({
                uploadImage: {
                    url: url_domain + "/mall-server/api/mall/ShopNav/uploadImg" //接口url
                    , type: 'post' //默認post
                }
            });
            //建立編輯器
            var textarea_demo = layedit.build('details_demo', {
                height: 280, //設置編輯器高度
                tool: [
                    'strong' //加粗
                    , 'italic' //斜體
                    , 'underline' //下划線
                    , 'del' //刪除線
                    , '|' //分割線
                    , 'left' //左對齊
                    , 'center' //居中對齊
                    , 'right' //右對齊
                    , 'link' //超鏈接
                    , 'unlink' //清除鏈接
                    , 'face' //表情
                    , 'image' //插入圖片
                    , 'help' //幫助
                ]
            });

            //添加商品   form 表單提交
            $("#form_add_but").click(function () {
                //獲取 規格數據  並且賦值到 規格隱藏域
                // guige_info();
                $("#specification").val(JSON.stringify(tablearrinfo));
                //獲取 參數數據  並且賦值到 參數隱藏域
                canshu_info();


                //console.log();
                $("input[name='file']").removeAttr("name");
                //富文本賦值
                $("#details_demo").val(layedit.getContent(textarea_demo));

                var form_data = new FormData(document.getElementById("form_data"));
                // #Lexin 注釋，圖片顯示問題
                // var form_img = curFiles.length; //圖片數組個數
                // if(form_img > 0) {
                //     for (var f = 0; f < form_img; f++) {
                //         form_data.append('productImg', curFiles[f]);
                //     }
                // };
                if ($("#productVideo").val() == "" || $("#productVideo").val() == null) {
                    form_data.set("productVideo", "");
                };
                console.log('test 傳參');
                console.log(form_data);
                form_data.set("productForm", "1");
                $.ajax({
                    url: url_domain + "/mall-server/api/mall/tmp/product/createForMeal",
                    headers: { 'Authorization': token },
                    type: "post",
                    data: form_data,
                    dataType: "JSON",
                    processData: false,
                    contentType: false,
                    success: function (obj) {
                        if (obj.status == 0) {
                            console.log(obj);
                            console.log(obj.data.productCode);
                            var productCode = obj.data.productCode;
                            var mealCode = obj.data.id;
                            layer.open({ title: "添加成功", time: 2000 });
                            $("#product_id").val(obj.data.id);


                            var huiyuan_miaoshu = $("#info_number").val();
                            console.log(huiyuan_miaoshu);
                            if (huiyuan_miaoshu == "") {
                                layer.open({ title: "信息提示:", icon: 2, content: "套餐的使用次數，請輸入套餐的使用次數！", time: 4000 });
                                // $("#form_data .first_instance_describe").css("border-color","#ff0000");
                            } else {
                                 console.log(productCode)
                                //添加商品成功調接口
                                $.ajax({
                                    url: url_domain + "/mall-server/api/mall/B/meal/create",
                                    headers: { 'Authorization': token },
                                    type: "get",
                                    data: {
                                        // 'mealCode': mealCode,      
                                        'productCode': productCode,
                                        'useLimit': $("#info_number").val(),
                                        'ids': ''
                                    },
                                    // datatype: "JSON",
                                    // processData: false,
                                    // contentType: false,
                                    success: function (obj) {
                                        if (obj.status == 0) {
                                            console.log(obj)
                                            layer.open({ title: "添加成功", time: 2000 });
                                            //觸發點擊事件
                                            // $('#product_jifen_but').trigger('click');
                                            var fenpei_index = parent.layer.getFrameIndex(window.name); //獲取窗口索引
                                            parent.layer.close(fenpei_index);  // 關閉layer
                                            window.parent.location.reload(); //刷新父頁面
                                        } else {
                                            layer.open({ title: "添加失敗", time: 3000 });
                                            layer.alert(obj.statusText, {
                                                icon: 5,
                                                title: "提示"
                                            });
                                        }
                                    },
                                    error: function (returndata) {
                                        // alert(returndata);
                                    }
                                });

                            }
                        } else {
                            layer.open({ title: "添加失敗", time: 3000 });
                            layer.alert(obj.statusText, {
                                icon: 5,
                                title: "提示"
                            });
                        }
                    },
                    error: function (returndata) {
                        alert(returndata);
                    }
                });
            });

            //返回列表
            $("#cancel").click(function () {
                var fenpei_index = parent.layer.getFrameIndex(window.name); //獲取窗口索引
                parent.layer.close(fenpei_index);  // 關閉layer
                window.parent.location.reload(); //刷新父頁面
            });

            //點擊商品積分 時的提示
            $("#product_jifen_but").click(function () {
                //.hasClass("layui-show")
                var index_2 = $(".layui-tab-content .layui-show").index();

                if ($("#product_id").val() == "" || $("#product_id").val() == null) {
                    setTimeout(function () {
                        $("#product_tab .pro_top_tab li").eq(index_2).addClass("tab_this").siblings().removeClass("tab_this");
                    }, 1);
                    layer.confirm('請先添加商品，再設置會員積分！', { icon: 3, title: '提示信息' });

                } else {
                    $("#form_data").css("display", "none");
                    $("#product_jifen").css("display", "block");
                };
            });




            //添加商品 積分  form 表單提交
            $("#product_jifen_add").click(function () {
                //拼接積分參數
                var jifen_obj = product_jifen();

                //拼接區域積分參數
                var form_jifen_data = "4," + $(".vip_quyu_integral").val() + ";5," + $(" .vip_sheng_integral").val() + ';';
                //console.log(typeof form_jifen_data);
                $.ajax({
                    url: url_domain + "/mall-server/api/mall/tmp/product/add",
                    // headers :{'Authorization':token},
                    type: "post",
                    data: {
                        "pointList": jifen_obj, "aearPoint": form_jifen_data
                    },
                    success: function (obj) {
                        if (obj.status == 0) {
                            layer.open({ title: "添加成功！", time: 1000 });
                            var fenpei_index = parent.layer.getFrameIndex(window.name); //獲取窗口索引
                            parent.layer.close(fenpei_index);  // 關閉layer
                            window.parent.location.reload(); //刷新父頁面
                        } else {
                            layer.open({ title: "添加失敗", time: 3000 });
                        }
                    },
                    error: function (returndata) {
                        alert(returndata);
                    }
                });
            });

        });
    </script>


</body>

</html>

 


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 【JSP】layui+jsp，根據后台數據給復選框默認勾選 element el-table (type="selection") ，使用tableData自身數據，設置CheckBox 是否可以勾選 layui table 分頁問題 Ant design vue table 單擊行選中 勾選checkbox vue ele table表格 設置只能勾選一個 el-table根據列表狀態，控制是否可以勾選checkbox elementUI的table 點擊分頁時記住上一頁選中的數據 VUE使用el-table展開行加載子節點table聯動勾選《VUE專欄四》 WPF 勾選划線 vue中使用elementui里的table時,需求是前面的勾選框根據條件判斷是否可以勾選設置
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM