<template>
|
<div class="page_status">
|
<v-header
|
title="商品管理"
|
:bar="bar"
|
search
|
@on-search="onSearch"
|
></v-header>
|
<div class="add" v-if="!storeId">
|
<el-button
|
type="primary"
|
size="small"
|
@click="
|
$router.push({
|
path: '/jh_lovePointsStoreAdd',
|
query: { id: 10 }
|
})
|
"
|
>新增</el-button
|
>
|
<el-button type="primary" size="small" @click="setTime()"
|
>设置兑换时间和地点</el-button
|
>
|
</div>
|
<div class="tab">
|
<v-tool-table :trs="trs" :tds="tds">
|
<template v-slot:btn="item">
|
<div class="table_flex">
|
<!-- {{item.scope.id}} -->
|
<span
|
class="col_primary"
|
v-if="item.scope.goodType == 1"
|
@click="onSaveTop(0, item.scope)"
|
>下架</span
|
>
|
<span class="col_primary" v-else @click="onSaveTop(1, item.scope)"
|
>上架</span
|
>
|
<span class="col_primary" @click="onEdit(item.scope.id)">编辑</span>
|
<span class="col_primary" @click="onDel(item.scope.id)">删除</span>
|
</div>
|
</template>
|
<template v-slot:state="item">
|
<b>{{ ["下架", "上架"][item.scope.goodType] || "无" }}</b>
|
</template>
|
<template v-slot:coverImgUrl="item">
|
<el-image
|
:src="item.scope.coverImgUrl"
|
style="width: 100px;"
|
:fit="fill"
|
:preview-src-list="[item.scope.coverImgUrl]"
|
></el-image>
|
</template>
|
</v-tool-table>
|
</div>
|
<v-tool-page :item="paged" @on-page="onPage"></v-tool-page>
|
|
<el-dialog
|
title="兑换地址"
|
:visible.sync="dialogVisibleMap"
|
:before-close="handleCloseMap"
|
append-to-body
|
>
|
<MapBox ref="mapContent" @setLocation="setLocation" />
|
|
<div class="radioBox mr-t-20">
|
<div class="radioBox_title">兑换时间</div>
|
<div>
|
<el-radio v-model="businessType" label="1">每天</el-radio>
|
<el-radio v-model="businessType" label="2">周一~周五</el-radio>
|
<el-radio v-model="businessType" label="3">周六周日</el-radio>
|
</div>
|
</div>
|
|
<div class="time mr-t-20">
|
<el-time-picker
|
v-model="businessStartTime"
|
placeholder="开始时间"
|
value-format="HH:mm:ss"
|
format="HH:mm:ss"
|
>
|
</el-time-picker>
|
<el-time-picker
|
arrow-control
|
v-model="businessEndTime"
|
placeholder="结束时间"
|
value-format="HH:mm:ss"
|
format="HH:mm:ss"
|
>
|
</el-time-picker>
|
</div>
|
|
<div style="text-align: center; margin-top: 20px">
|
<el-button @click="handleCloseMap">取 消</el-button>
|
<el-button type="primary" @click="mapComfirm">确 定</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { mapState } from "vuex";
|
import MapBox from "../../../components/map/map.vue";
|
|
export default {
|
props: {},
|
components: { MapBox },
|
data() {
|
return {
|
bar: [
|
{ title: "商品名称", name: "goodName" },
|
{
|
title: "商品状态",
|
name: "goodType",
|
type: "select",
|
list: [
|
{ label: "上架", value: "1" },
|
{ label: "下架", value: "0" }
|
]
|
}
|
],
|
trs: [
|
{ text: "商品ID", val: "id", width: "50px" },
|
{ text: "商品名称", val: "goodName" },
|
{ text: "商品图片", val: "btn", slot: "coverImgUrl" },
|
{ text: "商品价格(金汇币)", val: "goodPrice" },
|
{ text: "商品状态", val: "btn", slot: "state" },
|
{ text: "操作", val: "btn" }
|
],
|
tds: [],
|
paged: { page: 0, total: 0, r: 0, limit: 10 },
|
os: {},
|
search: {},
|
dialogVisibleMap: false,
|
positionData: {},
|
radioList: [
|
{ label: "每天", value: "每天" },
|
{ label: "周一~周五", value: "周一~周五" },
|
{ label: "周六周日", value: "周六周日" }
|
],
|
exchangeDay: "",
|
address: "",
|
lat: "",
|
lng: "",
|
beginTime: "",
|
endTime: "",
|
storeId: "",
|
businessType: "",
|
businessStartTime: "",
|
businessEndTime: "",
|
systemInfo: {}
|
};
|
},
|
computed: {
|
...mapState({ vuex_page: "pageReset" })
|
},
|
watch: {
|
vuex_page: {
|
handler(n) {
|
if (n.page === this.$route.path) {
|
this.paged.page = 1;
|
this.init();
|
}
|
},
|
deep: true
|
}
|
},
|
methods: {
|
// 置顶
|
onSaveTop(isTopping, v) {
|
this.$api.post(
|
"Jinhui/shoppingUpAndDown",
|
{ id: v.id, goodType: isTopping },
|
() => {
|
demo.toast("操作成功");
|
this.init();
|
}
|
);
|
},
|
onSearch(v) {
|
this.search = demo.copy(v);
|
delete this.search.time;
|
this.paged.page = 1;
|
this.init();
|
},
|
// 分页点击
|
onPage(v) {
|
if (v.page === this.paged.page && v.page && !v.reset) {
|
return 0;
|
}
|
this.paged.page = v.page;
|
this.paged.limit = v.limit;
|
this.init();
|
},
|
// 获取数据
|
init() {
|
let v = demo.copy(
|
Object.assign(this.os, this.search, {
|
pageNum: this.paged.page,
|
pageSize: this.paged.limit
|
})
|
);
|
this.$api.get("Jinhui/shoppingGetList", v, e => {
|
this.paged.total = e.total;
|
this.paged.r++;
|
this.tds = e.records || [];
|
e.records.map((item, index) => {
|
item.index = (this.paged.page - 1) * this.paged.limit + index + 1;
|
});
|
});
|
},
|
onEdit(id) {
|
this.$router.push({
|
path: "/jh_lovePointsStoreEdit",
|
query: { id: "10", type: id }
|
});
|
},
|
onDel(id) {
|
this.$js.model("", "是否删除", res => {
|
if (res) {
|
this.$api.del("Jinhui/shoppingExpurgateData?id=" + id, {}, () => {
|
demo.toast("删除成功");
|
this.init();
|
});
|
}
|
});
|
},
|
|
handleCloseMap() {
|
this.dialogVisibleMap = false;
|
this.positionData = {};
|
this.address = this.systemInfo.address;
|
this.lat = this.systemInfo.lat;
|
this.lng = this.systemInfo.lng;
|
this.businessStartTime = this.systemInfo.businessStartTime;
|
this.businessEndTime = this.systemInfo.businessEndTime;
|
this.businessType = this.systemInfo.businessType;
|
},
|
setLocation(data) {
|
console.log(data);
|
this.positionData = data;
|
},
|
setTime() {
|
let that = this;
|
this.dialogVisibleMap = true;
|
this.$nextTick(() => {
|
that.$refs.mapContent.getLocation({
|
val: that.address,
|
l: that.lat,
|
r: that.lng
|
});
|
});
|
},
|
mapComfirm() {
|
this.insertvo();
|
},
|
getLocationAndAdress() {
|
// VolunteerMerchant/Community/Config/getData
|
let user = demo.$session.get("user") || {};
|
let communityId = "";
|
if (user.communityId) {
|
communityId = user.communityId;
|
}
|
this.$api.get("Jinhui/configGetDetails", { communityId }, e => {
|
this.systemInfo = e;
|
this.address = e.address;
|
this.lat = e.lat;
|
this.lng = e.lng;
|
this.businessStartTime = e.businessStartTime;
|
this.businessEndTime = e.businessEndTime;
|
this.businessType = e.businessType;
|
});
|
},
|
insertvo() {
|
let user = demo.$session.get("user") || {};
|
let communityId = "";
|
if (user.communityId) {
|
communityId = user.communityId;
|
}
|
let p = {
|
communityId,
|
address: this.positionData.addr,
|
lat: this.positionData.lat,
|
lng: this.positionData.lng,
|
businessStartTime: this.businessStartTime,
|
businessEndTime: this.businessEndTime,
|
businessType: this.businessType
|
};
|
if (this.systemInfo) {
|
p.id = this.systemInfo.id;
|
}
|
|
this.$api.post("Jinhui/configAddData", p, e => {
|
// this.systemInfo = e;
|
demo.toast("设置成功");
|
this.handleCloseMap();
|
});
|
}
|
},
|
mounted() {
|
//查询动态分类列表
|
this.storeId = this.$route.query.id;
|
this.getLocationAndAdress();
|
}
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.page_status {
|
overflow-y: auto;
|
.add,
|
.tab {
|
margin-bottom: 10px;
|
}
|
}
|
.radioBox {
|
display: flex;
|
justify-content: flex-start;
|
align-items: center;
|
.radioBox_title {
|
margin-right: 20px;
|
}
|
}
|
</style>
|
