|
|
@@ -0,0 +1,386 @@
|
|
|
+<template>
|
|
|
+ <div class="app-list-content">
|
|
|
+ <x-crud class="liu-crud-wrap" @load="onLoad">
|
|
|
+ <template #slot-tabs>
|
|
|
+ <el-tabs class="liu-tabs" type="border-card" v-model="tabIndex" @tab-click="handleClick">
|
|
|
+ <el-tab-pane
|
|
|
+ v-for="(item, index) in tabsData"
|
|
|
+ :key="index"
|
|
|
+ :label="`${item.text}`"
|
|
|
+ :name="item.key"
|
|
|
+ ></el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-avatar="{scope}">
|
|
|
+ <cl-avatar :size="22" :src="scope.row.avatar" :style="{ margin: 'auto' }"></cl-avatar>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-id="{scope}">
|
|
|
+ <el-link
|
|
|
+ :underline="true"
|
|
|
+ @click="detailShowFn(scope.row)"
|
|
|
+ style="font-size:12px;"
|
|
|
+ >{{ scope.row.id }}</el-link>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-mobile="{scope}">
|
|
|
+ <span v-if="scope.row.mobile != ''">{{ scope.row.mobile }}</span>
|
|
|
+ <span v-else>-</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-header-debtAmount>
|
|
|
+ <div class="set-sort">
|
|
|
+ <span style="color:blue;">待结欠款</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template #table-column-debtAmount="{scope}">
|
|
|
+ <span v-if="scope.row.debtAmount > 0" style="color:blue;">{{ scope.row.debtAmount?parseFloat(scope.row.debtAmount):0 }}</span>
|
|
|
+ <span v-else>0</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-balance="{scope}">
|
|
|
+ <span>{{ scope.row.balance }}</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-debt="{scope}">
|
|
|
+ <i class="el-icon-success" v-if="scope.row.debt == 1" style="color:green;font-size:18px;cursor: pointer;" @click="modifyDebt(scope.row,0)"></i>
|
|
|
+ <i class="el-icon-open" v-else style="font-size:16px;cursor: pointer;" @click="modifyDebt(scope.row,1)"></i>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-debtLimit="{scope}">
|
|
|
+ <span v-if="scope.row.debt == 1" style="font-weight:bold;color:green;cursor: pointer;" @click="changeDebtAmount(scope.row)">
|
|
|
+ {{ scope.row.debtLimit ? parseFloat(scope.row.debtLimit) : 0 }}
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ <i class="el-icon-edit" style="font-size:15px;cursor: pointer;" @click="pleaseOpen()"></i>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-buyAmount="{scope}">
|
|
|
+ <span>{{ scope.row.buyAmount ? parseFloat(scope.row.buyAmount) : 0 }}</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-billing>
|
|
|
+ <el-button type="primary" size="mini" style="margin-left:60px;" @click="add()">添加供货商</el-button>
|
|
|
+ <el-button type="primary" size="mini" style="margin-left:60px;" @click="billing()">开单</el-button>
|
|
|
+ <el-button type="primary" size="mini" style="margin-left:60px;" @click="newCg()">新增采购</el-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #table-column-name="{scope}">
|
|
|
+ <el-link
|
|
|
+ :underline="true"
|
|
|
+ @click="detailShowFn(scope.row)"
|
|
|
+ style="font-size:12px;"
|
|
|
+ >{{ scope.row.name }}</el-link>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-column-option="{scope}">
|
|
|
+ <el-button size="small" type="primary" @click="goClear">去清账</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="goCg(scope.row)">去采购</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="modify(scope.row)">修改</el-button>
|
|
|
+ <el-button size="small" type="success" @click="">结账记录</el-button>
|
|
|
+ <el-button size="small" type="success" @click="">采购记录</el-button>
|
|
|
+ <el-button size="small" type="success" @click="">欠款变动明细</el-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ </x-crud>
|
|
|
+
|
|
|
+ <!-- 详情 -->
|
|
|
+ <detail-draw :show.sync="drapShow" :info="modalData" />
|
|
|
+
|
|
|
+ <el-dialog :title="rechargeTitle" :visible.sync="rechargePop" width="600px" center :close-on-click-modal="false">
|
|
|
+ <div>
|
|
|
+ <div class="accounts-list">
|
|
|
+ 充值金额
|
|
|
+ <el-input style="width: 80%" v-model="rechargeAmount" clearable></el-input>
|
|
|
+ </div>
|
|
|
+ <div class="accounts-list">
|
|
|
+ 转账方式
|
|
|
+ <div class="accounts-center">
|
|
|
+ <el-button :type="rechargePayWay == 0?'primary':''" @click="rechargePayWay=0" size="small">微信</el-button>
|
|
|
+ <el-button :type="rechargePayWay == 1?'primary':''" @click="rechargePayWay=1" size="small">支付宝</el-button>
|
|
|
+ <el-button :type="rechargePayWay == 4?'primary':''" @click="rechargePayWay=4" size="small">现金</el-button>
|
|
|
+ <el-button :type="rechargePayWay == 5?'primary':''" @click="rechargePayWay=5" size="small">银行卡</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="accounts-list" style="margin-top:20px;">
|
|
|
+ <span></span>
|
|
|
+ <div class="accounts-center">
|
|
|
+ <el-button @click="resetRecharge()">取消</el-button>
|
|
|
+ <el-button type="primary" @click="confirmRecharge()" style="margin-left:80px;">确认</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog title="添加供货商" :visible.sync="addPop" width="600px" center :close-on-click-modal="false">
|
|
|
+ <div>
|
|
|
+ <div class="accounts-list">
|
|
|
+ 供货商名称
|
|
|
+ <el-input style="width: 80%" v-model="name1" clearable></el-input>
|
|
|
+ </div>
|
|
|
+ <div class="accounts-list" style="margin-top:20px;">
|
|
|
+ <span></span>
|
|
|
+ <div class="accounts-center">
|
|
|
+ <el-button @click="resetAdd()">取消</el-button>
|
|
|
+ <el-button type="primary" @click="confirmAdd()" style="margin-left:80px;">确认</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { mapGetters, mapActions } from 'vuex';
|
|
|
+import cardName from './components/card-name';
|
|
|
+import detailDraw from './components/detail-draw';
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ cardName,
|
|
|
+ detailDraw
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ app: null,
|
|
|
+ tabIndex: '0',
|
|
|
+ tabsData: [
|
|
|
+ {
|
|
|
+ text: '全部列表',
|
|
|
+ key: '0',
|
|
|
+ val: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ text: '欠款排行',
|
|
|
+ key: '2',
|
|
|
+ val: 0
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ modalData: {},
|
|
|
+ drapShow: false,
|
|
|
+ rechargeAmount:'',
|
|
|
+ rechargePayWay:-1,
|
|
|
+ rechargePop:false,
|
|
|
+ rechargeTitle:'充值',
|
|
|
+ rechargeCustom:{},
|
|
|
+ name1:'',
|
|
|
+ mobile1:'',
|
|
|
+ confirmMobile1:'',
|
|
|
+ addPop:false
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters({ levelData: 'level' })
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getLevel();
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ let that = this;
|
|
|
+ document.onkeydown=function(e) {
|
|
|
+ if(e && e.key == ',' && e.ctrlKey){
|
|
|
+ let query = {}
|
|
|
+ that.$router.push({path:'/order/add',query})
|
|
|
+ }
|
|
|
+ if(e && e.key == '.' && e.ctrlKey){
|
|
|
+ let query = {}
|
|
|
+ that.$router.push({path:'/in/add',query})
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapActions(['getLevel']),
|
|
|
+ goClear(){
|
|
|
+ this.$message({message: '开发中',type: 'warning'})
|
|
|
+ },
|
|
|
+ modify(){
|
|
|
+ this.$message({message: '开发中',type: 'warning'})
|
|
|
+ },
|
|
|
+ newCg(){
|
|
|
+ let query = {}
|
|
|
+ this.$router.push({path:'/in/add',query})
|
|
|
+ },
|
|
|
+ add(){
|
|
|
+ this.addPop = true
|
|
|
+ },
|
|
|
+ resetAdd(){
|
|
|
+ this.name1 = ''
|
|
|
+ this.mobile1 = ''
|
|
|
+ this.addPop = false
|
|
|
+ this.confirmMobile1 = ''
|
|
|
+ },
|
|
|
+ confirmAdd(){
|
|
|
+ if(this.mobile1 != this.confirmMobile1){
|
|
|
+ this.$message({message: '二次手机号不一致',type: 'warning'})
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ if(this.mobile1.length != 11){
|
|
|
+ this.$message({message: '手机号错误',type: 'warning'})
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ if(this.$util.isEmpty(this.name1)){
|
|
|
+ this.$message({message: '请填写名称',type: 'warning'})
|
|
|
+ return false
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$confirm('确认添加？', '提示', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' }).then(() => {
|
|
|
+ this.$service.custom.createCustomers({ name1:this.name1,mobile1:this.mobile1,confirmMobile1:this.confirmMobile1}).then(data => {
|
|
|
+ this.resetAdd()
|
|
|
+ this.$notify({ title: '添加成功，15秒后生效', message: 'success', type: 'success'})
|
|
|
+ this.app.refresh({ type: this.tabIndex })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ billing(){
|
|
|
+ let query = {}
|
|
|
+ this.$router.push({path:'/order/add',query})
|
|
|
+ },
|
|
|
+ goCg(info){
|
|
|
+ let query = {}
|
|
|
+ query.ghsId = info.id
|
|
|
+ query.ghsName = info.name
|
|
|
+ this.$router.push({path:'/in/add',query})
|
|
|
+ },
|
|
|
+ handleClick(tab, e) {
|
|
|
+ this.app.refresh({ type: this.tabIndex });
|
|
|
+ },
|
|
|
+ detailShowFn(item) {
|
|
|
+ this.modalData = item;
|
|
|
+ this.drapShow = true;
|
|
|
+ },
|
|
|
+ onLoad({ ctx, app }) {
|
|
|
+ this.app = app;
|
|
|
+
|
|
|
+ //传入参数 shish 2020.5.9
|
|
|
+ if (this.$route.query.type) {
|
|
|
+ this.tabIndex = this.$route.query.type;
|
|
|
+ }
|
|
|
+
|
|
|
+ ctx.service(this.$service.ghs)
|
|
|
+ .set('table', {
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ prop: 'id',
|
|
|
+ label: 'ID',
|
|
|
+ align: 'center',
|
|
|
+ width: 100
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'avatar',
|
|
|
+ label: '头像',
|
|
|
+ align: 'center',
|
|
|
+ width: 100
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'name',
|
|
|
+ label: '名称',
|
|
|
+ align: 'center',
|
|
|
+ width: 300
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'debtAmount',
|
|
|
+ label: '欠款',
|
|
|
+ align: 'center',
|
|
|
+ width: 100
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'debtNum',
|
|
|
+ label: '欠款笔数',
|
|
|
+ align: 'center',
|
|
|
+ width: 90
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'updateTime',
|
|
|
+ label: '最近访问',
|
|
|
+ align: 'center',
|
|
|
+ width: 160
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: 'addTime',
|
|
|
+ label: '添加时间',
|
|
|
+ align: 'center',
|
|
|
+ width: 160
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ op: {
|
|
|
+ visible: true,
|
|
|
+ props: {
|
|
|
+ width: 550,
|
|
|
+ align: 'center',
|
|
|
+ fixed: 'right',
|
|
|
+ label: '操作'
|
|
|
+ },
|
|
|
+ layout: ['slot-column-option']
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .set('dict', {
|
|
|
+ search: {
|
|
|
+ keyWord: 'name'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .set('search', {
|
|
|
+ key: { placeholder: '这里搜索' }
|
|
|
+ })
|
|
|
+ .set('layout', [
|
|
|
+ ['slot-tabs'],
|
|
|
+ ['search-key','slot-billing'],
|
|
|
+ ['data-table'],
|
|
|
+ ['flex1', 'pagination']
|
|
|
+ ])
|
|
|
+ .on('refresh', async (params, { next }) => {
|
|
|
+ let result = await next(params);
|
|
|
+ this.tabsData[0].val = result.totalUser
|
|
|
+ this.tabsData[1].val = result.mayGatheringNum
|
|
|
+ })
|
|
|
+ .done();
|
|
|
+ app.refresh({ type: this.tabIndex });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.user-name-warp {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ span {
|
|
|
+ margin-left: 6px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.recharge-modal-content {
|
|
|
+ @include disFlex(center, space-around);
|
|
|
+ .card-name {
|
|
|
+ width: 200px;
|
|
|
+ height: 100%;
|
|
|
+ border-right: 1px solid $borderColor;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.store-icon {
|
|
|
+ i {
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-icon-check {
|
|
|
+ color: #fee470;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-icon-close {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+}
|
|
|
+.accounts-list{
|
|
|
+ width: 80%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ .accounts-center{
|
|
|
+ width: 80%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
