前端

fuintAdmin/src/views/EventMarketing/yijiancoupon/index.vue

@@ -38,6 +38,7 @@
           align="center"
           label="排序"
         >
+
         </el-table-column>
         <el-table-column label="活动名称" align="center" prop="activeName" />
         <el-table-column label="选择条件 " align="center" prop="gradeName" width="400px"  >
@@ -122,7 +123,6 @@
           <div style="width: 217px;">
             <el-input v-model="form.activeName" placeholder="请输入活动名称" />
           </div>
-
         </el-form-item>
         <el-form-item label="会员等级" prop="gradeIds"  >
           <el-select v-model="form.gradeIds"  multiple clearable placeholder="会员等级" @change="change">

fuintAdmin_zt/src/views/Service/details.vue

@@ -1,26 +1,30 @@
 <template>
-  <div class="app-container">
+  <div class="ap-container">
-
+  <div class="top_">
-    <el-card >
+    <div class="tab-box" :class="tabindex == index ? 'active' : ''" v-for="(item,index) in tabList" :key="index" @click="gettab(index)" >
-      <div class="top-box">
+      {{item.title}}
-        <el-tabs v-model="activeName" @tab-click="handleClick">
-          <el-tab-pane label="基本设置" name="first">
-             <jcindex :id="id"></jcindex>
-
-          </el-tab-pane>
-          <el-tab-pane label="支付配置" name="second">
-             <payment  :id="id"></payment>
-          </el-tab-pane>
-          <el-tab-pane label="员工管理" name="staff">
-            <staff :id="id"></staff>
-          </el-tab-pane>
-          <el-tab-pane label="订单查看" name="allOrder">
-            <allOrder :id="id"></allOrder>
-          </el-tab-pane>
-
-        </el-tabs>
     </div>
-    </el-card >
+  </div>
+                 <payment  :id="id" v-if="tabindex == 1" ></payment>
+<!--    <el-card >-->
+<!--      <div class="top-box">-->
+<!--        <el-tabs v-model="activeName" @tab-click="handleClick">-->
+<!--          <el-tab-pane label="基本设置" name="first">-->
+<!--             <jcindex :id="id"></jcindex>-->
+<!--          </el-tab-pane>-->
+<!--          <el-tab-pane label="支付配置" name="second">-->
+<!--             <payment  :id="id"></payment>-->
+<!--          </el-tab-pane>-->
+<!--          <el-tab-pane label="员工管理" name="staff">-->
+<!--            <staff :id="id"></staff>-->
+<!--          </el-tab-pane>-->
+<!--          <el-tab-pane label="订单查看" name="allOrder">-->
+<!--            <allOrder :id="id"></allOrder>-->
+<!--          </el-tab-pane>-->
+
+<!--        </el-tabs>-->
+<!--      </div>-->
+<!--    </el-card >-->
 
     </div>
 
@@ -37,7 +41,31 @@
     data() {
       return {
         id:'',
-        activeName: 'first'
+        activeName: 'first',
+        tabindex:0,
+        tabList:[
+          {
+            name:'first',
+            title:'基本设置',
+            component:jcindex
+          },
+          {
+            name:'second',
+            title:'支付配置',
+            component:payment
+          },
+          {
+            name:'staff',
+            title:'员工管理',
+            component:staff
+          },
+          {
+            name:'allOrder',
+            title:'订单查看',
+            component:allOrder
+          }
+        ]
+
       };
     },
 
