Skip to content

S
smart_gov_platform
Commit fe38ec24 authored by “yiyousong”'s avatar “yiyousong”
Browse files
Options

feat: 添加站点风采

parent c1a916f0
Show whitespace changes
Inline Side-by-side
Showing with 537 additions and 138 deletions
base-manager-ui/admin/src/components/YTable.vue 0 → 100644
View file @ fe38ec24
<template>
<a-table
:columns="columns"
:data-source="data"
:bordered="bordered"
:defaultExpandAllRows="DefaultExpandAllRows"
:expandRowByClick="ExpandRowByClick"
:showHeader="ShowHeader"
:pagination="Pagination"
:rowKey="rowKey"
@change="handleTableChange"
v-bind="$attrs"
v-on="$listeners"
>
<template
slot-scope="text, record, index"
:slot="slot"
v-for="slot in Object.keys($scopedSlots).filter(
(key) => key !== 'expandedRowRender'
)"
>
<slot :name="slot" v-bind="{ text, record, index }"></slot>
</template>
<template :slot="slot" v-for="slot in Object.keys($slots)">
<slot :name="slot"></slot>
</template>
<template
slot-scope="record, index, indent, expanded"
:slot="$scopedSlots.expandedRowRender ? 'expandedRowRender' : ''"
>
<slot
v-bind="{ record, index, indent, expanded }"
:name="$scopedSlots.expandedRowRender ? 'expandedRowRender' : ''"
></slot>
</template>
</a-table>
</template>
<script>
import { pageSizeOptions } from "@/config/pageConfig.js";
export default {
props: {
columns: {
required: true,
type: Array,
default: () => [],
},
data: {
required: true,
type: Array,
default: () => [],
},
pageSize: {
required: true,
type: Number,
default: 10,
},
page: {
required: true,
type: Number,
default: 1,
},
total: {
required: true,
type: Number,
default: 0,
},
bordered: {
type: Boolean,
default: true,
},
defaultExpandAllRows: {
type: Boolean,
default: false,
},
expandRowByClick: {
type: Boolean,
default: false,
},
showHeader: {
type: Boolean,
default: true,
},
rowKey: {
type: [String, Function],
default: "id",
},
pagination: {
type: Object,
default: () => {},
},
pageSizeOptions: {
type: Array,
default: () => pageSizeOptions,
},
},
data() {
return {};
},
computed: {
Bordered() {
return !!this.bordered;
},
DefaultExpandAllRows() {
return !!this.defaultExpandAllRows;
},
ExpandRowByClick() {
return !!this.expandRowByClick;
},
ShowHeader() {
return !!this.showHeader;
},
PageSize: {
get() {
return this.pageSize;
},
set(value) {
this.$emit("update:pageSize", value);
},
},
Current: {
get() {
return this.page;
},
set(value) {
this.$emit("update:page", value);
},
},
Pagination() {
return {
showTotal: (total) => `共 ${total} 条`,
total: this.total,
current: this.Current,
pageSize: this.pageSize,
showSizeChanger: true,
showQuickJumper: true,
pageSizeOptions: this.pageSizeOptions,
...this.pagination,
};
},
},
methods: {
handleTableChange(pagination, filters, sorter, { currentDataSource }) {
let { current, pageSize } = pagination;
this.Current = current;
this.PageSize = pageSize;
if (this.$listeners.changePagination) {
this.$listeners.changePagination();
}
this.$emit("change", pagination, filters, sorter, { currentDataSource });
},
},
};
</script>
<style lang="less" scoped></style>
base-manager-ui/admin/src/components/YUpload.vue 0 → 100644
View file @ fe38ec24
<template>
<div class="y-upload">
<a-upload
v-if="listType == 'text' || listType == 'picture'"
:name="name"
:listType="listType"
:multiple="multiple"
:action="action"
:accept="accept"
:beforeUpload="beforeUpload"
:file-list="FileList"
v-bind="$attrs"
v-on="$listeners"
@change="handleChange"
@preview="handlePreview"
>
<slot>
<a-button type="primary"> <a-icon type="upload" />点击上传</a-button>
</slot>
</a-upload>
<a-upload
v-else-if="listType == 'picture-card'"
:name="name"
:listType="listType"
:multiple="multiple"
:action="action"
:accept="accept"
:beforeUpload="beforeUpload"
:file-list="FileList"
v-bind="$attrs"
v-on="$listeners"
@change="handleChange"
@preview="handlePreview"
>
<slot>
<div>
<a-icon type="plus" />
<div class="ant-upload-text">点击上传</div>
</div>
</slot>
</a-upload>
<!-- 视频、音频预览 -->
<div class="modal" v-if="previewVisible">
<video
v-if="previewData.type == 'video'"
:src="previewData.url"
autoplay
muted
controls
></video>
<audio
v-if="previewData.type == 'audio'"
:src="previewData.url"
autoplay
controls
></audio>
<a-icon type="close-circle" @click="previewVisible = false" />
</div>
</div>
</template>
<script>
// import { uploadFile } from "@/services/user";
export default {
model: {
prop: "value",
event: "onChange",
},
components: {},
props: {
name: {
type: String,
default: "file",
},
listType: {
type: String,
default: "text",
},
multiple: {
type: Boolean,
default: false,
},
value: {
type: [String, Array],
default: "",
},
// 文件限制
accept: {
type: String,
default: "",
},
// 上传数量
limit: {
type: Number,
validator: (value) => {
return value >= 0;
},
default: 1, // 0为不限制
},
// 上传文件大小限制mb 0为不限制
MB: {
type: Number,
validator: (value) => {
return value >= 0;
},
default: 10,
},
action: {
type: String,
default: "/base/file/commonupload",
},
},
data() {
return {
FileList: [],
imageType: ["png", "jpg", "jpeg", "gif", "svg"],
videoType: ["mp4", "avi", "wmv", "rmvb", "flv", "mkv"],
audioType: [
"mp3",
"wav",
"amr",
"aac",
"ogg",
"wma",
"flac",
"ape",
"mid",
"m4a",
"m4r",
"m4p",
"m4b",
],
previewData: {
type: "",
url: "",
},
previewVisible: false,
};
},
watch: {
value: {
handler(newValue) {
if (newValue) {
if (Array.isArray(newValue)) {
this.FileList = newValue.map((v) => {
let index = v.lastIndexOf("/");
let name = v.slice(index + 1);
return {
uid: v,
name,
status: "done",
url: v,
};
});
} else {
this.FileList = newValue.split(",").map((v) => {
let index = v.lastIndexOf("/");
let name = v.slice(index + 1);
return {
uid: v,
name,
status: "done",
url: v,
};
});
}
} else {
this.FileList = [];
}
},
deep: true,
immediate: true,
},
},
computed: {},
created() {},
methods: {
customRequest() {
console.log(arguments);
},
handleChange({ file, fileList }) {
this.FileList = [...fileList];
if (file.status == "done" || file.status == "removed") {
if (file.response && file.response.code == -1) {
this.$message.error(file.response.msg);
fileList = fileList.filter((file) => file.response.code != -1);
}
if (this.limit) {
this.FileList = [...fileList].slice(-this.limit);
}
this.FileList = this.FileList.map((v) => {
if (v.response) {
v.url = v.response.url;
}
return v;
});
let value;
if (Array.isArray(this.value)) {
value = this.FileList.map((v) => v.url);
} else {
value = this.FileList.map((v) => v.url).join(",");
}
this.$emit("onChange", value);
this.$emit("onSuccess", { file, fileList });
}
},
beforeUpload(file) {
let isType = true;
let isExceed = true;
return new Promise((resolve) => {
if (this.accept) {
const fileType = this.accept.split(","); // 限制文件类型
let index = file.name.lastIndexOf(".");
let type = file.name.slice(index);
isType = fileType.includes(type);
}
if (!isType) {
let msg = this.accept.replaceAll(",", "或者");
this.$message.error(`请上传${msg}文件!`);
}
if (this.MB) {
isExceed = file.size / 1024 / 1024 <= this.MB;
}
if (!isExceed) {
this.$message.error(`文件大小不能超过${this.MB}MB!`);
}
if (isType && isExceed) {
resolve(file);
}
});
},
// 预览
handlePreview(file) {
let { url } = file;
if (!url) return;
let index = url.lastIndexOf(".");
let type = url.slice(index + 1);
if (this.imageType.includes(type)) {
this.$viewerApi({
images: [url],
});
} else if (this.videoType.includes(type)) {
this.previewData.type = "video";
this.previewData.url = url;
this.previewVisible = true;
} else if (this.audioType.includes(type)) {
this.previewData.type = "audio";
this.previewData.url = url;
this.previewVisible = true;
} else {
let a = document.createElement("a");
a.href = url;
a.download = file.name;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
},
handleDownload(file) {
console.log(file);
},
},
};
</script>
<style lang="less" scoped>
/deep/.ant-upload-picture-card-wrapper {
display: flex;
flex-wrap: wrap;
}
.modal {
width: 100%;
height: 100%;
position: fixed;
left: 0px;
top: 0px;
background: rgba(0, 0, 0, 0.5);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
z-index: 999;
video {
height: 400px;
}
.anticon-close-circle {
font-size: 36px;
color: #fff;
cursor: pointer;
}
}
</style>
base-manager-ui/admin/src/components/ycheckbox/YCheckbox.vue
View file @ fe38ec24
<template>
<div>
<a-checkbox :checked="value" @change="onChange">
{{ checkText }}</a-checkbox
>
<slot></slot>
</a-checkbox>
</div>
</template>
......@@ -16,10 +16,6 @@ export default {
checked: {
required: true,
},
checkText: {
required: true,
default: "",
},
},
computed: {
value() {
......@@ -34,5 +30,4 @@ export default {
};
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
<style lang="less" scoped></style>
base-manager-ui/admin/src/pages/basicset/site/components/addsite.vue
View file @ fe38ec24
......@@ -181,19 +181,22 @@
</a-col>
<a-col :span="24">
<a-form-model-item label="中心Logo" prop="logoPath">
<a-upload
:action="api + 'base/file/commonupload'"
list-type="picture-card"
:file-list="fileList"
@preview="handlePreview"
@change="handleChange"
:accept="accept"
>
<div v-if="fileList.length < 1">
<a-icon type="plus" />
<div class="ant-upload-text">上传图片</div>
</div>
</a-upload>
<YUpload
accept=".png,.jpg,.jpeg,.svg"
:limit="1"
v-model="formInfo.logoPath"
listType="picture-card"
></YUpload>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item class="site-style" label="站点风貌" prop="govAffairStyle">
<YUpload
accept=".png,.jpg,.jpeg,.svg"
:limit="0"
v-model="formInfo.govAffairStyle"
listType="picture-card"
></YUpload>
</a-form-model-item>
</a-col>
</a-row>
......@@ -237,33 +240,12 @@
</a-row>
<a-form-model-item label="工作日">
<y-checkbox
v-model="formInfo.workday1"
checkText="星期一"
></y-checkbox>
<y-checkbox
v-model="formInfo.workday2"
checkText="星期二"
></y-checkbox>
<y-checkbox
v-model="formInfo.workday3"
checkText="星期三"
></y-checkbox>
<y-checkbox
v-model="formInfo.workday4"
checkText="星期四"
></y-checkbox>
<y-checkbox
v-model="formInfo.workday5"
checkText="星期五"
></y-checkbox>
<y-checkbox
v-model="formInfo.workday6"
checkText="星期六"
></y-checkbox>
<y-checkbox
v-model="formInfo.workday7"
checkText="星期天"
></y-checkbox>
v-model="formInfo[key]"
v-for="(v, key) in workday"
:key="key"
>
{{ v }}
</y-checkbox>
</a-form-model-item>
<a-row>
<a-col :span="4">
......@@ -306,9 +288,19 @@
import { modelList, siteSave } from "@/services/basicsetFun";
import YCheckbox from "@/components/ycheckbox/YCheckbox.vue";
import YSwitch from "@/components/yswitch/YSwitch.vue";
import YUpload from "@/components/YUpload.vue";
// import options from "@/utils/city";
import { regionData } from "element-china-area-data";
import { checkPort, checkIp } from "@/utils/validate";
const workday = {
workday1: "星期一",
workday2: "星期二",
workday3: "星期三",
workday4: "星期四",
workday5: "星期五",
workday6: "星期六",
workday7: "星期天",
};
export default {
props: {
formVisible: {
......@@ -323,6 +315,7 @@ export default {
components: {
YCheckbox,
YSwitch,
YUpload,
},
data() {
// 验证手机号码
......@@ -336,17 +329,8 @@ export default {
callback();
}
};
// const changeLandline = (rule, value, callback) => {
// if (!value) {
// callback(new Error("请输入中心座机号"));
// callback();
// } else if (!/^[0][1-9]{2,3}-[0-9]{5,10}$/.test(value)) {
// callback(new Error("格式：区号-电话号码"));
// } else {
// callback();
// }
// };
return {
workday,
api: process.env.VUE_APP_API_BASE_URL + "/",
accept: "image/jpeg,image/png", // 上传类型
loading: false,
......@@ -396,10 +380,10 @@ export default {
onlineTake: 0, // 在线取号
appointment: 0, // 微预约
gowMap: 0, // 政务地图
govAffairStyle:'', // 站点风貌
}, //表单提交数据
indeterminate: true,
checkAll: false,
fileList: [],
formRules: {
siteName: [
{
......@@ -595,14 +579,12 @@ export default {
},
//重置
resetForm() {
this.fileList = [];
this.cityData = [];
this.$refs.ruleForm.resetFields();
},
// 关闭对话框
closeModal() {
this.fileList = [];
this.$refs.ruleForm.resetFields();
this.resetForm();
this.Visible = false;
},
// 新增
......@@ -614,30 +596,43 @@ export default {
// 编辑
onEdit(data) {
this.$nextTick(() => {
this.formInfo = { ...data };
this.areaInfo.areaID = this.formInfo.areaID;
this.areaInfo.areaCode = this.formInfo.areaCode;
this.areaInfo.areaName = this.formInfo.areaName;
this.cityData = [
this.formInfo.proCode,
this.formInfo.cityCode,
this.formInfo.districtCode,
];
this.formInfo.modelIds = this.formInfo.modelIds.map(Number);
this.formInfo.amWorkStartTime = String(this.formInfo.amWorkStartTime);
this.formInfo.amWorkEndTime = String(this.formInfo.amWorkEndTime);
this.formInfo.pmWorkStartTime = String(this.formInfo.pmWorkStartTime);
this.formInfo.pmWorkEndTime = String(this.formInfo.pmWorkEndTime);
if (this.formInfo.logoPath) {
this.fileList = [
{
uid: -1,
status: "done",
name: this.formInfo.logoPath,
url: this.formInfo.logoPath,
},
];
let {
areaID,
areaCode,
areaName,
proCode,
cityCode,
districtCode,
modelIds,
amWorkStartTime,
amWorkEndTime,
pmWorkStartTime,
pmWorkEndTime,
} = (this.formInfo = data);
this.areaInfo.areaID = areaID;
this.areaInfo.areaCode = areaCode;
this.areaInfo.areaName = areaName;
this.cityData = [proCode, cityCode, districtCode];
if (modelIds) {
this.formInfo.modelIds = modelIds && modelIds.map(Number);
}
[
this.formInfo.amWorkStartTime,
this.formInfo.amWorkEndTime,
this.formInfo.pmWorkStartTime,
this.formInfo.pmWorkEndTime,
] = [
amWorkStartTime,
amWorkEndTime,
pmWorkStartTime,
pmWorkEndTime,
].map((v) => {
if (v) {
return String(v);
} else {
return "";
}
});
});
},
// 保存
......@@ -658,68 +653,20 @@ export default {
this.loading = false;
if (code === 1) {
this.$message.success(msg);
this.fileList = [];
this.Visible = false;
this.closeModal();
this.$parent.getSiteList({ areaID: this.areaInfo.areaID });
}
}
});
},
// 上传限制
beforeUpload(file) {
const isJpgOrPng =
file.type === "image/jpeg" || file.type === "image/png";
if (!isJpgOrPng) {
this.$message.error("请上传jpeg或者png图片!");
}
const isLt10M = file.size / 1024 / 1024 < 10;
if (!isLt10M) {
this.$message.error("图片大小不能超过10MB!");
}
return isJpgOrPng && isLt10M;
},
// 上传图片
handleChange({ file, fileList }) {
if (
file.status &&
file.status != "removed" &&
file.response &&
file.response.code == -1
) {
this.$message.error(file.response.msg);
fileList = fileList.filter((file) => file.response.code != -1);
}
this.fileList = [...fileList].slice(-1);
this.fileList = this.fileList.map((v) => {
if (v.response) {
v.url = v.response.url;
}
return v;
});
if (this.fileList[0]) {
this.formInfo.logoPath = this.fileList[0].url;
} else {
this.formInfo.logoPath = "";
}
// if (info.file.status === "uploading") {
// this.loading = true;
// return;
// }
// if (info.file.status === "done") {
// this.formInfo.logoPath = info.file.response.url;
// this.loading = false;
// }
},
// 预览logo
handlePreview(info) {
this.$viewerApi({
images: [info.url],
});
},
// 删除logo
// handleRemove() {
// this.formInfo.logoPath = "";
// },
// 地址
oncityChange(val) {
[
......@@ -728,6 +675,7 @@ export default {
this.formInfo.districtCode,
] = val;
},
// 获取详细地址经纬度
getAddress(address) {
this.$refs.ruleForm.validateField("detailAddress", (errVal) => {
if (errVal !== "中心详细地址不能为空") {
......@@ -833,4 +781,5 @@ export default {
margin-bottom: 6px;
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment