diff --git a/.env.development b/.env.development
index 275d6fc..e033be2 100644
--- a/.env.development
+++ b/.env.development
@@ -5,7 +5,7 @@ ENV = 'development'
 # VUE_APP_BASE_API = '/dev-api'
 # VUE_APP_BASE_API = 'http://106.75.49.247:20400'
 # VUE_APP_BASE_API = 'https://yruibao.com/admin'
-VUE_APP_BASE_API = 'http://192.168.2.26:20401'
+VUE_APP_BASE_API = 'http://192.168.2.5:20401'
 
 
 # vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
diff --git a/.env.production b/.env.production
index 4cfe70a..fe26717 100644
--- a/.env.production
+++ b/.env.production
@@ -5,4 +5,4 @@ ENV = 'production'
 # VUE_APP_BASE_API = '/prod-api'
 # VUE_APP_BASE_API = 'http://106.75.49.247:20400'
 # VUE_APP_BASE_API = 'https://yruibao.com/admin'
-VUE_APP_BASE_API = 'http://192.168.2.26:20401'
+VUE_APP_BASE_API = 'http://192.168.2.5:20401'
diff --git a/src/api/systemInstallment.js b/src/api/systemInstallment.js
new file mode 100644
index 0000000..ada2037
--- /dev/null
+++ b/src/api/systemInstallment.js
@@ -0,0 +1,107 @@
+import request from '@/utils/request';
+
+/**
+ * 删除商品分期配置表
+ * @param id
+ * @constructor
+ */
+export function DelInstallments(id) {
+  const data = {
+    id: id,
+  };
+  return request({
+    url: '/admin/customInstallments/delete',
+    method: 'GET',
+    params: data,
+  });
+}
+
+/**
+ * 商品分期配置表详情
+ * @param id
+ * @constructor
+ */
+export function InfoInstallments(id) {
+  const data = {
+    id: id,
+  };
+  return request({
+    url: '/admin/customInstallments/info',
+    method: 'get',
+    params: data,
+  });
+}
+
+/**
+ * 商品分期配置表列表
+ * @param pram
+ * @constructor
+ */
+export function ListInstallments(pram) {
+  const data = {
+    productName: pram.productName,
+    productId: pram.productId,
+    page: pram.page,
+    limit: pram.limit,
+  };
+  return request({
+    url: '/admin/customInstallments/list',
+    method: 'GET',
+    params: data,
+  });
+}
+
+/**
+ * 新增商品分期配置表
+ * @param pram
+ * @constructor
+ */
+export function AddInstallments(pram) {
+  const data = {
+    name: pram.name,
+    tips:pram.tips
+  };
+  return request({
+    url: '/admin/customInstallments/save',
+    method: 'post',
+    data: data,
+  });
+}
+
+
+/**
+ * 新增自定义账单
+ * @param pram
+ * @constructor
+ */
+export function AddInstallmentsDetail(pram) {
+  const data = {
+    installmentsId: pram.id,
+    installmentNumber: pram.installmentNumber,
+    repaymentPercent: pram.repaymentPercent,
+    repaymentDeadlineStr: pram.repaymentDeadlineStr,
+  };
+  return request({
+    url: '/admin/customInstallmentsDetail/save',
+    method: 'post',
+    data: data,
+  });
+}
+
+/**
+ * 更新商品分期配置表
+ * @param pram
+ * @constructor
+ */
+export function UpdateInstallments(pram) {
+  const data = {
+    name: pram.name,
+    tips:pram.tips
+  };
+  return request({
+    url: '/admin/customInstallments/update',
+    method: 'post',
+    params: { id: pram.id },
+    data: data,
+  });
+}
diff --git a/src/components/CustomInstallments/edit.vue b/src/components/CustomInstallments/edit.vue
new file mode 100644
index 0000000..3c3fe48
--- /dev/null
+++ b/src/components/CustomInstallments/edit.vue
@@ -0,0 +1,222 @@
+<template>
+  <div>
+    <el-form ref="editPram" :model="editPram" label-width="130px">
+      <el-form-item
+        label="分类名称"
+        prop="name"
+        :rules="[{ required: true, message: '请输入分类名称', trigger: ['blur', 'change'] }]"
+      >
+        <el-input v-model="editPram.name" :maxlength="biztype.value === 1 ? 8 : 20" placeholder="分类名称" />
+      </el-form-item>
+      <el-form-item label="URL" v-if="biztype.value !== 1 && biztype.value !== 3">
+        <el-input v-model="editPram.url" placeholder="URL" />
+      </el-form-item>
+      <el-form-item label="父级" v-if="biztype.value !== 3">
+        <el-cascader
+          v-model="editPram.pid"
+          :disabled="isCreate === 1 && editPram.pid === 0"
+          :options="biztype.value === 5 ? allTreeList : parentOptions"
+          :props="categoryProps"
+          style="width: 100%"
+        />
+      </el-form-item>
+      <el-form-item label="菜单图标" v-if="biztype.value === 5">
+        <el-input placeholder="请选择菜单图标" v-model="editPram.extra">
+          <el-button slot="append" icon="el-icon-circle-plus-outline" @click="addIcon"></el-button>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="分类图标(180*180)" v-if="biztype.value === 1 || biztype.value === 3">
+        <div class="upLoadPicBox" @click="modalPicTap('1')">
+          <div v-if="editPram.extra" class="pictrue">
+            <img :src="editPram.extra" />
+          </div>
+          <div v-else class="upLoad">
+            <i class="el-icon-camera cameraIconfont" />
+          </div>
+        </div>
+      </el-form-item>
+      <el-form-item label="排序">
+        <el-input-number v-model="editPram.sort" :min="0" />
+      </el-form-item>
+      <el-form-item label="状态">
+        <el-switch
+          v-model="editPram.status"
+          active-text="显示"
+          inactive-text="隐藏"
+          :active-value="true"
+          :inactive-value="false"
+        />
+      </el-form-item>
+      <el-form-item label="扩展字段" v-if="biztype.value !== 1 && biztype.value !== 3 && biztype.value !== 5">
+        <el-input v-model="editPram.extra" type="textarea" placeholder="扩展字段" />
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          :loading="loadingBtn"
+          v-hasPermi="['admin:category:update']"
+          v-debounceClick="
+            () => {
+              handlerSubmit('editPram');
+            }
+          "
+          >确定</el-button
+        >
+        <el-button @click="close">取消</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<!--创建和编辑公用一个组件-->
+<script>
+import * as categoryApi from '@/api/categoryApi.js';
+import * as selfUtil from '@/utils/ZBKJIutil.js';
+export default {
+  // name: "edit"
+  props: {
+    prent: {
+      type: Object,
+      required: true,
+    },
+    isCreate: {
+      type: Number,
+      default: 0,
+    },
+    editData: {
+      type: Object,
+    },
+    biztype: {
+      type: Object,
+      required: true,
+    },
+    allTreeList: {
+      type: Array,
+    },
+  },
+  data() {
+    return {
+      loadingBtn: false,
+      constants: this.$constants,
+      editPram: {
+        extra: null,
+        name: null,
+        pid: null,
+        sort: 0,
+        status: true,
+        type: this.biztype.value,
+        url: null,
+        id: 0,
+      },
+      categoryProps: {
+        value: 'id',
+        label: 'name',
+        children: 'child',
+        expandTrigger: 'hover',
+        checkStrictly: true,
+        emitPath: false,
+      },
+      parentOptions: [],
+    };
+  },
+  mounted() {
+    this.initEditData();
+  },
+  methods: {
+    // 点击图标
+    addIcon() {
+      const _this = this;
+      _this.$modalIcon(function (icon) {
+        _this.editPram.extra = icon;
+      });
+    },
+    // 点击商品图
+    modalPicTap(tit, num, i) {
+      const _this = this;
+      const attr = [];
+      this.$modalUpload(
+        function (img) {
+          if (tit === '1' && !num) {
+            _this.editPram.extra = img[0].sattDir;
+          }
+          if (tit === '2' && !num) {
+            img.map((item) => {
+              attr.push(item.attachment_src);
+              _this.formValidate.slider_image.push(item);
+            });
+          }
+        },
+        tit,
+        'store',
+      );
+    },
+    close() {
+      this.$emit('hideEditDialog');
+    },
+    initEditData() {
+      this.parentOptions = [...this.allTreeList];
+      this.addTreeListLabelForCasCard(this.parentOptions, 'child');
+      const { extra, name, pid, sort, status, type, id, url } = this.editData;
+      if (this.isCreate === 1) {
+        this.editPram.extra = extra;
+        this.editPram.name = name;
+        this.editPram.pid = pid;
+        this.editPram.sort = sort;
+        this.editPram.status = status;
+        this.editPram.type = type;
+        this.editPram.url = url;
+        this.editPram.id = id;
+      } else {
+        this.editPram.pid = this.prent.id;
+        this.editPram.type = this.biztype.value;
+      }
+    },
+    addTreeListLabelForCasCard(arr, child) {
+      arr.forEach((o, i) => {
+        if (o.child && o.child.length) {
+          // o.disabled = true
+          o.child.forEach((j) => {
+            j.disabled = true;
+          });
+        }
+      });
+    },
+    handlerSubmit(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (!valid) return;
+        this.handlerSaveOrUpdate(this.isCreate === 0);
+      });
+    },
+    handlerSaveOrUpdate(isSave) {
+      if (isSave) {
+        // this.editPram.pid = this.prent.id
+        this.loadingBtn = true;
+        categoryApi
+          .addCategroy(this.editPram)
+          .then((data) => {
+            this.$emit('hideEditDialog');
+            this.$message.success('创建目录成功');
+            this.loadingBtn = false;
+          })
+          .catch(() => {
+            this.loadingBtn = false;
+          });
+      } else {
+        this.editPram.pid = Array.isArray(this.editPram.pid) ? this.editPram.pid[0] : this.editPram.pid;
+        this.loadingBtn = true;
+        categoryApi
+          .updateCategroy(this.editPram)
+          .then((data) => {
+            this.$emit('hideEditDialog');
+            this.$message.success('更新目录成功');
+            this.loadingBtn = false;
+          })
+          .catch(() => {
+            this.loadingBtn = false;
+          });
+      }
+    },
+  },
+};
+</script>
+
+<style scoped></style>
diff --git a/src/components/CustomInstallments/info.vue b/src/components/CustomInstallments/info.vue
new file mode 100644
index 0000000..d5410b2
--- /dev/null
+++ b/src/components/CustomInstallments/info.vue
@@ -0,0 +1,110 @@
+<template>
+  <div>
+    <el-tree :data="ddd" :props="defaultProps" @node-click="handleNodeClick" />
+  </div>
+</template>
+
+<script>
+import * as categoryApi from '@/api/categoryApi.js';
+export default {
+  // name: "info"
+  props: {
+    id: {
+      type: Number,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      defaultProps: {
+        children: 'children',
+        label: 'label',
+      },
+      ddd: [
+        {
+          label: '一级 1',
+          children: [
+            {
+              label: '二级 1-1',
+              children: [
+                {
+                  label: '三级 1-1-1',
+                },
+              ],
+            },
+          ],
+        },
+        {
+          label: '一级 2',
+          children: [
+            {
+              label: '二级 2-1',
+              children: [
+                {
+                  label: '三级 2-1-1',
+                },
+              ],
+            },
+            {
+              label: '二级 2-2',
+              children: [
+                {
+                  label: '三级 2-2-1',
+                },
+              ],
+            },
+          ],
+        },
+        {
+          label: '一级 3',
+          children: [
+            {
+              label: '二级 3-1',
+              children: [
+                {
+                  label: '三级 3-1-1',
+                },
+              ],
+            },
+            {
+              label: '二级 3-2',
+              children: [
+                {
+                  label: '三级 3-2-1',
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      dataList: {
+        // 数据结果
+        page: 0,
+        limit: 0,
+        totalPage: 0,
+        total: 0,
+        list: [],
+      },
+    };
+  },
+  mounted() {
+    this.handlerGetTreeList(this.id);
+  },
+  methods: {
+    handlerGetTreeList(id) {
+      if (!id) {
+        this.$message.error('当前数据id不正确');
+        return;
+      }
+      categoryApi.treeCategroy({ pid: id }).then((data) => {
+        this.dataList = data;
+      });
+    },
+    handleNodeClick(data) {
+      console.log('data:', data);
+    },
+  },
+};
+</script>
+
+<style scoped></style>
diff --git a/src/components/CustomInstallments/list.vue b/src/components/CustomInstallments/list.vue
new file mode 100644
index 0000000..e5694f4
--- /dev/null
+++ b/src/components/CustomInstallments/list.vue
@@ -0,0 +1,360 @@
+<template>
+  <div>
+    <template v-if="selectModel">
+      <el-tree
+        ref="tree"
+        :data="treeList"
+        show-checkbox
+        node-key="id"
+        @check="getCurrentNode"
+        :default-checked-keys="selectModelKeysNew"
+        :props="treeProps"
+      >
+      </el-tree>
+    </template>
+    <template v-else>
+      <div class="divBox">
+        <el-card class="box-card">
+          <div slot="header" class="clearfix">
+<!--            <div class="container">-->
+<!--              <el-form inline size="small">-->
+<!--                <el-form-item label="状态：">-->
+<!--                  <el-select v-model="listPram.status" placeholder="状态" class="selWidth" @change="handlerGetList">-->
+<!--                    <el-option label="全部" :value="-1"></el-option>-->
+<!--                    <el-option label="显示" :value="1"></el-option>-->
+<!--                    <el-option label="不显示" :value="0"></el-option>-->
+<!--                  </el-select>-->
+<!--                </el-form-item>-->
+<!--                <el-form-item label="名称：">-->
+<!--                  <el-input v-model="listPram.name" placeholder="请输入名称" class="selWidth" size="small" clearable>-->
+<!--                    <el-button slot="append" icon="el-icon-search" @click="handlerGetList" size="small" />-->
+<!--                  </el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-form>-->
+<!--            </div>-->
+            <el-button
+              size="mini"
+              type="primary"
+              @click="handleAddMenu({ id: 0, name: '顶层目录' })"
+              v-hasPermi="['admin:category:save']"
+              >添加套餐</el-button
+            >
+          </div>
+          <el-table
+            ref="treeList"
+            :data="treeList"
+            size="mini"
+            class="table"
+            highlight-current-row
+            row-key="id"
+            :tree-props="{ children: 'child', hasChildren: 'hasChildren' }"
+          >
+            <el-table-column prop="name" label="名称" min-width="240">
+              <template slot-scope="scope"> {{ scope.row.name }} | {{ scope.row.id }} </template>
+            </el-table-column>
+            <template v-if="!selectModel">
+<!--              <el-table-column label="类型" min-width="150">-->
+<!--                <template slot-scope="scope">-->
+<!--                  <span>{{ scope.row.type | filterCategroyType | filterEmpty }}</span>-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+<!--              <el-table-column label="分类图标" min-width="80">-->
+<!--                <template slot-scope="scope">-->
+<!--                  <div class="listPic" v-if="biztype.value === 5">-->
+<!--                    <i :class="'el-icon-' + scope.row.extra" style="font-size: 20px" />-->
+<!--                  </div>-->
+<!--                  <div class="demo-image__preview" v-else>-->
+<!--                    <el-image-->
+<!--                      style="width: 36px; height: 36px"-->
+<!--                      :src="scope.row.extra"-->
+<!--                      :preview-src-list="[scope.row.extra]"-->
+<!--                      v-if="scope.row.extra"-->
+<!--                    />-->
+<!--                    <img style="width: 36px; height: 36px" v-else :src="defaultImg" alt="" />-->
+<!--                  </div>-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+<!--              <el-table-column label="Url" min-width="250" v-if="biztype.value === 5" key="2">-->
+<!--                <template slot-scope="scope">-->
+<!--                  <span>{{ scope.row.url }}</span>-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+<!--              <el-table-column label="排序" prop="sort" min-width="150" />-->
+<!--              <el-table-column label="状态" min-width="150">-->
+<!--                &lt;!&ndash;  &ndash;&gt;-->
+<!--                <template slot-scope="scope" v-if="checkPermi(['admin:category:update:status'])">-->
+<!--                  <el-switch-->
+<!--                    v-model="scope.row.status"-->
+<!--                    :active-value="true"-->
+<!--                    :inactive-value="false"-->
+<!--                    active-text="显示"-->
+<!--                    inactive-text="隐藏"-->
+<!--                    @change="onchangeIsShow(scope.row)"-->
+<!--                  />-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+
+              <el-table-column label="操作" min-width="200" fixed="right">
+                <template slot-scope="scope">
+                  <el-button
+                    v-if="(biztype.value === 1 && scope.row.pid === 0) || biztype.value === 5"
+                    type="text"
+                    size="small"
+                    @click="handleAddMenu(scope.row)"
+                    >添加子目录</el-button
+                  >
+                  <el-button
+                    type="text"
+                    size="small"
+                    @click="handleEditMenu(scope.row)"
+                    v-hasPermi="['admin:category:info']"
+                    >编辑</el-button
+                  >
+                  <el-button
+                    type="text"
+                    size="small"
+                    v-debounceClick="
+                      () => {
+                        handleDelMenu(scope.row);
+                      }
+                    "
+                    v-hasPermi="['admin:category:delete']"
+                    >删除</el-button
+                  >
+                </template>
+              </el-table-column>
+            </template>
+          </el-table>
+        </el-card>
+      </div>
+    </template>
+    <el-dialog
+      :title="editDialogConfig.isCreate === 0 ? `创建${biztype.name}` : `编辑${biztype.name}`"
+      :visible.sync="editDialogConfig.visible"
+      destroy-on-close
+      :close-on-click-modal="false"
+    >
+      <edit
+        v-if="editDialogConfig.visible"
+        :prent="editDialogConfig.prent"
+        :is-create="editDialogConfig.isCreate"
+        :edit-data="editDialogConfig.data"
+        :biztype="editDialogConfig.biztype"
+        :all-tree-list="treeList"
+        @hideEditDialog="hideEditDialog"
+      />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import * as categoryApi from '@/api/categoryApi.js';
+import info from './info';
+import edit from './edit';
+import * as selfUtil from '@/utils/ZBKJIutil.js';
+import { checkPermi, checkRole } from '@/utils/permission';
+export default {
+  // name: "list"
+  components: { info, edit },
+  props: {
+    biztype: {
+      // 类型，1 产品分类，2 附件分类，3 文章分类， 4 设置分类， 5 菜单分类
+      type: Object,
+      default: { value: -1 },
+      validator: (obj) => {
+        return obj.value > 0;
+      },
+    },
+    pid: {
+      type: Number,
+      default: 0,
+      validator: (value) => {
+        return value >= 0;
+      },
+    },
+    selectModel: {
+      // 是否选择模式
+      type: Boolean,
+      default: false,
+    },
+    selectModelKeys: {
+      type: Array,
+    },
+    rowSelect: {},
+  },
+  data() {
+    return {
+      selectModelKeysNew: this.selectModelKeys,
+      loading: false,
+      constants: this.$constants,
+      treeProps: {
+        label: 'name',
+        children: 'child',
+        // expandTrigger: 'hover',
+        // checkStrictly: false,
+        // emitPath: false
+      },
+      // treeCheckedKeys:[],// 选择模式下的属性结构默认选中
+      multipleSelection: [],
+      editDialogConfig: {
+        visible: false,
+        isCreate: 0, // 0=创建，1=编辑
+        prent: {}, // 父级对象
+        data: {},
+        biztype: this.biztype, // 统一主业务中的目录类型
+      },
+      dataList: [],
+      treeList: [],
+      listPram: {
+        pid: this.pid,
+        type: this.biztype.value,
+        status: -1,
+        name: '',
+        page: this.$constants.page.page,
+        limit: this.$constants.page.limit[0],
+      },
+      viewInfoConfig: {
+        data: null,
+        visible: false,
+      },
+      defaultImg: require('@/assets/imgs/moren.jpg'),
+    };
+  },
+  mounted() {
+    /* if(this.biztype.value === 3){
+      this.listPram.pageSize = constants.page.pageSize[4]
+      this.handlerGetList()
+    }else{*/
+    this.handlerGetTreeList();
+    // }
+  },
+  methods: {
+    checkPermi, //权限控制
+    onchangeIsShow(row) {
+      categoryApi
+        .categroyUpdateStatus(row.id)
+        .then(() => {
+          this.$message.success('修改成功');
+          this.handlerGetTreeList();
+        })
+        .catch(() => {
+          row.status = !row.status;
+        });
+    },
+    handleEditMenu(rowData) {
+      this.editDialogConfig.isCreate = 1;
+      this.editDialogConfig.data = rowData;
+      this.editDialogConfig.prent = rowData;
+      this.editDialogConfig.visible = true;
+    },
+    handleAddMenu(rowData) {
+      this.editDialogConfig.isCreate = 0;
+      this.editDialogConfig.prent = rowData;
+      this.editDialogConfig.data = {};
+      this.editDialogConfig.biztype = this.biztype;
+      this.editDialogConfig.visible = true;
+    },
+    getCurrentNode(data) {
+      let node = this.$refs.tree.getNode(data);
+      this.childNodes(node);
+      // this.parentNodes(node);
+      //是否编辑的表示
+      // this.ruleForm.isEditorFlag = true;
+      //编辑时候使用
+      this.$emit('rulesSelect', this.$refs.tree.getCheckedKeys());
+      // this.selectModelKeys = this.$refs.tree.getCheckedKeys();
+      //无论编辑和新增点击了就传到后台这个值
+      // this.$emit('rulesSelect', this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys()));
+      // this.ruleForm.menuIdsisEditor = this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys());
+    },
+    //具体方法可以看element官网api
+    childNodes(node) {
+      let len = node.childNodes.length;
+      for (let i = 0; i < len; i++) {
+        node.childNodes[i].checked = node.checked;
+        this.childNodes(node.childNodes[i]);
+      }
+    },
+    parentNodes(node) {
+      if (node.parent) {
+        for (let key in node) {
+          if (key == 'parent') {
+            node[key].checked = true;
+            this.parentNodes(node[key]);
+          }
+        }
+      }
+    },
+    handleDelMenu(rowData) {
+      this.$confirm('删除当前数据?').then(() => {
+        categoryApi.deleteCategroy(rowData).then((data) => {
+          this.handlerGetTreeList();
+          this.$message.success('删除成功');
+        });
+      });
+    },
+    handlerGetList() {
+      this.handlerGetTreeList();
+      // categoryApi.listCategroy({status:this.listPram.status, type: 1 }).then(data => {
+      //   this.treeList = data.list
+      // })
+    },
+    handlerGetTreeList() {
+      // this.biztype.value === 5 && !this.selectModel) ?  -1 : 1
+      // const _pram = { type: this.biztype.value, status: !this.selectModel ? -1 : (this.biztype.value === 5 ? -1 : 1) }
+      const _pram = { type: this.biztype.value, status: this.listPram.status, name: this.listPram.name };
+      this.loading = true;
+      this.biztype.value !== 3
+        ? categoryApi
+            .treeCategroy(_pram)
+            .then((data) => {
+              this.treeList = this.handleAddArrt(data);
+              this.loading = false;
+            })
+            .catch(() => {
+              this.loading = false;
+            })
+        : categoryApi
+            .listCategroy({ type: 3, status: this.listPram.status, pid: this.listPram.pid, name: this.listPram.name })
+            .then((data) => {
+              this.treeList = data.list;
+            });
+    },
+    handlerGetInfo(id) {
+      this.viewInfoConfig.data = id;
+      this.viewInfoConfig.visible = true;
+    },
+    handleNodeClick(data) {
+      console.log('data:', data);
+    },
+    handleAddArrt(treeData) {
+      const _result = selfUtil.addTreeListLabel(treeData);
+      return _result;
+    },
+    hideEditDialog() {
+      setTimeout(() => {
+        this.editDialogConfig.prent = {};
+        this.editDialogConfig.type = 0;
+        this.editDialogConfig.visible = false;
+        this.handlerGetTreeList();
+      }, 200);
+    },
+    handleSelectionChange(d1, { checkedNodes, checkedKeys, halfCheckedNodes, halfCheckedKeys }) {
+      // this.multipleSelection =  checkedKeys.concat(halfCheckedKeys)
+      this.multipleSelection = checkedKeys;
+      this.$emit('rulesSelect', this.multipleSelection);
+    },
+  },
+};
+</script>
+
+<style scoped>
+.custom-tree-node {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  padding-right: 8px;
+}
+</style>
diff --git a/src/router/modules/operation.js b/src/router/modules/operation.js
index e6f7849..c8e6315 100644
--- a/src/router/modules/operation.js
+++ b/src/router/modules/operation.js
@@ -31,6 +31,15 @@ const operationRouter = {
         icon: 'clipboard',
       },
     },
+    {
+      path: 'installment',
+      name: 'installment',
+      component: () => import('@/views/systemSetting/installment'),
+      meta: {
+        title: '自定义分期配置',
+        icon: 'clipboard',
+      },
+    },
     {
       path: 'notification',
       name: 'notification',
diff --git a/src/views/systemSetting/installment/creatDetail.vue b/src/views/systemSetting/installment/creatDetail.vue
new file mode 100644
index 0000000..7e5eb51
--- /dev/null
+++ b/src/views/systemSetting/installment/creatDetail.vue
@@ -0,0 +1,150 @@
+<template>
+  <el-dialog
+    v-if="detailVisible"
+    title="添加自定义账单"
+    :visible.sync="detailVisible"
+    width="500px"
+    :before-close="handleClose">
+    <el-form :model="user" :rules="rules" ref="user" label-width="100px" class="demo-ruleForm" v-loading="loading">
+      <el-form-item label="第几期" >
+        <el-select v-model="user.installmentNumber" placeholder="请选择" style="width: 20%">
+          <el-option v-for="item in installmentNumberTreeData" :key="item" :label="item" :value="item">
+          </el-option>
+        </el-select>
+        <span>期</span>
+      </el-form-item>
+      <el-form-item label="还款比例(%)" >
+        <el-input-number style="width: 50%;float: left"
+                         v-model="user.repaymentPercent"
+                         :min="0"
+                         :step="1"
+                         step-strictly
+                         placeholder="请输入还款比例"
+        />
+        <span class="el-input-group__append">%</span>
+      </el-form-item>
+      <el-form-item label="还款时间" prop="repaymentDeadlineStr">
+        <el-date-picker v-model="user.repaymentDeadlineStr" type="date" placeholder="选择日期" />
+      </el-form-item>
+<!--      <el-form-item label="分期提示" prop="tips">-->
+<!--        <el-input v-model="user.tips" placeholder="请输入分期提示"></el-input>-->
+<!--      </el-form-item>-->
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="resetForm('user')">取 消</el-button>
+      <el-button
+        type="primary"
+        @click="submitForm('formValidate')"
+        v-hasPermi="['admin:setting:update', 'admin:setting:save']"
+        >确 定</el-button
+      >
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+  import { AddInstallments, AddInstallmentsDetail, UpdateInstallments } from '@/api/systemInstallment'
+import { Debounce } from '@/utils/validate';
+const obj = {
+  name: '',
+  grade: 1,
+  discount: '',
+  icon: '',
+  image: '',
+  id: null,
+  tips:''
+};
+export default {
+  name: 'CreatDetail',
+  props: {
+    user: Object,
+  },
+  data() {
+    return {
+      detailVisible: false,
+      installmentNumberTreeData: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18],
+      formValidate: Object.assign({}, obj),
+      loading: false,
+      rules: {
+        name: [{ required: true, message: '请输入分期套餐名称', trigger: 'blur' }],
+      },
+    };
+  },
+  methods: {
+    formatPercentage(value) {
+      if(value == "0.00" || value == "0.0" || value == "0" || value == 0 || value == null){
+        return "-";
+      }else {
+        return (value * 100).toFixed(2) + '%';
+      }
+    },
+    // 点击商品图
+    modalPicTap(tit, num) {
+      const _this = this;
+      this.$modalUpload(
+        function (img) {
+          tit === '1' && num === 'icon'
+            ? (_this.formValidate.icon = img[0].sattDir)
+            : (_this.formValidate.image = img[0].sattDir);
+          this.$set(_this.user, 'icon', _this.formValidate.icon);
+          this.$set(_this.user, 'isShow', false);
+        },
+        tit,
+        'user',
+      );
+    },
+    info(id) {
+      this.loading = true;
+      levelInfoApi({ id: id })
+        .then((res) => {
+          this.formValidate = res;
+          this.loading = false;
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+    handleClose() {
+      this.detailVisible = false;
+      // this.user = Object.assign({}, '')
+    },
+    submitForm: Debounce(function (formName) {
+      this.$refs.user.validate((valid) => {
+        if (valid) {
+          this.loading = true;
+          console.log("----------- "+JSON.stringify(this.user));
+          AddInstallmentsDetail(this.user)
+            .then((res) => {
+              this.$message.success('添加成功');
+              this.loading = false;
+              this.handleClose();
+              this.formValidate = Object.assign({}, obj);
+              this.$parent.getList();
+            })
+            .catch(() => {
+              this.loading = false;
+              this.formValidate = Object.assign({}, obj);
+            });
+        } else {
+          return false;
+        }
+      });
+    }),
+    resetForm(formName) {
+      this.detailVisible = false;
+      this[formName] = {};
+      //  this.$nextTick(() => {
+      //   this.$refs.formData.resetFields();
+      // })
+    },
+  },
+};
+</script>
+
+<style scoped>
+  .el-input-number .el-input-group__append {
+    padding: 0 12px;
+    line-height: 36px;
+    border-left: 1px solid #dcdfe6;
+  }
+</style>
diff --git a/src/views/systemSetting/installment/creatSetting.vue b/src/views/systemSetting/installment/creatSetting.vue
new file mode 100644
index 0000000..44417a3
--- /dev/null
+++ b/src/views/systemSetting/installment/creatSetting.vue
@@ -0,0 +1,158 @@
+<template>
+  <el-dialog
+    v-if="dialogVisible"
+    title="添加分期配置"
+    :visible.sync="dialogVisible"
+    width="500px"
+    :before-close="handleClose"
+  >
+    <el-form :model="user" :rules="rules" ref="user" label-width="100px" class="demo-ruleForm" v-loading="loading">
+      <el-form-item label="分期名称" prop="name">
+        <el-input v-model="user.name" placeholder="请输入分期套餐名称"></el-input>
+      </el-form-item>
+      <el-form-item label="分期提示" prop="name">
+        <el-input v-model="user.tips" placeholder="请输入分期套餐提示"></el-input>
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="resetForm('user')">取 消</el-button>
+      <el-button
+        type="primary"
+        @click="submitForm('formValidate')"
+        v-hasPermi="['admin:setting:update', 'admin:setting:save']"
+        >确 定</el-button
+      >
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { AddInstallments,UpdateInstallments} from '@/api/systemInstallment';
+import { Debounce } from '@/utils/validate';
+const obj = {
+  name: '',
+  grade: 1,
+  discount: '',
+  icon: '',
+  image: '',
+  id: null,
+  tips:''
+};
+export default {
+  name: 'CreatSetting',
+  props: {
+    user: Object,
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      installmentNumberTreeData: [1,3,6,9,12,18,24,36],
+      formValidate: Object.assign({}, obj),
+      loading: false,
+      rules: {
+        name: [{ required: true, message: '请输入分期套餐名称', trigger: 'blur' }],
+      },
+    };
+  },
+  methods: {
+    formatPercentage(value) {
+      if(value == "0.00" || value == "0.0" || value == "0" || value == 0 || value == null){
+        return "-";
+      }else {
+        return (value * 100).toFixed(2) + '%';
+      }
+    },
+    // 点击商品图
+    modalPicTap(tit, num) {
+      const _this = this;
+      this.$modalUpload(
+        function (img) {
+          tit === '1' && num === 'icon'
+            ? (_this.formValidate.icon = img[0].sattDir)
+            : (_this.formValidate.image = img[0].sattDir);
+          this.$set(_this.user, 'icon', _this.formValidate.icon);
+          this.$set(_this.user, 'isShow', false);
+        },
+        tit,
+        'user',
+      );
+    },
+    info(id) {
+      this.loading = true;
+      levelInfoApi({ id: id })
+        .then((res) => {
+          this.formValidate = res;
+          this.loading = false;
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+    handleClose() {
+      this.dialogVisible = false;
+      // this.user = Object.assign({}, '')
+    },
+    submitForm: Debounce(function (formName) {
+      this.$refs.user.validate((valid) => {
+        if (valid) {
+          this.loading = true;
+           // this.user.amountComesUp = (this.user.amountComesUp)/100;
+           // this.user.downPaymentPercent = (this.user.downPaymentPercent)/100;
+          console.log("----------- "+JSON.stringify(this.user));
+          let data = {
+            name: this.user.name,
+            installmentNumber: this.user.installmentNumber,
+            // amountComesUp: (this.user.amountComesUp)/100,
+            // downPaymentPercent: (this.user.downPaymentPercent)/100,
+            downPaymentNumber: this.user.downPaymentNumber,
+            cycle: this.user.cycle,
+            id: this.user.id,
+            tips:this.user.tips
+          };
+          this.user.id
+            ? UpdateInstallments(data)
+                .then((res) => {
+                  this.$message.success('编辑成功');
+                  this.loading = false;
+                  this.handleClose();
+                  this.formValidate = Object.assign({}, obj);
+                  this.$parent.getList();
+                })
+                .catch(() => {
+                  this.loading = false;
+                })
+            : AddInstallments(this.user)
+                .then((res) => {
+                  this.$message.success('添加成功');
+                  this.loading = false;
+                  this.handleClose();
+                  this.formValidate = Object.assign({}, obj);
+                  this.$parent.getList();
+                })
+                .catch(() => {
+                  this.loading = false;
+                  this.formValidate = Object.assign({}, obj);
+                });
+        } else {
+          return false;
+        }
+      });
+    }),
+    resetForm(formName) {
+      this.dialogVisible = false;
+      this[formName] = {};
+      //  this.$nextTick(() => {
+      //   this.$refs.formData.resetFields();
+      // })
+    },
+  },
+};
+</script>
+
+<style scoped>
+  .el-input-number .el-input-group__append {
+    padding: 0 12px;
+    line-height: 36px;
+    border-left: 1px solid #dcdfe6;
+  }
+</style>
diff --git a/src/views/systemSetting/installment/index.vue b/src/views/systemSetting/installment/index.vue
new file mode 100644
index 0000000..4250d04
--- /dev/null
+++ b/src/views/systemSetting/installment/index.vue
@@ -0,0 +1,193 @@
+<template>
+  <div class="divBox">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <el-button type="primary" class="mr10" @click="add" size="small" v-hasPermi="['admin:setting:save']"
+          >添加套餐</el-button>
+      </div>
+
+      <el-table v-loading="listLoading" :data="listData.list" style="width: 100%" size="mini">
+        <el-table-column prop="id" label="ID" min-width="50" />
+        <el-table-column prop="name" label="分期套餐名称" min-width="100" />
+        <el-table-column prop="tips" label="提示内容" min-width="100" />
+        <el-table-column label="操作" min-width="120" fixed="right" align="center">
+          <template slot-scope="scope">
+            <el-button
+              type="text"
+              size="small"
+              @click="addDetail(scope.row)"
+              class="mr10"
+              :disabled="scope.row.pid > 0"
+            >添加自定义账单</el-button>
+            <el-button
+              type="text"
+              size="small"
+              @click="edit(scope.row)"
+              class="mr10"
+              v-hasPermi="['admin:setting:update']"
+              >编辑</el-button>
+            <el-button
+              type="text"
+              size="small"
+              @click="handleDelete(scope.row.id, scope.$index)"
+              v-hasPermi="['admin:setting:delete']"
+              >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="block mb20">
+        <el-pagination
+          :current-page="listPram.page"
+          :page-sizes="constants.page.limit"
+          :layout="constants.page.layout"
+          :total="listData.total"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+        />
+      </div>
+    </el-card>
+    <creat-setting ref="grades" :user="userInfo"></creat-setting>
+    <creat-detail ref="grades1" :user="detailInfo"></creat-detail>
+  </div>
+</template>
+
+<script>
+import { ListInstallments,UpdateInstallments,DelInstallments} from '@/api/systemInstallment';
+import creatSetting from './creatSetting';
+import creatDetail from './creatDetail';
+import { checkPermi } from '@/utils/permission'; // 权限判断函数
+export default {
+  name: 'StoreSetting',
+  filters: {
+    typeFilter(status) {
+      const statusMap = {
+        wechat: '微信用户',
+        routine: '小程序你用户',
+        h5: 'H5用户',
+      };
+      return statusMap[status];
+    },
+  },
+  components: { creatSetting, creatDetail },
+  data() {
+    return {
+      listLoading: true,
+      userInfo: {},
+      detailInfo: {},
+      constants: this.$constants,
+      listPram: {
+        productId: null,
+        productName: null,
+        page: 1,
+        limit: this.$constants.page.limit[0],
+      },
+      listData: { list: [], total: 0 },
+      tableData: {
+        data: [],
+        total: 0,
+      },
+    };
+  },
+  mounted() {
+
+    this.getList();
+  },
+  methods: {
+    formatPercentage(value) {
+      if(value == "0.00" || value == "0.0" || value == "0" || value == 0 || value == null){
+        return "-";
+      }else {
+        return (value * 100).toFixed(2) + '%';
+      }
+    },
+    formatNumber(value){
+      if(value == 0){
+        return "-";
+      }else {
+        return value + "期";
+      }
+    },
+    checkPermi,
+    seachList() {
+      this.getList();
+    },
+    add() {
+      this.$refs.grades.dialogVisible = true;
+      this.userInfo = {};
+    },
+    addDetail(detailInfo) {
+      console.log("detailInfo-----------"+JSON.stringify(detailInfo))
+      this.$refs.grades1.detailVisible = true;
+      this.detailInfo = detailInfo;
+    },
+    edit(user) {
+      console.log(JSON.stringify(user))
+      this.userInfo = user;
+      this.$refs.grades.dialogVisible = true;
+    },
+    // 列表
+    getList() {
+      this.listLoading = true;
+      ListInstallments(this.listPram)
+        .then((res) => {
+          this.listData = res;
+          this.listLoading = false;
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    // 删除
+    handleDelete(id, idx) {
+      this.$modalSure('删除吗？删除会导致对应分期套餐配置数据清空，请谨慎操作！').then(() => {
+        DelInstallments(id).then(() => {
+          this.$message.success('删除成功');
+          this.getList();
+        });
+      });
+    },
+    handleSizeChange(val) {
+      this.listPram.limit = val;
+      this.handlerGetListData(this.listPram);
+    },
+    handleCurrentChange(val) {
+      this.listPram.page = val;
+      this.handlerGetListData(this.listPram);
+    },
+    onchangeIsShow(row) {
+      if (row.isShow == false) {
+        row.isShow = !row.isShow;
+        UpdateInstallments({ id: row.id, isShow: row.isShow })
+          .then(() => {
+            this.$message.success('修改成功');
+            this.getList();
+          })
+          .catch(() => {
+            row.isShow = !row.isShow;
+          });
+      } else {
+        this.$modalSure('该操作会导致对应用户等级隐藏，请谨慎操作').then(() => {
+          row.isShow = !row.isShow;
+          UpdateInstallments({ id: row.id, isShow: row.isShow })
+            .then(() => {
+              this.$message.success('修改成功');
+              this.getList();
+            })
+            .catch(() => {
+              row.isShow = !row.isShow;
+            });
+        });
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.el-switch.is-disabled {
+  opacity: 1;
+}
+::v-deep .el-switch__label {
+  cursor: pointer !important;
+}
+</style>