|
@@ -0,0 +1,357 @@
|
|
|
+<template>
|
|
|
+ <div class="m-container">
|
|
|
+ <div class="m-core">
|
|
|
+ <div @click="chargeOperation('create')" v-permission="'paymentConfig/add'" class="newBand">添加</div>
|
|
|
+ <!-- 列表 -->
|
|
|
+ <div class="tableWrap">
|
|
|
+ <el-table :data="tableList" :header-cell-style="{background:'#EDEEF0',color:'#444'}">
|
|
|
+ <el-table-column align="center" prop="organName" label="分部"></el-table-column>
|
|
|
+ <el-table-column align="center" label="收费方式">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="scope.row.typeRouteScale && scope.row.typeRouteScale.length > 0">
|
|
|
+ <p v-for="(item, index) in scope.row.typeRouteScale" :key="index">
|
|
|
+ {{ getOrganToStr(item.organId) }}--{{ getTypes(item.feeType) }}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column align="center" width="250px" label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ @click="chargeOperation('update', scope.row)"
|
|
|
+ v-permission="'paymentConfig/update'"
|
|
|
+ type="text"
|
|
|
+ >修改</el-button>
|
|
|
+ <el-button
|
|
|
+ @click="chargeDel(scope.row)"
|
|
|
+ v-permission="'paymentConfig/del'"
|
|
|
+ type="text"
|
|
|
+ >删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination
|
|
|
+ :total="pageInfo.total"
|
|
|
+ :page.sync="pageInfo.page"
|
|
|
+ :limit.sync="pageInfo.limit"
|
|
|
+ :page-sizes="pageInfo.page_size"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ :title="formTitle[formActionTitle]"
|
|
|
+ :visible.sync="chargeStatus"
|
|
|
+ @close="onFormClose('ruleForm')"
|
|
|
+ width="700px"
|
|
|
+ >
|
|
|
+ <el-form :model="form" :rules="rules" ref="ruleForm">
|
|
|
+ <el-form-item label="所属分部" prop="id" :label-width="formLabelWidth">
|
|
|
+ <el-select @change="onChange" v-model.trim="form.id" :disabled="formActionTitle === 'update'" placeholder="请选择所属分部">
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in calcBranchList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-row :gutter="10" v-for="(domain, index) in form.typeRouteScale" :key="index">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item :label-width="formLabelWidth" label="收费方式" :prop="'typeRouteScale.' + index + '.feeType'" :rules="[
|
|
|
+ { required: true, message: '请选择收费方式', trigger: 'change' },
|
|
|
+ ]">
|
|
|
+ <el-select
|
|
|
+ v-model.trim="domain.feeType"
|
|
|
+ placeholder="请选择收费方式"
|
|
|
+ style="width: 100% !important;"
|
|
|
+ disabled
|
|
|
+ >
|
|
|
+ <el-option value="SERVICE" label="服务收入"></el-option>
|
|
|
+ <el-option value="SELL" label="销售收入"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item :prop="'typeRouteScale.' + index + '.organId'" :rules="[
|
|
|
+ { required: true, message: '请选择分润分部', trigger: 'change' },
|
|
|
+ ]">
|
|
|
+ <el-select
|
|
|
+ v-model.trim="domain.organId"
|
|
|
+ placeholder="请选择分润分部"
|
|
|
+ clearable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in branchList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ :disabled="item.disabled"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="chargeStatus = false">取 消</el-button>
|
|
|
+ <el-button @click="onChargeSubmit('ruleForm')" type="primary">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import pagination from "@/components/Pagination/index";
|
|
|
+import {
|
|
|
+ paymentConfigQueryPage
|
|
|
+} from "@/api/systemManage";
|
|
|
+import { getPaymentConfigs, addTypeRoute, updateTypeRoute, delTypeRoute } from "./api";
|
|
|
+import { branchQueryPage } from "@/api/specialSetting";
|
|
|
+import cleanDeep from 'clean-deep'
|
|
|
+export default {
|
|
|
+ name: "chargeProfitManager",
|
|
|
+ components: { pagination },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableList: [],
|
|
|
+ pageInfo: {
|
|
|
+ // 分页规则
|
|
|
+ limit: 10, // 限制显示条数
|
|
|
+ page: 1, // 当前页
|
|
|
+ total: 0, // 总条数
|
|
|
+ page_size: [10, 20, 40, 50] // 选择限制显示条数
|
|
|
+ },
|
|
|
+ chargeStatus: false,
|
|
|
+ branchList: [], // 分部列表
|
|
|
+ calcBranchList: [], // 可选比例分部
|
|
|
+ formActionTitle: "create",
|
|
|
+ formLabelWidth: "100px",
|
|
|
+ formTitle: {
|
|
|
+ create: "添加分润",
|
|
|
+ update: "修改分润"
|
|
|
+ },
|
|
|
+ form: {
|
|
|
+ id: null,
|
|
|
+ typeRouteScale: [{
|
|
|
+ feeType: 'SERVICE',
|
|
|
+ organId: null
|
|
|
+ }, {
|
|
|
+ feeType: 'SELL',
|
|
|
+ organId: null
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ id: [
|
|
|
+ { required: true, message: "请选择所属分部", trigger: "change" }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getList();
|
|
|
+ this.getRoleList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onChargeSubmit(formName) {
|
|
|
+ this.$refs[formName].validate(valid => {
|
|
|
+ let params = JSON.parse(JSON.stringify(this.form));
|
|
|
+ if (valid) {
|
|
|
+ params.typeRouteScale = JSON.stringify(params.typeRouteScale)
|
|
|
+ if (this.formActionTitle == "create") {
|
|
|
+ addTypeRoute(params).then(res => {
|
|
|
+ this.messageTips("添加", res);
|
|
|
+ });
|
|
|
+ } else if (this.formActionTitle == "update") {
|
|
|
+ updateTypeRoute(params).then(res => {
|
|
|
+ this.messageTips("修改", res);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getOrganToStr(id) {
|
|
|
+ let name = null
|
|
|
+ this.calcBranchList.forEach(item => {
|
|
|
+ if(item.value == id) {
|
|
|
+ name = item.label
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return name
|
|
|
+ },
|
|
|
+ getTypes(type) {
|
|
|
+ let template = {
|
|
|
+ 'SERVICE': '服务收入',
|
|
|
+ 'SELL': '销售收入'
|
|
|
+ }
|
|
|
+ return template[type]
|
|
|
+ },
|
|
|
+ messageTips(title, res) {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success(title + "成功");
|
|
|
+ this.chargeStatus = false;
|
|
|
+ this.getList();
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.msg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onChange() {
|
|
|
+ let form = this.form
|
|
|
+ let tempInfo = {}
|
|
|
+ this.calcBranchList.forEach(item => {
|
|
|
+ if(item.value == form.id) {
|
|
|
+ tempInfo = item
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if(!tempInfo.value) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.getRoleList(tempInfo.payType)
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ let params = {
|
|
|
+ hasTypeRoute: 1
|
|
|
+ };
|
|
|
+ params.rows = this.pageInfo.limit;
|
|
|
+ params.page = this.pageInfo.page;
|
|
|
+ paymentConfigQueryPage(params).then(res => {
|
|
|
+ if (res.code == 200 && res.data) {
|
|
|
+ res.data.rows.forEach(item => {
|
|
|
+ if(item.typeRouteScale) {
|
|
|
+ item.typeRouteScale = JSON.parse(item.typeRouteScale)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.tableList = res.data.rows;
|
|
|
+ this.pageInfo.total = res.data.total;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async getRoleList(val) {
|
|
|
+ await getPaymentConfigs(cleanDeep({ payType: val })).then(res => {
|
|
|
+ if (res.code == 200 && res.data) {
|
|
|
+ if(val) {
|
|
|
+ this.branchList = []
|
|
|
+ } else {
|
|
|
+ this.calcBranchList = []
|
|
|
+ }
|
|
|
+ res.data.forEach(item => {
|
|
|
+ if(val) {
|
|
|
+ this.branchList.push({
|
|
|
+ label: item.organName,
|
|
|
+ value: item.id,
|
|
|
+ payType: item.payType
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.calcBranchList.push({
|
|
|
+ label: item.organName,
|
|
|
+ value: item.id,
|
|
|
+ payType: item.payType
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ chargeOperation(type, data) {
|
|
|
+ this.formActionTitle = type;
|
|
|
+ this.chargeStatus = true;
|
|
|
+ // 修改的时候
|
|
|
+ if (type == "update") {
|
|
|
+ this.getRoleList(data.payType)
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.form = {
|
|
|
+ id: data.id,
|
|
|
+ typeRouteScale: data.typeRouteScale ? data.typeRouteScale : []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ chargeDel(row) {
|
|
|
+ // 删除数据
|
|
|
+ // paymentConfigDel
|
|
|
+ this.$confirm("你确定删除?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ delTypeRoute({ id: row.id }).then(res => {
|
|
|
+ this.messageTips("删除", res);
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch();
|
|
|
+ },
|
|
|
+ onFormClose(formName) {
|
|
|
+ this.branchList = []
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+/deep/.el-button--primary {
|
|
|
+ background: #14928a;
|
|
|
+ border-color: #14928a;
|
|
|
+ color: #fff;
|
|
|
+ &:hover,
|
|
|
+ &:active,
|
|
|
+ &:focus {
|
|
|
+ background: #14928a;
|
|
|
+ border-color: #14928a;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/deep/.el-select,
|
|
|
+/deep/.el-date-editor.el-input {
|
|
|
+ width: 100% !important;
|
|
|
+}
|
|
|
+
|
|
|
+.moreRule {
|
|
|
+ background: #f0f0f0;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .el-form-item__error {
|
|
|
+ color: #f56c6c;
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 1;
|
|
|
+ position: absolute;
|
|
|
+ left: 100px;
|
|
|
+ top: 100%;
|
|
|
+ margin-top: -21px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.moreRuleIn {
|
|
|
+ .el-form-item {
|
|
|
+ display: inline-block;
|
|
|
+ &:first-child {
|
|
|
+ /deep/.el-form-item__content {
|
|
|
+ margin-left: 100px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.el-form-item__content {
|
|
|
+ margin-left: 0 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .setWidth {
|
|
|
+ /deep/.el-form-item__content {
|
|
|
+ width: 250px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.el-input-group__append {
|
|
|
+ padding: 0 8px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.min,
|
|
|
+.max {
|
|
|
+ display: inline-block;
|
|
|
+ width: 250px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+</style>
|