退款通知配置

src/views/system_config/PaySetting.vue

@@ -2,74 +2,197 @@
   <div class="manage-root personnel-create">
     <Header />
     <div class="manage-root-contain">
-        <nav-menu class="manage-root-contain-left" :activeMenuIndex="activeMenuIndex"></nav-menu>
-        <div class="manage-root-contain-right">
-            <breadcrumb :breadcrumbList="breadcrumbList" class="breadcrumb-box"></breadcrumb>
-            <div class="create-bottom">
-                <h3>支付配置</h3>
-                <el-form :model="registerForm" ref="registerForm" label-width="100px" class="registerForm" label-position="top">
-                    <h6>微信支付：</h6>
-                    <el-form-item label="开发者 ID" prop="app_id">
-                        <el-input v-model="registerForm.wx.app_id" autocomplete="off" placeholder="请输入址" @blur="handleTrim('registerForm','wx','app_id')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="商户 ID" prop="mch_id">
-                        <el-input v-model="registerForm.wx.mch_id" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','wx','mch_id')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="商户 API 安全密钥" prop="api_key">
-                        <el-input v-model="registerForm.wx.api_key" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','wx','api_key')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="终端 IP" prop="spbill_create_ip">
-                        <el-input v-model="registerForm.wx.spbill_create_ip" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','wx','spbill_create_ip')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="安全证书文件" prop="cert_file_List">
-                        <upload :datafileList="registerForm.wx.cert_file_List" :changeFillId="handleAvatarSuccess" :fileName="'courseResource'" :filleNumber="1" :showList="true" />
-                        <ul v-if="registerForm.wx.cert_file_List.length>0" class="resource-list">
-                            <li v-for="(itemR,indexR) in registerForm.wx.cert_file_List" :key="indexR">
-                                <a><span>{{itemR.name}}</span></a>
-                                <i class="el-icon-delete" @click="handleDelResource(indexR)"></i>
-                            </li>
-                        </ul>
-                    </el-form-item>
-                    <el-form-item label="支付通知地址" prop="notify_url">
-                        <el-input v-model="registerForm.wx.notify_url" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','wx','notify_url')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <h6>支付宝支付：</h6>
-                    <el-form-item label="请求地址" prop="url">
-                        <el-input v-model="registerForm.zfb.url" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','zfb','url')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="商户 appid" prop="app_id">
-                        <el-input v-model="registerForm.zfb.app_id" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','zfb','app_id')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="应用私钥" prop="rsa_private_key">
-                        <el-input v-model="registerForm.zfb.rsa_private_key" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','zfb','rsa_private_key')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="支付宝公钥" prop="alipay_public_key">
-                        <el-input v-model="registerForm.zfb.alipay_public_key" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','zfb','alipay_public_key')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="SELLERID" prop="seller_id">
-                        <el-input v-model="registerForm.zfb.seller_id" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','zfb','seller_id')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="支付通知地址" prop="notify_url">
-                        <el-input v-model="registerForm.zfb.notify_url" autocomplete="off" placeholder="请输入" @blur="handleTrim('registerForm','wx','notify_url')" maxlength="200">
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item>
-                        <el-button type="primary" @click="onSubmit('registerForm')" size="small" :loading="loading">保存</el-button>
-                        <el-button @click="onCancel('registerForm')" size="small">取消</el-button>
-                    </el-form-item>
-                </el-form>
-            </div>
+      <nav-menu
+        class="manage-root-contain-left"
+        :activeMenuIndex="activeMenuIndex"
+      ></nav-menu>
+      <div class="manage-root-contain-right">
+        <breadcrumb
+          :breadcrumbList="breadcrumbList"
+          class="breadcrumb-box"
+        ></breadcrumb>
+        <div class="create-bottom">
+          <h3>支付配置</h3>
+          <el-form
+            :model="registerForm"
+            ref="registerForm"
+            label-width="100px"
+            class="registerForm"
+            label-position="top"
+          >
+            <h6>微信支付：</h6>
+            <el-form-item label="开发者 ID" prop="app_id">
+              <el-input
+                v-model="registerForm.wx.app_id"
+                autocomplete="off"
+                placeholder="请输入址"
+                @blur="handleTrim('registerForm', 'wx', 'app_id')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="商户 ID" prop="mch_id">
+              <el-input
+                v-model="registerForm.wx.mch_id"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'wx', 'mch_id')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="商户 API 安全密钥" prop="api_key">
+              <el-input
+                v-model="registerForm.wx.api_key"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'wx', 'api_key')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="终端 IP" prop="spbill_create_ip">
+              <el-input
+                v-model="registerForm.wx.spbill_create_ip"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'wx', 'spbill_create_ip')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="安全证书文件" prop="cert_file_List">
+              <upload
+                :datafileList="registerForm.wx.cert_file_List"
+                :changeFillId="handleAvatarSuccess"
+                :fileName="'courseResource'"
+                :filleNumber="1"
+                :showList="true"
+              />
+              <ul
+                v-if="registerForm.wx.cert_file_List.length > 0"
+                class="resource-list"
+              >
+                <li
+                  v-for="(itemR, indexR) in registerForm.wx.cert_file_List"
+                  :key="indexR"
+                >
+                  <a
+                    ><span>{{ itemR.name }}</span></a
+                  >
+                  <i
+                    class="el-icon-delete"
+                    @click="handleDelResource(indexR)"
+                  ></i>
+                </li>
+              </ul>
+            </el-form-item>
+            <el-form-item label="支付通知地址" prop="notify_url">
+              <el-input
+                v-model="registerForm.wx.notify_url"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'wx', 'notify_url')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="退款通知地址" prop="notify_url_refund">
+              <el-input
+                v-model="registerForm.wx.notify_url_refund"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'wx', 'notify_url_refund')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <h6>支付宝支付：</h6>
+            <el-form-item label="请求地址" prop="url">
+              <el-input
+                v-model="registerForm.zfb.url"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'url')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="商户 appid" prop="app_id">
+              <el-input
+                v-model="registerForm.zfb.app_id"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'app_id')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="应用私钥" prop="rsa_private_key">
+              <el-input
+                v-model="registerForm.zfb.rsa_private_key"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'rsa_private_key')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="支付宝公钥" prop="alipay_public_key">
+              <el-input
+                v-model="registerForm.zfb.alipay_public_key"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'alipay_public_key')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="SELLERID" prop="seller_id">
+              <el-input
+                v-model="registerForm.zfb.seller_id"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'seller_id')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="支付通知地址" prop="notify_url">
+              <el-input
+                v-model="registerForm.zfb.notify_url"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'notify_url')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item label="退款通知地址" prop="notify_url_refund">
+              <el-input
+                v-model="registerForm.zfb.notify_url_refund"
+                autocomplete="off"
+                placeholder="请输入"
+                @blur="handleTrim('registerForm', 'zfb', 'notify_url_refund')"
+                maxlength="200"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-button
+                type="primary"
+                @click="onSubmit('registerForm')"
+                size="small"
+                :loading="loading"
+                >保存</el-button
+              >
+              <el-button @click="onCancel('registerForm')" size="small"
+                >取消</el-button
+              >
+            </el-form-item>
+          </el-form>
         </div>