@@ -53,6 +81,10 @@
 
     },
     methods: {
+      gettab(index){
+        this.tabindex = index
+        console.log(this.tabindex)
+      },
       handleClick(tab, event) {
         console.log(tab, event);
       }
@@ -62,11 +94,40 @@
 </script>
 
 <style scoped>
-  .app-container{
+  .ap-container{
-      height: 100%;
+      height: 100vh;
+      background: #f9f9f9;
+    box-sizing: border-box;
+
   }
   .top-box{
     width: 100%;
   }
+  .top_{
+    width: 100%;
+    background: #fff;
+    box-sizing: border-box;
+    padding: 10px 25px;
+    padding-bottom: 0px;
+    display: flex;
+    align-items: center;
+
+  }
+  .active{
+    color: #FF9655 !important;
+    border-bottom: 2px solid #FF9655 !important;
+  }
+  .tab-box{
+    color: #999999;
+    font-size: 14px;
+    height: 40px;
+    width: 60px;
+    border-bottom: 2px solid transparent;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0px 25px;
+    cursor: pointer;
+  }
 
 </style>

fuintAdmin_zt/src/views/components/Service/payment.vue

@@ -1,130 +1,396 @@
 <template>
   <div class="box-centenr">
-    <div style="width: 100%;display: flex">
+    <div class="new-box">
-      <el-alert
+      <div class="n-top-box">
-        title="说明"
+        <div class="d-s">
-        type="error"
+          <div class="gang"></div>
-        description="为了保证加油站商户日常在线支付业务的稳定性，来个油惠目前支持多通道支付
+          <div class="title_">商户信息</div>
-                      可以有效的避免单支付通道带来不稳定性，从而造成油站不能正常支付问题
+          <div class="size_">说明：为了保证加油站商户日常在线支付业务的稳定性，目前支持多通道支付，可以有效的避免单支付通道带来不稳定性，从而造成油站不能正常支付问题，加油站一旦出现不能正常支付的情况，可以随时手工切换支付通道，来保证加油站支付收款业务</div>
-                      加油站一旦出现不能正常支付的情况，可以随时手工切换支付通道，来保证加油站支付收款业务"
+        </div>
-        :closable="false"
+        <div class="o-button" @click="addMerchantShow()">新增商户信息</div>
-      >
+      </div>
-      </el-alert>
+      <el-table
+        :data="tableData"
 
-      <div style="width: 150%;display: flex;justify-content: right">
+        border
-        <div class="mingc">功能状态</div>
+        style="width: 100%">
-        <el-switch
+        <el-table-column
-          v-model="value1"
+          type="index"
-          @change="changeStatus1"
+          align="center"
+          label="序号"
+          width="50">
+        </el-table-column>
+        <el-table-column
+          prop="PaymentChannel"
+          align="center"
+          label="支付通道"
+          width="120">
+        </el-table-column>
+        <el-table-column
+          prop="PaymentNum"
+          align="center"
+          label="商户号编码"
          >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          align="center"
+          label="所属机构">
+        </el-table-column>
+        <el-table-column
+          prop="price"
+          align="center"
+          label="累计收款金额（元）">
+        </el-table-column>
+        <el-table-column
+          prop="status"
+          align="center"
+          label="使用状态"
+          width="100">
+        </el-table-column>
+        <el-table-column
+          prop="remark"
+          align="center"
+          label="备注">
+        </el-table-column>
+        <el-table-column
+          prop="founder"
+          align="center"
+          width="100"
+          label="创建人">
+        </el-table-column>
+        <el-table-column
+          prop="date"
+          align="center"
+          label="创建时间">
+        </el-table-column>
+        <el-table-column
+          prop="date"
+          align="center"
+          width="100"
+          label="操作">
+          <template slot-scope="scope">
+           <div style="color: #409EFF;cursor: pointer" @click="editMerchant(scope.row)"  >修改</div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="n-top-box" style="margin-top: 30px">
+        <div class="d-s">
+          <div class="gang"></div>
+          <div class="title_">商户分账规则</div>
+          <div class="size_">使用说明：添加/编辑对应的规则->规则配置正常->发布规则->规则生效 注意:功能状态启用且通道规则发布生效后当前功能才有效,否则使用系统单商户号模式</div>
+        </div>
+        <div class="o-button" @click="addRules()">新增规则</div>
+      </div>
+      <el-table
+        :data="tableData1"
+        style="width: 100%;margin-bottom: 20px;"
+        border>
+        <el-table-column
+          type="index"
+          align="center"
+          label="序号"
+          width="50">
+        </el-table-column>
+        <el-table-column
+          prop="RuleName"
+          label="规则名称"
+          align="center"
+          width="120">
+          <template slot-scope="scope">
+            <div style="color: #409EFF;cursor: pointer">规则名称</div>
+          </template>
+
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="规则类型"
+          align="center"
+          width="180">
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="规则状态"
+          align="center"
+          width="80">
+          <template slot-scope="scope">
+            <el-switch
+              v-model="scope.row.status"
+              active-color="#13ce66"
+              inactive-color="#ff4949">
             </el-switch>
+
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="date"
+          label="开始时间"
+          align="center"
+          width="180">
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          align="center"
+          label="规则描述">
+        </el-table-column>
+        <el-table-column
+          prop="founder"
+          align="center"
+          width="100"
+          label="创建人">
+        </el-table-column>
+        <el-table-column
+          prop="date"
+          label="创建时间"
+          align="center"
+          width="180">
+        </el-table-column>
+        <el-table-column
+          prop="date"
+          align="center"
+          width="180"
+          label="操作">
+          <template slot-scope="scope">
+            <div style="display: flex;justify-content: center;width: 100%">
+              <div style="color: #409EFF;cursor: pointer;margin: 0 10px">修改</div>
+              <div style="color: #409EFF;cursor: pointer;margin: 0 10px">删除</div>
+              <div style="color: #409EFF;cursor: pointer;margin: 0 10px" @click="Enable = true" >启用</div>
             </div>
+
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
-    <div style="margin-top: 20px"><el-button type="primary" icon="el-icon-plus" v-hasPermi="['Merchant:add']" @click="addMerchant">添加商户信息</el-button></div>
+      <el-dialog :title="addMerchantTitile" :visible.sync="addMerchants" width="550px" >
-    <div class="content-box">
+      <el-form :model="form">
-<!--      <el-card class="box-card" shadow="hover" v-for="(item,index) in 10" :key="index">-->
+        <el-form-item label="所属机构" :label-width="formLabelWidth">
+          <el-select v-model="form.region" placeholder="请选择所属机构" style="width: 350px">
+            <el-option label="机构一" value="shanghai"></el-option>
+            <el-option label="机构二" value="beijing"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="支付通道" :label-width="formLabelWidth">
+          <el-select v-model="form.region" placeholder="请选择支付通道" style="width: 350px">
+            <el-option label="支付通道一" value="shanghai"></el-option>
+            <el-option label="支付通道二" value="beijing"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="商户号编号" :label-width="formLabelWidth">
+          <el-input v-model="form.name" placeholder="请输入商户号编号" autocomplete="off" style="width: 350px"></el-input>
+        </el-form-item>
+        <el-form-item label="备注" :label-width="formLabelWidth" >
+          <el-input  type="textarea" v-model="form.desc" placeholder="请输入备注" autocomplete="off" style="width: 350px"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="addMerchants = false">取 消</el-button>
+        <el-button type="primary" @click="addMerchants = false">确 定</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog :title="Ruletitle" :visible.sync="addRule"  >
+      <el-form :model="form">
+        <el-form-item label="规则名称" :label-width="formLabelWidth">
+          <el-input v-model="form.name" placeholder="请输入规则名称" autocomplete="off" style="width: 350px"></el-input>
+        </el-form-item>
+        <el-form-item label="规则描述" :label-width="formLabelWidth" >
+          <el-input  type="textarea" v-model="form.desc" placeholder="请输入规则描述" autocomplete="off" style="width: 350px"></el-input>
+        </el-form-item>
+        <el-form-item label="规则描述" :label-width="formLabelWidth" >
+          <div style="display: flex">
+            <div class="xz_box" :class=" {'active' : SeparateAccounts == 1 } " @click="SeparateAccounts = 1" > <i class="el-icon-aim"></i> 按比例分账</div>
+            <div class="xz_box" :class=" {'active' : SeparateAccounts == 2 } " @click="SeparateAccounts = 2" > <i class="el-icon-aim"></i> 按交易类型分账</div>
+          </div>
+        </el-form-item>
+        <el-form-item label="规则配置" :label-width="formLabelWidth" >
+          <i class="el-icon-circle-plus-outline" style="font-size: 14px;color:#FF9655 " @click="addboxlsit()" ></i>
+        </el-form-item>
+        <div class="d-s" v-for="(item,index) in form.boxlist" :key="index" style="margin-bottom: 15px" v-if=" SeparateAccounts == 1" >
+          <div class="list-box">
+            <el-form-item label="支付通道" :label-width="formLabelWidth">
+              <el-select v-model="item.one" placeholder="请选择支付通道" style="width: 300px">
+                <el-option label="支付通道一" value="shanghai"></el-option>
+                <el-option label="支付通道二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="商户号编号" :label-width="formLabelWidth">
+              <el-input v-model="item.two" placeholder="请输入商户号编号" autocomplete="off" style="width: 300px"></el-input>
+            </el-form-item>
+            <el-form-item label="交易占比" :label-width="formLabelWidth">
+
+              <el-input v-model="item.three" placeholder="请输入交易占比" autocomplete="off" style="width: 300px">
+                <template slot="append">.com</template>
+              </el-input>
+            </el-form-item>
+          </div>
+          <i class="el-icon-delete" style="font-size: 28px;margin-left: 15px" @click="deleteDoxlist(index)" ></i>
+        </div>
+        <div class="d-s" v-for="(item,index) in form.boxlist" :key="index" style="margin-bottom: 15px" v-if=" SeparateAccounts == 2" >
+          <div class="list-box">
+            <el-form-item label="支付通道" :label-width="formLabelWidth">
+              <el-select v-model="item.one" placeholder="请选择支付通道" style="width: 300px">
+                <el-option label="支付通道一" value="shanghai"></el-option>
+                <el-option label="支付通道二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="商户号编号" :label-width="formLabelWidth">
+              <el-input v-model="item.two" placeholder="请输入商户号编号" autocomplete="off" style="width: 300px"></el-input>
+            </el-form-item>
+            <el-form-item label="交易类型" :label-width="formLabelWidth">
+              <el-select v-model="item.three" placeholder="请选择交易类型" style="width: 300px">
+                <el-option label="支付通道一" value="shanghai"></el-option>
+                <el-option label="支付通道二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="油号-油枪" :label-width="formLabelWidth">
+              <el-select v-model="item.three" placeholder="请选择油号-油枪" style="width: 300px">
+                <el-option label="支付通道一" value="shanghai"></el-option>
+                <el-option label="支付通道二" value="beijing"></el-option>
+              </el-select>
+            </el-form-item>
+          </div>
+          <i class="el-icon-delete" style="font-size: 28px;margin-left: 15px" @click="deleteDoxlist(index)" ></i>
+        </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="addRule = false">取 消</el-button>
+        <el-button type="primary" @click="addRule = false">确 定</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="启用" :visible.sync="Enable" width="650px" >
+      <el-form :model="ruleForm">
+        <el-form-item label="活动时间" required>
+         <div style="display: flex;align-items: center;">
+           <el-form-item prop="date1">
+             <el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.date1" style="width: 100%;"></el-date-picker>
+           </el-form-item>
+           <div style="width: 15px"></div>
+           <el-form-item prop="date2">
+             <el-time-picker placeholder="选择时间" v-model="ruleForm.date2" style="width: 100%;"></el-time-picker>
+           </el-form-item>
+         </div>
+          <div style="margin-left: 80px">启用成功后其他规则的规则状态变为停用！</div>
+
+
+
+
+
+
+        </el-form-item>
+
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="Enable = false">取 消</el-button>
+        <el-button type="primary" @click="Enable = false">确 定</el-button>
+      </div>
+    </el-dialog>
+<!--    <div style="width: 100%;display: flex">-->
+<!--      <el-alert-->
+<!--        title="说明"-->
+<!--        type="error"-->
+<!--        description="为了保证加油站商户日常在线支付业务的稳定性，来个油惠目前支持多通道支付-->
+<!--                      可以有效的避免单支付通道带来不稳定性，从而造成油站不能正常支付问题-->
+<!--                      加油站一旦出现不能正常支付的情况，可以随时手工切换支付通道，来保证加油站支付收款业务"-->
+<!--        :closable="false"-->
+<!--      >-->
+<!--      </el-alert>-->
+
+<!--      <div style="width: 150%;display: flex;justify-content: right">-->
+<!--        <div class="mingc">功能状态</div>-->
+<!--        <el-switch-->
+<!--          v-model="value1"-->
+<!--          @change="changeStatus1"-->
+<!--        >-->
+<!--        </el-switch>-->
+<!--      </div>-->
+<!--    </div>-->
+<!--    <div style="margin-top: 20px"><el-button type="primary" icon="el-icon-plus" v-hasPermi="['Merchant:add']" @click="addMerchant">添加商户信息</el-button></div>-->
+<!--    <div class="content-box">-->
+<!--&lt;!&ndash;      <el-card class="box-card" shadow="hover" v-for="(item,index) in 10" :key="index">&ndash;&gt;-->
+<!--&lt;!&ndash;        <div slot="header" class="clearfix">&ndash;&gt;-->
+<!--&lt;!&ndash;          <span>卡片名称</span>&ndash;&gt;-->
+<!--&lt;!&ndash;          <el-button style="float: right; padding: 3px 0" type="text">切换为当前通道</el-button>&ndash;&gt;-->
+<!--&lt;!&ndash;        </div>&ndash;&gt;-->
+<!--&lt;!&ndash;        <div>商户编号:1861975</div>&ndash;&gt;-->
+<!--&lt;!&ndash;      </el-card>&ndash;&gt;-->
+<!--      <el-card class="box-card" shadow="hover" v-for="item in merchantList" :key="item.id">-->
 <!--        <div slot="header" class="clearfix">-->
-<!--          <span>卡片名称</span>-->
+<!--          <span><dict-tag :options="dict.type.payment_channel" :value="item.merchantName"/></span>-->
-<!--          <el-button style="float: right; padding: 3px 0" type="text">切换为当前通道</el-button>-->
+<!--          <el-button v-if="item.isUse=='0'"-->
+<!--                     @click="editStatus(item,1)"-->
+<!--                     style="float: right; padding: 3px 0" type="text">切换为当前通道</el-button>-->
+<!--          <el-tag v-else effect="dark" type="success" style="float: right">当前使用中</el-tag>-->
+<!--        </div>-->
+<!--        <div>商户编号: {{ item.mchntCd }}</div>-->
+<!--        <div style="margin-top: 5px;display: flex;justify-content: space-between">-->
+<!--          <span>-->
+<!--            备注: <span style="color: #00afff;margin-left: 3px" @click="editRemark(item.id)">{{ item.remark ? item.remark : "&#45;&#45;" }}</span>-->
+<!--          </span>-->
+<!--          <span>-->
+<!--            <el-button-->
+<!--              size="mini"-->
+<!--              type="text"-->
+<!--              icon="el-icon-edit"-->
+<!--              @click="handleUpdate(item)"-->
+<!--              v-hasPermi="['Merchant:edit']"-->
+<!--            >修改</el-button>-->
+<!--            <el-button-->
+<!--              size="mini"-->
+<!--              type="text"-->
+<!--              icon="el-icon-delete"-->
+<!--              @click="handleDelete(item)"-->
+<!--              v-hasPermi="['Merchant:delete']"-->
+<!--            >删除</el-button>-->
+<!--          </span>-->
 <!--        </div>-->
-<!--        <div>商户编号:1861975</div>-->
 <!--      </el-card>-->
-      <el-card class="box-card" shadow="hover" v-for="item in merchantList" :key="item.id">
-        <div slot="header" class="clearfix">
-          <span><dict-tag :options="dict.type.payment_channel" :value="item.merchantName"/></span>
-          <el-button v-if="item.isUse=='0'"
-                     @click="editStatus(item,1)"
-                     style="float: right; padding: 3px 0" type="text">切换为当前通道</el-button>
-          <el-tag v-else effect="dark" type="success" style="float: right">当前使用中</el-tag>
-        </div>
-        <div>商户编号: {{ item.mchntCd }}</div>
-        <div style="margin-top: 5px;display: flex;justify-content: space-between">
-          <span>
-            备注: <span style="color: #00afff;margin-left: 3px" @click="editRemark(item.id)">{{ item.remark ? item.remark : "--" }}</span>
-          </span>
-          <span>
-            <el-button
-              size="mini"
-              type="text"
-              icon="el-icon-edit"
-              @click="handleUpdate(item)"
-              v-hasPermi="['Merchant:edit']"
-            >修改</el-button>
-            <el-button
-              size="mini"
-              type="text"
-              icon="el-icon-delete"
-              @click="handleDelete(item)"
-              v-hasPermi="['Merchant:delete']"
-            >删除</el-button>
-          </span>
-        </div>
-      </el-card>
-    </div>
-    <el-divider></el-divider>
-    <div class="cont-box">
-      <div style="width: 40%">
-        <el-alert
-          title="使用说明"
-          type="error"
-          description="添加/编辑对应的规则->规则配置正常->发布规则->规则生效
-注意:功能状态启用且通道规则发布生效后当前功能才有效,否则使用系统单商户号模式"
-          :closable="false"
-        >
-        </el-alert>
-      </div>
-
-      <div style="display: flex;align-items: center">
-        <div class="mingc">规则周期</div>
-        <el-radio-group v-model="labelPosition" @input="ruleCycle == labelPosition" size="small">
-          <el-radio-button label="permanent">永久</el-radio-button>
-          <el-radio-button label="singleDay">单日</el-radio-button>
-        </el-radio-group>
-        <div class="mingc">功能状态</div>
-        <el-switch
-          v-model="value"
-          @change="changeStatus"
-        >
-        </el-switch>
-      </div>
-    </div>
-
-    <div class="cont-box" >
-      <div><el-button type="primary" icon="el-icon-plus"
-                      v-hasPermi="['payment:add']" @click="addOil">添加规则</el-button></div>
-      <div><el-button type="success" icon="el-icon-s-promotion" @click="open">发布规则</el-button></div>
-    </div>
-    <div class="hangbox" v-for="(item,index) in oilConfigList" :key="item.id">
-      <div>{{index + 1}}.通道</div>
-      <div class="jiaong">{{ item.merchantName }}({{ item.remark }})</div>
-      <div> 商户号 </div>
-      <div class="jiaong">{{ item.mchntCd }}</div>
-<!--      <div> 交易满 </div>-->
-      <div> 交易占比 </div>
-      <div class="jiaong"> {{ item.proportion }} </div>
-      <div style="margin-right: 20px"> %更换支付通道   </div>
-<!--      <div class="jiaong"> 参与次数不固定次数 </div>-->
-
-      <el-button type="primary" icon="el-icon-edit"
-                 v-hasPermi="['payment:edit']" @click="editOilConfig(item.id)">编辑</el-button>
-      <el-button type="danger" icon="el-icon-close"
-                 v-hasPermi="['payment:delete']" @click="deleteOilConfig(item.id)">删除</el-button>
-    </div>
-<!--    <div class="hangbox" v-for="(item,index) in 3" :key="index">-->
-<!--      <div>{{index + 1}}.通道</div>-->
-<!--      <div class="jiaong"> 名称 </div>-->
-<!--      <div> 商户号 </div>-->
-<!--      <div class="jiaong"> 1231213213212</div>-->
-<!--&lt;!&ndash;      <div> 交易满 </div>&ndash;&gt;-->
-<!--      <div> 交易占比 </div>-->
-<!--      <div class="jiaong"> 2 </div>-->
-<!--      <div> %更换支付通道 参与次数  </div>-->
-<!--      <div class="jiaong"> 不固定次数 </div>-->
-
-<!--      <el-button type="primary" icon="el-icon-edit">编辑</el-button>-->
-<!--      <el-button type="danger" icon="el-icon-close">删除</el-button>-->
 <!--    </div>-->
-    <div class="hsize">注:规则按照顺序进行处理并自动更换支付通道，新增或变更规则后需要发布当前规则才生效,发布生效后的规则将从序号1的配置生效</div>
+<!--    <el-divider></el-divider>-->
+<!--    <div class="cont-box">-->
+<!--      <div style="width: 40%">-->
+<!--        <el-alert-->
+<!--          title="使用说明"-->
+<!--          type="error"-->
+<!--          description="添加/编辑对应的规则->规则配置正常->发布规则->规则生效-->
+<!--注意:功能状态启用且通道规则发布生效后当前功能才有效,否则使用系统单商户号模式"-->
+<!--          :closable="false"-->
+<!--        >-->
+<!--        </el-alert>-->
+<!--      </div>-->
+
+<!--      <div style="display: flex;align-items: center">-->
+<!--        <div class="mingc">规则周期</div>-->
+<!--        <el-radio-group v-model="labelPosition" @input="ruleCycle == labelPosition" size="small">-->
+<!--          <el-radio-button label="permanent">永久</el-radio-button>-->
+<!--          <el-radio-button label="singleDay">单日</el-radio-button>-->
+<!--        </el-radio-group>-->
+<!--        <div class="mingc">功能状态</div>-->
+<!--        <el-switch-->
+<!--          v-model="value"-->
+<!--          @change="changeStatus"-->
+<!--        >-->
+<!--        </el-switch>-->
+<!--      </div>-->
+<!--    </div>-->
+
+<!--    <div class="cont-box" >-->
+<!--      <div><el-button type="primary" icon="el-icon-plus"-->
+<!--                      v-hasPermi="['payment:add']" @click="addOil">添加规则</el-button></div>-->
+<!--      <div><el-button type="success" icon="el-icon-s-promotion" @click="open">发布规则</el-button></div>-->
+<!--    </div>-->
+<!--    <div class="hangbox" v-for="(item,index) in oilConfigList" :key="item.id">-->
+<!--      <div>{{index + 1}}.通道</div>-->
+<!--      <div class="jiaong">{{ item.merchantName }}({{ item.remark }})</div>-->
+<!--      <div> 商户号 </div>-->
+<!--      <div class="jiaong">{{ item.mchntCd }}</div>-->
+<!--      <div> 交易占比 </div>-->
+<!--      <div class="jiaong"> {{ item.proportion }} </div>-->
+<!--      <div style="margin-right: 20px"> %更换支付通道   </div>-->
+<!--      <el-button type="primary" icon="el-icon-edit"-->
+<!--                 v-hasPermi="['payment:edit']" @click="editOilConfig(item.id)">编辑</el-button>-->
+<!--      <el-button type="danger" icon="el-icon-close"-->
+<!--                 v-hasPermi="['payment:delete']" @click="deleteOilConfig(item.id)">删除</el-button>-->
+<!--    </div>-->
+<!--    <div class="hsize">注:规则按照顺序进行处理并自动更换支付通道，新增或变更规则后需要发布当前规则才生效,发布生效后的规则将从序号1的配置生效</div>-->
 
     <el-dialog :title="title" :visible.sync="dialogVisible" width="30%">
       <el-form :model="form1" ref="form1" :rules="rules" >
@@ -248,6 +514,13 @@ export default {
 
   data(){
     return{
+      ruleForm:[],
+      Enable:false,
+      SeparateAccounts:1,
+      addRule:false,
+      Ruletitle:'',
+      addMerchants:false,
+      addMerchantTitile:'',
       // 是否禁用
       isDis:false,
       // 商户配置信息
@@ -265,10 +538,11 @@ export default {
         delivery: false,
         type: [],
         resource: '',
-        desc: ''
+        desc: '',
+        boxlist:[],
       },
       form1:{},
-      formLabelWidth: '80px',
+      formLabelWidth: '100px',
       dialogFormVisible:false,
       dialogVisible:false,
       show:false,
@@ -276,7 +550,76 @@ export default {
       value1:true,
       labelPosition: 'singleDay',
       title:"",
+      boxlist:[],
       merchantConfig:{},
+      tableData: [{
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄',
+        PaymentChannel:'富有',
+        PaymentNum:'00004879449874854',
+        price:'1587461740.00',
+        status: '正在使用',
+        remark:'',
+        founder:'xxxx',
+      }, {
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄',
+        PaymentChannel:'富有',
+        PaymentNum:'00004879449874854',
+        price:'1587461740.00',
+        status: '正在使用',
+        remark:'',
+        founder:'xxxx',
+      },{
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄',
+        PaymentChannel:'富有',
+        PaymentNum:'00004879449874854',
+        price:'1587461740.00',
+        status: '正在使用',
+        remark:'',
+        founder:'xxxx',
+      },{
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄',
+        PaymentChannel:'富有',
+        PaymentNum:'00004879449874854',
+        price:'1587461740.00',
+        status: '正在使用',
+        remark:'',
+        founder:'xxxx',
+      }, ],
+      tableData1: [{
+        date: '2016-05-02',
+        name: '按交易类型分账',
+        address: 'xxxxxxxxxxxxxxxxxxx',
+        RuleName:'规则名字',
+        PaymentNum:'00004879449874854',
+        price:'1587461740.00',
+        status: true,
+        remark:'',
+        founder:'xxxx',
+      }, {
+        id: 2,
+        date: '2016-05-04',
+        name: '王小虎',
+        address: 'xxxxxxxxxxxxxxxxxxx',
+      }, {
+        id: 3,
+        date: '2016-05-01',
+        name: '王小虎',
+        address: 'xxxxxxxxxxxxxxxxxxx',
+
+      }, {
+        id: 4,
+        date: '2016-05-03',
+        name: '王小虎',
+        address: 'xxxxxxxxxxxxxxxxxxx',
+      }],
       rules:{
         merchantName: [
           { required: true, message: '请选择支付通道', trigger: 'blur' },
@@ -291,6 +634,32 @@ export default {
     this.getList();
   },
   methods:{
+    addboxlsit(){
+
+    let data = {
+      one: '',
+      two: '',
+      three: '',
+    }
+      this.form.boxlist.push(data)
+    },
+    deleteDoxlist(index){
+      this.form.boxlist.splice(index, 1)
+    },
+    addRules(){
+      this.Ruletitle = '新增规则'
+      this.addRule = true
+    },
+    addMerchantShow(){
+      this.addMerchantTitile = '新增商户信息'
+      this.addMerchants = true
+
+    },
+    editMerchant(data){
+      // data用于请求接口
+      this.addMerchantTitile = '修改商户信息'
+      this.addMerchants = true
+    },
     handleUpdate(data){
       merchantInfo(data.id).then(res => {
         this.title = "商户信息"
@@ -547,9 +916,58 @@ export default {
 <style scoped>
 .box-centenr{
   width: 100%;
+  background: #f9f9f9;
   box-sizing: border-box;
   padding: 20px;
 }
+.new-box{
+  width: 100%;
+  background: #fff;
+  box-sizing: border-box;
+  padding: 20px;
+}
+.n-top-box{
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 10px;
+}
+.d-s{
+  display: flex;
+  align-items: center;
+}
+.gang{
+  width: 2px;
+  height: 12px;
+  background: #FF770F;
+  margin-right: 5px;
+
+}
+.title_{
+  font-weight: 600;
+  font-size: 14px;
+  color: #333333;
+  margin-right: 10px;
+}
+.size_{
+  font-weight: 400;
+  font-size: 12px;
+  color: #666666;
+}
+.o-button{
+ box-sizing: border-box;
+  padding: 7px 5px;
+  background: linear-gradient( 180deg, #FF8648 0%, #FFA360 100%);
+  border-radius: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: #fff;
+  font-weight: 400;
+  font-size: 14px;
+  cursor: pointer;
+}
 .content-box{
   width: 100%;
   display: flex;
@@ -593,6 +1011,24 @@ export default {
 .hsize{
   color: #999;
 }
-
+.xz_box{
-
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  color: #999999;
+  margin-right: 15px;
+  cursor: pointer;
+}
+.active{
+  color: #FF9655 !important;
+}
+.list-box{
+  border: 1px solid #D1D1D1;
+  border-radius: 8px;
+  padding: 20px;
+  box-sizing: border-box;
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+}
 </style>