fix：增加收银中心，供应商账单，分店管理修改
This commit is contained in:
GaoHao
parent
11b297baa5
commit
164dd52afa
|
|
@ -0,0 +1,145 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-alert title="当前列表仅作为数据记录，不产生任何实际交易。" type="warning" show-icon :closable="false"
|
||||
style="margin-bottom: 15px;" />
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="4">
|
||||
<el-input v-model="state.query.name" clearable placeholder="请输入耗材名称" style="width: 100%" class="filter-item"
|
||||
@keyup.enter="getTableData" />
|
||||
</el-col>
|
||||
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="getTableData">查询</el-button>
|
||||
<el-button type="primary" @click="getTableData" plain>批量付款</el-button>
|
||||
<el-text tag="b" size="large" style="margin-left: 15px;">供应商：供应商名称</el-text>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-table v-loading="state.tableData.loading" :data="state.tableData.list">
|
||||
<el-table-column prop="id" label="ID" width="80" />
|
||||
<el-table-column label="耗材信息">
|
||||
<template v-slot="scope">
|
||||
<div>{{ scope.row.shopName }}（{{ scope.row.shopName }}）</div>
|
||||
<div>账号：{{ scope.row.shopName }}</div>
|
||||
<div>联系电话：{{ scope.row.phone }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="账单金额" width="120" />
|
||||
<el-table-column prop="status" label="已付款金额" width="120" />
|
||||
<el-table-column prop="status" label="未付款金额" width="120" />
|
||||
<el-table-column prop="status" label="创建时间" width="120" />
|
||||
<el-table-column prop="createdAt" label="备注" />
|
||||
<el-table-column label="操作" width="200">
|
||||
<template v-slot="scope">
|
||||
<el-button type="primary" size="small" link @click="handlePayment(scope.row)">
|
||||
付款
|
||||
</el-button>
|
||||
<el-button type="primary" size="small" link @click="handleRecord(scope.row.id)">
|
||||
付款记录
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-pagination v-model:current-page="state.tableData.page" v-model:page-size="state.tableData.size"
|
||||
:total="state.tableData.total" :page-sizes="[10, 20, 30, 50, 100]"
|
||||
layout="total, sizes , prev, pager ,next, jumper " @current-change="paginationChange" />
|
||||
</div>
|
||||
<payment ref="refPayment" @refresh="getTableData"></payment>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ShopApi from "@/api/account/shop";
|
||||
import { ElMessageBox } from "element-plus";
|
||||
import payment from "./components/payment.vue";
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const state = reactive({
|
||||
query: {
|
||||
name: "",
|
||||
},
|
||||
tableData: {
|
||||
list: [],
|
||||
page: 1,
|
||||
size: 10,
|
||||
loading: false,
|
||||
total: 0,
|
||||
},
|
||||
});
|
||||
onMounted(() => {
|
||||
console.log(route.query);
|
||||
if (route.query.id) {
|
||||
}
|
||||
getTableData();
|
||||
});
|
||||
// 获取商家列表
|
||||
async function getTableData() {
|
||||
state.tableData.loading = true;
|
||||
try {
|
||||
const res = await ShopApi.getList({
|
||||
page: state.tableData.page,
|
||||
size: state.tableData.size,
|
||||
shopName: state.query.name,
|
||||
account: state.query.account,
|
||||
status: state.query.status,
|
||||
});
|
||||
state.tableData.loading = false;
|
||||
state.tableData.list = res.records;
|
||||
state.tableData.total = res.totalRow * 1;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
const refPayment = ref();
|
||||
function handlePayment(item) {
|
||||
refPayment.value.open(item);
|
||||
}
|
||||
// 付款记录
|
||||
function handleRecord(id) {
|
||||
router.push({ name: "financePaymentRecord", query: { id: id } });
|
||||
|
||||
}
|
||||
|
||||
// 重置查询
|
||||
function resetHandle() {
|
||||
state.query.name = "";
|
||||
getTableData();
|
||||
}
|
||||
// 分页回调
|
||||
function paginationChange(e) {
|
||||
state.tableData.page = e;
|
||||
getTableData();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.head-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.shop_info {
|
||||
display: flex;
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-link {
|
||||
min-height: 23px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
<template>
|
||||
<!-- 修改和增加 -->
|
||||
<el-dialog title="付款" v-model="show" width="400px" @close="reset">
|
||||
<el-form :inline="false" ref="refform" label-width="90" :model="form" :rules="rules" class="demo-form-inline">
|
||||
<el-form-item label="供应商" prop="conName">
|
||||
<el-input v-model="form.conName" placeholder="请输入供应商名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="付款金额 " prop="price">
|
||||
<el-input-number v-model="form.price" placeholder="请输入付款金额" style="width: 100%;"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="付款方式" prop="conName">
|
||||
<el-input v-model="form.conName" placeholder="请输入付款方式"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="defaultUnit">
|
||||
<el-input v-model="form.defaultUnit" placeholder="请输入备注"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="display: flex; justify-content: flex-end">
|
||||
<el-button @click="close">取 消</el-button>
|
||||
<el-button type="primary" @click="submitForm('refform')">确 定</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import consApi from "@/api/product/cons";
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
const emits = defineEmits(["refresh"]);
|
||||
|
||||
const rules = {
|
||||
conName: [{ required: true, message: "请输入耗材名称", trigger: "blur" }],
|
||||
price: [{ required: true, message: "请输入耗材价格", trigger: "blur" }],
|
||||
conWarning: [{ required: true, message: "请输入付款金额", trigger: "blur" }],
|
||||
conUnit: [{ required: true, message: "请输入付款方式", trigger: "blur" }],
|
||||
|
||||
};
|
||||
|
||||
const basicForm = {
|
||||
conName: "",
|
||||
consGroupId: "",
|
||||
conUnit: "",
|
||||
price: undefined,
|
||||
conWarning: undefined,
|
||||
};
|
||||
const form = reactive({
|
||||
...basicForm,
|
||||
});
|
||||
|
||||
const show = ref(false);
|
||||
function open(item) {
|
||||
Object.assign(form, item);
|
||||
show.value = true;
|
||||
}
|
||||
|
||||
function close() {
|
||||
show.value = false;
|
||||
}
|
||||
const refform = ref();
|
||||
async function submitForm() {
|
||||
refform.value.validate(async (valid) => {
|
||||
if (valid) {
|
||||
const res = await consApi.add(form);
|
||||
ElMessage({ type: "success", message: "付款成功" });
|
||||
emits("refresh");
|
||||
close();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function reset() {
|
||||
console.log("reset");
|
||||
Object.assign(form, basicForm);
|
||||
console.log(form);
|
||||
}
|
||||
defineExpose({
|
||||
open,
|
||||
close,
|
||||
});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,139 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-alert title="当前列表仅作为数据记录，不产生任何实际交易。" type="warning" show-icon :closable="false"
|
||||
style="margin-bottom: 15px;" />
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="4">
|
||||
<el-input v-model="state.query.name" clearable placeholder="请输入供应商名称" style="width: 100%"
|
||||
class="filter-item" @keyup.enter="getTableData" />
|
||||
</el-col>
|
||||
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="getTableData">查询</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="8" style="display: flex;flex-direction: column; justify-content: center;align-items: center;">
|
||||
<div>账单总金额（全部/本月）</div>
|
||||
<div>2000/1000</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="8" style="display: flex;flex-direction: column; justify-content: center;align-items: center;">
|
||||
<div>已付款总金额（全部/本月）</div>
|
||||
<div>2000/1000</div>
|
||||
</el-col>
|
||||
<el-col :span="8" style="display: flex;flex-direction: column; justify-content: center;align-items: center;">
|
||||
<div>未付款总金额（全部/本月）</div>
|
||||
<div>2000/1000</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-table v-loading="state.tableData.loading" :data="state.tableData.list">
|
||||
<el-table-column prop="id" label="ID" width="80" />
|
||||
<el-table-column prop="status" label="供应商" width="220" />
|
||||
<el-table-column prop="status" label="账单金额" width="160" />
|
||||
<el-table-column prop="status" label="已付款金额" width="160" />
|
||||
<el-table-column prop="status" label="未付款金额" width="160" />
|
||||
<el-table-column prop="createdAt" label="备注" />
|
||||
<el-table-column label="操作" width="120">
|
||||
<template v-slot="scope">
|
||||
<el-button type="primary" size="small" link @click="handleTo(scope.row.id)">
|
||||
账单记录
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-pagination v-model:current-page="state.tableData.page" v-model:page-size="state.tableData.size"
|
||||
:total="state.tableData.total" :page-sizes="[10, 20, 30, 50, 100]"
|
||||
layout="total, sizes , prev, pager ,next, jumper " @current-change="paginationChange" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ShopApi from "@/api/account/shop";
|
||||
const router = useRouter();
|
||||
|
||||
const state = reactive({
|
||||
query: {
|
||||
name: "",
|
||||
},
|
||||
tableData: {
|
||||
list: [],
|
||||
page: 1,
|
||||
size: 10,
|
||||
loading: false,
|
||||
total: 0,
|
||||
},
|
||||
});
|
||||
onMounted(() => {
|
||||
getTableData();
|
||||
});
|
||||
// 获取商家列表
|
||||
async function getTableData() {
|
||||
state.tableData.loading = true;
|
||||
try {
|
||||
const res = await ShopApi.getList({
|
||||
page: state.tableData.page,
|
||||
size: state.tableData.size,
|
||||
shopName: state.query.name,
|
||||
account: state.query.account,
|
||||
status: state.query.status,
|
||||
});
|
||||
state.tableData.loading = false;
|
||||
state.tableData.list = res.records;
|
||||
state.tableData.total = res.totalRow * 1;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
function handleTo(id) {
|
||||
// router.push({ path: "/finance/supplierBill/billingRecord", query: { id: e.id } });
|
||||
router.push({ name: "financeBillingRecord", query: { id: id } });
|
||||
|
||||
}
|
||||
// 重置查询
|
||||
function resetHandle() {
|
||||
state.query.name = "";
|
||||
getTableData();
|
||||
}
|
||||
// 分页回调
|
||||
function paginationChange(e) {
|
||||
state.tableData.page = e;
|
||||
getTableData();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.head-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.shop_info {
|
||||
display: flex;
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-link {
|
||||
min-height: 23px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-alert title="当前列表仅作为数据记录，不产生任何实际交易。" type="warning" show-icon :closable="false"
|
||||
style="margin-bottom: 15px;" />
|
||||
<el-text tag="b" size="large" style="margin-left: 15px;">供应商：供应商名称</el-text>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-card shadow="never">
|
||||
<el-table v-loading="state.tableData.loading" :data="state.tableData.list">
|
||||
<el-table-column prop="id" label="ID" width="80" />
|
||||
<el-table-column label="耗材信息">
|
||||
<template v-slot="scope">
|
||||
<div>{{ scope.row.shopName }}（{{ scope.row.shopName }}）</div>
|
||||
<div>账号：{{ scope.row.shopName }}</div>
|
||||
<div>联系电话：{{ scope.row.phone }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="付款金额" width="120" />
|
||||
<el-table-column prop="status" label="付款方式" width="120" />
|
||||
<el-table-column prop="createdAt" label="备注" />
|
||||
<el-table-column prop="status" label="创建时间" />
|
||||
<el-table-column label="操作人" width="200">
|
||||
<template v-slot="scope">
|
||||
<div>员工名称：{{ scope.row.shopName }}</div>
|
||||
<div>员工编号：{{ scope.row.shopName }}</div>
|
||||
<div>员工账号：{{ scope.row.phone }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-pagination v-model:current-page="state.tableData.page" v-model:page-size="state.tableData.size"
|
||||
:total="state.tableData.total" :page-sizes="[10, 20, 30, 50, 100]"
|
||||
layout="total, sizes , prev, pager ,next, jumper " @current-change="paginationChange" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ShopApi from "@/api/account/shop";
|
||||
import { ElMessageBox } from "element-plus";
|
||||
const route = useRoute();
|
||||
|
||||
const state = reactive({
|
||||
query: {
|
||||
name: "",
|
||||
},
|
||||
tableData: {
|
||||
list: [],
|
||||
page: 1,
|
||||
size: 10,
|
||||
loading: false,
|
||||
total: 0,
|
||||
},
|
||||
});
|
||||
onMounted(() => {
|
||||
console.log(route.query);
|
||||
if (route.query.id) {
|
||||
}
|
||||
getTableData();
|
||||
});
|
||||
// 获取商家列表
|
||||
async function getTableData() {
|
||||
state.tableData.loading = true;
|
||||
try {
|
||||
const res = await ShopApi.getList({
|
||||
page: state.tableData.page,
|
||||
size: state.tableData.size,
|
||||
shopName: state.query.name,
|
||||
account: state.query.account,
|
||||
status: state.query.status,
|
||||
});
|
||||
state.tableData.loading = false;
|
||||
state.tableData.list = res.records;
|
||||
state.tableData.total = res.totalRow * 1;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
function handleSync(e) {
|
||||
console.log(e)
|
||||
ElMessageBox.confirm(`同步功能开启后不能关闭，请确认是否给${e.shopName}开启同步?`, "提示", {
|
||||
confirmButtonText: "确认",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(async () => {
|
||||
const res = await ShopApi.delete({ id: row.id });
|
||||
ElMessage({
|
||||
type: "success",
|
||||
message: "同步成功",
|
||||
});
|
||||
getTableData();
|
||||
}).catch(() => { });
|
||||
}
|
||||
// 重置查询
|
||||
function resetHandle() {
|
||||
state.query.name = "";
|
||||
getTableData();
|
||||
}
|
||||
// 分页回调
|
||||
function paginationChange(e) {
|
||||
state.tableData.page = e;
|
||||
getTableData();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.head-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.shop_info {
|
||||
display: flex;
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-link {
|
||||
min-height: 23px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,197 +0,0 @@
|
|||
<template>
|
||||
<!-- 修改和增加 -->
|
||||
<el-dialog :title="dialogtitle" v-model="show" width="85%">
|
||||
<div v-if="dialogtitle != '编辑'">
|
||||
<div v-for="(item, index) in forms" :key="index">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:ref="(el) => setFormRef(el, index)"
|
||||
:model="item"
|
||||
:rules="rules"
|
||||
class="demo-form-inline"
|
||||
>
|
||||
<el-form-item label=" ">
|
||||
<el-icon color="red" @click="formsReduce(index)"><Remove /></el-icon>
|
||||
</el-form-item>
|
||||
<el-form-item label="耗材名称" prop="conName">
|
||||
<el-input v-model="item.conName" placeholder="请输入耗材信息名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="耗材类型" prop="conTypeId">
|
||||
<el-select v-model="item.conTypeId" placeholder="请选择耗材类型" style="width: 200px">
|
||||
<el-option
|
||||
v-for="option in consGroups"
|
||||
:key="option.conTypeId"
|
||||
:label="option.conTypeName"
|
||||
:value="option.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="单位" prop="conUnit">
|
||||
<el-input v-model="item.conUnit" placeholder="请输入单位"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="耗材价格">
|
||||
<el-input v-model="item.price" placeholder="请输入耗材价格"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="预警值">
|
||||
<el-input v-model="item.conWarning" placeholder="请输入耗材预警值"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label=" ">
|
||||
<el-icon color="green" @click="formsAdd(index)"><CirclePlus /></el-icon>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; justify-content: flex-end">
|
||||
<el-button @click="dialogshow = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitForms()">确 定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-form
|
||||
v-else
|
||||
:inline="true"
|
||||
ref="refform"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
class="demo-form-inline"
|
||||
>
|
||||
{{ dialogtitle }}
|
||||
|
||||
<el-form-item label="耗材信息名称" prop="conName">
|
||||
<el-input v-model="form.conName" placeholder="请输入耗材信息名称"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="耗材价格">
|
||||
<el-input v-model="form.price" placeholder="请输入耗材价格"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" prop="conUnit">
|
||||
<el-input v-model="form.conUnit" placeholder="请输入单位"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="预警值">
|
||||
<el-input v-model="form.conWarning" placeholder="请输入耗材预警值"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="状态" v-if="dialogtitle == '编辑'">
|
||||
<el-switch v-model="form.status" active-value="1" inactive-value="0"></el-switch>
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item label="单位耗材值" prop="surplusStock">
|
||||
<el-input v-model="form.surplusStock" placeholder="请输入单位耗材值"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item style="display: flex; justify-content: flex-end">
|
||||
<el-button @click="dialogshow = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitForm('refform')">确 定</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import consApi from "@/api/product/cons";
|
||||
import consGroupApi from "@/api/product/cons-group";
|
||||
import { ElMessage } from "element-plus";
|
||||
const consGroups = ref([]);
|
||||
const rules = {
|
||||
conCode: [{ required: true, message: "请输入耗材信息代码", trigger: "blur" }],
|
||||
conName: [{ required: true, message: "请输入耗材信息名称", trigger: "blur" }],
|
||||
conTypeId: [{ required: true, message: "请选择耗材类型", trigger: "change" }],
|
||||
price: [{ required: true, message: "请输入耗材价格", trigger: "blur" }],
|
||||
conWarning: [{ required: true, message: "请输入耗材预警值", trigger: "blur" }],
|
||||
conTypeId: [{ required: true, message: "请输入耗材类型id", trigger: "blur" }],
|
||||
conUnit: [{ required: true, message: "请输入单位", trigger: "blur" }],
|
||||
conWarning: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入单位",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
};
|
||||
function getConsGroups() {
|
||||
consGroupApi.getAllList().then((res) => {
|
||||
consGroups.value = res.map((v) => {
|
||||
return {
|
||||
...v,
|
||||
label: v.name,
|
||||
value: v.id,
|
||||
};
|
||||
});
|
||||
});
|
||||
}
|
||||
getConsGroups();
|
||||
const basicForm = {
|
||||
conCode: "",
|
||||
conName: "",
|
||||
conTypeId: "",
|
||||
price: "0",
|
||||
conNames: "",
|
||||
conUnit: "",
|
||||
conWarning: "999",
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
status: "",
|
||||
};
|
||||
const forms = ref([{ ...basicForm }]);
|
||||
const form = reactive({
|
||||
...basicForm,
|
||||
});
|
||||
|
||||
const show = ref(false);
|
||||
let dialogtitle = ref("");
|
||||
function open(item) {
|
||||
dialogtitle.value = item ? "编辑" : "新增";
|
||||
show.value = true;
|
||||
}
|
||||
function formsAdd(index) {
|
||||
forms.value.push({ ...basicForm });
|
||||
}
|
||||
function close() {
|
||||
show.value = false;
|
||||
}
|
||||
|
||||
const refForms = ref([]);
|
||||
function setFormRef(el, index) {
|
||||
if (el) {
|
||||
refForms.value[index] = el;
|
||||
}
|
||||
}
|
||||
function returnPromise(index, prosise) {
|
||||
return new Promise((resolve, reject) => {
|
||||
prosise
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
resolve({ sucees: true });
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
resolve({ sucees: false });
|
||||
});
|
||||
});
|
||||
}
|
||||
async function submitForms() {
|
||||
let isAllPassForm = 0;
|
||||
for (let i in this.forms) {
|
||||
console.log(refForms.value[i]);
|
||||
const res = await returnPromise(i, refForms.value[i].validate());
|
||||
console.log(res);
|
||||
isAllPassForm += res.sucees ? 1 : 0;
|
||||
}
|
||||
//判断验证是否通过
|
||||
if (isAllPassForm === this.forms.length) {
|
||||
await consApi.add(this.forms);
|
||||
ElMessage({ type: "success", message: "添加成功" });
|
||||
// for(let i of this.forms){
|
||||
// const res=await posttbConsInfo(i)
|
||||
// this.$message({ type: "success", message: "添加成功" });
|
||||
// }
|
||||
this.dialogshow = false;
|
||||
this.resetRuleForms();
|
||||
this.ruleFormLoading = false;
|
||||
this.getTableData();
|
||||
}
|
||||
}
|
||||
defineExpose({
|
||||
open,
|
||||
close,
|
||||
});
|
||||
</script>
|
||||
|
|
@ -59,13 +59,6 @@ const contentConfig: IContentConfig<UserPageQuery> = {
|
|||
pk: "id",
|
||||
toolbar: [
|
||||
"add",
|
||||
{
|
||||
icon: "edit",
|
||||
text: "库存预警",
|
||||
type: "info",
|
||||
name: "custom1",
|
||||
auth: "import",
|
||||
},
|
||||
{
|
||||
icon: "refresh",
|
||||
text: "同步",
|
||||
|
|
@ -73,6 +66,14 @@ const contentConfig: IContentConfig<UserPageQuery> = {
|
|||
name: "custom2",
|
||||
auth: "import",
|
||||
},
|
||||
{
|
||||
icon: "edit",
|
||||
text: "库存预警",
|
||||
type: "info",
|
||||
name: "custom1",
|
||||
auth: "import",
|
||||
},
|
||||
|
||||
],
|
||||
cols: [
|
||||
// { type: "selection", width: 50, align: "center" },
|
||||
|
|
|
|||
|
|
@ -1,60 +0,0 @@
|
|||
<template>
|
||||
<el-dialog title="激活码" width="500px" v-model="show" @close="reset">
|
||||
<el-form :model="form" ref="refForm" :rules="rules">
|
||||
<el-form-item label="激活码" prop="activateCode">
|
||||
<el-input v-model="form.activateCode" placeholder="请输入激活码"></el-input>
|
||||
<div class="tips">注：输入有效激活码表示添加的同时直接激活该店铺。</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ShopApi from "@/api/account/shop";
|
||||
|
||||
const show = ref(false);
|
||||
const form = reactive({
|
||||
activateCode: "",
|
||||
id: "",
|
||||
});
|
||||
const rules = {
|
||||
activateCode: [{ required: true, message: "请输入激活码", trigger: "blur" }],
|
||||
};
|
||||
|
||||
function reset() {
|
||||
form.activateCode = "";
|
||||
form.id = "";
|
||||
}
|
||||
const emit = defineEmits(["submit"]);
|
||||
const refForm = ref();
|
||||
function submit() {
|
||||
refForm.value.validate((valid) => {
|
||||
if (valid) {
|
||||
ShopApi.edit(form).then(() => {
|
||||
ElNotification({
|
||||
title: "成功",
|
||||
message: "操作成功",
|
||||
type: "success",
|
||||
});
|
||||
emit("success");
|
||||
close();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
function close() {
|
||||
show.value = false;
|
||||
}
|
||||
function open(obj) {
|
||||
form.id = obj.id;
|
||||
show.value = true;
|
||||
}
|
||||
defineExpose({
|
||||
open,
|
||||
close,
|
||||
});
|
||||
</script>
|
||||
|
|
@ -1,531 +0,0 @@
|
|||
<template>
|
||||
<el-dialog :title="state.form.id ? '编辑店铺' : '添加店铺'" v-model="state.dialogVisible" @close="reset">
|
||||
<div style="height: 50vh; overflow-y: auto">
|
||||
<el-form ref="refForm" :model="state.form" :rules="state.rules" label-width="120px" label-position="left">
|
||||
<el-form-item label="店铺名称" prop="shopName">
|
||||
<el-input v-model="state.form.shopName" placeholder="请输入门店名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="店铺类型">
|
||||
<el-radio-group v-model="state.form.shopType">
|
||||
<el-radio-button value="only">单店</el-radio-button>
|
||||
<el-radio-button value="chain">连锁店</el-radio-button>
|
||||
<el-radio-button value="join">加盟店</el-radio-button>
|
||||
</el-radio-group>
|
||||
<div class="tips">请谨慎修改！！！</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否为主店" prop="isMainStore">
|
||||
<el-radio-group v-model="state.form.isMainStore" @change=" state.form.mainId = ''">
|
||||
<el-radio value="1">是</el-radio>
|
||||
<el-radio value="0">否</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="主店账号" prop="mainId" v-if="state.form.isMainStore == '0'">
|
||||
<!-- <el-form-item label="主店账号" prop="mainId" v-if="state.form.shopType != 'only'"> -->
|
||||
<el-select v-model="state.form.mainId" placeholder="请选择主店铺" filterable reserve-keyword
|
||||
:remote-method="getTableData" :loading="state.shopListLoading">
|
||||
<el-option v-for="item in state.shopList" :label="`${item.shopName}`" :value="item.id"
|
||||
:key="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="连锁店扩展店名">
|
||||
<el-input v-model="state.form.chainName" placeholder="请输入连锁店扩展店名"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="门店logo" prop="logo">
|
||||
<SingleImageUpload v-model="state.form.logo" />
|
||||
</el-form-item>
|
||||
<el-form-item label="门店照片">
|
||||
<SingleImageUpload v-model="state.form.frontImg" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经营模式">
|
||||
<el-radio-group v-model="state.form.registerType">
|
||||
<el-radio-button value="before">先付费</el-radio-button>
|
||||
<el-radio-button value="after">后付费</el-radio-button>
|
||||
</el-radio-group>
|
||||
<div class="tips">请谨慎修改！！！</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="管理方式" v-if="state.form.shopType != 'only'">
|
||||
<el-radio-group v-model="state.form.tube_type">
|
||||
<el-radio-button value="0">不可直接管理</el-radio-button>
|
||||
<el-radio-button value="1">直接管理</el-radio-button>
|
||||
</el-radio-group>
|
||||
<div class="tips">请谨慎修改！！！</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="试用/正式">
|
||||
<el-radio-group v-model="state.form.profiles">
|
||||
<el-radio-button value="probation">试用</el-radio-button>
|
||||
<el-radio-button value="release">正式</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="激活码">
|
||||
<el-input v-model="state.form.activateCode" placeholder="请输入激活码"></el-input>
|
||||
<div class="tips">注：输入有效激活码表示添加的同时直接激活该店铺。</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录账号" prop="accountName">
|
||||
<el-input v-model="state.form.accountName" placeholder="请输入登录账号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录密码" prop="password" v-if="!state.form.id">
|
||||
<el-input type="password" show-password v-model="state.form.accountPwd" placeholder="请输入登录密码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话" prop="phone">
|
||||
<el-input v-model="state.form.phone" placeholder="请输入联系电话"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="设备数量">
|
||||
<el-input-number v-model="state.form.supportDeviceNumber" controls-position="right" :min="1" :step="1"
|
||||
step-strictly></el-input-number>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="外卖起送金额">
|
||||
<el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right"
|
||||
:min="0"></el-input-number>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="店铺经度" prop="lat">
|
||||
<el-row>
|
||||
<el-col :span="9" v-if="state.form.provinces">
|
||||
<el-input :value="`${state.form.provinces}-${state.form.cities}-${state.form.districts}`" disabled />
|
||||
</el-col>
|
||||
<el-col :span="4" v-if="state.form.lng">
|
||||
<el-input v-model="state.form.lng" placeholder="经度" disabled></el-input>
|
||||
</el-col>
|
||||
<el-col :span="4" v-if="state.form.lng">
|
||||
<el-input v-model="state.form.lat" placeholder="纬度" disabled></el-input>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-button type="primary" plain icon="place" @click="state.showLocation = true">
|
||||
选择坐标
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="店铺详细地址">
|
||||
<el-input type="textarea" v-model="state.form.address" placeholder="请输入门店详细地址"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="店铺简介">
|
||||
<el-input type="textarea" v-model="state.form.detail" placeholder="请输入店铺简介"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<el-radio-group v-model="state.form.status">
|
||||
<el-radio :value="1">开启</el-radio>
|
||||
<el-radio :value="0">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-dialog title="选择地址" v-model="state.showLocation" :modal="false" :modal-append-to-body="false">
|
||||
<div class="map_box">
|
||||
<div class="map">
|
||||
<el-amap ref="map" :center="state.amapOptions.center" @init="mapInit">
|
||||
<el-amap-marker :position="state.amapOptions.center"></el-amap-marker>
|
||||
</el-amap>
|
||||
</div>
|
||||
<div class="search_box">
|
||||
<el-input v-model="state.searchOption.keyword" placeholder="请输入关键字" @focus="state.searchOption.focus = true"
|
||||
@blur="autoCompleteSearchBlur" @input="autoCompleteSearch(state.searchOption.keyword)">
|
||||
<template #append>
|
||||
<el-button type="primary" @click="placeSearchSearch(state.searchOption.keyword)">
|
||||
搜索
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<div class="list" v-if="state.searchOption.focus && state.searchOption.show">
|
||||
<div class="item" @click="autoCompleteListClick(item)" v-for="item in state.autoCompleteList"
|
||||
:key="item.id">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="search_wrap">
|
||||
<div class="item" v-for="item in state.locationSearchList" :key="item.id">
|
||||
<div class="left">
|
||||
<div class="name">{{ item.name }}-{{ item.address }}</div>
|
||||
<div class="location">经纬度：{{ item.location.lng }},{{ item.location.lat }}</div>
|
||||
</div>
|
||||
<div class="btn">
|
||||
<el-button type="primary" @click="selectLocationHandle(item)">选择</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="submitHandle" :loading="state.formLoading">
|
||||
<span v-if="!state.formLoading">保存</span>
|
||||
<span v-else>保存中...</span>
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { getToken } from "@/utils/auth";
|
||||
import uploadImg from "@/assets/images/upload.png";
|
||||
import { ElAmap } from "@vuemap/vue-amap";
|
||||
import { initMapLoad } from "@/utils/mapLoadUtil";
|
||||
import { ElNotification } from "element-plus";
|
||||
// { geocode, ShopApi.getList }
|
||||
import ShopApi from "@/api/account/shop";
|
||||
const validateLogo = (rule, value, callback) => {
|
||||
if (!state.form.logo) {
|
||||
callback(new Error("请上传门店logo"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
|
||||
const state = reactive({
|
||||
uploadImg: uploadImg,
|
||||
dialogVisible: false,
|
||||
showLocation: false,
|
||||
showUpload: false,
|
||||
uploadIndex: 1,
|
||||
startTime: "",
|
||||
endTime: "",
|
||||
formLoading: false,
|
||||
form: {
|
||||
id: "",
|
||||
shopName: "",
|
||||
mainId: "",
|
||||
shopType: "only",
|
||||
tube_type: "0",
|
||||
registerType: "before",
|
||||
profiles: "release",
|
||||
activateCode: "",
|
||||
accountName: "",
|
||||
accountPwd: "",
|
||||
phone: "",
|
||||
supportDeviceNumber: 1,
|
||||
lat: "",
|
||||
lng: "",
|
||||
address: "",
|
||||
detail: "",
|
||||
status: 1,
|
||||
logo: "",
|
||||
frontImg: "",
|
||||
provinces: "",
|
||||
cities: "",
|
||||
districts: "",
|
||||
chainName: "",
|
||||
isMainStore: '0',
|
||||
},
|
||||
resetForm: "",
|
||||
rules: {
|
||||
activateCode: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入激活码",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
shopName: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入店铺名称",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
isMainStore: [
|
||||
{
|
||||
required: true,
|
||||
message: " ",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
mainId: [
|
||||
{
|
||||
required: true,
|
||||
message: " ",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
lat: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择坐标",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
logo: [
|
||||
{
|
||||
required: true,
|
||||
validator: validateLogo,
|
||||
trigger: "请上传门店logo",
|
||||
},
|
||||
],
|
||||
accountName: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入账号",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
accountPwd: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入账号密码",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
phone: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入联系电话",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
},
|
||||
fileList: [],
|
||||
files: [],
|
||||
headers: {
|
||||
Authorization: getToken(),
|
||||
},
|
||||
searchOption: {
|
||||
city: "西安",
|
||||
citylimit: false,
|
||||
keyword: "",
|
||||
show: false,
|
||||
focus: false,
|
||||
},
|
||||
autoCompleteList: [],
|
||||
locationSearchList: [],
|
||||
amapOptions: {
|
||||
center: [108.946465, 34.347984],
|
||||
position: [],
|
||||
},
|
||||
shopListLoading: false,
|
||||
shopList: [],
|
||||
});
|
||||
onBeforeMount(async () => {
|
||||
const res = await initMapLoad();
|
||||
});
|
||||
onMounted(() => {
|
||||
state.resetForm = { ...state.form };
|
||||
});
|
||||
|
||||
// 获取商家列表
|
||||
async function getTableData(query = "") {
|
||||
console.log(123)
|
||||
state.shopListLoading = true;
|
||||
try {
|
||||
const res = await ShopApi.getList({
|
||||
page: 1,
|
||||
size: 100,
|
||||
shopName: query,
|
||||
type: "only",
|
||||
});
|
||||
state.shopListLoading = false;
|
||||
state.shopList = res.records;
|
||||
} catch (error) {
|
||||
state.shopListLoading = false;
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
|
||||
// 确认地址选择
|
||||
async function selectLocationHandle(item) {
|
||||
console.log(item);
|
||||
state.form.lng = item.location.lng;
|
||||
state.form.lat = item.location.lat;
|
||||
state.form.address = item.address;
|
||||
state.showLocation = false;
|
||||
|
||||
const position = `${item.location.lng},${item.location.lat}`;
|
||||
|
||||
state.form.provinces = item.pname;
|
||||
state.form.cities = item.cityname;
|
||||
state.form.districts = item.adname;
|
||||
}
|
||||
const emits = defineEmits(["close", "success"]);
|
||||
const refForm = ref(null);
|
||||
// 保存
|
||||
function submitHandle() {
|
||||
refForm.value.validate(async (valid) => {
|
||||
if (valid) {
|
||||
state.formLoading = true;
|
||||
try {
|
||||
state.form.id ? await ShopApi.edit(state.form) : await ShopApi.add(state.form);
|
||||
emits("success");
|
||||
state.formLoading = false;
|
||||
ElNotification({
|
||||
title: "成功",
|
||||
message: `${state.form.id ? "编辑" : "添加"}成功`,
|
||||
type: "success",
|
||||
});
|
||||
close();
|
||||
} catch (error) {
|
||||
state.formLoading = false;
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
function handleSuccess(response, file, fileList) {
|
||||
// const uid = file.uid
|
||||
// const id = response.id
|
||||
// this.files.push({ uid, id })
|
||||
console.log("上传成功", response);
|
||||
state.files = response.data;
|
||||
}
|
||||
|
||||
function show(obj) {
|
||||
getTableData();
|
||||
state.dialogVisible = true;
|
||||
if (obj && obj.id) {
|
||||
console.log(obj);
|
||||
state.form = { ...obj };
|
||||
}
|
||||
for (let key in state.rules) {
|
||||
if (key === "accountName") {
|
||||
if (obj.id) {
|
||||
state.rules[key][0].required = false;
|
||||
} else {
|
||||
state.rules[key][0].required = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(state.rules);
|
||||
}
|
||||
function close() {
|
||||
state.dialogVisible = false;
|
||||
}
|
||||
function reset() {
|
||||
state.form = { ...state.resetForm };
|
||||
}
|
||||
|
||||
let ElMap = undefined;
|
||||
let placeSearch = undefined;
|
||||
let autoComplete = undefined;
|
||||
let PlaceSearchIndex = 1;
|
||||
|
||||
function autoCompleteSearchBlur() {
|
||||
setTimeout(() => {
|
||||
state.searchOption.show = false;
|
||||
}, 200);
|
||||
}
|
||||
|
||||
function autoCompleteSearch(keyword) {
|
||||
if (keyword === "") {
|
||||
state.autoCompleteList = [];
|
||||
return;
|
||||
}
|
||||
autoComplete.search(keyword, function (status, result) {
|
||||
if (status === "complete" && result.info === "OK") {
|
||||
// 搜索成功时，result即是对应的匹配数据
|
||||
console.log(result);
|
||||
state.searchOption.show = true;
|
||||
state.autoCompleteList = result.tips;
|
||||
}
|
||||
});
|
||||
}
|
||||
function autoCompleteListClick(item) {
|
||||
console.log(item);
|
||||
state.searchOption.keyword = item.name;
|
||||
state.autoCompleteList = [];
|
||||
placeSearchSearch(item.name);
|
||||
}
|
||||
function placeSearchSearch(keyword) {
|
||||
PlaceSearchIndex = 1;
|
||||
if (keyword === "") {
|
||||
state.locationSearchList = [];
|
||||
return;
|
||||
}
|
||||
// 关键字查询
|
||||
placeSearch.search(keyword, (status, result) => {
|
||||
console.log(status);
|
||||
console.log(result);
|
||||
state.locationSearchList = result.poiList.pois;
|
||||
});
|
||||
}
|
||||
function mapInit(map) {
|
||||
map.plugin(["AMap.PlaceSearch", "AMap.AutoComplete", "AMap.ToolBar"], () => {
|
||||
const toolBar = new AMap.ToolBar();
|
||||
map.addControl(toolBar);
|
||||
// 注意：输入提示插件2.0版本需引入AMap.AutoComplete，而1.4版本应使用AMap.Autocomplete
|
||||
// 实例化AutoComplete
|
||||
var autoOptions = {
|
||||
city: "西安",
|
||||
};
|
||||
autoComplete = new AMap.AutoComplete(autoOptions);
|
||||
|
||||
//构造地点查询类
|
||||
placeSearch = new AMap.PlaceSearch({
|
||||
pageSize: 10, // 单页显示结果条数
|
||||
pageIndex: PlaceSearchIndex, // 页码
|
||||
city: "西安", // 兴趣点城市
|
||||
citylimit: true, //是否强制限制在设置的城市内搜索
|
||||
map: map, // 展现结果的地图实例
|
||||
// panel: "search_wrap", // 结果列表将在此容器中进行展示。
|
||||
autoFitView: true, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
|
||||
});
|
||||
});
|
||||
|
||||
ElMap = map;
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
show,
|
||||
close,
|
||||
reset,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.map_box {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
.map {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.search_box {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
z-index: 3000;
|
||||
|
||||
.list {
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||
padding: 0 10px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search_wrap {
|
||||
padding: 6px 0;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
padding: 12px 0;
|
||||
|
||||
.left {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-right: 20px;
|
||||
|
||||
.location {
|
||||
color: #999;
|
||||
padding-top: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.amap-sug-result {
|
||||
z-index: 2000;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,156 +0,0 @@
|
|||
<template>
|
||||
<el-dialog v-model="dialogVisible" :show-close="false" @close="reset">
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane label="聚合支付" name="pay">
|
||||
<el-form ref="form" :model="form" label-width="120px" label-position="left">
|
||||
<el-form-item label="店铺id">
|
||||
<el-input v-model="form.storeId" placeholder="请输入店铺id"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商户名称">
|
||||
<el-input v-model="form.merchantName" placeholder="请输入支付系统商户名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商户应用id">
|
||||
<el-input v-model="form.appId" placeholder="请输入商户应用id"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="商户密钥">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="form.appSecret"
|
||||
placeholder="请输入商户密钥"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="支付密码">
|
||||
<el-input v-model="form.payPassword" placeholder="请输入支付密码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="微信appid">
|
||||
<el-input
|
||||
v-model="form.wechatSmallAppid"
|
||||
placeholder="请输入微信小程序appid"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="支付宝appid">
|
||||
<el-input
|
||||
v-model="form.alipaySmallAppid"
|
||||
placeholder="请输入支付宝小程序appid"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="支付宝商户号">
|
||||
<el-input v-model="form.alipayAppId" placeholder="请输入支付宝商户号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="支付宝商户密钥">
|
||||
<el-input v-model="form.alipayAppToken" placeholder="请输入支付宝商户密钥"></el-input>
|
||||
</el-form-item> -->
|
||||
|
||||
<!-- <el-form-item label="状态">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio :value="1">启用</el-radio>
|
||||
<el-radio :value="-1">禁用</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item> -->
|
||||
</el-form>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="submitHandle" :loading="formLoading">
|
||||
<span v-if="!formLoading">保存</span>
|
||||
<span v-else>保存中...</span>
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { tbMerchantThirdApply, tbMerchantThirdApplyPut } from "@/api/shop";
|
||||
import ShopApi from "@/api/account/shop";
|
||||
import shopMerchantApi from "@/api/account/shopMerchant";
|
||||
import { ElNotification } from "element-plus";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
activeName: "pay",
|
||||
formLoading: false,
|
||||
form: {
|
||||
appSecret: "",
|
||||
id: "",
|
||||
payPassword: "",
|
||||
status: 1,
|
||||
appId: "",
|
||||
wechatSmallAppid: "",
|
||||
storeId: "",
|
||||
alipaySmallAppid: "",
|
||||
alipayAppToken: "",
|
||||
alipayAppId: "",
|
||||
},
|
||||
shopId: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 保存
|
||||
async submitHandle() {
|
||||
this.formLoading = true;
|
||||
try {
|
||||
await shopMerchantApi.edit(this.shopId, this.form);
|
||||
this.$emit("success");
|
||||
this.formLoading = false;
|
||||
ElNotification({
|
||||
title: "成功",
|
||||
message: `修改成功`,
|
||||
type: "success",
|
||||
});
|
||||
this.close();
|
||||
} catch (error) {
|
||||
this.formLoading = false;
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.dialogVisible = false;
|
||||
},
|
||||
reset() {
|
||||
this.form.appSecret = "";
|
||||
this.form.id = "";
|
||||
this.form.payPassword = "";
|
||||
this.form.status = 1;
|
||||
this.form.appId = "";
|
||||
this.shopId = "";
|
||||
},
|
||||
// 详情（配置三方支付）
|
||||
async getDetail(id) {
|
||||
console.log(id);
|
||||
this.shopId = id;
|
||||
try {
|
||||
const res = await shopMerchantApi.get(id);
|
||||
this.form.appSecret = res.appSecret || "";
|
||||
this.form.payPassword = res.payPassword || "";
|
||||
this.form.status = res.status || "";
|
||||
this.form.appId = res.appId || "";
|
||||
this.form.wechatSmallAppid = res.wechatSmallAppid || "";
|
||||
this.form.alipaySmallAppid = res.alipaySmallAppid || "";
|
||||
this.form.merchantName = res.merchantName || "";
|
||||
//this.form.alipayAppToken = res.alipayAppToken
|
||||
//this.form.alipayAppId = res.alipayAppId
|
||||
this.form.storeId = res.storeId || "";
|
||||
this.dialogVisible = true;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
show(obj) {
|
||||
if (obj && obj.id) {
|
||||
this.form.id = obj.id;
|
||||
this.getDetail(obj.id);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
:deep(.el-dialog__header) {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,33 +19,42 @@
|
|||
<el-card shadow="never">
|
||||
<el-table v-loading="state.tableData.loading" :data="state.tableData.list">
|
||||
<el-table-column prop="status" label="ID" width="80" />
|
||||
<el-table-column label="店铺信息" width="200">
|
||||
<el-table-column label="店铺信息" >
|
||||
<template v-slot="scope">
|
||||
<div>{{ scope.row.shopName }}{{ scope.row.shopName }}</div>
|
||||
<div>{{ scope.row.shopName }}（{{ scope.row.shopName }}）</div>
|
||||
<div>账号：{{ scope.row.shopName }}</div>
|
||||
<div>联系电话：{{ scope.row.phone }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="商品同步">
|
||||
<el-table-column prop="status" label="商品同步" width="120">
|
||||
<template v-slot="scope">
|
||||
<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0" disabled />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="会员同步">
|
||||
<el-table-column prop="status" label="会员同步" width="120">
|
||||
<template v-slot="scope">
|
||||
<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0" disabled />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="耗材同步">
|
||||
<el-table-column prop="status" label="耗材同步" width="120">
|
||||
<template v-slot="scope">
|
||||
<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0" disabled />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createdAt" label="备注">
|
||||
<el-table-column prop="status" label="账号状态" width="120">
|
||||
<template v-slot="scope">
|
||||
<span v-if="scope.row.expireTime">
|
||||
{{ dayjs(scope.row.expireTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</span>
|
||||
<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0" disabled />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createdAt" label="备注" />
|
||||
<el-table-column label="操作" width="200">
|
||||
<template v-slot="scope">
|
||||
<el-button type="primary" size="small" link icon="edit" @click="handleSync(scope.row)">
|
||||
同步启用
|
||||
</el-button>
|
||||
<el-button type="primary" size="small" link icon="edit" @click="handleAccount(scope.row.id)">
|
||||
账号启用
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -108,6 +117,21 @@ async function getTableData() {
|
|||
console.log(error);
|
||||
}
|
||||
}
|
||||
function handleSync(e) {
|
||||
console.log(e)
|
||||
ElMessageBox.confirm(`同步功能开启后不能关闭，请确认是否给${e.shopName}开启同步?`, "提示", {
|
||||
confirmButtonText: "确认",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(async () => {
|
||||
const res = await ShopApi.delete({ id: row.id });
|
||||
ElMessage({
|
||||
type: "success",
|
||||
message: "同步成功",
|
||||
});
|
||||
getTableData();
|
||||
}).catch(() => { });
|
||||
}
|
||||
// 重置查询
|
||||
function resetHandle() {
|
||||
state.query.name = "";
|
||||
|
|
|
|||
Loading…
Reference in New Issue