+      </div>
     </div>
   </div>
 </template>
@@ -78,10 +201,10 @@
 //这里可以导入其它文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
 //例如：import 《组件名称》from ‘《组件路径》';
 import Header from "../../components/Header.vue";
-import NavMenu from "../../components/NavMenu.vue"
-import Breadcrumb from '../../components/Breadcrumb.vue';
+import NavMenu from "../../components/NavMenu.vue";
+import Breadcrumb from "../../components/Breadcrumb.vue";
 import { getLogin } from "@/api/ajax";
-import Upload from "../../components/Upload.vue"
+import Upload from "../../components/Upload.vue";
 
 export default {
   //import引入的组件需要注入到对象中才能使用
@@ -90,216 +213,215 @@ export default {
   data() {
     //这里存放数据
     return {
-        activeMenuIndex: "pay_setting",
-        breadcrumbList:[
-            {
-                icon:'setting',
-                url:'',
-                text:''
-            },
-            {
-                icon:'',
-                url:'',
-                notLink: true,
-                text:'系统配置'
-            },
-            {
-                icon:'',
-                url:'',
-                text:'支付配置'
-            }
-        ],
-        registerForm:{
-            wx:{
-                app_id: '',
-                mch_id: '',
-                api_key: '',
-                spbill_create_ip: '',
-                notify_url: '',
-                cert_file_id: '',
-                cert_file_List: [],
-            },
-            zfb:{
-                url: '',
-                app_id: '',
-                rsa_private_key: '',
-                alipay_public_key: '',
-                seller_id: '',
-                notify_url: ''
-            }
+      activeMenuIndex: "pay_setting",
+      breadcrumbList: [
+        {
+          icon: "setting",
+          url: "",
+          text: "",
         },
-        loading: false
-    }
+        {
+          icon: "",
+          url: "",
+          notLink: true,
+          text: "系统配置",
+        },
+        {
+          icon: "",
+          url: "",
+          text: "支付配置",
+        },
+      ],
+      registerForm: {
+        wx: {
+          app_id: "",
+          mch_id: "",
+          api_key: "",
+          spbill_create_ip: "",
+          notify_url: "",
+          cert_file_id: "",
+          cert_file_List: [],
+        },
+        zfb: {
+          url: "",
+          app_id: "",
+          rsa_private_key: "",
+          alipay_public_key: "",
+          seller_id: "",
+          notify_url: "",
+        },
+      },
+      loading: false,
+    };
   },
   //计算属性 类似于data概念
-  computed: {
-    
-  },
+  computed: {},
   //监控data中数据变化
-  watch: {
-    
-  },
+  watch: {},
   //方法集合
   methods: {
     // 去掉前后空格
-    handleTrim(form,filds,fild){
-        this[form][filds][fild] = this[form][filds][fild].trim()
+    handleTrim(form, filds, fild) {
+      this[form][filds][fild] = this[form][filds][fild].trim();
     },
-    handleAvatarSuccess(fileList,name) {
-        this.registerForm.wx.cert_file_List = fileList
-        this.registerForm.wx.cert_file_id = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
-        this.$forceUpdate()
+    handleAvatarSuccess(fileList, name) {
+      this.registerForm.wx.cert_file_List = fileList;
+      this.registerForm.wx.cert_file_id =
+        fileList[0] &&
+        fileList[0].response &&
+        fileList[0].response.file_info_list &&
+        fileList[0].response.file_info_list[0]
+          ? fileList[0].response.file_info_list[0].file_id
+          : "";
+      this.$forceUpdate();
     },
     // 删除资源文件
-    handleDelResource(i){
-        this.$confirm("确定删除吗?", "提示", {
-            confirmButtonText: "确定",
-            cancelButtonText: "取消",
-            type: "warning",
-        }).then(() => {
-            this.registerForm.wx.cert_file_List.splice(i, 1);
-            this.$forceUpdate()
-        });
+    handleDelResource(i) {
+      this.$confirm("确定删除吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        this.registerForm.wx.cert_file_List.splice(i, 1);
+        this.$forceUpdate();
+      });
     },
     // 提交表单
-    onSubmit(formName){
-        this.$refs[formName].validate((valid) => {
-          if (valid) {
-            this.loading = true
-            let MethodName = "/OrgServer/Manager/SysConfigManager/SetSysConfig_Pay";
-            let data = this.registerForm
-            getLogin(MethodName, data)
+    onSubmit(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.loading = true;
+          let MethodName =
+            "/OrgServer/Manager/SysConfigManager/SetSysConfig_Pay";
+          let data = this.registerForm;
+          getLogin(MethodName, data)
             .then((res) => {
-                this.loading = false
-                if(res.status===1){
-                    this.$message.success("保存成功")
-                }
-            }).catch((res) =>{
-                this.loading = false
+              this.loading = false;
+              if (res.status === 1) {
+                this.$message.success("保存成功");
+              }
             })
-          } else {
-            return false;
-          }
-        });
+            .catch((res) => {
+              this.loading = false;
+            });
+        } else {
+          return false;
+        }
+      });
     },
     // 取消 恢复到修改前状态
-    onCancel(formName){
-        this.$refs[formName].resetFields();
+    onCancel(formName) {
+      this.$refs[formName].resetFields();
     },
     // 得到配置信息
-    getInfo(){
-        let MethodName = "/OrgServer/Manager/SysConfigManager/GetSysConfig_Pay";
-        getLogin(MethodName, {})
+    getInfo() {
+      let MethodName = "/OrgServer/Manager/SysConfigManager/GetSysConfig_Pay";
+      getLogin(MethodName, {})
         .then((res) => {
-            if(res.status===1){
-                this.registerForm = res
-                if(res.wx.cert_file_id){
-                    this.registerForm.wx.cert_file_List = [
-                        {
-                            id: res.wx.cert_file_id,
-                            name: res.wx.cert_file_name
-                        }
-                    ]
-                }else{
-                    this.registerForm.wx.cert_file_List = []
-                }
+          if (res.status === 1) {
+            this.registerForm = res;
+            if (res.wx.cert_file_id) {
+              this.registerForm.wx.cert_file_List = [
+                {
+                  id: res.wx.cert_file_id,
+                  name: res.wx.cert_file_name,
+                },
+              ];
+            } else {
+              this.registerForm.wx.cert_file_List = [];
             }
-        }).catch((res) =>{
-            
+          }
         })
-    }
+        .catch((res) => {});
+    },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {
-    this.getInfo()
+    this.getInfo();
   },
   //生命周期 - 挂载完成（可以访问DOM元素）
-  mounted() {
-
-  },
+  mounted() {},
   //生命周期-创建之前
-  beforeCreated() { },
+  beforeCreated() {},
   //生命周期-挂载之前
-  beforeMount() { },
+  beforeMount() {},
   //生命周期-更新之前
-  beforUpdate() { },
+  beforUpdate() {},
   //生命周期-更新之后
-  updated() { },
+  updated() {},
   //生命周期-销毁之前
-  beforeDestory() { },
+  beforeDestory() {},
   //生命周期-销毁完成
-  destoryed() { },
+  destoryed() {},
   //如果页面有keep-alive缓存功能，这个函数会触发
-  activated() { }
-}
+  activated() {},
+};
 </script>
 <style lang="scss" scoped>
 /* @import url(); 引入css类 */
-.create-bottom{
-    padding: 40px 40px;
-    background: #FFFFFF;
-    border-radius: 4px;
-    height: calc(100vh - 140px);
-    overflow: auto;
-    h3{
-        font-size: 20px;
-        font-weight: 500;
-        line-height: 28px;
-        margin: 0 0 28px 0;
-        color: #1D2129;
-    }
-    h6{
-        color: #000;
-        font-size: 16px;
-        font-weight: 500;
-        line-height: 24px; /* 150% */
-        margin: 24px 0 16px 0;
-    }
+.create-bottom {
+  padding: 40px 40px;
+  background: #ffffff;
+  border-radius: 4px;
+  height: calc(100vh - 140px);
+  overflow: auto;
+  h3 {
+    font-size: 20px;
+    font-weight: 500;
+    line-height: 28px;
+    margin: 0 0 28px 0;
+    color: #1d2129;
+  }
+  h6 {
+    color: #000;
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 24px; /* 150% */
+    margin: 24px 0 16px 0;
+  }
 }
-.resource-list{
-    list-style: none;
-    margin: 12px 0 0 0;
-    padding: 0;
-    li{
-        display: flex;
-        align-items: center;
-        a{
-            width: 360px;
-            padding: 7px 12px;
-            background: #F7F8FA;
-            border-radius: 2px;
-            color: #1D2129;
-            display: flex;
-            align-items: center;
-            cursor: inherit;
-            span{
-                overflow:hidden;
-                text-overflow:ellipsis;
-                white-space: nowrap;
-                flex: 1;
-                display: block;
-                font-size: 14px;
-                line-height: 22px;
-            }
-            .svg-icon{
-                width: 16px;
-                height: 16px;
-                margin-right: 8px;
-                color: #4E5969;
-            }
-        }
-        .el-icon-delete{
-            color: #4E5969;
-            cursor: pointer;
-            margin-left: 12px;
-            &:hover{
-                color: #165DFF;
-            }
-        }
+.resource-list {
+  list-style: none;
+  margin: 12px 0 0 0;
+  padding: 0;
+  li {
+    display: flex;
+    align-items: center;
+    a {
+      width: 360px;
+      padding: 7px 12px;
+      background: #f7f8fa;
+      border-radius: 2px;
+      color: #1d2129;
+      display: flex;
+      align-items: center;
+      cursor: inherit;
+      span {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        flex: 1;
+        display: block;
+        font-size: 14px;
+        line-height: 22px;
+      }
+      .svg-icon {
+        width: 16px;
+        height: 16px;
+        margin-right: 8px;
+        color: #4e5969;
+      }
+    }
+    .el-icon-delete {
+      color: #4e5969;
+      cursor: pointer;
+      margin-left: 12px;
+      &:hover {
+        color: #165dff;
+      }
     }
+  }
 }
 </style>
 
-<style lang="scss">
-
-</style>
+<style lang="scss"></style>