浏览代码

初步对接完成

谢杰标 2 年之前
父节点
当前提交
49dcf4edc2

+ 1 - 0
package.json

@@ -66,6 +66,7 @@
     "vue-cropper": "0.5.5",
     "vue-draggable-resizable": "^2.3.0",
     "vue-meta": "^2.4.0",
+    "vue-qr": "^4.0.9",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.0"

+ 9 - 1
src/api/salesman/commission.js

@@ -1,4 +1,4 @@
-import request from '@/utils/request'
+import request from "@/utils/request";
 //登录短信
 export function getCashList() {
   return request({
@@ -6,3 +6,11 @@ export function getCashList() {
     method: "get",
   });
 }
+
+export function cancelApply(data) {
+  return request({
+    url: "/distribution/withdrawal/cancelApply",
+    method: "post",
+    data,
+  });
+}

+ 19 - 7
src/api/salesman/user.js

@@ -1,10 +1,10 @@
-import request from '@/utils/request'
+import request from "@/utils/request";
 //修改信息
 export function sellerEdit(data) {
   return request({
     url: "/distribution/seller/edit",
     method: "post",
-    data: data,
+    data,
   });
 }
 export function getInfoByShareCode(data) {
@@ -17,11 +17,11 @@ export function getInfoByShareCode(data) {
 }
 
 // 查询用户是否绑定公众号
-export function checkBindGzh(data) {
+export function checkBindGzh(query) {
   return request({
     url: "/distribution/seller/checkBindGzh",
     method: "get",
-    data,
+    params: query,
   });
 }
 
@@ -54,11 +54,11 @@ export function withdrawal(data) {
 }
 
 // 提现记录
-export function getWithdrawalList(data) {
+export function getWithdrawalList(query) {
   return request({
     url: "/distribution/withdrawal/list",
     method: "get",
-    data: data,
+    params: query,
   });
 }
 
@@ -69,4 +69,16 @@ export function getSellerInfo(data) {
     method: "get",
     data: data,
   });
-}
+}
+
+// 获取分享页面参数
+export function getSharePoster(query) {
+  return request({
+    url: "/app/common/distribution/sharePoster",
+    method: "get",
+    params: query,
+    headers: {
+      isToken: false,
+    },
+  });
+}

+ 0 - 6
src/components/tableList.vue

@@ -285,12 +285,6 @@
             "
             >结构树视图</span
           >
-          <div
-            v-else-if="item.scope === 'PvOrdown'"
-            style="color: blue; cursor: pointer"
-          >
-            <span>预览</span>
-          </div>
           <span v-else-if="item.scope === 'leftCh'">
             {{ item.ch }}{{ scope.row[item.prop] }}
           </span>

+ 1 - 1
src/utils/request.js

@@ -8,7 +8,7 @@ import methods from '@/utils/methodsTool';
 axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
 // 创建axios实例
 // export const baseURL = process.env.VUE_APP_BASE_API
-export const baseURL = 'http://192.168.1.7:5030/'
+export const baseURL = 'http://192.168.1.24:5030/'
 export const BASE_IMG_URL = process.env.VUE_APP_IMG_API
 const service = axios.create({
   // axios中请求配置有baseURL选项,表示请求URL公共部分

+ 36 - 5
src/views/Marketing/activitySystem/activityList/activityInfo/first.vue

@@ -27,16 +27,23 @@
           >
           </el-date-picker>
         </el-form-item>
-        </el-col
-      >
+      </el-col>
       <el-col :span="6" :offset="4" v-show="ruleForm.posterId">
         <div style="text-align: center">
           <el-image
+            v-if="!isSales"
             style="width: 187.5px; height: 333.5px"
             :src="ModelUrl(ruleForm.posterId)"
             :preview-src-list="[ModelUrl(ruleForm.posterId)]"
           >
           </el-image>
+          <!-- 业务员 -->
+          <preview-bill
+            v-else
+            :posterUrl="ModelUrl(ruleForm.posterId)"
+            :scale="0.5"
+            :modelData="modelData"
+          ></preview-bill>
           <h2>模板预览</h2>
         </div>
       </el-col>
@@ -45,6 +52,9 @@
 </template>
 
 <script>
+import previewBill from "@/views/salesman/act/previewBill.vue";
+import { getSharePoster } from "@/api/salesman/user";
+import { getLinkCode } from "@/api/salesman/act";
 export default {
   props: {
     ruleForm: {
@@ -88,10 +98,12 @@ export default {
           },
         ],
       },
+      modelData: {},
     };
   },
   created() {
     this.getModelList();
+    this.isSales && this.getSharePoster();
   },
   computed: {
     ModelUrl: function () {
@@ -99,9 +111,7 @@ export default {
         if (k) {
           for (let i = 0; i < this.modelList.length; i++) {
             if (this.modelList[i].posterId === k) {
-              return this.$methodsTools.splitImgHost(
-                this.modelList[i].url
-              );
+              return this.$methodsTools.splitImgHost(this.modelList[i].url);
             }
           }
         } else {
@@ -109,6 +119,9 @@ export default {
         }
       };
     },
+    isSales() {
+      return this.$route.query.isSales;
+    },
   },
   methods: {
     //获取模板列表
@@ -117,6 +130,24 @@ export default {
         this.modelList = res.rows;
       });
     },
+    getSharePoster() {
+      let distributionId = this.$route.query.id;
+      getLinkCode({ distributionId }).then((res) => {
+        getSharePoster({
+          distributionId,
+          shareCode: res.data.shareCode,
+          linkCode: res.data.linkCode,
+        }).then(({ data: { posterConfig, urlCard, urlActivity } }) => {
+          this.modelData = JSON.parse(posterConfig);
+          this.modelData.distribution.name = urlCard;
+          this.modelData.cardCode.name = urlActivity;
+          this.isShow = true;
+        });
+      });
+    },
+  },
+  components: {
+    previewBill,
   },
 };
 </script>

