commit
This commit is contained in:
@@ -1,193 +0,0 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.van-card {
|
||||
background: #ffffff;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.welfare_card {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.welfare_card .receive_img {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.van-card__thumb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 110px;
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
input[type="button"], input[type="submit"], input[type="reset"] {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
textarea {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
|
||||
color: rgb(24, 103, 176)
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: red;
|
||||
}
|
||||
|
||||
|
||||
.qrCodeImg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<m-page-loading v-if="mLoading"></m-page-loading>
|
||||
<van-nav-bar
|
||||
title="商超及购物网站"
|
||||
left-arrow
|
||||
placeholder
|
||||
fixed
|
||||
@click-left="window.history.back()">
|
||||
</van-nav-bar>
|
||||
|
||||
|
||||
<van-sticky>
|
||||
<van-tabs v-model="pageForm.tabName" @change="tabChange">
|
||||
<van-tab title="商超" name="商超"></van-tab>
|
||||
<van-tab title="购物网站" name="购物网站"></van-tab>
|
||||
</van-tabs>
|
||||
</van-sticky>
|
||||
|
||||
<van-list :finished="finished" :finished-text="tableData.length>0?'没有更多了':''"
|
||||
v-if="tableData && tableData.length>0"
|
||||
v-model="loading"
|
||||
@load="pageData">
|
||||
<template v-for="o in tableData">
|
||||
<div class="welfare_card">
|
||||
<van-card>
|
||||
<template #thumb>
|
||||
<img :src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+o.iconId" alt="" class="van-image__img"
|
||||
v-if="o.iconId">
|
||||
<image v-else src="/assets/mobile/svg/welfare/welfareHome.svg"></image>
|
||||
|
||||
</template>
|
||||
<template #title>
|
||||
<div class="van-ellipsis" style="font-size: 15px;font-weight: bold;flex: 3">{{o.shoppingName}}
|
||||
</div>
|
||||
<div class="van-ellipsis" style="float: right" v-if="o.qrCodeId">
|
||||
<van-button round type="info" size="mini" @click.stop="openQrCode(o.qrCodeId)"
|
||||
v-if="o.isEnable">查看二维码
|
||||
</van-button>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<template #desc>
|
||||
<div class="van-ellipsis" style="flex: 1">联系人：{{o.userName}}</div>
|
||||
<div class="van-ellipsis" style="flex: 1">联系方式：{{o.mobile}}</div>
|
||||
<div class="van-ellipsis" style="flex: 1">类型：{{o.typeName}}</div>
|
||||
<div class="van-ellipsis" style="flex: 1">网址：
|
||||
<template v-if="o.isEnable">
|
||||
<a v-if="o.link" :href="o.link">{{o.link}}</a>
|
||||
<template v-else>暂无</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
{{o.link}}
|
||||
</template>
|
||||
|
||||
</div>
|
||||
<div class="van-ellipsis" style="flex: 1">启用状态：{{o.isEnable?'已启用':'未启用'}}</div>
|
||||
</template>
|
||||
</van-card>
|
||||
<div class="receive_img">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</van-list>
|
||||
<van-empty v-else description="暂无数据"></van-empty>
|
||||
|
||||
|
||||
<van-dialog v-model="qrCodeDialog" confirm-button-color="#1989fa">
|
||||
<img class="qrCodeImg" :src="FILE_STREAM_PREVIEW_ADDRESS+'?id='+qrCodeId">
|
||||
</van-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [mobileMixins],
|
||||
data() {
|
||||
return {
|
||||
qrCodeId: null,
|
||||
qrCodeDialog: false,
|
||||
tabName: "商超"
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openQrCode(id) {
|
||||
this.qrCodeId = id
|
||||
|
||||
this.qrCodeDialog = true
|
||||
|
||||
},
|
||||
async pageData() {
|
||||
this.mLoading = true
|
||||
this.pageForm.typeName = JSON.stringify([this.tabName])
|
||||
const resp = await $.post('/platform/shoppingType/apply/pageData', this.pageForm)
|
||||
if (resp.code === 0) {
|
||||
if (resp.data.list.length === 0) {
|
||||
this.tableData = []
|
||||
this.loading = false
|
||||
this.finished = true
|
||||
} else {
|
||||
resp.data.list.forEach(v => {
|
||||
if (v.qrCode) v.qrCodeId = JSON.parse(v.qrCode)[0].id
|
||||
if (v.icon) v.iconId = JSON.parse(v.icon)[0].id
|
||||
})
|
||||
this.tableData = this.tableData.concat(resp.data.list)
|
||||
}
|
||||
if (this.tableData.length === resp.data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
}
|
||||
this.loading = false;
|
||||
this.mLoading = false
|
||||
},
|
||||
tabChange(val) {
|
||||
this.tabName = val
|
||||
this.pageData()
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.startLoading()
|
||||
this.pageData()
|
||||
this.closeLoading()
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -1,428 +0,0 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<div class="platform" id="app" v-cloak>
|
||||
|
||||
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<div class="search">
|
||||
<div class="search-item">
|
||||
<div class="search-item-label">年  度：</div>
|
||||
<div class="search-item-option">
|
||||
<el-date-picker
|
||||
@change="doSearch"
|
||||
placeholder="选择年"
|
||||
style="width: 100%"
|
||||
type="year" v-model="pageForm.year"
|
||||
value-format="yyyy">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="search-item">
|
||||
<div class="search-item-label">名称：</div>
|
||||
<div class="search-item-option">
|
||||
<el-input placeholder="请输入名称" v-model="pageForm.shoppingName" clearable
|
||||
@keyup.enter.native="doSearch()">
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="search-item">
|
||||
<div class="search-item-label">类型：</div>
|
||||
<div class="search-item-option">
|
||||
<el-checkbox-group v-model="pageForm.typeName" max="1">
|
||||
<el-checkbox-button label="商超" key="商超">商  超
|
||||
</el-checkbox-button>
|
||||
<el-checkbox-button label="购物网站" key="购物网站">购物网站
|
||||
</el-checkbox-button>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="search-query">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch">搜索
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
<el-card class="mt10" shadow="never">
|
||||
<table-tool :app="this" label="商超和购物网站">
|
||||
<template #func>
|
||||
<el-button @click="openAdd" type="primary">新建
|
||||
</el-button>
|
||||
</template>
|
||||
</table-tool>
|
||||
|
||||
|
||||
<el-table :data="tableData" :size="tableSize"
|
||||
@sort-change="pageOrder"
|
||||
class="vi-table" row-key="id" style="width: 100%;margin-bottom: 20px"
|
||||
v-loading="tableLoading">
|
||||
|
||||
<el-table-column :index="indexMethod" align="center" header-align="center"
|
||||
label="序号" type="index"
|
||||
width="80px"></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns">
|
||||
|
||||
|
||||
<template scope="{row}" v-if="column.prop=='link'">
|
||||
<el-link @click="openLink(row.link)" type="primary">{{row.link}}
|
||||
</el-link>
|
||||
</template>
|
||||
<template scope="{row}" v-else-if="column.prop=='qrCode'">
|
||||
<el-image
|
||||
:src="APP_DOMAIN+'/file_server/fileStreamPreview?id='+row.qrCodeId"
|
||||
:preview-src-list="[APP_DOMAIN+'/file_server/fileStreamPreview?id='+row.qrCodeId]"
|
||||
v-if="row.qrCodeId">
|
||||
</el-image>
|
||||
<template v-else>暂无</template>
|
||||
|
||||
</template>
|
||||
<template scope="{row}" v-else-if="column.prop=='isEnable'">
|
||||
<el-switch v-model="row.isEnable"
|
||||
@change="isEnableChange(row.isEnable,row.id)"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" header-align="center" label="操作"
|
||||
prop="userOnline" width="300px">
|
||||
<template scope="{row}">
|
||||
|
||||
<el-button size="mini" type="primary" plain @click="openView(row)">
|
||||
查看
|
||||
</el-button>
|
||||
|
||||
<el-button size="mini" type="primary" @click="openEdit(row)">
|
||||
编辑
|
||||
</el-button>
|
||||
|
||||
<el-button size="mini" type="danger" @click="doDelete(row.id)">
|
||||
删除
|
||||
</el-button>
|
||||
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<template #view>
|
||||
<el-form :model="formData" label-position="right" label-suffix="："
|
||||
label-width="130px" :rules="rules">
|
||||
<el-row :gutter="60">
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="年度">
|
||||
{{viewData.year}}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称">
|
||||
{{viewData.shoppingName}}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系人">
|
||||
{{viewData.userName?viewData.userName:'暂无'}}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系方式">
|
||||
{{viewData.mobile?viewData.mobile:'暂无'}}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="类型">
|
||||
{{viewData.typeName?viewData.typeName:'暂无'}}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="网址">
|
||||
<el-link @click="openLink(viewData.link)" type="primary"
|
||||
v-if="viewData.link">
|
||||
{{viewData.link}}
|
||||
</el-link>
|
||||
<template v-else></template>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="简介">
|
||||
{{viewData.简介?viewData.简介:'暂无'}}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="图标">
|
||||
<file-upload :files.sync="viewData.icon" view></file-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="二维码">
|
||||
<file-upload :files.sync="viewData.qrCode" view></file-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
|
||||
<el-form :model="formData" label-position="right" label-suffix="："
|
||||
label-width="130px" :rules="rules" ref="addForm">
|
||||
<el-row :gutter="60">
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="年度" prop="year">
|
||||
<el-input v-model="formData.year" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称" prop="shoppingName">
|
||||
<el-input placeholder="请输入名称"
|
||||
v-model="formData.shoppingName"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系人" prop="userName">
|
||||
<el-input placeholder="请输入名称" v-model="formData.userName"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系方式" prop="mobile">
|
||||
<el-input placeholder="请输入联系方式" v-model="formData.mobile"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="类型" prop="typeName">
|
||||
<el-select v-model="formData.typeName" style="width: 100%"
|
||||
placeholder="请选择类型">
|
||||
<el-option label="商超" value="商超"></el-option>
|
||||
<el-option label="购物网站" value="购物网站"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="网址" prop="link">
|
||||
<el-input placeholder="请输入网址" v-model="formData.link"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="简介" prop="brief">
|
||||
<el-input type="textarea" placeholder="请输入简介"
|
||||
v-model="formData.brief"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="图标" prop="icon">
|
||||
<file-upload card :files.sync="formData.icon" :max="1"
|
||||
:type="['jpg', 'jpeg', 'png']">
|
||||
<template #el-upload__tip>
|
||||
<span style="color: red">
|
||||
只能上传jpg,jpeg,png格式的一张图片
|
||||
</span>
|
||||
</template>
|
||||
</file-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="二维码" prop="qrCode">
|
||||
<file-upload card :files.sync="formData.qrCode" :max="1"
|
||||
:type="['jpg', 'jpeg', 'png','webp']">
|
||||
<template #el-upload__tip>
|
||||
<span style="color: red">
|
||||
只能上传jpg,jpeg,png,webp格式的一张图片
|
||||
</span>
|
||||
</template>
|
||||
</file-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button type="primary" @click="submit()">确 定</el-button>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
</guava>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
viewData: {},
|
||||
pageForm: {
|
||||
typeName: [],
|
||||
year: new Date().getFullYear() + ''
|
||||
},
|
||||
formData: {
|
||||
year: new Date().getFullYear() + '',
|
||||
shoppingName: null,
|
||||
userName: null,
|
||||
mobile: null,
|
||||
typeName: null,
|
||||
link: null,
|
||||
brief: null,
|
||||
},
|
||||
tableColumns: [
|
||||
{prop: 'year', label: '年度', sortable: true},
|
||||
{prop: 'shoppingName', label: '名称', sortable: true},
|
||||
{prop: 'userName', label: '联系人', sortable: true},
|
||||
{prop: 'mobile', label: '联系方式'},
|
||||
{prop: 'typeName', label: '类型', sortable: true},
|
||||
{prop: 'qrCode', label: '二维码',},
|
||||
{prop: 'link', label: '网址',},
|
||||
{prop: 'isEnable', label: '启用状态', sortable: true},
|
||||
],
|
||||
rules: {
|
||||
year: [{required: true, message: '必填', trigger: ['change', 'blur']}],
|
||||
shoppingName: [{required: true, message: '必填', trigger: ['change', 'blur']}],
|
||||
typeName: [{required: true, message: '必填', trigger: ['change', 'blur']}],
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openView(row) {
|
||||
this.viewData = row
|
||||
this.$refs.guava.view()
|
||||
},
|
||||
doDelete(id) {
|
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const resp = await $.post(loc() + "/doDelete", {id: id})
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
}
|
||||
this.doSearch()
|
||||
})
|
||||
},
|
||||
openLink(url) {
|
||||
window.open(url)
|
||||
},
|
||||
async isEnableChange(val, id) {
|
||||
const resp = await $.post(loc() + "/isEnableChange", {isEnable: val, id: id})
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
}
|
||||
this.doSearch()
|
||||
},
|
||||
openAdd() {
|
||||
this.formData = {
|
||||
year: new Date().getFullYear() + '',
|
||||
shoppingName: null,
|
||||
userName: null,
|
||||
mobile: null,
|
||||
typeName: null,
|
||||
link: null,
|
||||
brief: null,
|
||||
}
|
||||
this.$refs.guava.edit()
|
||||
if (this.$refs['addForm']) {
|
||||
this.$refs['addForm'].resetFields();
|
||||
}
|
||||
|
||||
},
|
||||
openEdit(row) {
|
||||
this.formData = {}
|
||||
this.formData = row
|
||||
this.$refs.guava.edit()
|
||||
},
|
||||
async submit() {
|
||||
this.$refs["addForm"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
const resp = await $.post(loc() + "/submit", {shoppingType: JSON.stringify(this.formData)})
|
||||
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
}
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
}
|
||||
})
|
||||
},
|
||||
pageData() {
|
||||
sublime.showLoadingbar();
|
||||
this.tableLoading = true
|
||||
const pageForm = clone(this.pageForm)
|
||||
pageForm.typeName = JSON.stringify(pageForm.typeName)
|
||||
$.post(loc() + "/pageData", pageForm, (data) => {
|
||||
sublime.closeLoadingbar();
|
||||
this.tableLoading = false
|
||||
if (data.code == 0) {
|
||||
data.data.list.forEach(v => {
|
||||
if (v.qrCode) v.qrCodeId = JSON.parse(v.qrCode)[0].id
|
||||
if (v.qrCode) v.qrCode = JSON.parse(v.qrCode)
|
||||
if (v.icon) v.icon = JSON.parse(v.icon)
|
||||
})
|
||||
this.tableData = data.data.list;
|
||||
this.pageForm.totalCount = data.data.totalCount;
|
||||
} else {
|
||||
this.$message.error(data.msg);
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user