+ 38 - 4
src/views/salesman/act/index.vue

@@ -12,6 +12,7 @@
       :tableData="tableData"
       :navText="navText"
       :loading="loading"
+      @openDialog="openDialog"
     >
       <template slot="btn" slot-scope="props">
         <el-button type="text" @click="editClick(props.scope.row)"
@@ -26,6 +27,17 @@
       @handleSizeChange="handleSizeChange"
       @handleCurrentChange="handleCurrentChange"
     />
+    <BaseDialog
+      width="500px"
+      :isShow.sync="isShow"
+      title="海报"
+      :isShowFooter="false"
+    >
+      <preview-bill
+        :posterUrl="modelData.bgUrl"
+        :modelData="modelData"
+      ></preview-bill>
+    </BaseDialog>
   </div>
 </template>
 
@@ -33,10 +45,13 @@
 import searchBoxNew from "@/components/searchBoxNew";
 import tableList from "@/components/tableList";
 import pagination from "@/components/pagination";
+import previewBill from "./previewBill.vue";
 import { getActList } from "@/api/salesman/act";
+import { getSharePoster } from "@/api/salesman/user";
+import { getLinkCode } from "@/api/salesman/act";
 export default {
   name: "RegisteredUser",
-  components: { searchBoxNew, tableList, pagination },
+  components: { searchBoxNew, tableList, pagination, previewBill },
   data() {
     return {
       loading: false, //当前表单加载是否加载动画
@@ -122,9 +137,10 @@ export default {
         },
         {
           label: "海报",
-          prop: "idCard",
-          scope: "openBox",
+          name: "预览",
+          prop: "posterUrl",
           hidden: true,
+          scope: "openDialog",
         },
         {
           label: "备注",
@@ -136,6 +152,8 @@ export default {
       total: 0, //一共多少条
       pageSize: 10, //每页多少条数据
       currentPage: 1, //当前页码
+      modelData: {},
+      isShow: false,
     };
   },
   mounted() {
@@ -178,13 +196,29 @@ export default {
     },
     editClick(e, status) {
       this.$router.push({
-        name: "ActivityInfo",
+        name: "ActDetail",
         query: {
           id: e.distributionId,
           status: status ? "edit" : "info",
+          isSales: true,
         },
       });
     },
+    openDialog({ distributionId, posterUrl }) {
+      getLinkCode({ distributionId }).then((res) => {
+        getSharePoster({
+          distributionId,
+          shareCode: res.data.shareCode,
+          linkCode: res.data.linkCode,
+        }).then(({ data: { posterConfig, urlCard, urlActivity } }) => {
+          this.modelData = JSON.parse(posterConfig);
+          this.modelData.distribution.name = urlCard;
+          this.modelData.cardCode.name = urlActivity;
+          this.modelData.bgUrl = posterUrl;
+          this.isShow = true;
+        });
+      });
+    },
   },
 };
 </script>

+ 85 - 0
src/views/salesman/act/previewBill.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class="posterUrl_style" :style="backStyle()">
+    <img :src="$methodsTools.splitImgHost(posterUrl)" alt="" />
+    <div
+      class="code_style"
+      v-if="modelData.distribution && modelData.distribution.checked"
+      :style="backPosition(modelData.distribution)"
+    >
+      <vue-qr
+        :text="modelData.distribution.name"
+        :size="modelData.distribution.height * 2"
+      ></vue-qr>
+    </div>
+
+    <div
+      class="code_style"
+      v-if="modelData.cardCode && modelData.cardCode.checked"
+      :style="backPosition(modelData.cardCode)"
+    >
+      <vue-qr
+        :text="modelData.cardCode.name"
+        :size="modelData.cardCode.height * 2"
+      ></vue-qr>
+    </div>
+  </div>
+</template>
+
+<script>
+import vueQr from "vue-qr";
+export default {
+  props: {
+    posterUrl: {
+      type: String,
+    },
+    modelData: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+    scale: {
+      type: Number,
+      default: 1,
+    },
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    backPosition(data) {
+      return {
+        top: data.top * this.scale + "px",
+        left: data.left * this.scale + "px",
+        width: data.width * this.scale + "px",
+        height: data.height * this.scale + "px",
+      };
+    },
+    backStyle() {
+      return {
+        width: 375 * this.scale + "px",
+        height: 667 * this.scale + "px",
+      };
+    },
+  },
+  components: {
+    vueQr,
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+img {
+  width: 100%;
+  height: 100%;
+}
+.posterUrl_style {
+  margin: 0 auto;
+  width: 375px;
+  height: 667px;
+  position: relative;
+  & > .code_style {
+    position: absolute;
+  }
+}
+</style>

+ 60 - 26
src/views/salesman/commission/index.vue

@@ -7,6 +7,15 @@
       @search="search"
       @init="init"
     /> -->
+    <div class="withd-box">
+      <div>
+        总佣金:{{
+          (userInfo.cash + userInfo.usedCash + userInfo.freezeCash).toFixed(2)
+        }}元
+      </div>
+      <div>可提现:{{ userInfo.cash }}元</div>
+      <div>已提现:{{ userInfo.usedCash }}元</div>
+    </div>
     <table-list
       :tableSets="tableSet"
       :tableData="tableData"
@@ -14,10 +23,10 @@
       :loading="loading"
     >
       <template slot="customize">
-        <el-button size="medium" @click="handelBatch(1)" type="primary"
+        <el-button size="medium" @click="dialogVisible = true" type="primary"
           >申请提现</el-button
         >
-        <el-button size="medium" @click="handelBatch(0)" type="primary"
+        <el-button size="medium" @click="toRecord" type="primary"
           >提现记录</el-button
         >
       </template>
@@ -32,7 +41,11 @@
       @handleSizeChange="handleSizeChange"
       @handleCurrentChange="handleCurrentChange"
     />
-    <withd-dialog :dialogVisible.sync="dialogVisible"></withd-dialog>
+    <withd-dialog
+      :dialogVisible.sync="dialogVisible"
+      @getSellerInfo="getSellerInfo"
+      :cash="userInfo.cash || 0"
+    ></withd-dialog>
   </div>
 </template>
 
@@ -41,6 +54,8 @@ import searchBoxNew from "@/components/searchBoxNew";
 import tableList from "@/components/tableList";
 import pagination from "@/components/pagination";
 import withdDialog from "./withdDialog.vue";
+import { getCashList } from "@/api/salesman/commission";
+import { getSellerInfo } from "@/api/salesman/user";
 export default {
   name: "RegisteredUser",
   components: { searchBoxNew, tableList, pagination, withdDialog },
@@ -74,55 +89,54 @@ export default {
       // 表单
       tableSet: [
         {
-          label: "活动名称",
+          label: "佣金ID",
           prop: "studentCode",
           hidden: true,
         },
         {
-          label: "活动类型",
-          prop: "nickname",
+          label: "所属订单",
+          prop: "relatedSn",
           hidden: true,
         },
         {
-          label: "模板",
+          label: "所属活动",
           prop: "sex",
           hidden: true,
           scope: "sex",
         },
         {
-          label: "活动开始时间",
-          prop: "payWay",
+          label: "下单人",
+          prop: "nickname",
           hidden: true,
         },
         {
-          label: "活动结束时间",
-          prop: "realname",
+          label: "订单时间",
+          prop: "payWay",
           hidden: true,
         },
         {
-          label: "创建人",
-          prop: "idCard",
+          label: "订单金额",
+          prop: "payWay",
           hidden: true,
         },
         {
-          label: "创建时间",
-          prop: "telphone",
+          label: "佣金分成方式",
+          prop: "profitType",
           hidden: true,
         },
         {
-          label: "状态",
-          prop: "orderNum",
+          label: "佣金等级",
+          prop: "payWay",
           hidden: true,
         },
         {
-          label: "海报",
-          prop: "idCard",
-          scope: "PvOrdown",
+          label: "佣金金额",
+          prop: "payWay",
           hidden: true,
         },
         {
-          label: "备注",
-          prop: "idCard",
+          label: "佣金结算时间",
+          prop: "freezingPeriod",
           hidden: true,
         },
       ],
@@ -130,11 +144,13 @@ export default {
       total: 0, //一共多少条
       pageSize: 10, //每页多少条数据
       currentPage: 1, //当前页码
-      dialogVisible: true,
+      dialogVisible: false,
+      userInfo: {},
     };
   },
   mounted() {
     this.search();
+    this.getSellerInfo();
   },
   methods: {
     search(int) {
@@ -144,13 +160,11 @@ export default {
       }
       if (int === 2) {
         this.formData = {
-          status: "0,1",
           pageSize: 10,
           pageNum: 1,
         };
       }
-      this.$api
-        .inquireappuserlists(this.formData)
+      getCashList(this.formData)
         .then((res) => {
           this.tableData = res.rows;
           this.total = res.total;
@@ -172,6 +186,16 @@ export default {
       this.formData.pageNum = v;
       this.search();
     },
+    toRecord() {
+      this.$router.push({
+        path: "record",
+      });
+    },
+    getSellerInfo() {
+      getSellerInfo().then((res) => {
+        this.userInfo = res.data;
+      });
+    },
   },
 };
 </script>
@@ -266,4 +290,14 @@ export default {
     margin: 5px 0px;
   }
 }
+.withd-box{
+  display: flex;
+  position: absolute;
+  top: 122px;
+  left: 200px;
+  z-index: 10;
+  div{
+    margin-right: 20px;
+  }
+}
 </style>

+ 92 - 16
src/views/salesman/commission/withdDialog.vue

@@ -7,10 +7,27 @@
     @close="close"
   >
     <el-form :inline="true" :model="form" :rules="rules" ref="form">
-      <el-form-item label="提现金额:">
-        <el-input v-model="form.money" placeholder="请输入提现金额"> </el-input>
+      <el-form-item label="提现金额:" prop="cash">
+        <el-input
+          @input="formatNum(form.cash, 'cash')"
+          v-model.Number="form.cash"
+          placeholder="请输入提现金额"
+        >
+        </el-input>
       </el-form-item>
     </el-form>
+    <div class="step-box">
+      <el-steps :active="active" align-center>
+        <el-step title="微信账号授权"></el-step>
+        <el-step title="提现申请"></el-step>
+        <el-step title="提现审核"></el-step>
+        <el-step title="提现申请成功"></el-step>
+      </el-steps>
+      <div class="step-code-box" v-if="active == 1">
+        <vue-qr text="modelData.cardCode.name" :size="200"></vue-qr>
+      </div>
+    </div>
+
     <div class="withd-tips">
       提现注意事项:
       <p>1.当佣金被结算时有一定的冻结期,被解冻的佣金方可提现</p>
@@ -21,6 +38,8 @@
 </template>
 
 <script>
+import vueQr from "vue-qr";
+import { checkBindGzh, withdrawal } from "@/api/salesman/user";
 export default {
   props: {
     dialogVisible: {
@@ -31,6 +50,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    cash: {
+      type: Number,
+      default: 0,
+    },
   },
   data() {
     return {
@@ -50,22 +73,45 @@ export default {
         },
       ],
       form: {
-        money: 0,
+        cash: 0,
       },
       rules: {
-        name: [
-          { required: true, message: "请输入活动名称", trigger: "blur" },
-          { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
-        ],
+        cash: [{ required: true, message: "请输入提现金额", trigger: "blur" }],
       },
+      reverse: true,
+      activities: [
+        {
+          content: "活动按期开始",
+        },
+        {
+          content: "通过审核",
+        },
+        {
+          content: "创建成功",
+        },
+      ],
+      active: 2,
     };
   },
   methods: {
     submitForm() {
-      this.$refs.form.validate((valid) => {
+      this.$refs.form.validate(async (valid) => {
         if (valid) {
+          if (this.active == 1) {
+            await this.checkBindGzh();
+            if (this.active == 1) {
+              this.$message.warning("请先微信授权");
+              return;
+            }
+          }
+          withdrawal(this.form).then((res) => {
+            if (res.code == 200) {
+              this.$message.success("提现申请成功");
+              this.isShow = false;
+              this.$emit("getSellerInfo");
+            }
+          });
         } else {
-          console.log("error submit!!");
           return false;
         }
       });
@@ -75,6 +121,27 @@ export default {
     },
     close() {
       this.isShow = false;
+      this.$refs.form.clearValidate();
+    },
+    checkBindGzh() {
+      return checkBindGzh().then((res) => {
+        this.active = res.data ? 2 : 1;
+        return Promise.resolve();
+      });
+    },
+    formatNum(val, key) {
+      if (val > this.cash) {
+        this.form[key] = this.cash;
+        return;
+      }
+      let temp = val.toString();
+      temp = temp.replace(/。/g, ".");
+      temp = temp.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
+      temp = temp.replace(/^\./g, ""); //验证第一个字符是数字
+      temp = temp.replace(/\.{2,}/g, ""); //只保留第一个, 清除多余的
+      temp = temp.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
+      temp = temp.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3"); //只能输入两个小数
+      this.form[key] = temp;
     },
   },
   computed: {
@@ -87,14 +154,16 @@ export default {
       },
     },
   },
+  created() {
+    this.checkBindGzh();
+  },
+  components: {
+    vueQr,
+  },
   watch: {
     dialogVisible(val) {
-      if (val === false) {
-        this.uploadText("");
-      } else {
-        this.$nextTick(() => {
-          this.$refs.formData.clearValidate();
-        });
+      if (val) {
+        this.form.cash = this.cash || 0;
       }
     },
   },
@@ -107,8 +176,15 @@ export default {
   align-items: center;
 }
 .withd-tips {
-  margin-top: 20px;
+  margin-top: 30px;
   line-height: 10px;
   color: #999;
 }
+.step-box {
+  margin-top: 20px;
+  .step-code-box {
+    width: 200px;
+    margin: 20px auto 0;
+  }
+}
 </style>

+ 75 - 56
src/views/salesman/person/index.vue

@@ -1,51 +1,50 @@
 <template>
   <div class="sales-box">
-    <el-form
-      label-position="right"
-      label-width="120px"
-      :model="listData"
-      ref="listData"
-    >
-      <el-form-item
-        v-for="(items, indexs) in listitem"
-        :key="indexs"
-        :label="items.label"
-        :prop="items.prop"
-      >
-        <div v-if="items.scope === 'header_img'" class="header_img">
-          <el-image
-            class="imageStyBoxShow"
-            :src="
-              listData[items.prop]
-                ? $methodsTools.splitImgHost(listData[items.prop])
-                : defaultHead
-            "
-            :preview-src-list="[
-              $methodsTools.splitImgHost(listData[items.prop]),
-            ]"
+    <el-card>
+      <div slot="header" class="clearfix">
+        <span>基本资料</span>
+        <el-form
+          label-position="right"
+          label-width="120px"
+          :model="listData"
+          ref="listData"
+        >
+          <el-form-item
+            v-for="(items, indexs) in listitem"
+            :key="indexs"
+            :label="items.label"
+            :prop="items.prop"
           >
-          </el-image>
-          <label for="imgs"
-            ><i class="btns">{{
-              listData[items.prop] ? "更换头像" : "上传头像"
-            }}</i></label
-          >
-          <input
-            id="imgs"
-            type="file"
-            style="display: none"
-            @change="uploadImg"
-          />
-        </div>
-        <!-- <el-input v-else v-model="listData[items.prop]"></el-input> -->
-        <div v-else>{{ listData[items.prop] }}</div>
-      </el-form-item>
-    </el-form>
+            <div v-if="items.scope === 'header_img'" class="header_img">
+              <el-image
+                class="imageStyBoxShow"
+                :src="
+                  items.value
+                    ? $methodsTools.splitImgHost(items.value)
+                    : defaultHead
+                "
+                :preview-src-list="[$methodsTools.splitImgHost(items.value)]"
+              >
+              </el-image>
+              <label for="imgs"><i class="btns"> 更换头像 </i></label>
+              <input
+                id="imgs"
+                type="file"
+                style="display: none"
+                @change="uploadImg"
+              />
+            </div>
+            <!-- <el-input v-else v-model="listData[items.prop]"></el-input> -->
+            <div v-else>{{ items.value }}</div>
+          </el-form-item>
+        </el-form>
+      </div>
+    </el-card>
   </div>
 </template>
 
 <script>
-import { getSellerInfo } from "@/api/salesman/user";
+import { getSellerInfo, sellerEdit } from "@/api/salesman/user";
 export default {
   data() {
     return {
@@ -55,30 +54,37 @@ export default {
           label: " ",
           prop: "avatar",
           scope: "header_img",
+          value: "",
         },
         {
-          label: "姓名",
+          label: "姓名",
           prop: "realname",
+          value: "",
         },
         {
-          label: "手机号码",
-          prop: "telphone",
+          label: "手机号码:",
+          prop: "phonenumber",
+          value: "",
         },
         {
-          label: "身份证号",
+          label: "身份证号",
           prop: "idCard",
+          value: "",
         },
         {
-          label: "总佣金",
-          prop: "realname",
+          label: "总佣金:",
+          prop: "allCash",
+          value: "",
         },
         {
-          label: "已提现",
-          prop: "telphone",
+          label: "已提现:",
+          prop: "cash",
+          value: "",
         },
         {
-          label: "可提现",
-          prop: "idCard",
+          label: "可提现:",
+          prop: "usedCash",
+          value: "",
         },
       ],
       //   弹窗数据
@@ -112,8 +118,13 @@ export default {
       this.$upload
         .upload(file, 0)
         .then((res) => {
-          this.$set(this.listData, "avatar", res);
-          this.$refs["listData"].validateField("avatar");
+          sellerEdit({
+            avatar: res,
+          }).then((r) => {
+            this.$message.success("更新头像成功");
+            this.getSellerInfo();
+            this.$store.dispatch("GetInfo");
+          });
         })
         .finally(() => {
           e.target.value = "";
@@ -121,7 +132,16 @@ export default {
     },
     getSellerInfo() {
       getSellerInfo().then((res) => {
-        console.log(res);
+        this.listitem.forEach((ele) => {
+          ele.value = res.data[ele.prop];
+          if (ele.prop == "allCash") {
+            ele.value = (
+              res.data.cash +
+              res.data.usedCash +
+              res.data.freezeCash
+            ).toFixed(2);
+          }
+        });
       });
     },
   },
@@ -137,14 +157,13 @@ export default {
   padding: 40px;
   /deep/ {
     .el-form-item {
-      margin-bottom: 30px;
+      margin-bottom: 20px;
     }
   }
 }
 .header_img {
   display: flex;
   align-items: center;
-  margin-left: 40px;
   & > .imageStyBoxShow {
     border-radius: 50%;
     overflow: hidden;

+ 294 - 17
src/views/salesman/withdrawal/record.vue

@@ -1,29 +1,306 @@
 <template>
-    <div>
-        111
-    </div>
+  <div id="registeredUser">
+    <search-box-new
+      ref="searchBox"
+      :formData="formData"
+      :formList="formList"
+      @search="search"
+      @init="init"
+    />
+    <table-list
+      :tableSets="tableSet"
+      :tableData="tableData"
+      :navText="navText"
+      :loading="loading"
+    >
+      <template slot="btn" slot-scope="props">
+        <el-button
+          type="text"
+          v-if="props.scope.row.cwStatus == 0"
+          @click="withdraw(props.scope.row)"
+          >取消申请</el-button
+        >
+      </template>
+    </table-list>
+    <pagination
+      :total="total"
+      :pageSize="formData.pageSize"
+      :currentPage="formData.pageNum"
+      @handleSizeChange="handleSizeChange"
+      @handleCurrentChange="handleCurrentChange"
+    />
+  </div>
 </template>
 
 <script>
-export default {
-    name: 'SaasEntrepotAdminRecord',
+import searchBoxNew from "@/components/searchBoxNew";
+import tableList from "@/components/tableList";
+import pagination from "@/components/pagination";
+import { getWithdrawalList } from "@/api/salesman/user";
+import { cancelApply } from "@/api/salesman/commission";
 
-    data() {
-        return {
-            
+export default {
+  name: "RegisteredUser",
+  components: { searchBoxNew, tableList, pagination },
+  data() {
+    return {
+      loading: false, //当前表单加载是否加载动画
+      navText: {
+        title: "活动列表",
+        index: 0,
+        ch: "条",
+        num: false,
+        choice: false,
+        addHide: true,
+        backFatherBtn: {
+          status: false,
+          title: "未定义",
+        },
+      },
+      //搜索
+      formList: [
+        {
+          prop: "cwSn",
+          placeholder: "提现单号",
+        },
+        {
+          prop1: "applyStartTime",
+          prop2: "applyEndTime",
+          placeholder1: "开始时间",
+          placeholder2: "结束时间",
+          scope: "moreDataPicker",
+        },
+      ],
+      formData: {},
+      // 表单
+      tableSet: [
+        {
+          label: "提现单号",
+          prop: "cwSn",
+          hidden: true,
+        },
+        {
+          label: "申请时间",
+          prop: "applyTime",
+          hidden: true,
+          scope: "aTimeList",
+        },
+        // {
+        //   label: "提现方式",
+        //   prop: "sex",
+        //   hidden: true,
+        //   scope: "sex",
+        // },
+        // {
+        //   label: "账号",
+        //   prop: "nickname",
+        //   hidden: true,
+        // },
+        {
+          label: "金额(元)",
+          prop: "cash",
+          hidden: true,
+        },
+        {
+          label: "提现状态",
+          prop: "cwStatus",
+          hidden: true,
+          scope: "isOptions",
+          options: [
+            {
+              label: "已取消",
+              value: -2,
+            },
+            {
+              label: "已拒绝",
+              value: -1,
+            },
+            {
+              label: "未审核",
+              value: 0,
+            },
+            {
+              label: "初审通过",
+              value: 1,
+            },
+            {
+              label: "二审通过",
+              value: 2,
+            },
+            {
+              label: "三审通过",
+              value: 3,
+            },
+            {
+              label: "已打款",
+              value: 4,
+            },
+          ],
+        },
+        {
+          label: "备注",
+          prop: "remark",
+          hidden: true,
+        },
+      ],
+      tableData: [], //表单数据
+      total: 0, //一共多少条
+      pageSize: 10, //每页多少条数据
+      currentPage: 1, //当前页码
+      dialogVisible: false,
+    };
+  },
+  mounted() {
+    this.search(2);
+  },
+  methods: {
+    search(int) {
+      this.loading = true;
+      if (int === 1) {
+        this.formData.pageNum = 1;
+      }
+      if (int === 2) {
+        this.formData = {
+          pageSize: 10,
+          pageNum: 1,
+          cwSn: "",
+          applyEndTime: "",
+          applyStartTime: "",
         };
+      }
+      var data = JSON.parse(JSON.stringify(this.formData));
+      if (this.formData.applyEndTime) {
+        data.applyEndTime = data.applyEndTime / 1000;
+      }
+      if (this.formData.applyStartTime) {
+        data.applyStartTime = data.applyStartTime / 1000;
+      }
+      getWithdrawalList(data)
+        .then((res) => {
+          this.tableData = res.rows;
+          this.total = res.total;
+          this.navText.index = res.total;
+        })
+        .finally(() => {
+          this.loading = false;
+        });
     },
-
-    mounted() {
-        
+    init() {
+      this.search(2);
     },
-
-    methods: {
-        
+    handleSizeChange(v) {
+      this.formData.pageSize = v;
+      this.formData.pageNum = 1;
+      this.search();
     },
+    handleCurrentChange(v) {
+      this.formData.pageNum = v;
+      this.search();
+    },
+    withdraw(row) {
+      this.$confirm("将取消申请提现, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        cancelApply({ id: row.id, cwSn: row.cwSn }).then((res) => {
+          this.search();
+          this.$message.success("取消成功");
+        });
+      });
+    },
+  },
 };
 </script>
 
-<style lang="scss" scoped>
-
-</style>
+<style lang="less" scoped>
+/deep/.el-button {
+  border-radius: 8px;
+}
+/deep/.el-dialog {
+  border-radius: 8px;
+  .el-dialog__header {
+    padding: 0;
+    .hearders {
+      height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0px 18px 0px 20px;
+      border-bottom: 1px solid #e2e2e2;
+      .leftTitle {
+        font-size: 14px;
+        font-weight: bold;
+        color: #2f4378;
+      }
+      .rightBoxs {
+        display: flex;
+        align-items: center;
+        img {
+          width: 14px;
+          height: 14px;
+          margin-left: 13px;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+  .el-dialog__footer {
+    padding: 0;
+    .dialog-footer {
+      padding: 0px 40px;
+      height: 70px;
+      border-top: 1px solid #e2e2e2;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+    }
+  }
+}
+.imgBox {
+  width: 100%;
+  // height: 210px;
+  border: 1px solid #e2e2e2;
+  border-radius: 8px;
+  padding: 8px 8px 3px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  .imgLabel {
+    flex: 1;
+    width: 100%;
+    border: 1px dotted #e2e2e2;
+    color: #999;
+    font-size: 14px;
+    cursor: pointer;
+    border-radius: 8px;
+    .msPhoto {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      max-width: 100%;
+      max-height: 270px;
+      img {
+        max-width: 100%;
+        max-height: 270px;
+      }
+    }
+    .imgbbx {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      width: 100%;
+      height: 100%;
+      i {
+        font-weight: bold;
+        margin: 14px 0;
+        font-size: 24px;
+      }
+    }
+  }
+  p {
+    margin: 5px 0px;
+  }
+}
+</style>