maojiacai/ba_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

'保安项目提交'

Browse Source
This commit is contained in:
esacpe
2025-09-22 09:01:41 +08:00
commit 21e2a12e3c
1439 changed files with 336271 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
src/components/Breadcrumb/index.vue Normal file
View File

@ -0,0 +1,67 @@
<template>
<el-breadcrumb class="breadcrumb-wrap" separator="/">
<transition-group name="breadcrumb">
<el-breadcrumb-item v-for="(item, index) in breadcrumData" :key="item.path">
<!---不可点击-->
<span class="no-redirect" v-if="index === breadcrumData.length - 1">{{ item.meta.title }}</span>
<!---可点击项-->
<span class="redirect" v-else @click="onLinkClick(item)">{{ item.meta.title }}</span>
</el-breadcrumb-item>
</transition-group>
</el-breadcrumb>
</template>
<script setup>
import { useStore } from 'vuex'
import { watch, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
const route = useRoute();
//生成数组数据
const breadcrumData = ref([]);
const getBreadcrumData = () => {
//当前路由的标准化路由纪录
breadcrumData.value = route.matched.filter(item => item.meta && item.meta.title)
}
//watch监听路由变化
watch(route, () => {
getBreadcrumData();
}, {
immediate: true
})
const store = useStore();
const linkHoverColor = ref(store.getters.cssVar.menuBg);
const router = useRouter();
const onLinkClick = (item) => {
router.push(item.path)
}
</script>
<style lang="scss" scoped>
.breadcrumb-wrap {
display: inline-block;
font-size: 14px;
line-height: 50px;
margin-left: 8px;
.no-redirect {
color: #97a8be;
cursor: text;
}
.redirect {
color: #666;
font-weight: 600;
cursor: pointer;
}
.redirect:hover {
// 将来需要进行主题替换，所以这里不去写死样式
color: v-bind(linkHoverColor);
}
}
</style>

184
src/components/ChooseList/ChooseBA/index.vue Normal file
View File

@ -0,0 +1,184 @@
<template>
<el-dialog :title="data.title" width="1400px" :model-value="modelValue" append-to-body @close="closed" v-if="modelValue">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input placeholder="请输入姓名" v-model="listQuery.xm" clearabl></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.data.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table :loading="loading" @selection-change="handleSelectionChange" :row-key="keyid" height="450" ref="multipleUserRef" :data="tableData" border style="width: 100%">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column prop="xm" align="center" label="姓名"></el-table-column>
<el-table-column prop="zjhm" align="center" label="证件号码"></el-table-column>
<el-table-column prop="lxdh" align="center" label="联系电话"></el-table-column>
<el-table-column prop="jzdz" align="center" label="居住地址"></el-table-column>
<el-table-column prop="wpdw" align="center" label="外派单位"></el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet } from "@/api/qcckApi";
import * as MOSTY from "@/components/MyComponents/index";
import { defineProps, watch, ref, onMounted, nextTick, reactive } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
data:{
type: Object,
default: {
title:'选择列表',
type:'ba',//选择类型
Single:false,//是否单选
roleIds:[],//回显的数据
}
},
});
const emits = defineEmits(["update:modelValue", "choosedUsers",'close']);
const total = ref(0);
const loading = ref(false);
const listQuery = reactive({
pageCurrent: 1,
pageSize: 20
});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
watch(()=>props.modelValue, (val) => {
if (val) {
nextTick(() => {
getListData();
});
}
},{immediate: true});
const keyid = (row) => {
return row.id;
};
// 列表数据
const getListData = () => {
let params = { ...listQuery }
loading.value = true;
qcckGet(params,"/mosty-jmxf/tbbary/selectPage").then((res) => {
loading.value = false;
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser();
}).catch(()=>{
loading.value = false;
});
};
//列表回显
function multipleUser() {
let ids = props.data.roleIds ? props.data.roleIds :[];
tableData.value.forEach((item) => {
if (ids.some((id) => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.pageCurrent = currentPage;
getListData();
};
// 筛选
const handleFilter = () => {
listQuery.pageCurrent = 1;
getListData();
};
// 重置
const reset = () => {
listQuery.pageCurrent = 1
listQuery.pageSize = 10
getListData();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.pageSize = currentSize;
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [],listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosedUsers", list);
emits("choosedUsersLeader", { userList: userList });
closed();
};
// 选择的数据
const handleSelectionChange = (val) => {
if (props.data.Single && val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
};
// 关闭
const closed = () => {
emits("update:modelValue", false);
emits("close");
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

203
src/components/ChooseList/ChooseMFJ/index.vue Normal file
View File

@ -0,0 +1,203 @@
<template>
<el-dialog :title="data.title" width="1400px" :model-value="modelValue" append-to-body @close="closed" v-if="modelValue">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item label="姓名">
<el-input placeholder="请输入姓名" v-model="listQuery.xm" clearabl></el-input>
</el-form-item>
<el-form-item label="身份证号">
<el-input placeholder="请输入身份证号" v-model="listQuery.sfzh" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.data.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table :loading="loading" @selection-change="handleSelectionChange" :row-key="keyid" height="450" ref="multipleUserRef" :data="tableData" border style="width: 100%">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column prop="xm" align="center" label="姓名"></el-table-column>
<el-table-column prop="sfzh" align="center" label="身份证号"></el-table-column>
<el-table-column prop="ssbm" align="center" label="所属部门"></el-table-column>
<el-table-column prop="jh" align="center" label="警号"></el-table-column>
<el-table-column prop="lxdh" align="center" label="电话"></el-table-column>
<el-table-column prop="xbdm" align="center" label="性别">
<template #default="{ row }">
<span> {{ row.xbdm == 1 ? "男" : "女" }}</span>
</template>
</el-table-column>
<el-table-column prop="fl" align="center" label="警种">
<template #default="{ row }">
<span> {{ row.fl == '01' ? "民警" : "辅警" }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet } from "@/api/qcckApi";
import * as MOSTY from "@/components/MyComponents/index";
import { defineProps, watch, ref, onMounted, nextTick, reactive } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
data:{
type: Object,
default: {
title:'选择列表',
type:'mj',//选择类型
Single:false,//是否单选
roleIds:[],//回显的数据
}
},
});
const emits = defineEmits(["update:modelValue", "choosedUsers",'close']);
const total = ref(0);
const loading = ref(false);
const listQuery = reactive({
pageCurrent: 1,
pageSize: 20
});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
watch(()=>props.modelValue, (val) => {
if (val) {
nextTick(() => {
getListData();
});
}
},{immediate: true});
const keyid = (row) => {
return row.id;
};
// 列表数据
const getListData = () => {
let params = {
...listQuery,
fl: props.data.type == 'fj' ? '02' : '01',
}
loading.value = true;
qcckGet(params,"/mosty-jmxf/tbJcglXfll").then((res) => {
loading.value = false;
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser();
}).catch(()=>{
loading.value = false;
});
};
//列表回显
function multipleUser() {
let ids = props.data.roleIds ? props.data.roleIds :[];
tableData.value.forEach((item) => {
if (ids.some((id) => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.pageCurrent = currentPage;
getListData();
};
// 筛选
const handleFilter = () => {
listQuery.pageCurrent = 1;
getListData();
};
// 重置
const reset = () => {
listQuery.pageCurrent = 1
listQuery.pageSize = 10
getListData();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.pageSize = currentSize;
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [],listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosedUsers", list);
emits("choosedUsersLeader", { userList: userList });
closed();
};
// 选择的数据
const handleSelectionChange = (val) => {
if (props.data.Single && val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
};
// 关闭
const closed = () => {
emits("update:modelValue", false);
emits("close");
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

186
src/components/ChooseList/ChooseQFQZ/index.vue Normal file
View File

@ -0,0 +1,186 @@
<template>
<el-dialog :title="data.title" width="1400px" :model-value="modelValue" append-to-body @close="closed" v-if="modelValue">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input placeholder="请输入姓名" v-model="listQuery.xm" clearabl></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.data.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table :loading="loading" @selection-change="handleSelectionChange" :row-key="keyid" height="450" ref="multipleUserRef" :data="tableData" border style="width: 100%">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column prop="xm" align="center" label="姓名"></el-table-column>
<el-table-column prop="sfzh" align="center" label="身份证号"></el-table-column>
<el-table-column prop="sjh" align="center" label="手机号"></el-table-column>
<el-table-column prop="xbdm" align="center" label="人员类型">
<template #default="{ row }">
<span> {{ row.rylx == '01' ? "群众" : "党员" }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckPost } from "@/api/qcckApi";
import { defineProps, watch, ref, nextTick, reactive } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
data:{
type: Object,
default: {
title:'选择列表',
type:'qfqz',//选择类型
Single:false,//是否单选
roleIds:[],//回显的数据
}
},
});
const emits = defineEmits(["update:modelValue", "choosedUsers",'close']);
const total = ref(0);
const loading = ref(false);
const listQuery = reactive({
pageCurrent: 1,
pageSize: 20
});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
watch(()=>props.modelValue, (val) => {
if (val) {
nextTick(() => {
getListData();
});
}
},{immediate: true});
const keyid = (row) => {
return row.id;
};
// 列表数据
const getListData = () => {
let params = { ...listQuery }
loading.value = true;
qcckPost(params,"/mosty-jmxf/jmxf/qfqz/selectPage").then((res) => {
loading.value = false;
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser();
}).catch(()=>{
loading.value = false;
});
};
//列表回显
function multipleUser() {
let ids = props.data.roleIds ? props.data.roleIds :[];
tableData.value.forEach((item) => {
if (ids.some((id) => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.pageCurrent = currentPage;
getListData();
};
// 筛选
const handleFilter = () => {
listQuery.pageCurrent = 1;
getListData();
};
// 重置
const reset = () => {
listQuery.pageCurrent = 1
listQuery.pageSize = 10
getListData();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.pageSize = currentSize;
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [],listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosedUsers", list);
emits("choosedUsersLeader", { userList: userList });
closed();
};
// 选择的数据
const handleSelectionChange = (val) => {
if (props.data.Single && val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
};
// 关闭
const closed = () => {
emits("update:modelValue", false);
emits("close");
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

193
src/components/ChooseList/ChooseWGY/index.vue Normal file
View File

@ -0,0 +1,193 @@
<template>
<el-dialog :title="data.title" width="1400px" :model-value="modelValue" append-to-body @close="closed" v-if="modelValue">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input placeholder="请输入姓名" v-model="listQuery.username" clearabl></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.data.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table :loading="loading" @selection-change="handleSelectionChange" :row-key="keyid" height="450" ref="multipleUserRef" :data="tableData" border style="width: 100%">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column prop="username" align="center" label="姓名"></el-table-column>
<el-table-column prop="actionTelephone" align="center" label="行动电话，执法公开电话"></el-table-column>
<el-table-column prop="telephone" align="center" label="座机"></el-table-column>
<el-table-column prop="alarm" align="center" label="警号"></el-table-column>
<el-table-column prop="category" align="center" label="人员类型">
<template #default="{ row }">
<span> {{ row.category == '01' ? "民警" : row.category == '02' ?'辅警': "警务助理" }}</span>
</template>
</el-table-column>
<el-table-column prop="sex" align="center" label="性别">
<template #default="{ row }">
<span> {{ row.sex == 1 ? "男" : "女" }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet } from "@/api/qcckApi";
import * as MOSTY from "@/components/MyComponents/index";
import { defineProps, watch, ref, onMounted, nextTick, reactive } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
data:{
type: Object,
default: {
title:'选择列表',
type:'wgy',//选择类型
Single:false,//是否单选
roleIds:[],//回显的数据
}
},
});
const emits = defineEmits(["update:modelValue", "choosedUsers",'close']);
const total = ref(0);
const loading = ref(false);
const listQuery = reactive({
pageCurrent: 1,
pageSize: 20
});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
watch(()=>props.modelValue, (val) => {
if (val) {
nextTick(() => {
getListData();
});
}
},{immediate: true});
const keyid = (row) => {
return row.id;
};
// 列表数据
const getListData = () => {
let params = { ...listQuery }
loading.value = true;
qcckGet(params,"/mosty-jmxf/gridUser/getPageList").then((res) => {
loading.value = false;
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser();
}).catch(()=>{
loading.value = false;
});
};
//列表回显
function multipleUser() {
let ids = props.data.roleIds ? props.data.roleIds :[];
tableData.value.forEach((item) => {
if (ids.some((id) => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.pageCurrent = currentPage;
getListData();
};
// 筛选
const handleFilter = () => {
listQuery.pageCurrent = 1;
getListData();
};
// 重置
const reset = () => {
listQuery.pageCurrent = 1
listQuery.pageSize = 10
getListData();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.pageSize = currentSize;
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [],listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosedUsers", list);
emits("choosedUsersLeader", { userList: userList });
closed();
};
// 选择的数据
const handleSelectionChange = (val) => {
if (props.data.Single && val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
};
// 关闭
const closed = () => {
emits("update:modelValue", false);
emits("close");
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

49
src/components/ChooseList/index.vue Normal file
View File

@ -0,0 +1,49 @@
<template>
<!-- 民警 - 辅警 -->
<ChooseMFJ v-if="['fzr','mj','fj'].includes(props.data.type)" :data="data" v-model="props.modelValue" :Single="Single" :roleIds="roleIds" @close="close" @choosedUsers="choosedList"></ChooseMFJ>
<!-- 群防群治 -->
<ChooseQFQZ v-if="['qfqz'].includes(props.data.type)" :data="data" v-model="props.modelValue" :Single="Single" :roleIds="roleIds" @close="close" @choosedUsers="choosedList"></ChooseQFQZ>
<!-- 网格员 -->
<ChooseWGY v-if="['wgy'].includes(props.data.type)" :data="data" v-model="props.modelValue" :Single="Single" :roleIds="roleIds" @close="close" @choosedUsers="choosedList"></ChooseWGY>
<!-- 保安 -->
<ChooseBA v-if="['ba'].includes(props.data.type)" :data="data" v-model="props.modelValue" :Single="Single" :roleIds="roleIds" @close="close" @choosedUsers="choosedList"></ChooseBA>
</template>
<script setup>
import ChooseMFJ from "./ChooseMFJ/index.vue";
import ChooseQFQZ from "./ChooseQFQZ/index.vue";
import ChooseWGY from "./ChooseWGY/index.vue";
import ChooseBA from "./ChooseBA/index.vue";
import { reactive, ref, onMounted } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
data:{
type: Object,
default: {
title:'选择列表',
type:'user',//选择类型
Single:false,//是否单选
roleIds:[],//回显的数据
}
},
});
const emits = defineEmits(["choosed", "update:modelValue"]);
// 选择数据
function choosedList(data) {
emits("choosed", data);
emits("update:modelValue", false);
}
function close() {
emits("update:modelValue", false);
}
</script>
<style>
</style>

53
src/components/DictTag/index.vue Normal file
View File

@ -0,0 +1,53 @@
<template>
<div>
<template v-for="(item, index) in options">
<template v-if="values.includes(item.value)">
<span
v-if="item.elTagType == 'default' || item.elTagType == '' || tag == false"
:key="item.value"
:index="index"
:class="item.elTagType"
>{{ item.label }}</span>
<el-tag
v-else
:disable-transitions="true"
:key="item.value + ''"
:index="index"
:type="item.elTagType === 'primary' ? '' : item.elTagType"
:class="item.elTagType"
>{{ item.label }}</el-tag
>
</template>
</template>
</div>
</template>
<script setup>
import { computed } from "vue";
const props = defineProps({
// 数据
options: {
type: Array,
default: null
},
tag: false,
value: [Number, String, Array]
});
const values = computed(() => {
if (props.value !== null && typeof props.value !== "undefined") {
return Array.isArray(props.value) ? props.value : [String(props.value)];
} else {
return [];
}
});
</script>
<style scoped>
.el-tag + .el-tag {
margin-left: 10px;
}
</style>

90
src/components/From/Email/index.vue Normal file
View File

@ -0,0 +1,90 @@
<template>
<el-form ref="formRef" :model="groupData" :rules="rules">
<el-form-item
:label-width="LABEL_WIDTH"
prop="modelValue"
label="邮箱"
>
<el-input
v-bind="$attrs"
v-model="groupData.modelValue"
@input="onInput()"
@blur="validate()"
max="11"
></el-input>
</el-form-item>
</el-form>
</template>
<script setup>
import { LABEL_WIDTH } from '@/constant';
import { ref, defineProps, defineEmits, defineExpose } from 'vue'
const formRef = ref(null);
const props = defineProps({
isRequired: {
type: Boolean,
default: false
}
})
const groupData = ref({
modelValue: ''
});
const emits = defineEmits(['update:modelValue']);
const onInput = (e) => {
emits('update:modelValue', groupData.value.modelValue)
}
const isBX = ref(false)
const validateIdentity = () => {
return (rule, value, callback) => {
const reg = /^([a-zA-Z0-9]+[-_\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/
if (!value) {
} else {
if (!reg.test(value)) {
return callback(new Error('请输入正确的邮箱地址'));
} else {
callback();
}
}
};
};
// 验证规则
const rules = ref({
modelValue: [
{
required: props.isRequired,
message: '请输入邮箱',
trigger: 'blur'
},
{
trigger: 'blur',
validator: validateIdentity()
}
]
})
// 校验是否 符合规则 。 把当前组件名通过 emits分发出去
const validate = () => {
formRef.value.validate((valid) => {
if (valid) {
emits('validateStatus', { 'Email': true })
} else {
emits('validateStatus', { 'Email': false })
}
})
if (!props.isRequired && groupData.value.modelValue.length === 0) {
emits('validateStatus', { 'Email': true })
}
}
const childMethod = () => {
groupData.value.modelValue = ""
}
// 主动暴露childMethod方法
defineExpose({ childMethod })
</script>
<style lang="scss" scoped>
</style>

68
src/components/From/IdentityCard/index.vue Normal file
View File

@ -0,0 +1,68 @@
<template>
<el-form ref="formRef" :model="groupData" :rules="rules">
<el-form-item :label-width="LABEL_WIDTH" prop="modelValue" label="身份证号">
<el-input
v-bind="$attrs"
v-model="groupData.modelValue"
@input="onInput()"
@blur="validate()"
></el-input>
</el-form-item>
</el-form>
</template>
<script setup>
import { LABEL_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, defineExpose } from "vue";
import { validateIdentity } from "./rules";
const props = defineProps({
isRequired: {
type: Boolean,
default: false
}
});
const groupData = ref({
modelValue: ""
});
const formRef = ref(null);
const emits = defineEmits(["videoListShowFn"]);
const onInput = (e) => {
emits("update:modelValue", groupData.value.modelValue);
};
// 验证规则
const rules = ref({
modelValue: [
{
required: props.isRequired,
message: "请输入身份证",
trigger: "blur"
},
{
trigger: "change",
validator: validateIdentity()
}
]
});
// 校验是否 符合规则 。 把当前组件名通过 emits分发出去
const validate = () => {
formRef.value.validate((valid) => {
if (valid) {
emits("validateStatus", { IdentityCard: true });
} else {
emits("validateStatus", { IdentityCard: false });
}
});
if (!props.isRequired && groupData.value.modelValue.length === 0) {
emits("validateStatus", { IdentityCard: true });
}
};
const childMethod = () => {
groupData.value.modelValue = "";
};
// 主动暴露childMethod方法
defineExpose({ childMethod });
</script>
<style lang="scss" scoped></style>

79
src/components/From/IdentityCard/rules.js Normal file
View File

@ -0,0 +1,79 @@
export const validateIdentity = () => {
return (rule, value, callback) => {
if (!value) {
// return callback(new Error('身份证号不能为空'));
} else if (!/(^\d{15}$)|(^\d{17}(\d|X|x)$)/.test(value)) {
callback(new Error('输入的身份证长度或格式错误'));
}
//身份证城市
var aCity = {
11: '北京',
12: '天津',
13: '河北',
14: '山西',
15: '内蒙古',
21: '辽宁',
22: '吉林',
23: '黑龙江',
31: '上海',
32: '江苏',
33: '浙江',
34: '安徽',
35: '福建',
36: '江西',
37: '山东',
41: '河南',
42: '湖北',
43: '湖南',
44: '广东',
45: '广西',
46: '海南',
50: '重庆',
51: '四川',
52: '贵州',
53: '云南',
54: '西藏',
61: '陕西',
62: '甘肃',
63: '青海',
64: '宁夏',
65: '新疆',
71: '台湾',
81: '香港',
82: '澳门',
91: '国外'
};
if (!aCity[parseInt(value.substr(0, 2))]) {
callback(new Error('身份证地区非法'));
}
// 出生日期验证
var sBirthday = (
value.substr(6, 4) +
'-' +
Number(value.substr(10, 2)) +
'-' +
Number(value.substr(12, 2))
).replace(/-/g, '/'),
d = new Date(sBirthday);
if (
sBirthday !==
d.getFullYear() + '/' + (d.getMonth() + 1) + '/' + d.getDate()
) {
callback(new Error('身份证上的出生日期非法'));
}
// 身份证号码校验
var sum = 0,
weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2],
codes = '10X98765432';
for (var i = 0; i < value.length - 1; i++) {
sum += value[i] * weights[i];
}
var last = codes[sum % 11]; //计算出来的最后一位身份证号码
if (value[value.length - 1] !== last) {
callback(new Error('输入的身份证号非法'));
}
callback();
};
};

89
src/components/From/Phone/index.vue Normal file
View File

@ -0,0 +1,89 @@
<template>
<el-form ref="formRef" :model="groupData" :rules="rules">
<el-form-item :label-width="LABEL_WIDTH" prop="modelValue" label="手机号">
<el-input v-bind="$attrs" v-model="groupData.modelValue" @input="onInput()" @blur="validate()" max="11">
</el-input>
</el-form-item>
</el-form>
</template>
<script setup>
import { LABEL_WIDTH } from '@/constant';
import { ref, defineProps, defineEmits, defineExpose } from 'vue'
const formRef = ref(null);
const props = defineProps({
isRequired: {
type: Boolean,
default: false
}
})
const isOk = ref()
const groupData = ref({
modelValue: ''
});
const emits = defineEmits(['update:modelValue']);
const onInput = (e) => {
emits('update:modelValue', groupData.value.modelValue)
}
const isBX = ref(false)
const validateIdentity = () => {
return (rule, value, callback) => {
if (!value) {
} else {
const reg = /^1[3|4|5|7|8][0-9]\d{8}$/
if (reg.test(value)) {
callback();
} else {
return callback(new Error('请输入正确的手机号'));
}
}
};
};
// 验证规则
const rules = ref({
modelValue: [
{
required: props.isRequired,
message: '请输入手机号',
trigger: 'blur'
},
{
min: 11,
message: '手机号格式不正确',
trigger: 'blur'
},
{
trigger: 'change',
validator: validateIdentity()
}
]
})
// 校验是否 符合规则 。 把当前组件名通过 emits分发出去
const validate = () => {
formRef.value.validate((valid) => {
if (valid) {
emits('validateStatus', { Phone: true })
isOk.value = true
} else {
emits('validateStatus', { Phone: false })
isOk.value = false
}
})
if (!props.isRequired && groupData.value.modelValue.length === 0) {
emits('validateStatus', { Phone: true })
isOk.value = true
}
}
const childMethod = () => {
groupData.value.modelValue = ""
}
// 主动暴露childMethod方法
defineExpose({ childMethod })
</script>
<style lang="scss" scoped>
</style>

347
src/components/GdMap/a.vue Normal file
View File

@ -0,0 +1,347 @@
<template>
<div :id="mapid" class="map"></div>
<div class="changeMap_box" v-if="props.isShow">
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
</el-input-number>
</div>
</div>
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
import { MapUtil } from "./mapUtil";
import emitter from "@/utils/eventBus.js";
import { getItem } from "@/utils/storage";
const conditionRoute = ref(true); //路况
const mMap = ref(null); //地图对象
const mapUtil = ref(null); //地图工具对象
const zoomTarget = ref(6);
const props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
isShowDraw: {
type: Boolean,
default: false
}
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) {}
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "446px";
box[0].style.transition = "0.5s";
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:3857",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36,29.65],
zoom: 10
},
transformRequest: (url) => {
if (url.indexOf("TileMatrix=") != -1) {
const arr = url.split("TileMatrix=");
const arr1 = arr[1].split("&");
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
}
}
});
window.map = map;
map.mapboxGLMap.on("load", () => {
map.addGaudLayer({
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
})
zoomTarget.value = map.mapboxGLMap.getZoom();
});
// http://89.0.23.24:3534/PGIS_S_TileMapServer
mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
});
emitter.on("removePlot", (flag) => {
mapUtil.value.removePlot(flag);
});
emitter.on("removeAll", (flag) => {
mapUtil.value.removeAll(flag);
});
// 撒点
emitter.on("addPointArea", (obj) => {
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
});
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(res);
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
background-color: aliceblue;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 1;
}
.changeMap_box {
position: absolute;
right: 448px;
top: 70px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
& > img {
width: 100%;
height: 50px;
}
& > div {
text-align: center;
position: relative;
top: -3px;
}
}
.zoomTargetBox {
margin-top: 10px;
margin-left: 23px;
z-index: 999;
}
::v-deep .el-input-number__decrease,
::v-deep .el-input-number__increase {
border: none;
}
::v-deep .el-input__inner {
background: #0c1641;
}
}
</style>

387
src/components/GdMap/index.vue Normal file
View File

@ -0,0 +1,387 @@
<template>
<div :id="mapid" class="map"></div>
<div class="changeMap_box" v-if="props.isShow">
<!-- <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" /> -->
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom"></el-input-number>
</div>
</div>
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
import { MapUtil } from "./mapUtil";
import emitter from "@/utils/eventBus.js";
import { getItem } from "@/utils/storage";
const conditionRoute = ref(true); //路况
const mMap = ref(null); //地图对象
const mapUtil = ref(null); //地图工具对象
const zoomTarget = ref(6);
const props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
isShowDraw: {
type: Boolean,
default: false
}
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) { }
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "398px";
box[0].style.transition = "0.5s";
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:4490",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36057012, 29.64276831],
zoom: 15
},
minZoom: 7,
maxZoom: 18,
});
window.map = map;
map.mapboxGLMap.on("load", () => {
map.addWMTSLayer(
"/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
,
{
Service: "getImage",
Type: "RGB",
ZoomOffset: "0",
V: "0.3",
Zoom: "{z}",
Row: "{y}",
Col: "{x}"
},
{
tileSize: 300
}
);
zoomTarget.value = map.mapboxGLMap.getZoom();
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:3857",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36,29.65],
zoom: 10
},
transformRequest: (url) => {
if (url.indexOf("TileMatrix=") != -1) {
const arr = url.split("TileMatrix=");
const arr1 = arr[1].split("&");
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
}
}
});
window.map = map;
map.mapboxGLMap.on("load", () => {
map.addGaudLayer({
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
})
zoomTarget.value = map.mapboxGLMap.getZoom();
});
mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
});
emitter.on("removePlot", (flag) => {
mapUtil.value.removePlot(flag);
});
emitter.on("removeAll", (flag) => {
mapUtil.value.removeAll(flag);
});
// 撒点
emitter.on("addPointArea", (obj) => {
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
});
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(res);
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
background-color: aliceblue;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 1;
}
.changeMap_box {
position: absolute;
right: 444px;
bottom: 4px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
&>img {
width: 100%;
height: 50px;
}
&>div {
text-align: center;
position: relative;
top: -3px;
}
}
.zoomTargetBox {
margin-top: 10px;
margin-left: 23px;
}
::v-deep .el-input-number__decrease,
::v-deep .el-input-number__increase {
background: #133362;
color: #fff;
border: none;
}
::v-deep .el-input__inner {
background: #0c1641;
}
}
</style>

359
src/components/GdMap/indexn.vue Normal file
View File

@ -0,0 +1,359 @@
<template>
<div :id="mapid" class="map"></div>
<div class="changeMap_box" v-if="props.isShow">
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom"></el-input-number>
</div>
</div>
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
import { MapUtil } from "./mapUtil";
import emitter from "@/utils/eventBus.js";
import { getItem } from "@/utils/storage";
const conditionRoute = ref(true); //路况
const mMap = ref(null); //地图对象
const mapUtil = ref(null); //地图工具对象
const zoomTarget = ref(6);
const props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
isShowDraw: {
type: Boolean,
default: false
}
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) { }
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "398px";
box[0].style.transition = "0.5s";
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:4490",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36057012, 29.64276831],
zoom: 15
},
minZoom: 7,
maxZoom: 18,
});
window.map = map;
map.mapboxGLMap.on("load", () => {
map.addWMTSLayer(
"/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
,
{
Service: "getImage",
Type: "RGB",
ZoomOffset: "0",
V: "0.3",
Zoom: "{z}",
Row: "{y}",
Col: "{x}"
},
{
tileSize: 300
}
);
zoomTarget.value = map.mapboxGLMap.getZoom();
});
mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
});
emitter.on("removePlot", (flag) => {
mapUtil.value.removePlot(flag);
});
emitter.on("removeAll", (flag) => {
mapUtil.value.removeAll(flag);
});
// 撒点
emitter.on("addPointArea", (obj) => {
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
});
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(res);
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
background-color: aliceblue;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 1;
}
.changeMap_box {
position: absolute;
right: 398px;
bottom: 4px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
&>img {
width: 100%;
height: 50px;
}
&>div {
text-align: center;
position: relative;
top: -3px;
}
}
.zoomTargetBox {
margin-top: 10px;
margin-left: 23px;
}
::v-deep .el-input-number__decrease,
::v-deep .el-input-number__increase {
background: #133362;
color: #fff;
border: none;
}
::v-deep .el-input__inner {
background: #0c1641;
}
}
</style>

784
src/components/GdMap/mapUtil.js Normal file
View File

@ -0,0 +1,784 @@
import emitter from "@/utils/eventBus.js";
export function MapUtil(map) {
let _that = this;
_that.mMap = map; //地图对象
_that._self = {};//图层对象
_that._CustomDraw = null;//自定义绘图
_that.polygonGeo = null;//边界
_that.idsBox = {} //存放id的容器（需要某个标记单个删除的时候存储）
_that.isCheck = false
/**
* 设置地图中心点以
* @param {*} location 中心坐标 [jd,wd]
* @param {*} zoomLevel 层级 10
*/
MapUtil.prototype.setMapCenter = (location, zoomLevel) => {
map.mapboxGLMap.setCenter(location);
map.mapboxGLMap.setZoom(zoomLevel);
};
/**
* 撒点.鼠标滑动展示内容
* @param {*} coords 坐标 geojson
* @param {*} icon 图标
* @param {*} flag 标识
*/
MapUtil.prototype.showPoint = (res) => {
let { coords, icon, flag, iconH } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = [];
let pointList = coords.map((it, index) => {
let text = it.kfdMc || it.wzBc || it.gajgmc || it.xm || it.jczmc;
let obj = {
position: [it.jd, it.wd],
userData: { deviceSn: 'text' + index, area: text },
id: it.id,
text: text,
data: it
}
if (it.jd && it.wd) return obj;
});
const point = map.createdPoint(pointList, {
image: icon,//对应上面的图片名称
scale: 1,
highlightImage: iconH ? iconH : icon,//高亮图标
labelOption: {
pixelOffset: [0, -2],
allShow: false,
fontSize: '18px',
fontWeight: 600,
fontColor: '#000000'
}
})
_that._self[flag].push(point)
point.addEventListener("click", (val) => {
let data = val.data ? JSON.parse(val.data) : {};
// point.highlight(data.id) //高亮展示选中的点位
_that.openInfoDetail(flag, [data]) //点击打开详情
})
}
/**
* 撒点
* @param {*} coords 坐标 geojson
* @param {*} icon 图标
* @param {*} flag 标识
* @param {*} showTitle 是否展示标题
*/
MapUtil.prototype.makerSki = (res) => {
let { coords, icon, flag, showTitle } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = []; //存储地图标识的容器
if (!_that.idsBox[flag]) _that.idsBox[flag] = []; //存储id的容器
if (flag == 'rx') {
_that.handlePolice(coords, icon, flag, showTitle)
} else {
coords.forEach(item => {
let el = document.createElement("img");
el.src = item.icon || icon;
el.style.width = flag == 'kfd' ? '32px' : "25px";
if (flag.includes('jczMap_')) el.style.width = '45px';
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: [0, 0] })
el.addEventListener("click", () => {
_that.openInfoDetail(flag, item) //点击打开详情
})
_that._self[flag].push(marker)
_that.idsBox[flag].push(item.id)
});
}
};
// 警力处理展示
MapUtil.prototype.handlePolice = (coords, icon, flag, showTitle) => {
// 01-大型车辆-DXCL， 02-小型车辆=XXCL，03-摩托车-MTC，04-其他车辆-QTCL，05-重型车辆-ZXCL，06-风控车-FKC，07-巡逻车-XLC，08-装甲车-ZJC
coords.forEach(item => {
let el = document.createElement("img");
let jcIcon = require(`@/assets/point/police-car-bx.png`);
switch (item.lx) {
case '01': // 特警
jcIcon = require(`@/assets/point/specialPolice.png`);
break;
case '02': // 交警
jcIcon = require(`@/assets/point/trafficPolice.png`);
break;
case '03': // 派出所民警
jcIcon = require(`@/assets/point/peoplePolice.png`);
break;
default: // 默认图标
jcIcon = require(`@/assets/point/specialPolice.png`);
break;
}
if (item.zzlx == 1) jcIcon = require(`@/assets/point/by.png`); //便衣
let cllxList = item.cllx ? item.cllx.split(',') : [];
if ((cllxList.includes('03') || cllxList.includes('04')) && item.lx == '02') jcIcon = require(`@/assets/point/xljmtc.png`); //交警-摩托车
if ((cllxList.includes('03') || cllxList.includes('04')) && item.lx == '01') jcIcon = require(`@/assets/point/tjc.png`); //特警-摩托车
if (cllxList.includes('08') || cllxList.includes('06')) jcIcon = require(`@/assets/point/zjc.png`); //装甲车
el.src = jcIcon;
let isShoeCar = cllxList.includes('03') || cllxList.includes('08') //车辆类型
// el.style.width = isShoeCar ? '38px':"25px"; //图片大小
// if(cllxList.includes('08')) el.style.height = '40px'
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
_that.shouIcon(item, [item.jd, item.wd]); // 展示装备图标
let offset = isShoeCar ? [-10, 0] : [0, 0];
if (cllxList.includes('08')) offset = [-12, -10]
const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: offset })
el.addEventListener("click", () => {
_that.openInfoDetail(flag, item) //点击打开详情
})
_that._self[flag].push(marker)
_that.idsBox[flag].push(item.id)
});
}
// 信息框展示
MapUtil.prototype.makerShowTitle = (item, points, flag, text) => {
console.log(item,'item');
let T = flag == 'rx' ? 'rxTitle' : 'Title'
let flagT = flag + T;
if (!_that._self[flagT]) _that._self[flagT] = [];
// 展示名字
let textTitle = item.jzMc ? item.jzMc : item.fzrXm + '警组';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') textTitle = item.sbmc;
if (flag == 'gapText') textTitle = text;
if (flag == 'bxd' || flag=="search_bxd") textTitle = item.bxdMc;
// 设置样式
const el = document.createElement('div');
el.className = 'makerTitle';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly' ||flag == 'bxd' || flag=="search_bxd") el.className = 'makerTitlezb';
if (flag == 'rx') {
if (item.xfzt == '0') el.classList.add('makerTitleLine');
else if (item.xfzt == '1') el.classList.add('makerTitlecj');
else el.classList.add('makerTitleUnLine');
}
if (flag == 'gapText') el.className = 'makerTitleGapText';
// 渲染
el.innerHTML = textTitle;
const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -50] })
_that._self[flagT].push(marker)
}
/**
* 装备图标
* @param {点位数据} data
* @param {点} point
*/
MapUtil.prototype.shouIcon = (data, point) => {
if (!_that._self.gpsZb) _that._self.gpsZb = []
var qxIcon = require(`@/assets/point/qx.png`); //qixie
var zfjlyIcon = require(`@/assets/point/interphone.png`); // 对讲机
var clIcon = require(`@/assets/point/car.png`); // 车辆
let jyqx = typeof data.jyqx == "string" ? JSON.parse(data.jyqx) : data.jyqx ? data.jyqx : [];
let txzb = typeof data.txzb == "string" ? JSON.parse(data.txzb) : data.txzb ? data.txzb : [];
let pbcl = typeof data.pbcl == "string" ? JSON.parse(data.pbcl) : data.pbcl ? data.pbcl : [];
let list = []
let cl = (pbcl && pbcl.length > 0) ? true : false; // 车辆
let zb = (txzb && txzb.length > 0) ? true : false; // 智能装备
let qx = (jyqx && jyqx.length > 0) ? true : false; // 常用装备
if (zb) {
let el = document.createElement("img");
el.style.width = "15px"
el.src = zfjlyIcon;
const makerZb = map.Marker(el, point, { anchor: 'bottom', offset: [20, -26] })
list.push(makerZb)
}
if (qx) {
let elqx = document.createElement("img");
elqx.style.width = "15px"
elqx.src = qxIcon;
const makerQx = map.Marker(elqx, point, { anchor: 'bottom', offset: [20, -10] })
list.push(makerQx)
}
if (cl) {
let elcl = document.createElement("img");
elcl.style.width = "20px"
elcl.src = clIcon;
const makerCl = map.Marker(elcl, point, { anchor: 'bottom', offset: [20, 2] })
list.push(makerCl)
}
_that._self.gpsZb[data.id] = list
}
// 自定义展示
MapUtil.prototype.zdySquire = (obj) => {
let { points, flag, distance } = obj
if (!_that._self[flag]) _that._self[flag] = [];
let textTitle = '距离：' + distance; // 展示名字
const el = document.createElement('div');
el.className = 'makerTitle';
if (flag == 'distance') el.className = 'makerTitleDistance'; // 设置样式
el.innerHTML = textTitle;
const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -76] }) // 渲染
_that._self[flag].push(marker)
}
/**扩散圆
* @param coords:[jd,wd]
*/
MapUtil.prototype.diffusionCircle = (obj) => {
let { coords, flag, isClear } = obj
if (!_that._self[flag]) _that._self[flag] = {}
if (isClear) _that._self[flag].destroy() //destroy销毁，show(false) 移除
let data = [{ position: coords }]
_that._self[flag] = map.DiffuseCircle(data, {
radius: 10,
color: 'rgba(81,217,254)',//扫描扇形的颜色，必须是十六进制或者rgb
duration: 30,//圆环与上一个圆环出现的间隔时间。配合speed参数可以调整圆圈的数量
speed: 4 //圆环移动速度
})
}
/**
* 聚合撒点
* @param {*} coords 点位数据 geojson lng lat
* @param {*} icon 点位图
*/
MapUtil.prototype.aggregateScatteringPoint = (obj) => {
let { coords, icon, flag, isclear, scale, fontColor } = obj;
let points = coords.map(item => {
item.lng = item.jd;
item.lat = item.wd;
return item
})
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag) //移除聚合
let maker = map.clusterLayer(points, {
id: flag,
size: 18,
pixelRange: 60,
// gradient:{'1':'#00BFFF','10':'#008000', '100':'#FFA500', '1000':'#FF0000'},//可以自定义图片,把颜色换成图片地址
gradient: { '1': icon, '10': icon, '100': icon, '1000': icon },//可以自定义图片,把颜色换成图片地址
fontSize: 14,
fontColor: fontColor ? fontColor : '#001022',
style: 'custom',// spiral（螺旋形状），circle(圆圈)，custom(自定义)
image: icon,
scale: scale ? scale : 1,
// highlightImage:icon,
fontFamily: ['Microsoft YaHei']
})
_that._self[flag].push(maker)
// 聚合的点击一个
maker.addEventListener("click", (val) => {
_that.openInfoDetail(flag, [val]) //点击打开详情
})
// 聚合的多个
maker.addEventListener("clusterClick", (val) => {
_that.openInfoDetail(flag, val) //点击打开详情
})
};
/**
* 热力图
* @param {*} coords 数组
*/
MapUtil.prototype.showHeatDrawing = (res) => {
let { coords, flag, isclear, color } = res;
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag) //清除热力
let data = {
type: 'FeatureCollection',
features: []
}
for (let index = 0; index < coords.length; index++) {
const item = coords[index];
let jd = item.lng || item.jd;
let wd = item.lat || item.wd;
let mag = item.count <= 10 ? 1.4 : (item.count > 10 && item.count <= 50) ? 1.6 : 1.9;
let obj = {
properties: { mag },
type: 'Feature',
geometry: { type: 'Point', coordinates: [jd, wd, 0.1] }
}
data.features.push(obj)
}
let colors = { '0': 'rgba(23,102,172,0)', '0.5': 'rgb(209,229,240)', '1': 'rgb(178,24,43)' }
if (color) colors = { '0': color[0], '0.5': color[1], '1': color[2] }
let heartmap = map.HeatMap(data, { colors })
_that._self[flag].push(heartmap)
};
// 清除所有
MapUtil.prototype.removeAll = () => {
for (let key in _that._self) {
console.log(key, 'key');
if (key != 'rx' && key != 'gpsZb' && !key.includes('rxTitle')) {
let list = _that._self[key]
for (let i = 0; i < list.length; i++) {
const el = list[i];
console.log(el, 'el');
if (el && typeof el == 'object') el.destroy() //destory()销毁 , show(false) false:隐藏 true ：展示
else _that.removePlot(key)
}
_that._self[key] = [];
}
}
}
/**
* 删除图层要素
* @param {*} layer 唯一标识
*/
MapUtil.prototype.removeElement = (layer) => {
//警力装备
if (layer == 'gpsZb') {
for (let key in _that._self.gpsZb) {
let item = _that._self.gpsZb[key]
if (item && item.length > 0) {
for (let child in item) { item[child].destroy() }
_that._self.gpsZb[key] = []
}
}
}
if (layer == 'rx') _that.idsBox[layer] = [];
// 其他图层
if (!_that._self[layer]) return false;
if (layer !== 'gpsZb') {
for (let i = 0; i < _that._self[layer].length; i++) {
const el = _that._self[layer][i];
el.destroy()//destory()销毁 , show(false) false:隐藏 true ：展示
}
_that._self[layer] = [];
// d带标题的撒点
let T = layer == 'rx' ? 'rxTitle' : 'Title'
let flagT = layer + T;
if (!_that._self[flagT]) return false;
for (let i = 0; i < _that._self[flagT].length; i++) {
const el = _that._self[flagT][i];
el.destroy()//destory()销毁 , show(false) false:隐藏 true ：展示
}
_that._self[flagT] = []
}
};
/**
* 删除图层的某个要素
* @param {*} layer 唯一标识
*/
MapUtil.prototype.removeElementOne = (layer, id) => {
if (!_that.idsBox[layer]) return false;
let list = _that.idsBox[layer];
list.forEach((el, index) => {
if (el == id) {
_that.idsBox[layer].splice(index, 1);
if (_that._self[layer][index]) _that._self[layer][index].destroy()
_that._self[layer].splice(index, 1)
if (layer == 'rx') {
let flagT = layer + 'rxTitle';
if (_that._self[flagT][index]) _that._self[flagT][index].destroy()
_that._self[flagT].splice(index, 1)
_that.removeGpsZbOverlayById(id) //删除图标
}
}
})
};
// 删除图标装备
MapUtil.prototype.removeGpsZbOverlayById = (id) => {
if (_that._self.gpsZb[id]) {
try {
let info = _that._self.gpsZb[id]
if (info) {
info.forEach(element => { element.destroy() });
delete _that._self.gpsZb[id]
}
} catch (err) { }
}
}
// 绘制数据的初始化
MapUtil.prototype.Drawplot = (color) => {
const { point, line, polygon, circle, rectangle, geoJson, remove, enableEdit } = map.draw({
lineWidth: 2,
lineColor: 'rgba(233,168,32,1)',
fillColor: 'rgba(233,168,32,0.5)',
color: 'rgba(233,168,32,1)',
pixelSzie: 0,
})
_that._CustomDraw = { point, line, polygon, circle, rectangle, geoJson, remove, enableEdit }
}
/**
* 绘制工具
* @param {*} type 绘制形状
* (point 点, line 线, circle 圆, polygon 多边形, rectangle 矩形) ,
* geoJson:根据geojson回显图
*/
MapUtil.prototype.plot = (res, resFun) => {
let { flag, color, linecolor, type, coords } = res
if (!_that._self[flag]) _that._self[flag] = [];
if (res.isclear) _that.removePlot(flag); //移除绘制工具
if (res.isclear && (res.type == 'polygon' || res.type == 'line')) _that.removeEara(flag); //移除回显的面和线条
switch (type) {
case 'point':
_that._CustomDraw.point((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'rectangle':
_that._CustomDraw.rectangle((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'circle':
_that._CustomDraw.circle((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'polygon':
_that._CustomDraw.polygon((val) => { _that.handlePlot(val, type, flag, resFun) }, {
fillColor: color || 'rgba(233,168,32,0.5)',
lineColor: linecolor || 'rgba(233,168,32,1)',
})
break;
case 'line':
_that._CustomDraw.line((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'geoJson'://返回面
let json = {
type: 'FeatureCollection',
features: [{
type: 'Feature',
geometry: {
type: 'Polygon',
coordinates: coords // coords 是三维数组
},
id: flag,
properties: {
fillColor: color || 'rgba(233,168,32,1)',
lineColor: linecolor || 'rgba(233,168,32,1)',
}
}],
}
_that._CustomDraw.geoJson(json, (data) => { _that.handlePlot(data, type, flag, resFun) })
break;
}
}
/**
* 处理自定义数据
* @param {*} val 返回数据
* @param {*} type 类型
* @param {*} flag 唯一标识
* @param {*} resFun 回调
*/
// 校验
MapUtil.prototype.handlePlot = (val, type, flag, resFun) => {
_that._self[flag].push(val.id)
let coords = val.positionData; //绘制区域
resFun(coords, type, flag, val);
}
/**
* 移除绘制工具
* @param {*} flag 唯一标识
*/
MapUtil.prototype.removePlot = (flag) => {
if (!_that._self[flag]) return false;
_that._self[flag].forEach(v => {
_that._CustomDraw.remove(v)
})
}
/**
* 移除绘制面
* @param {*} flag 唯一标识
*/
MapUtil.prototype.removeEara = (flag) => {
_that._CustomDraw.remove(flag)
_that.removePlot(flag)
}
/**
* 创建线
* @param {*} type 回显形状
* (solid 实线, dash 虚线, FlowColor 彩虹线, RoadLine 流线
*/
MapUtil.prototype.createLine = (res) => {
let { type, coords, isclear, flag, color, width } = res;
if (!coords) return false; // coords 是数组对象，可以同时撒多条数据
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag); //移除回显的线条
let data = coords.map((item, index) => {
return {
position: item.coords[0], //二维数组
text: '',
id: index,
userData: {
name: item.text
}
}
})
let line = map.createLine(data, {
color: color ? color : 'rgba(20, 237, 245,1)',
width: width ? width : 8,
type,
highlightColor: 'red',
labelOption: {
pixelOffset: [0, -1],
allShow: false,
type: 'text',
fontColor: 'rgba(20, 237, 245,1)'
}
})
_that._self[flag].push(line)
}
/**
* 回显平面- 圆 - 多边形 - 矩形
* @param {*} type 回显形状
* type: 'polygon', 'rectangle
coords = [{
position:[[[jd,wd],[jd,wd] ---]], //三维数组
text,//展示的文字
id, //唯一标识
FID, //渲染颜色的标识
userData:{} //存储数据
}]
* type:circle
coords:[jd,wd] radius:半径
* @param {*} text 展示的文字
*/
MapUtil.prototype.echoPlane = (res) => {
let { type, coords, fontColor, fontSize, text = '', radius = 0, isclear, flag, id = 1, color, linecolor } = res;
if (!coords) return;
if (isclear) _that.removeElement(flag)
if (!_that._self[flag]) _that._self[flag] = [];
let color1 = color ? color : 'rgba(29,237,245,0.6)'
let linecolor1 = linecolor ? linecolor : 'rgba(29,237,245,0.6)'
let style = {
color: color1,
outLineColor: linecolor1,
outLineWidth: 2,
highlightColor: 'rgba(255,0,0,0.5)',
labelOption: {
pixelOffset: [0, 0],
allShow: true,
fontColor: fontColor ? fontColor : '#ffffff',
fontSize: fontSize ? fontSize : '12px'
}
}
let maker;
// 圆
if (type == 'circle') {
let params = [{ center: coords, radius, text, id }]
maker = map.createCircle(params, style);
}
// 矩形
if (type == 'rectangle') maker = map.createRectangle(coords, style);
// 多边形
if (type == 'polygon') maker = map.createPolygon(coords, style);
_that._self[flag].push(maker);
maker.addEventListener("click", (val) => {
if (flag == 'xfq') {
maker.highlight(val.id) //高亮展示
emitter.emit('showXFQinfo', val)
if (val.id == _that.lightHeight) {
_that.isCheck = !_that.isCheck
if (_that.isCheck) {
maker.highlight(0); //取消高亮展示
emitter.emit('showXFQinfo', null)
} else {
emitter.emit('showXFQinfo', val)
}
}
_that.lightHeight = val.id
}
if (flag == 'zdxl_fzyc') {
emitter.emit('showFzycInfo', { info: val, type: true })
}
})
}
// 分割线展示文字
MapUtil.prototype.gapText = (obj) => {
let { points, text, flag } = obj
_that.makerShowTitle({}, points, flag, text) //展示标题
}
/**
* 轨迹回放
* @param {*} coords 轨迹坐标.二维数组[[104.03640684556253,30.7415801286654],[103.98021233220163,30.6555411499294],[103.85766040251299,30.58094579138167]]
* @param {*} isClear 是否清除上一次的记录
*/
MapUtil.prototype.displayLineAnimation = (res) => {
let { coords, isClear, flag } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = [];
if (isClear && _that._self[flag]) _that.removeElement(flag); //destroy 移除,start 播放,pause 暂停
let lineString = getUUid().slice(3, 5)
const data = [
{
position: coords,
text: '实线',
id: lineString,
userData: { name: '测试1' }
}
]
const track = map.trajectoryRealtime(data, {
color: '#28F', //轨迹背景颜色
width: 8,
image: 'images/car.png',
speed: 80, // 单位 m/s
imageWidth: 20,
imageHeight: 40,
isShowLine: false, //轨迹线是否显示
isAgain: false,//轨迹运动是否重复,
traveledColor: '#32b1fb' //运动轨迹颜色
})
track.start()
track.on('length', (data) => {
let obj = { flag }
if (data && data[0].percent == 0) {
obj.icon = require('@/assets/point/start.png') // 开始
let item = data[0].position[0]
obj.coords = [{ jd: item[0], wd: item[1] }]
_that.makerSki(obj)
}
if (data && data[0].percent == 99) {
let len = data[0].position.length
let val = data[0].position[len - 1]
obj.coords = [{ jd: val[0], wd: val[1] }]
obj.icon = require('@/assets/point/end.png') // 结束
_that.makerSki(obj)
}
})
_that._self[flag].push(track)
}
// 移除轨迹
MapUtil.prototype.removeTrajectory = (flag) => {
if (_that._self[flag]) {
_that._self[flag].destroy();
_that._self[flag] = null
}
}
/**geojson 创建边界
* let data = {
* type: "FeatureCollection",
* features: [
* {
geometry: {
type: "Polygon",
coordinates: [it.coordinates]
},
properties: {
},
type: "Feature",
}
* ]
};
*/
MapUtil.prototype.createBoundarys = (res) => {
let { data } = res
if (!data) return false;
if (_that.polygonGeo) _that.removeBj();
_that.polygonGeo = map.createPolygon(data, {
color: 'rgba(20,237,245,0.3)',
outLineColor: '#cf1010',
outLineWidth: 6,
highlightColor: 'red',
type: 'solid',
labelOption: {
pixelOffset: [2, 0],
allShow: false,
fontColor: '#ffffff'
}
})
_that.polygonGeo.flyTo()
}
// 移除边界
MapUtil.prototype.removeBj = (res) => {
_that.polygonGeo.destroy()
}
// 打开详情弹窗
MapUtil.prototype.openInfoDetail = (flag, data) => {
switch (flag) {
case "rx":
emitter.emit('showJzInfo', data);
break;
case 'gaj':
case 'pcs':
case 'jwz':
case 'xfq':
case 'zdfkd':
emitter.emit('showGazy', data);
break;
case 'kfd':
emitter.emit("changeGroupPoint", { lx: 'kfd', xffwlx: '2', xffwid: data.kfdId });
emitter.emit('showGazy', [data]);
break;
case 'sp':
case 'map_gzy':
emitter.emit('showGzy', data);
emitter.emit("showGzyInfo", data);
break;
case 'kk':
emitter.emit('showGzy', data);
break;
case 'aj':
case 'jqMap':
emitter.emit('showAj', data);
break;
case 'yj':
case 'yjMap':
emitter.emit("showYjxq", data);
break;
case 'dzjg':
case 'school':
case 'hospital':
case 'banck':
case 'shop':
emitter.emit("showShzy", data);
break;
case 'qchzc_map':
case 'jczMap_hm':
case 'jczMap_hhx':
emitter.emit("showJcz", [data]);
break;
case 'cyryMap':
console.log(data, '从业人员');
emitter.emit("showCyry", [data]);
break;
}
}
}
// 获取uuid 作为边界图层ID
function getUUid() {
var list = [];
var hexDigits = "0123456789abcdefghijklmnopqrstuvwxyz";
for (var i = 0; i < 32; i++) {
list[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
list[14] = "4";
list[19] = hexDigits.substr((list[19] & 0x3) | 0x8, 1);
list[8] = list[13] = list[18] = list[23];
let uuid = list.join("");
return uuid;
}

3
src/components/GdMap/rs.json Normal file
View File

@ -0,0 +1,3 @@
{
"coords":"104.191712,30.332337,104.190379,30.321575,104.231962,30.315252,104.227763,30.283791,104.241479,30.268395,104.228153,30.257561,104.242864,30.244730,104.270769,30.240455,104.269092,30.219985,104.277914,30.224568,104.293406,30.209630,104.302729,30.213200,104.307097,30.202998,104.325129,30.207037,104.355347,30.194195,104.363096,30.183460,104.354874,30.185101,104.352787,30.178549,104.386214,30.163126,104.392108,30.139422,104.386563,30.134069,104.406584,30.128212,104.417883,30.110023,104.411449,30.102072,104.421724,30.093237,104.433945,30.091459,104.434490,30.102374,104.447575,30.103505,104.455815,30.090000,104.477106,30.090159,104.472787,30.079513,104.480840,30.075074,104.465410,30.062860,104.479359,30.049892,104.456587,30.050092,104.452813,30.040084,104.465165,30.035835,104.455327,30.027999,104.458818,30.019591,104.448027,29.999489,104.477911,29.990649,104.457530,29.956299,104.478816,29.947313,104.470366,29.937748,104.486035,29.924377,104.486081,29.908460,104.505562,29.900162,104.492675,29.891903,104.492992,29.877076,104.501067,29.874142,104.487466,29.868024,104.475572,29.839224,104.480389,29.823872,104.473848,29.813915,104.499239,29.808909,104.491448,29.794094,104.465447,29.790942,104.442186,29.735454,104.427166,29.742971,104.414194,29.733388,104.404817,29.736075,104.393217,29.753224,104.373968,29.744401,104.367685,29.731782,104.356188,29.739397,104.355446,29.733333,104.335661,29.730418,104.332333,29.717842,104.347244,29.712211,104.346778,29.702659,104.336663,29.700136,104.313561,29.713003,104.295611,29.673814,104.280138,29.671614,104.283271,29.663143,104.274707,29.653997,104.280570,29.652266,104.271474,29.639306,104.247799,29.635751,104.237983,29.645245,104.243843,29.650490,104.231474,29.654349,104.237800,29.660088,104.228079,29.663086,104.233011,29.673066,104.227693,29.678490,104.204520,29.666834,104.193826,29.684265,104.200269,29.695269,104.183408,29.688925,104.185530,29.712206,104.181102,29.708149,104.167587,29.719218,104.164097,29.712006,104.156209,29.719685,104.147994,29.708280,104.132691,29.711712,104.116456,29.735662,104.105234,29.739340,104.109314,29.745872,104.099019,29.750351,104.088669,29.742201,104.058084,29.781140,104.070105,29.785362,104.088526,29.816182,104.072903,29.815785,104.072469,29.829395,104.040234,29.833418,104.056118,29.857406,104.049233,29.871115,104.040958,29.865559,104.027382,29.876641,104.001555,29.876057,103.981529,29.851563,103.964863,29.857306,103.968616,29.869100,103.991537,29.880289,103.998148,29.894420,103.984192,29.887484,103.969852,29.890776,103.952945,29.917885,103.962461,29.927505,103.946054,29.965100,103.952523,29.969262,103.917956,29.980131,103.926683,29.990640,103.959824,29.983321,103.957729,29.994857,103.972654,30.001121,103.966893,30.009745,103.977840,30.029956,103.971729,30.047714,103.987262,30.074897,103.977687,30.093740,103.981558,30.102835,103.968602,30.112735,103.978708,30.128111,103.970273,30.143360,103.981090,30.145538,103.982377,30.158880,103.974518,30.161745,103.979487,30.172736,103.969649,30.180335,103.989892,30.197132,103.959528,30.216906,103.966730,30.233955,103.979510,30.240572,103.964281,30.252780,103.969394,30.267698,103.984404,30.277331,103.997281,30.265453,104.047086,30.274065,104.051446,30.261304,104.062409,30.268811,104.066778,30.256984,104.074634,30.261237,104.078283,30.250003,104.089862,30.253217,104.094024,30.241503,104.124537,30.228739,104.149999,30.246957,104.150805,30.269599,104.165559,30.285692,104.179104,30.327688,104.191656,30.332522,104.191712,30.332337;104.479952"
}

47
src/components/Hamburger/index.vue Normal file
View File

@ -0,0 +1,47 @@
<template>
<div class="hamburger-container" @click="toggleClick">
<SvgIcon
id="guide-hamburger"
class="hamburger"
:icon="icon"
color="white"
></SvgIcon>
</div>
</template>
<script setup>
import emitter from "@/utils/eventBus.js";
import { computed, getCurrentInstance, onMounted, ref } from "vue";
import { useStore } from "vuex";
const { proxy } = getCurrentInstance();
const keyIndex = ref(1);
const store = useStore();
onMounted(() => {
emitter.on("closeMeun", () => {
toggleClick();
});
});
const toggleClick = () => {
store.commit("app/triggerSidebarOpened");
proxy.mittBus.emit("mittFn", keyIndex.value++);
};
const icon = computed(() =>
store.getters.sidebarOpened ? "hamburger-opened" : "hamburger-closed"
);
</script>
<style lang="scss" scoped>
.hamburger-container {
padding: 0 8px;
display: inline-block;
cursor: pointer;
.hamburger {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
}
}
</style>

60
src/components/HelloWorld.vue Normal file
View File

@ -0,0 +1,60 @@
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
msg: String
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>

413
src/components/Map/GdMap/index.vue Normal file
View File

@ -0,0 +1,413 @@
<template>
<div :id="mapid" style="width: 100%; height: 100%;background-color: aliceblue;"></div>
<div class="changeMap_box" v-if="props.isShow">
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
</el-input-number>
</div>
</div>
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
import { MapUtil } from "./mapUtil";
import emitter from "@/utils/eventBus.js";
import { getItem } from "@/utils/storage";
const conditionRoute = ref(true); //路况
const mMap = ref(null); //地图对象
const mapUtil = ref(null); //地图工具对象
const zoomTarget = ref(6);
const props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
isShowDraw: {
type: Boolean,
default: false
}
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) {}
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "446px";
box[0].style.transition = "0.5s";
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:4490",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [104.75433600759237, 31.458009915910402],
zoom: 10
},
minZoom: 7,
maxZoom: 18,
transformRequest: (url) => {
if (url.indexOf("TileMatrix=") != -1) {
const arr = url.split("TileMatrix=");
const arr1 = arr[1].split("&");
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${
arr1[2]
}`;
return {
url: nurl,
headers: {
"Content-Type": "image/png;charset=utf-8",
userToken: JSON.parse(window.localStorage.GdToken).userToken,
appToken: JSON.parse(window.localStorage.GdToken).appToken,
host: "152.9.14.26",
"authentication-code": "1edce2b3-bcd7-49da-939f-c4328c59281c"
}
};
} else {
if (url.indexOf("restcloud") != -1) {
return {
url: url,
headers: {
"Content-Type": "application/x-protobuf",
userToken: JSON.parse(window.localStorage.GdToken).userToken,
appToken: JSON.parse(window.localStorage.GdToken).appToken,
host: "152.9.14.26",
"authentication-code": "69e3a21f-befc-4458-881c-f5f685de2a1b"
}
};
}
}
}
});
window.map = map;
let layer;
// 路况
const add = () => {
layer = map.addMvtLayer({
url: window.location.origin + "/restcloud/pgis/api/mvt/road/condition/{z}/{x}/{y}",
sourceLayer: "mvt",
layer: "line",
style: {
paint: {
// state:道路路段交通情况（1畅通 2缓慢 3拥堵 4极度拥堵 5无数据）
"line-color": [
"match",
["get", "state"],
1,
"#53FF2B",
2,
"#FFEA47",
3,
"#FF5627",
4,
"#FF1200",
5,
"#999999",
"#53FF2B"
],
"line-width": 3
},
layout: {
"line-join": "miter",
"line-cap": "round"
}
}
});
};
map.mapboxGLMap.on("load", () => {
map.addWMTSLayer(
window.location.origin + "/restcloud/pgis/api/map/sl",
{
layer: "scmap",
style: "default",
tilematrixset: "ChinaPublicServicesCGCS2000_snzsllayers",
Service: "WMTS",
Request: "GetTile",
Version: "1.0.0",
Format: "image/png",
TileMatrix: "{z}",
TileRow: "{y}",
TileCol: "{x}"
},
{
tileSize: 300
}
);
add();
zoomTarget.value = map.mapboxGLMap.getZoom();
});
mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
});
emitter.on("removePlot", (flag) => {
mapUtil.value.removePlot(flag);
});
emitter.on("removeAll", (flag) => {
mapUtil.value.removeAll(flag);
});
// 撒点
emitter.on("addPointArea", (obj) => {
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
});
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(res);
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
}
.changeMap_box {
position: absolute;
right: 448px;
bottom: 4px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
& > img {
width: 100%;
height: 50px;
}
& > div {
text-align: center;
position: relative;
top: -3px;
}
}
.zoomTargetBox {
margin-top: 10px;
margin-left: 23px;
}
::v-deep .el-input-number__decrease,
::v-deep .el-input-number__increase {
border: none;
}
::v-deep .el-input__inner {
background: #0c1641;
}
}
</style>

371
src/components/Map/GdMap/indexnw.vue Normal file
View File

@ -0,0 +1,371 @@
<template>
<div :id="mapid" class="map"></div>
<div class="changeMap_box" v-if="props.isShow">
<el-switch
v-model="conditionRoute"
@change="handleSwitch"
active-text="打开路况"
inactive-text="关闭路况"
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949"
/>
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/slt.jpg')" alt="" />
<div>栅格浅色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
<div>影像图</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/yst.jpg')" alt="" />
<div>栅格深色</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="mapImageItem">
<img :src="require('@/assets/images/shy.png')" alt="" />
<div>三合一</div>
</div>
</el-carousel-item>
</el-carousel> -->
<!-- 地图缩放 -->
<div class="zoomTargetBox">
<el-input-number
:min="7"
:max="18"
v-model="zoomTarget"
:step="1"
step-strictly
@change="handleZoom"
>
</el-input-number>
</div>
</div>
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
import { MapUtil } from "./mapUtil";
import emitter from "@/utils/eventBus.js";
import { getItem } from "@/utils/storage";
const conditionRoute = ref(true); //路况
const mMap = ref(null); //地图对象
const mapUtil = ref(null); //地图工具对象
const zoomTarget = ref(6);
const props = defineProps({
mapid: {
type: String,
default: "mapDiv"
},
//是否显示可以切换地图底图
isShow: {
type: Boolean,
default: false
},
//是否显示实时路况
isShowMvt: {
type: Boolean,
default: false
},
//是否显示地图层级
isShowZoom: {
type: Boolean,
default: false
},
//是否显示绘制控件
isShowDraw: {
type: Boolean,
default: false
}
});
try {
const userInfo = getItem("deptId")[0].deptCode;
} catch (error) {}
let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
box[0].style.right = !res ? "4px" : "398px";
box[0].style.transition = "0.5s";
});
map = new EliMap({
id: props.mapid,
crs: "EPSG:4490",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36057012, 29.64276831],
zoom: 15
},
minZoom: 7,
maxZoom: 18
});
window.map = map;
map.mapboxGLMap.on("load", () => {
map.addWMTSLayer(
"/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap",
{
Service: "getImage",
Type: "RGB",
ZoomOffset: "0",
V: "0.3",
Zoom: "{z}",
Row: "{y}",
Col: "{x}"
},
{
tileSize: 300
}
);
zoomTarget.value = map.mapboxGLMap.getZoom();
});
mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层
emitter.on("setMapCenter", (res) => {
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
});
emitter.on("removePlot", (flag) => {
mapUtil.value.removePlot(flag);
});
emitter.on("removeAll", (flag) => {
mapUtil.value.removeAll(flag);
});
// 撒点
emitter.on("addPointArea", (obj) => {
mapUtil.value.makerSki(obj);
});
// 鼠标滑过提示文字的点位
emitter.on("showPoint", (obj) => {
mapUtil.value.showPoint(obj);
});
// 清除覆盖物
emitter.on("deletePointArea", (res) => {
mapUtil.value.removeElement(res);
});
// 清除某个覆盖物的单个
emitter.on("deletePointAreaOne", (obj) => {
mapUtil.value.removeElementOne(obj.flag, obj.id);
});
// 清除某个覆盖物的单个
emitter.on("showSquire", (obj) => {
mapUtil.value.zdySquire(obj);
});
// 绘制图形 - 回显区域
emitter.on("drawShape", (res) => {
mapUtil.value.plot(res, resFun);
});
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显图形
emitter.on("echoPlane", (res) => {
mapUtil.value.echoPlane(res);
});
//移除绘制区域
emitter.on("removeEara", (flag) => {
mapUtil.value.removeEara(flag);
});
// 回显线
emitter.on("echoLine", (res) => {
mapUtil.value.createLine(res, res.flag);
});
//创建边界面（geojson）
emitter.on("setBoundarys", (res) => {
mapUtil.value.createBoundarys(res);
});
// 移除边界
emitter.on("removeBj", (res) => {
mapUtil.value.removeBj(res);
});
// 轨迹回放
emitter.on("drawLineAnimation", (res) => {
mapUtil.value.displayLineAnimation(res);
});
// 聚合撒点
emitter.on("addPoint", (obj) => {
mapUtil.value.aggregateScatteringPoint(obj);
});
// 热力图显示
emitter.on("thermodynamicChart", (res) => {
mapUtil.value.showHeatDrawing(res);
});
// 扩散圆
emitter.on("diffusionCircle", (res) => {
mapUtil.value.diffusionCircle(res);
});
// 展示盘曲
emitter.on("showGapText", (obj) => {
mapUtil.value.gapText(obj);
});
// 获取当前地图中心点
emitter.on("getCurrentCenter", (res) => {
let centerPoint = map.mapboxGLMap.getCenter();
let coords = [centerPoint.lng, centerPoint.lat];
emitter.emit("getcentercoord", coords);
});
});
//切换地图底图
const onMapImageChange = (val) => {
//清除已经存在胡地图图层
if (map.mapboxGLMap.getLayer("SGQS_ID"))
map.mapboxGLMap.removeLayer("SGQS_ID");
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
if (map.mapboxGLMap.getLayer("SGSG_ID"))
map.mapboxGLMap.removeLayer("SGSG_ID");
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
map.mapboxGLMap.removeLayer("TDT_POI_ID");
//设置图层
switch (val) {
case 0:
mapSetLayer("SGQS_ID", "SGQS");
break;
case 1:
mapSetLayer("YX_ID", "YX");
break;
case 2:
mapSetLayer("SGSG_ID", "SGSG");
break;
case 3:
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
break;
}
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
};
//设置图层函数
const mapSetLayer = (id, source) => {
map.mapboxGLMap.addLayer({ id, type: "raster", source });
};
//获取地图绘制的数据
const resFun = (coord, type, flag, data) => {
emitter.emit("coordString", {
coord: coord,
type: type,
flag: flag,
data: data
});
};
// 地图层级
const handleZoom = (val) => {
map.mapboxGLMap.setZoom(val);
};
// 是否打开或者关闭路况
const handleSwitch = (val) => {
if (val) {
// 打开
} else {
// 关闭
}
};
onUnmounted(() => {
emitter.off("removePlot");
emitter.off("setMapCenter");
emitter.off("addPointArea");
emitter.off("showPoint");
emitter.off("deletePointArea");
emitter.off("deletePointAreaOne");
emitter.off("drawShape");
emitter.off("echoPlane");
emitter.off("removeEara");
emitter.off("echoLine");
emitter.off("addPoint");
emitter.off("thermodynamicChart");
emitter.off("drawLineAnimation");
emitter.off("aggregateScatteringPoint");
emitter.off("hotmap");
emitter.off("setBoundarys");
emitter.off("diffusionCircle");
emitter.off("SsCircle");
emitter.off("ClearssCircle");
});
</script>
<style lang="scss" scoped>
.map {
width: 100%;
height: 100%;
background-color: aliceblue;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 1;
}
.changeMap_box {
position: absolute;
right: 398px;
bottom: 4px;
z-index: 9;
.mapImageItem {
border: 1px solid #08aae8;
background: rgb(9, 26, 70);
& > img {
width: 100%;
height: 50px;
}
& > div {
text-align: center;
position: relative;
top: -3px;
}
}
.zoomTargetBox {
margin-top: 10px;
margin-left: 23px;
}
::v-deep .el-input-number__decrease,
::v-deep .el-input-number__increase {
background: #133362;
color: #fff;
border: none;
}
::v-deep .el-input__inner {
background: #0c1641;
}
}
</style>

776
src/components/Map/GdMap/mapUtil.js Normal file
View File

@ -0,0 +1,776 @@
import emitter from "@/utils/eventBus.js";
export function MapUtil(map) {
let _that = this;
_that.mMap = map; //地图对象
_that._self = {};//图层对象
_that._CustomDraw = null;//自定义绘图
_that.polygonGeo = null;//边界
_that.idsBox = {} //存放id的容器（需要某个标记单个删除的时候存储）
_that.isCheck = false
/**
* 设置地图中心点以
* @param {*} location 中心坐标 [jd,wd]
* @param {*} zoomLevel 层级 10
*/
MapUtil.prototype.setMapCenter = (location, zoomLevel) => {
map.mapboxGLMap.setCenter(location);
map.mapboxGLMap.setZoom(zoomLevel);
};
/**
* 撒点.鼠标滑动展示内容
* @param {*} coords 坐标 geojson
* @param {*} icon 图标
* @param {*} flag 标识
*/
MapUtil.prototype.showPoint = (res) => {
let { coords, icon, flag, iconH } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = [];
let pointList = coords.map((it, index) => {
let text = it.kfdMc || it.wzBc || it.gajgmc || it.xm || it.jczmc;
let obj = {
position: [it.jd, it.wd],
userData: { deviceSn: 'text' + index, area: text },
id: it.id,
text: text,
data: it
}
if (it.jd && it.wd) return obj;
});
const point = map.createdPoint(pointList, {
image: icon,//对应上面的图片名称
scale: 1,
highlightImage: iconH ? iconH : icon,//高亮图标
labelOption: {
pixelOffset: [0, -2],
allShow: false,
fontSize: '18px',
fontWeight: 600,
fontColor: '#000000'
}
})
_that._self[flag].push(point)
point.addEventListener("click", (val) => {
let data = val.data ? JSON.parse(val.data) : {};
// point.highlight(data.id) //高亮展示选中的点位
_that.openInfoDetail(flag, [data]) //点击打开详情
})
}
/**
* 撒点
* @param {*} coords 坐标 geojson
* @param {*} icon 图标
* @param {*} flag 标识
* @param {*} showTitle 是否展示标题
*/
MapUtil.prototype.makerSki = (res) => {
let { coords, icon, flag, showTitle } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = []; //存储地图标识的容器
if (!_that.idsBox[flag]) _that.idsBox[flag] = []; //存储id的容器
if (flag == 'rx') {
_that.handlePolice(coords, icon, flag, showTitle)
} else {
coords.forEach(item => {
let el = document.createElement("img");
el.src = item.icon || icon;
el.style.width = flag == 'kfd' ? '32px' : "25px";
if (flag.includes('jczMap_')) el.style.width = '45px';
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: [0, 0] })
el.addEventListener("click", () => {
_that.openInfoDetail(flag, item) //点击打开详情
})
_that._self[flag].push(marker)
_that.idsBox[flag].push(item.id)
});
}
};
// 警力处理展示
MapUtil.prototype.handlePolice = (coords, icon, flag, showTitle) => {
// 01-大型车辆-DXCL， 02-小型车辆=XXCL，03-摩托车-MTC，04-其他车辆-QTCL，05-重型车辆-ZXCL，06-风控车-FKC，07-巡逻车-XLC，08-装甲车-ZJC
coords.forEach(item => {
let el = document.createElement("img");
let jcIcon = require(`@/assets/point/police-car-bx.png`);
switch (item.lx) {
case '01': // 特警
jcIcon = require(`@/assets/point/specialPolice.png`);
break;
case '02': // 交警
jcIcon = require(`@/assets/point/trafficPolice.png`);
break;
case '03': // 派出所民警
jcIcon = require(`@/assets/point/peoplePolice.png`);
break;
default: // 默认图标
jcIcon = require(`@/assets/point/specialPolice.png`);
break;
}
if (item.zzlx == 1) jcIcon = require(`@/assets/point/by.png`); //便衣
let cllxList = item.cllx ? item.cllx.split(',') : [];
if ((cllxList.includes('03') || cllxList.includes('04')) && item.lx == '02') jcIcon = require(`@/assets/point/xljmtc.png`); //交警-摩托车
if ((cllxList.includes('03') || cllxList.includes('04')) && item.lx == '01') jcIcon = require(`@/assets/point/tjc.png`); //特警-摩托车
if (cllxList.includes('08') || cllxList.includes('06')) jcIcon = require(`@/assets/point/zjc.png`); //装甲车
el.src = jcIcon;
let isShoeCar = cllxList.includes('03') || cllxList.includes('08') //车辆类型
// el.style.width = isShoeCar ? '38px':"25px"; //图片大小
// if(cllxList.includes('08')) el.style.height = '40px'
if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
_that.shouIcon(item, [item.jd, item.wd]); // 展示装备图标
let offset = isShoeCar ? [-10, 0] : [0, 0];
if (cllxList.includes('08')) offset = [-12, -10]
const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: offset })
el.addEventListener("click", () => {
_that.openInfoDetail(flag, item) //点击打开详情
})
_that._self[flag].push(marker)
_that.idsBox[flag].push(item.id)
});
}
// 信息框展示
MapUtil.prototype.makerShowTitle = (item, points, flag, text) => {
let T = flag == 'rx' ? 'rxTitle' : 'Title'
let flagT = flag + T;
if (!_that._self[flagT]) _that._self[flagT] = [];
// 展示名字
let textTitle = item.jzMc ? item.jzMc : item.fzrXm + '警组';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') textTitle = item.sbmc;
if (flag == 'gapText') textTitle = text;
// 设置样式
const el = document.createElement('div');
el.className = 'makerTitle';
if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') el.className = 'makerTitlezb';
if (flag == 'rx') {
if (item.xfzt == '0') el.classList.add('makerTitleLine');
else if (item.xfzt == '1') el.classList.add('makerTitlecj');
else el.classList.add('makerTitleUnLine');
}
if (flag == 'gapText') el.className = 'makerTitleGapText';
// 渲染
el.innerHTML = textTitle;
const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -50] })
_that._self[flagT].push(marker)
}
/**
* 装备图标
* @param {点位数据} data
* @param {点} point
*/
MapUtil.prototype.shouIcon = (data, point) => {
if (!_that._self.gpsZb) _that._self.gpsZb = []
var qxIcon = require(`@/assets/point/qx.png`); //qixie
var zfjlyIcon = require(`@/assets/point/interphone.png`); // 对讲机
var clIcon = require(`@/assets/point/car.png`); // 车辆
let jyqx = typeof data.jyqx == "string" ? JSON.parse(data.jyqx) : data.jyqx ? data.jyqx : [];
let txzb = typeof data.txzb == "string" ? JSON.parse(data.txzb) : data.txzb ? data.txzb : [];
let pbcl = typeof data.pbcl == "string" ? JSON.parse(data.pbcl) : data.pbcl ? data.pbcl : [];
let list = []
let cl = (pbcl && pbcl.length > 0) ? true : false; // 车辆
let zb = (txzb && txzb.length > 0) ? true : false; // 智能装备
let qx = (jyqx && jyqx.length > 0) ? true : false; // 常用装备
if (zb) {
let el = document.createElement("img");
el.style.width = "15px"
el.src = zfjlyIcon;
const makerZb = map.Marker(el, point, { anchor: 'bottom', offset: [20, -26] })
list.push(makerZb)
}
if (qx) {
let elqx = document.createElement("img");
elqx.style.width = "15px"
elqx.src = qxIcon;
const makerQx = map.Marker(elqx, point, { anchor: 'bottom', offset: [20, -10] })
list.push(makerQx)
}
if (cl) {
let elcl = document.createElement("img");
elcl.style.width = "20px"
elcl.src = clIcon;
const makerCl = map.Marker(elcl, point, { anchor: 'bottom', offset: [20, 2] })
list.push(makerCl)
}
_that._self.gpsZb[data.id] = list
}
// 自定义展示
MapUtil.prototype.zdySquire = (obj) => {
let { points, flag, distance } = obj
if (!_that._self[flag]) _that._self[flag] = [];
let textTitle = '距离：' + distance; // 展示名字
const el = document.createElement('div');
el.className = 'makerTitle';
if (flag == 'distance') el.className = 'makerTitleDistance'; // 设置样式
el.innerHTML = textTitle;
const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -76] }) // 渲染
_that._self[flag].push(marker)
}
/**扩散圆
* @param coords:[jd,wd]
*/
MapUtil.prototype.diffusionCircle = (obj) => {
let { coords, flag, isClear } = obj
if (!_that._self[flag]) _that._self[flag] = {}
if (isClear) _that._self[flag].destroy() //destroy销毁，show(false) 移除
let data = [{ position: coords }]
_that._self[flag] = map.DiffuseCircle(data, {
radius: 10,
color: 'rgba(81,217,254)',//扫描扇形的颜色，必须是十六进制或者rgb
duration: 30,//圆环与上一个圆环出现的间隔时间。配合speed参数可以调整圆圈的数量
speed: 4 //圆环移动速度
})
}
/**
* 聚合撒点
* @param {*} coords 点位数据 geojson lng lat
* @param {*} icon 点位图
*/
MapUtil.prototype.aggregateScatteringPoint = (obj) => {
let { coords, icon, flag, isclear, scale, fontColor } = obj;
let points = coords.map(item => {
item.lng = item.jd;
item.lat = item.wd;
return item
})
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag) //移除聚合
let maker = map.clusterLayer(points, {
id: flag,
size: 18,
pixelRange: 60,
// gradient:{'1':'#00BFFF','10':'#008000', '100':'#FFA500', '1000':'#FF0000'},//可以自定义图片,把颜色换成图片地址
gradient: { '1': icon, '10': icon, '100': icon, '1000': icon },//可以自定义图片,把颜色换成图片地址
fontSize: 14,
fontColor: fontColor ? fontColor : '#001022',
style: 'custom',// spiral（螺旋形状），circle(圆圈)，custom(自定义)
image: icon,
scale: scale ? scale : 1,
// highlightImage:icon,
fontFamily: ['Microsoft YaHei']
})
_that._self[flag].push(maker)
// 聚合的点击一个
maker.addEventListener("click", (val) => {
_that.openInfoDetail(flag, [val]) //点击打开详情
})
// 聚合的多个
maker.addEventListener("clusterClick", (val) => {
_that.openInfoDetail(flag, val) //点击打开详情
})
};
/**
* 热力图
* @param {*} coords 数组
*/
MapUtil.prototype.showHeatDrawing = (res) => {
let { coords, flag, isclear, color } = res;
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag) //清除热力
let data = {
type: 'FeatureCollection',
features: []
}
for (let index = 0; index < coords.length; index++) {
const item = coords[index];
let jd = item.lng || item.jd;
let wd = item.lat || item.wd;
let mag = item.count <= 10 ? 1.4 : (item.count > 10 && item.count <= 50) ? 1.6 : 1.9;
let obj = {
properties: { mag },
type: 'Feature',
geometry: { type: 'Point', coordinates: [jd, wd, 0.1] }
}
data.features.push(obj)
}
let colors = { '0': 'rgba(23,102,172,0)', '0.5': 'rgb(209,229,240)', '1': 'rgb(178,24,43)' }
if (color) colors = { '0': color[0], '0.5': color[1], '1': color[2] }
let heartmap = map.HeatMap(data, { colors })
_that._self[flag].push(heartmap)
};
// 清除所有
MapUtil.prototype.removeAll = () => {
for (let key in _that._self) {
if (key != 'rx' && key != 'gpsZb' && !key.includes('rxTitle')) {
let list = _that._self[key]
for (let i = 0; i < list.length; i++) {
const el = list[i];
if (el && typeof el == 'object') el.destroy() //destory()销毁 , show(false) false:隐藏 true ：展示
}
_that._self[key] = [];
}
}
}
/**
* 删除图层要素
* @param {*} layer 唯一标识
*/
MapUtil.prototype.removeElement = (layer) => {
//警力装备
if (layer == 'gpsZb') {
for (let key in _that._self.gpsZb) {
let item = _that._self.gpsZb[key]
if (item && item.length > 0) {
for (let child in item) { item[child].destroy() }
_that._self.gpsZb[key] = []
}
}
}
if (layer == 'rx') _that.idsBox[layer] = [];
// 其他图层
if (!_that._self[layer]) return false;
if (layer !== 'gpsZb') {
for (let i = 0; i < _that._self[layer].length; i++) {
const el = _that._self[layer][i];
el.destroy()//destory()销毁 , show(false) false:隐藏 true ：展示
}
_that._self[layer] = [];
// d带标题的撒点
let T = layer == 'rx' ? 'rxTitle' : 'Title'
let flagT = layer + T;
if (!_that._self[flagT]) return false;
for (let i = 0; i < _that._self[flagT].length; i++) {
const el = _that._self[flagT][i];
el.destroy()//destory()销毁 , show(false) false:隐藏 true ：展示
}
_that._self[flagT] = []
}
};
/**
* 删除图层的某个要素
* @param {*} layer 唯一标识
*/
MapUtil.prototype.removeElementOne = (layer, id) => {
if (!_that.idsBox[layer]) return false;
let list = _that.idsBox[layer];
list.forEach((el, index) => {
if (el == id) {
_that.idsBox[layer].splice(index, 1);
if (_that._self[layer][index]) _that._self[layer][index].destroy()
_that._self[layer].splice(index, 1)
if (layer == 'rx') {
let flagT = layer + 'rxTitle';
if (_that._self[flagT][index]) _that._self[flagT][index].destroy()
_that._self[flagT].splice(index, 1)
_that.removeGpsZbOverlayById(id) //删除图标
}
}
})
};
// 删除图标装备
MapUtil.prototype.removeGpsZbOverlayById = (id) => {
if (_that._self.gpsZb[id]) {
try {
let info = _that._self.gpsZb[id]
if (info) {
info.forEach(element => { element.destroy() });
delete _that._self.gpsZb[id]
}
} catch (err) { }
}
}
// 绘制数据的初始化
MapUtil.prototype.Drawplot = (color) => {
const { point, line, polygon, circle, rectangle, geoJson, remove, enableEdit } = map.draw({
lineWidth: 2,
lineColor: 'rgba(233,168,32,1)',
fillColor: 'rgba(233,168,32,0.5)',
color: 'rgba(233,168,32,1)',
pixelSzie: 0,
})
_that._CustomDraw = { point, line, polygon, circle, rectangle, geoJson, remove, enableEdit }
}
/**
* 绘制工具
* @param {*} type 绘制形状
* (point 点, line 线, circle 圆, polygon 多边形, rectangle 矩形) ,
* geoJson:根据geojson回显图
*/
MapUtil.prototype.plot = (res, resFun) => {
let { flag, color, linecolor, type, coords } = res
if (!_that._self[flag]) _that._self[flag] = [];
if (res.isclear) _that.removePlot(flag); //移除绘制工具
if (res.isclear && (res.type == 'polygon' || res.type == 'line')) _that.removeEara(flag); //移除回显的面和线条
switch (type) {
case 'point':
_that._CustomDraw.point((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'rectangle':
_that._CustomDraw.rectangle((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'circle':
_that._CustomDraw.circle((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'polygon':
_that._CustomDraw.polygon((val) => { _that.handlePlot(val, type, flag, resFun) }, {
fillColor: color || 'rgba(233,168,32,0.5)',
lineColor: linecolor || 'rgba(233,168,32,1)',
})
break;
case 'line':
_that._CustomDraw.line((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
case 'geoJson'://返回面
let json = {
type: 'FeatureCollection',
features: [{
type: 'Feature',
geometry: {
type: 'Polygon',
coordinates: coords // coords 是三维数组
},
id: flag,
properties: {
fillColor: color || 'rgba(233,168,32,1)',
lineColor: linecolor || 'rgba(233,168,32,1)',
}
}],
}
_that._CustomDraw.geoJson(json, (data) => { _that.handlePlot(data, type, flag, resFun) })
break;
}
}
/**
* 处理自定义数据
* @param {*} val 返回数据
* @param {*} type 类型
* @param {*} flag 唯一标识
* @param {*} resFun 回调
*/
MapUtil.prototype.handlePlot = (val, type, flag, resFun) => {
_that._self[flag].push(val.id)
let coords = val.positionData; //绘制区域
resFun(coords, type, flag, val);
}
/**
* 移除绘制工具
* @param {*} flag 唯一标识
*/
MapUtil.prototype.removePlot = (flag) => {
if (!_that._self[flag]) return false;
_that._self[flag].forEach(v => {
_that._CustomDraw.remove(v)
})
}
/**
* 移除绘制面
* @param {*} flag 唯一标识
*/
MapUtil.prototype.removeEara = (flag) => {
_that._CustomDraw.remove(flag)
_that.removePlot(flag)
}
/**
* 创建线
* @param {*} type 回显形状
* (solid 实线, dash 虚线, FlowColor 彩虹线, RoadLine 流线
*/
MapUtil.prototype.createLine = (res) => {
let { type, coords, isclear, flag, color, width } = res;
if (!coords) return false; // coords 是数组对象，可以同时撒多条数据
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag); //移除回显的线条
let data = coords.map((item, index) => {
return {
position: item.coords[0], //二维数组
text: '',
id: index,
userData: {
name: item.text
}
}
})
let line = map.createLine(data, {
color: color ? color : 'rgba(20, 237, 245,1)',
width: width ? width : 8,
type,
highlightColor: 'red',
labelOption: {
pixelOffset: [0, -1],
allShow: false,
type: 'text',
fontColor: 'rgba(20, 237, 245,1)'
}
})
_that._self[flag].push(line)
}
/**
* 回显平面- 圆 - 多边形 - 矩形
* @param {*} type 回显形状
* type: 'polygon', 'rectangle
coords = [{
position:[[[jd,wd],[jd,wd] ---]], //三维数组
text,//展示的文字
id, //唯一标识
FID, //渲染颜色的标识
userData:{} //存储数据
}]
* type:circle
coords:[jd,wd] radius:半径
* @param {*} text 展示的文字
*/
MapUtil.prototype.echoPlane = (res) => {
let { type, coords, fontColor, fontSize, text = '', radius = 0, isclear, flag, id = 1, color, linecolor } = res;
if (!coords) return;
if (isclear) _that.removeElement(flag)
if (!_that._self[flag]) _that._self[flag] = [];
let color1 = color ? color : 'rgba(29,237,245,0.6)'
let linecolor1 = linecolor ? linecolor : 'rgba(29,237,245,0.6)'
let style = {
color: color1,
outLineColor: linecolor1,
outLineWidth: 2,
highlightColor: 'rgba(255,0,0,0.5)',
labelOption: {
pixelOffset: [0, 0],
allShow: true,
fontColor: fontColor ? fontColor : '#ffffff',
fontSize: fontSize ? fontSize : '12px'
}
}
let maker;
// 圆
if (type == 'circle') {
let params = [{ center: coords, radius, text, id }]
maker = map.createCircle(params, style);
}
// 矩形
if (type == 'rectangle') maker = map.createRectangle(coords, style);
// 多边形
if (type == 'polygon') maker = map.createPolygon(coords, style);
_that._self[flag].push(maker);
maker.addEventListener("click", (val) => {
if (flag == 'xfq') {
maker.highlight(val.id) //高亮展示
emitter.emit('showXFQinfo', val)
if (val.id == _that.lightHeight) {
_that.isCheck = !_that.isCheck
if (_that.isCheck) {
maker.highlight(0); //取消高亮展示
emitter.emit('showXFQinfo', null)
} else {
emitter.emit('showXFQinfo', val)
}
}
_that.lightHeight = val.id
}
if (flag == 'zdxl_fzyc') {
emitter.emit('showFzycInfo', { info: val, type: true })
}
})
}
// 分割线展示文字
MapUtil.prototype.gapText = (obj) => {
let { points, text, flag } = obj
_that.makerShowTitle({}, points, flag, text) //展示标题
}
/**
* 轨迹回放
* @param {*} coords 轨迹坐标.二维数组[[104.03640684556253,30.7415801286654],[103.98021233220163,30.6555411499294],[103.85766040251299,30.58094579138167]]
* @param {*} isClear 是否清除上一次的记录
*/
MapUtil.prototype.displayLineAnimation = (res) => {
let { coords, isClear, flag } = res
if (!coords) return;
if (!_that._self[flag]) _that._self[flag] = [];
if (isClear && _that._self[flag]) _that.removeElement(flag); //destroy 移除,start 播放,pause 暂停
let lineString = getUUid().slice(3, 5)
const data = [
{
position: coords,
text: '实线',
id: lineString,
userData: { name: '测试1' }
}
]
const track = map.trajectoryRealtime(data, {
color: '#28F', //轨迹背景颜色
width: 8,
image: 'images/car.png',
speed: 80, // 单位 m/s
imageWidth: 20,
imageHeight: 40,
isShowLine: false, //轨迹线是否显示
isAgain: false,//轨迹运动是否重复,
traveledColor: '#32b1fb' //运动轨迹颜色
})
track.start()
track.on('length', (data) => {
let obj = { flag }
if (data && data[0].percent == 0) {
obj.icon = require('@/assets/point/start.png') // 开始
let item = data[0].position[0]
obj.coords = [{ jd: item[0], wd: item[1] }]
_that.makerSki(obj)
}
if (data && data[0].percent == 99) {
let len = data[0].position.length
let val = data[0].position[len - 1]
obj.coords = [{ jd: val[0], wd: val[1] }]
obj.icon = require('@/assets/point/end.png') // 结束
_that.makerSki(obj)
}
})
_that._self[flag].push(track)
}
// 移除轨迹
MapUtil.prototype.removeTrajectory = (flag) => {
if (_that._self[flag]) {
_that._self[flag].destroy();
_that._self[flag] = null
}
}
/**geojson 创建边界
* let data = {
* type: "FeatureCollection",
* features: [
* {
geometry: {
type: "Polygon",
coordinates: [it.coordinates]
},
properties: {
},
type: "Feature",
}
* ]
};
*/
MapUtil.prototype.createBoundarys = (res) => {
let { data } = res
if (!data) return false;
if (_that.polygonGeo) _that.removeBj();
_that.polygonGeo = map.createPolygon(data, {
color: 'rgba(20,237,245,0.3)',
outLineColor: '#cf1010',
outLineWidth: 6,
highlightColor: 'red',
type: 'solid',
labelOption: {
pixelOffset: [2, 0],
allShow: false,
fontColor: '#ffffff'
}
})
_that.polygonGeo.flyTo()
}
// 移除边界
MapUtil.prototype.removeBj = (res) => {
_that.polygonGeo.destroy()
}
// 打开详情弹窗
MapUtil.prototype.openInfoDetail = (flag, data) => {
switch (flag) {
case "rx":
emitter.emit('showJzInfo', data);
break;
case 'gaj':
case 'pcs':
case 'jwz':
case 'xfq':
case 'zdfkd':
emitter.emit('showGazy', data);
break;
case 'kfd':
emitter.emit("changeGroupPoint", { lx: 'kfd', xffwlx: '2', xffwid: data.kfdId });
emitter.emit('showGazy', [data]);
break;
case 'sp':
emitter.emit('showGzy', data);
emitter.emit("showGzyInfo", data);
break;
case 'kk':
emitter.emit('showGzy', data);
break;
case 'aj':
case 'jqMap':
emitter.emit('showAj', data);
break;
case 'yj':
case 'yjMap':
emitter.emit("showYjxq", data);
break;
case 'dzjg':
case 'school':
case 'hospital':
case 'banck':
case 'shop':
emitter.emit("showShzy", data);
break;
case 'qchzc_map':
case 'jczMap_hm':
case 'jczMap_hhx':
emitter.emit("showJcz", [data]);
break;
case 'cyryMap':
console.log(data, '从业人员');
emitter.emit("showCyry", [data]);
break;
}
}
}
// 获取uuid 作为边界图层ID
function getUUid() {
var list = [];
var hexDigits = "0123456789abcdefghijklmnopqrstuvwxyz";
for (var i = 0; i < 32; i++) {
list[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
list[14] = "4";
list[19] = hexDigits.substr((list[19] & 0x3) | 0x8, 1);
list[8] = list[13] = list[18] = list[23];
let uuid = list.join("");
return uuid;
}

3
src/components/Map/GdMap/rs.json Normal file
View File

@ -0,0 +1,3 @@
{
"coords":"104.191712,30.332337,104.190379,30.321575,104.231962,30.315252,104.227763,30.283791,104.241479,30.268395,104.228153,30.257561,104.242864,30.244730,104.270769,30.240455,104.269092,30.219985,104.277914,30.224568,104.293406,30.209630,104.302729,30.213200,104.307097,30.202998,104.325129,30.207037,104.355347,30.194195,104.363096,30.183460,104.354874,30.185101,104.352787,30.178549,104.386214,30.163126,104.392108,30.139422,104.386563,30.134069,104.406584,30.128212,104.417883,30.110023,104.411449,30.102072,104.421724,30.093237,104.433945,30.091459,104.434490,30.102374,104.447575,30.103505,104.455815,30.090000,104.477106,30.090159,104.472787,30.079513,104.480840,30.075074,104.465410,30.062860,104.479359,30.049892,104.456587,30.050092,104.452813,30.040084,104.465165,30.035835,104.455327,30.027999,104.458818,30.019591,104.448027,29.999489,104.477911,29.990649,104.457530,29.956299,104.478816,29.947313,104.470366,29.937748,104.486035,29.924377,104.486081,29.908460,104.505562,29.900162,104.492675,29.891903,104.492992,29.877076,104.501067,29.874142,104.487466,29.868024,104.475572,29.839224,104.480389,29.823872,104.473848,29.813915,104.499239,29.808909,104.491448,29.794094,104.465447,29.790942,104.442186,29.735454,104.427166,29.742971,104.414194,29.733388,104.404817,29.736075,104.393217,29.753224,104.373968,29.744401,104.367685,29.731782,104.356188,29.739397,104.355446,29.733333,104.335661,29.730418,104.332333,29.717842,104.347244,29.712211,104.346778,29.702659,104.336663,29.700136,104.313561,29.713003,104.295611,29.673814,104.280138,29.671614,104.283271,29.663143,104.274707,29.653997,104.280570,29.652266,104.271474,29.639306,104.247799,29.635751,104.237983,29.645245,104.243843,29.650490,104.231474,29.654349,104.237800,29.660088,104.228079,29.663086,104.233011,29.673066,104.227693,29.678490,104.204520,29.666834,104.193826,29.684265,104.200269,29.695269,104.183408,29.688925,104.185530,29.712206,104.181102,29.708149,104.167587,29.719218,104.164097,29.712006,104.156209,29.719685,104.147994,29.708280,104.132691,29.711712,104.116456,29.735662,104.105234,29.739340,104.109314,29.745872,104.099019,29.750351,104.088669,29.742201,104.058084,29.781140,104.070105,29.785362,104.088526,29.816182,104.072903,29.815785,104.072469,29.829395,104.040234,29.833418,104.056118,29.857406,104.049233,29.871115,104.040958,29.865559,104.027382,29.876641,104.001555,29.876057,103.981529,29.851563,103.964863,29.857306,103.968616,29.869100,103.991537,29.880289,103.998148,29.894420,103.984192,29.887484,103.969852,29.890776,103.952945,29.917885,103.962461,29.927505,103.946054,29.965100,103.952523,29.969262,103.917956,29.980131,103.926683,29.990640,103.959824,29.983321,103.957729,29.994857,103.972654,30.001121,103.966893,30.009745,103.977840,30.029956,103.971729,30.047714,103.987262,30.074897,103.977687,30.093740,103.981558,30.102835,103.968602,30.112735,103.978708,30.128111,103.970273,30.143360,103.981090,30.145538,103.982377,30.158880,103.974518,30.161745,103.979487,30.172736,103.969649,30.180335,103.989892,30.197132,103.959528,30.216906,103.966730,30.233955,103.979510,30.240572,103.964281,30.252780,103.969394,30.267698,103.984404,30.277331,103.997281,30.265453,104.047086,30.274065,104.051446,30.261304,104.062409,30.268811,104.066778,30.256984,104.074634,30.261237,104.078283,30.250003,104.089862,30.253217,104.094024,30.241503,104.124537,30.228739,104.149999,30.246957,104.150805,30.269599,104.165559,30.285692,104.179104,30.327688,104.191656,30.332522,104.191712,30.332337;104.479952"
}

307
src/components/MyComponents/AddressSelect/index.vue Normal file
View File

@ -0,0 +1,307 @@
<template>
<div class="form-item-box zj-addressSelect-wrap" :style="{ width: width }">
<el-select :placeholder="placeholder" :clearable="true" v-model="value" popper-class="adderss-select"
@clear="handleClear">
<el-option value="1" style="display: none"></el-option>
<el-input v-if="filterable" v-model="filterText" style="margin-bottom: 5px; font-size: 12px"
:prefix-icon="Search" />
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane name="province" :label="province ? province : '请选择'">
<div class="citylist">
<ul>
<li @click="chooseProvince(item)" v-for="item in provinceList" :key="item.code"
:class="{ selected: provinceId == item.code }">
{{ item.name }}
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane name="city" v-if="cityList.length > 0" :label="city ? city : '请选择'">
<div class="citylist">
<ul>
<li @click="chooseCity(item)" v-for="item in cityList" :class="{ selected: cityId == item.code }"
:key="item.code">
{{ item.name }}
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane name="area" v-if="areaList.length > 0" :label="area ? area : '请选择'">
<div class="citylist">
<ul>
<li @click="chooseArea(item)" v-for="item in areaList" :key="item.code"
:class="{ selected: areaId == item.code }">
{{ item.name }}
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane name="street" v-if="streetList.length > 0" :label="street ? street : '请选择'">
<div class="citylist">
<ul>
<li @click="chooseStreet(item)" v-for="item in streetList" :key="item.code"
:class="{ selected: streetId == item.code }">
{{ item.name }}
</li>
</ul>
</div>
</el-tab-pane>
</el-tabs>
</el-select>
<!-- <el-icon class="errorIcon">
<circle-close-filled />
</el-icon>
<el-icon class="checkIcon">
<circle-check-filled />
</el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { nextTick, ref, watch } from "vue";
import { Search } from "@element-plus/icons-vue";
const emits = defineEmits(["handleChange"]); //子组件向父组件事件传递
const props = defineProps({
placeholder: {
default: "选择地址",
type: String
},
filterable: {
default: false,
type: Boolean
},
address: {
default: () => [],
type: Array
},
defaultConf: {
type: Object,
default: () => ({
children: "",
label: "",
id: ""
})
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const filterText = ref("");
const activeName = ref("province");
const value = ref("");
const valueId = ref([]);
const province = ref("");
const provinceId = ref("");
const provinceList = ref([]);
provinceList.value = require("@/constant/pca-code.json");
const city = ref("");
const cityId = ref("");
const cityList = ref([]);
const area = ref("");
const areaId = ref("");
const areaList = ref([]);
const street = ref("");
const streetId = ref("");
const streetList = ref([]);
const provinceListFilter = ref([]);
provinceListFilter.value = require("@/constant/pca-code.json");
const cityListFilter = ref([]);
const areaListFilter = ref([]);
const streetListFilter = ref([]);
nextTick(() => {
if (props.address.length > 0) {
init(props.address);
}
});
watch(filterText, (val) => {
filterNode(val);
});
const handleClick = () => {
filterText.value = "";
filterNode("");
};
const filterNode = (val) => {
if (activeName.value === "province") {
if (val !== "") {
provinceList.value = provinceListFilter.value.filter(
(item) => item[props.defaultConf.label].indexOf(val) !== -1
);
} else {
provinceList.value = provinceListFilter.value;
}
} else if (activeName.value === "city") {
if (val !== "") {
cityList.value = cityListFilter.value.filter(
(item) => item[props.defaultConf.label].indexOf(val) !== -1
);
} else {
cityList.value = cityListFilter.value;
}
} else if (activeName.value === "area") {
if (val !== "") {
areaList.value = areaListFilter.value.filter(
(item) => item[props.defaultConf.label].indexOf(val) !== -1
);
} else {
areaList.value = areaListFilter.value;
}
} else if (activeName.value === "street") {
if (val !== "") {
streetList.value = streetListFilter.value.filter(
(item) => item[props.defaultConf.label].indexOf(val) !== -1
);
} else {
streetList.value = streetListFilter.value;
}
}
};
const chooseProvince = (e) => {
province.value = e[props.defaultConf.label];
provinceId.value = e[props.defaultConf.id];
value.value = province.value;
valueId.value = [provinceId.value];
emits("handleChange", valueId.value);
city.value = "";
cityId.value = "";
cityList.value = [];
areaList.value = [];
streetList.value = [];
filterText.value = "";
provinceList.value.forEach((el) => {
if (el[props.defaultConf.id] === e[props.defaultConf.id]) {
if (el[props.defaultConf.children]) {
activeName.value = "city";
cityList.value = el[props.defaultConf.children];
cityListFilter.value = el[props.defaultConf.children];
}
}
});
};
const chooseCity = (e) => {
city.value = e[props.defaultConf.label];
cityId.value = e[props.defaultConf.id];
area.value = "";
areaId.value = "";
areaList.value = [];
streetList.value = [];
filterText.value = "";
value.value = province.value + "/" + city.value;
valueId.value = [provinceId.value, cityId.value];
emits("handleChange", valueId.value);
cityList.value.forEach((el) => {
if (el[props.defaultConf.id] === e[props.defaultConf.id]) {
if (el[props.defaultConf.children]) {
activeName.value = "area";
areaList.value = el[props.defaultConf.children];
areaListFilter.value = el[props.defaultConf.children];
}
}
});
};
const chooseArea = (e) => {
area.value = e[props.defaultConf.label];
areaId.value = e[props.defaultConf.id];
street.value = "";
streetId.value = "";
streetList.value = [];
filterText.value = "";
value.value = province.value + "/" + city.value + "/" + area.value;
valueId.value = [provinceId.value, cityId.value, areaId.value];
emits("handleChange", valueId.value);
areaList.value.forEach((el) => {
if (el[props.defaultConf.id] === e[props.defaultConf.id]) {
if (el[props.defaultConf.children]) {
streetList.value = el[props.defaultConf.children];
activeName.value = "street";
streetListFilter.value = el[props.defaultConf.children];
}
}
});
};
const chooseStreet = (e) => {
street.value = e[props.defaultConf.label];
streetId.value = e[props.defaultConf.id];
value.value =
province.value + "/" + city.value + "/" + area.value + "/" + street.value;
valueId.value = [
provinceId.value,
cityId.value,
areaId.value,
streetId.value
];
emits("handleChange", valueId.value);
};
const handleClear = () => {
activeName.value = "province";
value.value = "";
valueId.value = [];
province.value = "";
provinceId.value = "";
city.value = "";
cityId.value = "";
cityList.value = [];
area.value = "";
areaId.value = "";
areaList.value = [];
street.value = "";
streetId.value = "";
streetList.value = [];
cityListFilter.value = [];
areaListFilter.value = [];
streetListFilter.value = [];
filterText.value = "";
filterNode("");
emits("handleChange", []);
};
const treeValueFind = (tree, arr, newArr = []) => {
tree.forEach((el) => {
if (el[props.defaultConf.id] === arr) {
newArr.push(el);
}
if (el[props.defaultConf.children]) {
treeValueFind(el[props.defaultConf.children], arr, newArr);
}
});
return newArr;
};
const init = (data) => {
let obj1 = treeValueFind(provinceList.value, data[0])[0];
province.value = obj1[props.defaultConf.label];
provinceId.value = obj1[props.defaultConf.id];
cityList.value = obj1[props.defaultConf.children];
cityListFilter.value = obj1[props.defaultConf.children];
value.value = province.value;
if (data[1]) {
let obj2 = treeValueFind(provinceList.value, data[1])[0];
city.value = obj2[props.defaultConf.label];
cityId.value = obj2[props.defaultConf.id];
areaList.value = obj2[props.defaultConf.children];
areaListFilter.value = obj2[props.defaultConf.children];
value.value = province.value + "/" + city.value;
}
if (data[2]) {
let obj3 = treeValueFind(provinceList.value, data[2])[0];
area.value = obj3[props.defaultConf.label];
areaId.value = obj3[props.defaultConf.id];
streetList.value = obj3[props.defaultConf.children];
streetListFilter.value = obj3[props.defaultConf.children];
value.value = province.value + "/" + city.value + "/" + area.value;
}
if (data[3]) {
let obj4 = treeValueFind(provinceList.value, data[3])[0];
street.value = obj4[props.defaultConf.label];
streetId.value = obj4[props.defaultConf.id];
value.value =
province.value + "/" + city.value + "/" + area.value + "/" + street.value;
}
};
</script>
<style lang="scss" scoped>
.zj-addressSelect-wrap {
::v-deep .el-select {
width: 100%;
}
}
</style>

214
src/components/MyComponents/CarNumber/index.vue Normal file
View File

@ -0,0 +1,214 @@
<template>
<div class="zj-carnumber-box form-item-box" :style="{ width: width }">
<el-select
:class="{ 'error-input': carProvinceError }"
class="carnumber-select"
v-model="editForm.carProvince"
clearable
:placeholder="placeholder"
@change="carProvinceSelect"
popper-class="carnumber-select"
>
<el-option
v-for="item in allKeyWord.province"
:key="item"
:label="item"
:value="item"
>
</el-option>
</el-select>
<el-popover placement="bottom" popper-class="alphabet-select-wrap" trigger="click">
<template #reference>
<el-input
:class="{ 'error-input': carAlphabetError }"
class="carnumber-input"
style="text-transform:uppercase; "
:maxlength="maxlength"
@input="inputNumber"
onkeyup="value=value.replace(/[^\w\.\/]/ig,'')"
@clear="clearCarAlphabet"
v-model="editForm.carAlphabet"
placeholder="请输入车牌号"
/>
</template>
<div class="alphabet" >
<ul>
<li
@click="chooseNumber(item)"
v-for="item in allKeyWord.alphabet"
:key="item"
>
{{ item }}
</li>
</ul>
</div>
</el-popover>
<div class="error-tips" v-if="showErrorTips">{{ errorTips }}</div>
<!-- <el-icon class="errorIcon"><circle-close-filled /></el-icon>
<el-icon class="checkIcon"><circle-check-filled /></el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { ref, reactive, nextTick } from "vue";
const emits = defineEmits(["handleChange"]); //子组件向父组件事件传递
const props = defineProps({
//获取组件传值
carnumber: {
default: "",
type: String
},
nationOption: {
default: () => [],
type: Array
},
placeholder: {
default: "请选择",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const maxlength = 7;
const showErrorTips = ref(false);
const carProvinceError = ref(false);
const carAlphabetError = ref(false);
const errorTips = ref("");
const editForm = reactive({
carProvince: "",
carAlphabet: ""
});
nextTick(() => {
if (props.carnumber) {
editForm.carProvince = props.carnumber.substr(0, 1);
editForm.carAlphabet = props.carnumber.slice(1);
numberList.value = editForm.carAlphabet.split("");
}
});
const carNumber = ref("");
const numberList = ref([]);
const allKeyWord = {
province: [
"京",
"津",
"沪",
"渝",
"川",
"新",
"藏",
"宁",
"贵",
"桂",
"云",
"黑",
"吉",
"辽",
"晋",
"翼",
"青",
"鲁",
"豫",
"苏",
"皖",
"浙",
"闽",
"赣",
"湘",
"鄂",
"琼",
"甘",
"陕",
"蒙",
"粤"
// '港',
// '澳',
// '台',
// '使',
// '领',
// '警',
// '学'
],
alphabet: [
1,
2,
3,
4,
5,
6,
7,
8,
9,
0,
"A",
"B",
"C",
"D",
"E",
"F",
"G",
"H",
"J",
"K",
"L",
"M",
"N",
"O",
"P",
"Q",
"R",
"S",
"T",
"U",
"V",
"W",
"X",
"Y",
"Z"
]
};
const carProvinceSelect = (data) => {
carNumber.value = editForm.carProvince + editForm.carAlphabet;
emits("handleChange", carNumber.value.toUpperCase());
};
const clearCarAlphabet = () => {
editForm.carAlphabet = "";
numberList.value = [];
emits("handleChange", "");
};
const inputNumber = () => {
carNumber.value = editForm.carProvince + editForm.carAlphabet;
emits("handleChange", carNumber.value.toUpperCase());
};
const chooseNumber = (e) => {
numberList.value = editForm.carAlphabet.split(",");
numberList.value.push(e);
editForm.carAlphabet = numberList.value.toString().replace(/,/g, "");
carNumber.value = editForm.carProvince + editForm.carAlphabet;
emits("handleChange", carNumber.value.toUpperCase());
};
</script>
<style lang="scss" scoped>
.zj-carnumber-box {
display: flex;
justify-content: flex-start;
::v-deep .carnumber-select {
width: 88px !important;
.el-input {
width: 88px !important;
min-width: 88px !important;
}
}
.carnumber-input {
width: 100%;
::v-deep .el-input__inner{
width: 100%;
text-transform: uppercase ;
}
}
}
</style>

88
src/components/MyComponents/ChooseIcon/index.vue Normal file
View File

@ -0,0 +1,88 @@
<template>
<!--选择图标-->
<div class="form-item-box choose-icon-zj" :style="{ width: width }">
<el-autocomplete v-bind="$attrs" v-model="modelValue" :fetch-suggestions="querySearch"
popper-class="choose-icon-zj-autocomplete" :placeholder="placeholder" @change="onInput" @select="handleSelect">
<template #prefix>
<SvgIcon :icon="modelValue"></SvgIcon>
</template>
<template #default="{ item }">
<SvgIcon :icon="item.link"></SvgIcon>
<div class="value">{{ item.value }}</div>
</template>
</el-autocomplete>
<!-- <el-icon class="errorIcon">
<circle-close-filled />
</el-icon>
<el-icon class="checkIcon">
<circle-check-filled />
</el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, defineExpose, onMounted } from "vue";
const props = defineProps({
placeholder: {
default: "请输入图标名称",
type: String
},
modelValue: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const links = ref([]);
const querySearch = (queryString, cb) => {
const results = queryString
? links.value.filter(createFilter(queryString))
: links.value;
cb(results);
};
const createFilter = (queryString) => {
return (restaurant) => {
return (
restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
);
};
};
const handleSelect = (item) => {
emits("update:modelValue", item.value);
};
const handleIconClick = (ev) => {
};
const loadAll = () => {
const svgRequire = require.context("@/icons/svg", false, /\.svg$/);
const re = svgRequire.keys().map((svgIcon) => {
const iconName = svgIcon.split("/")[1];
const prefixIconName = iconName.split(".")[0];
return { value: prefixIconName, link: prefixIconName };
});
return re;
};
const iconListShow = ref(false);
const showIconList = () => {
iconListShow.value = true;
};
onMounted(() => {
links.value = loadAll();
});
const emits = defineEmits(["update:modelValue"]);
const onInput = (e) => {
emits("update:modelValue", e);
};
</script>
<style lang="scss" scoped>
</style>

178
src/components/MyComponents/ChooseJz/FjLoad.vue Normal file
View File

@ -0,0 +1,178 @@
<template>
<el-dialog title="选择辅警" width="1400px" v-model="modelValue" :append-to-body="true" @close="closed">
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input v-model="listQuery.xm" placeholder="请输入姓名" clearable />
</el-form-item>
<el-form-item label="身份证号码">
<el-input v-model="listQuery.sfzh" placeholder="请输入身份证号码" clearable />
</el-form-item>
<el-form-item label="所属部门" v-if="showBm">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" :row-key="keyid"
border style="width: 100%" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column label="序号" type="index" align="center" sortable width="80" />
<el-table-column sortable prop="xm" show-overflow-tooltip align="center" label="辅警姓名">
</el-table-column>
<el-table-column sortable prop="sfzh" show-overflow-tooltip align="center" label="身份证号码">
</el-table-column>
<el-table-column sortable prop="ssbm" label="所属部门" align="center"></el-table-column>
<el-table-column sortable prop="jh" label="警号" align="center"></el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent" :page-sizes="[10, 20, 50, 100]" :page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick } from "vue";
import { getTbJcglXfll } from "@/api/xfll";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleIds: {
type: Array,
default: []
},// 回显
//是否单选
Single: {
type: Boolean,
default: false
},
showBm: {
type: Boolean,
default: true
},
ssbmdm: {
type: String,
default: ""
}
});
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
fl: "02"
});
const keyid = (row) => {
return row.id;
};
const form = ref({});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
onMounted(() => {
handleFilter();
})
// 分页
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
// 获取列表
const getListData = async () => {
const params = { ...listQuery.value, ssbmdm: props.ssbmdm };
const res = await getTbJcglXfll(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser() {
tableData.value.forEach(item => {
if (props.roleIds.some(id => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row, false)
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
// 重置
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, fl: "02" };
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value
let list = []
let listId = []
userList.forEach(val => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
closed();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

287
src/components/MyComponents/ChooseJz/JyqxLoad.vue Normal file
View File

@ -0,0 +1,287 @@
<template>
<div>
<el-dialog
title="选择常用装备"
width="1400px"
v-model="modelValue"
@close="closed"
>
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="器械类型">
<el-select
v-model="listQuery.scode"
class="m-2"
placeholder="请选择器械类型"
>
<el-option
v-for="item in D_BZ_JYQXFL"
:label="item.label"
:key="item.value"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="所属部门" v-if="showBm">
<MOSTY.Department
width="100%"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="购置日期">
<el-date-picker
v-model="listQuery.cgrq"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
type="date"
unlink-panels
placeholder="请选择日期"
/>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
:row-key="keyid"
style="width: 100%"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
/>
<el-table-column
type="index"
show-overflow-tooltip
align="center"
width="60px"
label="序号"
>
</el-table-column>
<el-table-column
sortable
prop="ssbm"
label="所属部门"
width="200px"
align="center"
></el-table-column>
<el-table-column
sortable
prop="scode"
show-overflow-tooltip
align="center"
label="器械类型"
>
<template #default="{ row }">
<dict-tag
:options="D_BZ_JYQXFL"
:value="row.scode"
:tag="false"
/>
</template>
</el-table-column>
<el-table-column
sortable
prop="qxMc"
show-overflow-tooltip
align="center"
label="器械名称"
>
</el-table-column>
<el-table-column
sortable
prop="qxbh"
show-overflow-tooltip
align="center"
label="器械型号"
>
</el-table-column>
<el-table-column
sortable
prop="cgrq"
show-overflow-tooltip
label="生产日期"
align="center"
width="200px"
>
</el-table-column>
<el-table-column
sortable
prop="qxPch"
show-overflow-tooltip
label="录入批次"
align="center"
width="200px"
>
</el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageNo"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import {
defineProps,
watch,
ref,
onMounted,
nextTick,
getCurrentInstance
} from "vue";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
const { proxy } = getCurrentInstance();
const { D_BZ_JYQXFL } = proxy.$dict("D_BZ_JYQXFL");
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleIds: {
type: Array,
default: []
},
showBm: {
type: Boolean,
default: true
},
ssbmdm: {
type: String,
default: ""
}
});
const total = ref(0);
const listQuery = ref({
pageNo: 1,
pageSize: 20
});
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
onMounted(() => {
handleFilter();
});
const closed = () => {
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = {
pageNo: 1,
pageSize: 20
};
getListData();
};
const keyid = (row) => {
return row.id;
};
// 为用户分配角色
const onComfirm = () => {
const userList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
let list = []
let listId = []
userList.forEach(val=>{
if(listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageNo = currentPage;
getListData();
};
const getListData = async () => {
const params = listQuery.value;
const res = await qcckGet(params, "/mosty-jmxf/tpJcglJyqx/selectJyqx");
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser();
};
//列表回显
function multipleUser(row) {
tableData.value.forEach(item=>{
if(props.roleIds.some(id=>id == item.id)){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
const handleFilter = () => {
listQuery.value.pageNo = 1;
listQuery.ssbmdm = props.ssbmdm;
getListData();
};
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
multipleSelectionUser.value = val;
};
watch(
() => props.modelValue,
(val) => {
if (val === true) {
handleFilter();
}
}
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

235
src/components/MyComponents/ChooseJz/JzLoad.vue Normal file
View File

@ -0,0 +1,235 @@
<template>
<div>
<el-dialog title="选择警组" width="1400px" :model-value="modelValue" @close="closed">
<div v-if="modelValue">
<el-form :model="listQuery" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department
width="280px"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="警组名称">
<el-input
v-model="listQuery.jzMc"
placeholder="请输入警组名称"
clearable
/>
</el-form-item>
<el-form-item label="负责人">
<el-input
v-model="listQuery.ddMjxm"
placeholder="请输入负责人"
clearable
/>
</el-form-item>
<el-form-item>
<el-button @click="handleFilter"> 查询 </el-button>
<el-button @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
/>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
prop="jzMc"
show-overflow-tooltip
align="center"
label="警组名称"
>
</el-table-column>
<el-table-column
prop="ssbm"
label="所属部门"
align="center"
></el-table-column>
<el-table-column
prop="ddMjxm"
show-overflow-tooltip
label="警组负责人"
align="center"
>
</el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick } from "vue";
import { getJzList } from "@/api/basicsmanage/servicejz.js";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleId: {
type: String || Array,
default: "" || []
},
jczid:{
type:String,
default:""
},
//是否单选
Single: {
type: Boolean,
default: true
},
});
const keyid = (row) => {
return row.id;
};
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
jczid:props.jczid
});
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
onMounted(() => {
handleFilter();
});
// 重置
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, jczid:props.jczid };
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
if (props.Single) {
ElMessage({ type: "warning", message: "请每次选择一个警组!" });
} else {
emits("choosedUsers", userList);
closed();
}
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const getListData = async () => {
const params = listQuery.value;
const res = await getJzList(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser(row) {
tableData.value.forEach(item=>{
if(Array.isArray(props.roleId)){
props.roleId.forEach(v=>{
if(v == item.id){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}else{
if(props.roleId == item.id){
multipleUserRef.value.toggleRowSelection(item, true);
}
}
})
}
// 分页
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
// 多选
const handleSelectionChange = (val) => {
if(props.Single){
if(val.length>1){
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row,false)
}
multipleSelectionUser.value = val;
}else{
multipleSelectionUser.value = val;
}
};
watch(() => props.modelValue,(val) => {
if (val === true) handleFilter();
}
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner{
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox{
display: none;
}
</style>

277
src/components/MyComponents/ChooseJz/JzclLoad.vue Normal file
View File

@ -0,0 +1,277 @@
<template>
<el-dialog
title="选择警用车辆"
width="1400px"
:model-value="modelValue"
@close="closed"
>
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门" v-if="showBm">
<MOSTY.Department
width="100%"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="车牌号">
<el-input
v-model="listQuery.cph"
placeholder="请输入车牌号"
></el-input>
</el-form-item>
<el-form-item label="车辆品牌">
<el-select
filterable
v-model="listQuery.clpp"
class="m-2"
placeholder="请选择"
>
<el-option
v-for="item in D_BZ_CLPP"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div
class="tabBox"
:class="props.Single ? 'tabBoxRadio' : ''"
style="margin-top: 0px"
>
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
:row-key="keyid"
style="width: 100%"
height="450"
>
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column
type="index"
show-overflow-tooltip
align="center"
width="60px"
label="序号"
>
</el-table-column>
<el-table-column
sortable
prop="ssbm"
show-overflow-tooltip
align="center"
width="250px"
label="所属部门"
>
</el-table-column>
<el-table-column
sortable
prop="cplx"
show-overflow-tooltip
align="center"
width="150px"
label="号牌种类"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_HPZL" :value="row.cplx" :tag="false" />
</template>
</el-table-column>
<el-table-column
sortable
prop="cph"
label="车牌号"
width="250px"
align="center"
></el-table-column>
<el-table-column
sortable
prop="clpp"
show-overflow-tooltip
label="车辆品牌"
align="center"
width="250px"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_CLPP" :value="row.clpp" :tag="false" />
</template>
</el-table-column>
<el-table-column
sortable
prop="clnk"
show-overflow-tooltip
label="车辆年款"
align="center"
></el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import {
defineProps,
ref,
onMounted,
nextTick,
getCurrentInstance
} from "vue";
import { getXfcl } from "@/api/basicsmanage/watchmanCar";
const { proxy } = getCurrentInstance();
const { D_BZ_HPZL, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict(
"D_BZ_HPZL",
"D_BZ_CLYS",
"D_BZ_CLPP"
);
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleIds: {
type: Array,
default: []
},
//是否单选
Single: {
type: Boolean,
default: false
}, showBm: {
type: Boolean,
default: true
},
ssbmdm: {
type: String,
default: ""
}
});
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20
});
const form = ref({});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
onMounted(() => {
handleFilter();
});
const closed = () => {
emits("update:modelValue", false);
};
const keyid = (row) => {
return row.cid;
};
const reset = () => {
listQuery.value = {ssbmdm:props.ssbmdm,
pageCurrent: 1,
pageSize: 20
};
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = []
let listId = []
userList.forEach(val=>{
if(listId.indexOf(val.cid) == -1) {
list.push(val);
listId.push(val.cid);
}
})
emits("choosedUsers", list);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const getListData = async () => {
const params = {...listQuery.value,ssbmdm:props.ssbmdm};
const res = await getXfcl(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
//列表回显
function multipleUser() {
tableData.value.forEach(item=>{
if(props.roleIds.some(id=>id == item.cid)){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

280
src/components/MyComponents/ChooseJz/MjLoad.vue Normal file
View File

@ -0,0 +1,280 @@
<template>
<div>
<el-dialog
:title="titleValue"
width="1400px"
:model-value="modelValue"
:destroy-on-close="true"
@close="closed"
>
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input
v-model="listQuery.xm"
placeholder="请输入姓名"
clearable
/>
</el-form-item>
<el-form-item label="身份证号码">
<el-input
v-model="listQuery.sfzh"
placeholder="请输入身份证号码"
clearable
/>
</el-form-item>
<el-form-item label="所属部门" v-if="showBm">
<MOSTY.Department
width="100%"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="专业技能">
<el-select v-model="listQuery.bqId">
<el-option v-for="item in lxList" :key="item.id" :label="item.bqmc" :value="item.id" ></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
/>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
sortable
prop="xm"
show-overflow-tooltip
align="center"
label="民警姓名"
>
</el-table-column>
<el-table-column
sortable
prop="sfzh"
show-overflow-tooltip
align="center"
label="身份证号码"
>
</el-table-column>
<el-table-column
sortable
prop="sklList"
show-overflow-tooltip
align="center"
label="专业技能"
>
<template #default="{ row }">
<span class="tag" v-for="it in row.sklList" :key="it">{{it.bqmc}}</span>
</template>
</el-table-column>
<el-table-column
sortable
prop="ssbm"
label="所属部门"
align="center"
></el-table-column>
<el-table-column
sortable
prop="jh"
label="警号"
align="center"
></el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { getCountBqsl } from "@/api/xfll";
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref,reactive, onMounted, nextTick,watchEffect } from "vue";
import { getTbJcglXfll } from "@/api/xfll";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
titleValue: {
type: String,
default: "选择民警"
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
},// 回显
showBm: {
type: Boolean,
default: true
},
ssbmdm: {
type: String,
default: ""
}
});
const keyid = (row) => { return row.ryid; };
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
fl: "01"
});
const form = ref({});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
const lxList = reactive([]); //搜索框标签选择数据
watch(() => props.modelValue,
(val) => { if (val === true) handleFilter();}
);
onMounted(() => {
getListData();
//获取搜索栏标签选择数据
getCountBqsl().then((res) => {
res.forEach((item) => {
lxList.push(item);
});
});
});
// 分页
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
// 获取列表
const getListData = async () => {
const params ={...listQuery.value,ssbmdm:props.ssbmdm};
const res = await getTbJcglXfll(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser() {
tableData.value.forEach(item=>{
if(props.roleIds.some(id=>id == item.ryid)){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
// 重置
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, fl: "01", };
getListData();
};
const handleSelectionChange = (val) => {
if(props.Single){
if(val.length>1){
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row,false)
}
multipleSelectionUser.value = val;
}else{
multipleSelectionUser.value = val;
}
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value
let list = []
let listId = []
userList.forEach(val=>{
if(listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
closed();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
.tag{
padding: 1px 4px;
box-sizing: border-box;
margin: 0 4px;
border: 1px solid #24869b;
border-radius: 4px;
}
</style>
<style>
.tabBoxRadio .el-checkbox__inner{
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox{
display: none;
}
</style>

201
src/components/MyComponents/ChooseJz/QfqzLoad.vue Normal file
View File

@ -0,0 +1,201 @@
<template>
<div>
<el-dialog :title="titleValue" width="1400px" :model-value="modelValue" :destroy-on-close="true" @close="closed">
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input v-model="listQuery.xm" placeholder="请输入姓名" clearable />
</el-form-item>
<el-form-item label="身份证号码">
<el-input v-model="listQuery.sfzh" placeholder="请输入身份证号码" clearable />
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" border
style="width: 100%" :row-key="keyid" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column label="序号" type="index" align="center" sortable width="80" />
<el-table-column sortable prop="xm" show-overflow-tooltip align="center" label="民警姓名">
</el-table-column>
<el-table-column sortable prop="sfzh" show-overflow-tooltip align="center" label="身份证号码">
</el-table-column>
<el-table-column sortable prop="sklList" show-overflow-tooltip align="center" label="人员类型">
<template #default="{ row }">
{{ row.rylx == '01' ? "群众" : "党员" }}
</template>
</el-table-column>
<el-table-column sortable prop="sjh" label="电话号码" align="center"></el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent" :page-sizes="[10, 20, 50, 100]" :page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { getCountBqsl } from "@/api/xfll";
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import {qfqzSelectPage } from '@/api/lz/backstage'
import { defineProps, watch, ref, reactive, onMounted, nextTick, watchEffect } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
titleValue: {
type: String,
default: "选择群防群治人员"
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
},// 回显
// showBm: {
// type: Boolean,
// default: true
// },
// ssbmdm: {
// type: String,
// default: ""
// }
});
const keyid = (row) => { return row.ryid; };
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
});
const form = ref({});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
const lxList = reactive([]); //搜索框标签选择数据
watch(() => props.modelValue,
(val) => { if (val === true) handleFilter(); }
);
onMounted(() => {
getListData();
//获取搜索栏标签选择数据
getCountBqsl().then((res) => {
res.forEach((item) => {
lxList.push(item);
});
});
});
// 分页
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
// 获取列表
const getListData = async () => {
const params = listQuery.value;
const res = await qfqzSelectPage(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser() {
tableData.value.forEach(item => {
if (props.roleIds.some(id => id == item.ryid)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
// 重置
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, fl: "01", };
getListData();
};
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row, false)
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value
let list = []
let listId = []
userList.forEach(val => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
closed();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
.tag {
padding: 1px 4px;
box-sizing: border-box;
margin: 0 4px;
border: 1px solid #24869b;
border-radius: 4px;
}
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

315
src/components/MyComponents/ChooseJz/ZnzbLoad.vue Normal file
View File

@ -0,0 +1,315 @@
<template>
<el-dialog
title="选择智能装备"
width="1400px"
:model-value="modelValue"
@close="closed"
>
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门" v-if="showBm">
<MOSTY.Department
width="100%"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="装备类型">
<el-cascader
v-model="listQuery.scode"
:options="D_BZ_ZBLX_LZ"
:props="propsTree"
clearable
:show-all-levels="false"
>
</el-cascader>
</el-form-item>
<el-form-item label="生产日期">
<el-date-picker
unlink-panels
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
v-model="listQuery.gzrq"
type="date"
placeholder="请选择日期"
/>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
:row-key="keyid"
style="width: 100%"
height="450"
>
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column
type="index"
show-overflow-tooltip
align="center"
width="60px"
label="序号"
>
</el-table-column
><el-table-column
sortable
prop="ssbm"
label="所属部门"
width="250px"
align="center"
></el-table-column>
<el-table-column
sortable
prop="scode"
show-overflow-tooltip
align="center"
width="350px"
label="装备类型"
>
<template #default="{ row }">
<dict-tag :options="zbAllList" :value="row.scode" :tag="false" />
</template>
</el-table-column>
<el-table-column
sortable
prop="xh"
show-overflow-tooltip
label="装备型号"
align="center"
></el-table-column>
<el-table-column
sortable
prop="sbmc"
show-overflow-tooltip
label="装备名称"
align="center"
></el-table-column>
<el-table-column
sortable
prop="cgrq"
show-overflow-tooltip
label="生产日期"
align="center"
width="200px"
>
</el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageNo"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick,getCurrentInstance } from "vue";
import { getZnzb } from "@/api/basicsmanage/intelligence";
const { proxy } = getCurrentInstance();
const { D_BZ_ZNZBFL,D_BZ_ZBLX_LZ } = proxy.$dict("D_BZ_ZNZBFL","D_BZ_ZBLX_LZ");
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleIds: {
type: Array,
default: []
},
//是否单选
Single: {
type: Boolean,
default: false
},
zblx: {
type: String,
default: ""
},
data: {
type: Array,
default: []
},
showBm: {
type: Boolean,
default: true
},
ssbmdm: {
type: String,
default: ""
}
});
const propsTree = ref({
checkStrictly: true,
emitPath: false,
multiple: false
});
const total = ref(0);
const listQuery = ref({
pageNo: 1,
pageSize: 20
})
const form = ref({});
const tableData = ref([]);
const zbAllList = ref([])
watch(
() => D_BZ_ZBLX_LZ.value,
(val) => {
val.forEach((p) => {
zbAllList.value.push(p);
if (p.itemList && p.itemList.length > 0) {
getChildren(p);
}
});
}
);
watch(
() => props.zblx,
(val) => {
if (val) {
listQuery.value.ssbmdm = props.ssbmdm
listQuery.value.scode = val ? val : "";
}
},{
deep:true,
immediate:true
}
);
// 递归处理数据
function getChildren(item) {
zbAllList.value.push(item);
if (item.itemList && item.itemList.length > 0) {
item.itemList.forEach((v) => {
getChildren(v);
});
}
}
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
function changelx(val) {
listQuery.value.scode = val ? val : "";
}
const reset = () => {
listQuery.value = {
pageNo: 1,
ssbmdm: props.ssbmdm,
pageSize: 20
};
listQuery.value.scode = props.zblx
getListData();
};
const keyid = (row) => {
return row.id;
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value
let list = []
let listId = []
userList.forEach(val=>{
if(listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageNo = currentPage;
getListData();
};
const getListData = async () => {
const params = listQuery.value;
const res = await getZnzb(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser(row) {
tableData.value.forEach(item=>{
if(props.roleIds.some(id=>id == item.id)){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
const handleFilter = () => {
listQuery.value.pageNo = 1;
getListData();
};
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
if(props.Single){
if(val.length>1){
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row,false)
}
multipleSelectionUser.value = val;
}else{
multipleSelectionUser.value = val;
}
};
onMounted(()=>{
handleFilter();
});
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner{
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox{
display: none;
}
</style>

337
src/components/MyComponents/ChooseJz/jczLoad.vue Normal file
View File

@ -0,0 +1,337 @@
<template>
<div>
<el-dialog
:title="titleValue"
width="1400px"
v-model="modelValue"
@close="closed"
>
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department
width="100%"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="检查站名称">
<el-input
v-model="listQuery.jczmc"
placeholder="请输入检查站名称"
clearable
/>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
:highlight-current-row="props.Single"
border
v-loading="loading"
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
v-if="!props.Single"
/>
<el-table-column width="55" #default="{ row }" v-else>
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
</el-table-column>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
sortable
prop="ssbm"
label="所属部门"
show-overflow-tooltip
align="center"
></el-table-column>
<el-table-column
sortable
prop="jczmc"
show-overflow-tooltip
align="center"
label="检查站名称"
>
</el-table-column>
<el-table-column
show-overflow-tooltip
align="center"
label="检查站类型"
prop="jczlx"
>
<template #default="{ row }">
<dict-tag
:options="D_BZ_JCZLX"
:value="row.jczlx"
:tag="false"
/>
</template>
</el-table-column>
<el-table-column
prop="xxdz"
show-overflow-tooltip
align="center"
label="检查站地址"
>
</el-table-column>
<el-table-column
sortable
prop="jd"
show-overflow-tooltip
label="经度"
align="center"
>
</el-table-column>
<el-table-column
sortable
prop="wd"
show-overflow-tooltip
label="纬度"
align="center"
>
</el-table-column>
</el-table>
</div>
<div class="fenye" >
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import {
defineProps,
watch,
ref,
onMounted,
nextTick,
getCurrentInstance
} from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_JCZLX } = proxy.$dict("D_BZ_JCZLX");
const props = defineProps({
//是否显示
modelValue: {
type: Boolean,
required: true
},
//标题
titleValue: {
type: String,
default: "选择检查站"
},
//是否单选
Single: {
type: Boolean,
default: false
},
//已经选中得数据回显
data: {
type: Array,
default: []
}
});
const keyid = (row) => {
return row.id;
};
const ridioIndex = ref(null);
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
jczmc: "",
ssbmdm: ""
});
const form = ref({});
const tableData = ref([]);
const loading = ref(false)
const emits = defineEmits(["update:modelValue", "choosedJcz"]);
const closed = () => {
listQuery.value.jczmc = "";
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = {
pageCurrent: 1,
pageSize: 20,
jczmc: "",
ssbmdm: ""
};
getListData();
};
// 判断传进来的选中数据和加载的选中数据不满足的数据
const checkopenList = ref([]);
// 确定选中
const onComfirm = () => {
//单选
if (props.Single) {
if (![ridioIndex.value][0]) {
proxy.$message.warning("请选择检查站");
return;
}
const info = tableData.value.find((item) => {
return item.id === ridioIndex.value;
});
emits("choosedJcz", [JSON.parse(JSON.stringify(info))]);
} else {
//多选
const jczList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
if (jczList.length === 0) {
proxy.$message.warning("请选择检查站");
return;
}
emits("choosedJcz", [...jczList, ...checkopenList.value]);
}
closed();
};
onMounted(() => {
getListData();
});
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
//检查站数据
const getListData = async () => {
loading.value = true
qcckGet(listQuery.value, "/mosty-jmxf/jcz/selectJczList").then((res) => {
tableData.value = res?.records;
loading.value = false
multipleUser(props.data, tableData.value);
total.value = Number(res.total);
}).catch(()=>{ loading.value = false });
};
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
multipleSelectionUser.value = val;
if (checkopenList.value) {
for (let i = 0; i < multipleSelectionUser.value.length; i++) {
const l = multipleSelectionUser.value[i];
for (let j = 0; j < checkopenList.value.length; j++) {
const z = checkopenList.value[j];
if (l.id == z.id) {
checkopenList.value.splice(j, 1);
}
}
}
}
};
//回显--用于多选表格
function multipleUser(row, list) {
if (row) {
if (props.Single) {
row.forEach((item) => {
list.forEach((select) => {
if (typeof item == "object") {
if (item.id == select.id) {
ridioIndex.value = item.id;
}
} else {
if (item == select.id) {
ridioIndex.value = item;
}
}
});
});
} else {
row.forEach((item) => {
list.forEach((select) => {
if (item.id == select.id) {
if (multipleUserRef.value) {
multipleUserRef.value.toggleRowSelection(select, true);
}
}
});
});
}
}
}
watch(
() => props.modelValue,
(val) => {
if (val === true) {
ridioIndex.value = "";
handleFilter();
}
}
);
watch(
() => props.data,
(val) => {
if (multipleUserRef.value) multipleUser(val, tableData.value);
checkopenList.value = JSON.parse(JSON.stringify(val));
}
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
::v-deep .el-form--inline {
padding-left: 0 !important;
}
::v-deep .el-radio__label {
display: none;
}
::v-deep .el-table__body tr.current-row > td.el-table__cell {
background: #106fdc;
}
</style>

207
src/components/MyComponents/ChooseJz/ryload.vue Normal file
View File

@ -0,0 +1,207 @@
<template>
<div>
<el-dialog
:title="titleValue"
width="1400px"
:model-value="modelValue"
:destroy-on-close="true"
append-to-body
@close="closed"
>
<div v-if="modelValue">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="姓名">
<el-input v-model="listQuery.xm" placeholder="请输入姓名" clearable/>
</el-form-item>
<el-form-item label="身份证号码">
<el-input v-model="listQuery.sfzh" placeholder="请输入身份证号码" clearable/>
</el-form-item>
<el-form-item label="所属部门">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm"/>
</el-form-item>
<el-form-item label="人员类型">
<el-select v-model="listQuery.fl" placeholder="请选择人员类型" clearable>
<el-option label="民警" value="01"></el-option>
<el-option label="辅警" value="02"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column label="序号" type="index" align="center" width="80"/>
<el-table-column prop="xm" align="center" label="民警姓名"></el-table-column>
<el-table-column prop="sfzh" align="center" label="身份证号码"></el-table-column>
<el-table-column prop="fl" align="center" label="类型">
<template #default="{ row }">
<span v-if="row.fl == '01'">民警</span>
<span v-if="row.fl == '02'">辅警</span>
</template>
</el-table-column>
<el-table-column prop="jh" label="警号" align="center"></el-table-column>
<el-table-column prop="ssbm" label="所属部门" align="center"></el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick,watchEffect } from "vue";
import { getTbJcglXfll } from "@/api/xfll";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
titleValue: {
type: String,
default: "选择民警"
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
},// 回显
});
const keyid = (row) => { return row.id; };
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
});
const form = ref({});
const tableData = ref([]);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
watch(() => props.modelValue,
(val) => { if (val === true) handleFilter();}
);
onMounted(() => {
getListData();
});
// 分页
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
// 获取列表
const getListData = async () => {
const params = listQuery.value;
const res = await getTbJcglXfll(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser() {
tableData.value.forEach(item=>{
if(props.roleIds.some(id=>id == item.id)){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
// 重置
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, fl: "01", };
getListData();
};
const handleSelectionChange = (val) => {
if(props.Single){
if(val.length>1){
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row,false)
}
multipleSelectionUser.value = val;
}else{
multipleSelectionUser.value = val;
}
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value
let list = []
let listId = []
userList.forEach(val=>{
if(listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
closed();
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner{
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox{
display: none;
}
</style>

245
src/components/MyComponents/ChooseJz/xzLoad.vue Normal file
View File

@ -0,0 +1,245 @@
<template>
<div>
<el-dialog title="选择警组" width="1400px" :model-value="modelValue" @close="closed">
<div v-if="modelValue">
<el-form :model="listQuery" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department
width="280px"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="警组名称">
<el-input
v-model="listQuery.jzMc"
placeholder="请输入警组名称"
clearable
/>
</el-form-item>
<el-form-item label="负责人">
<el-input
v-model="listQuery.fzrXm"
placeholder="请输入负责人"
clearable
/>
</el-form-item>
<el-form-item>
<el-button @click="handleFilter"> 查询 </el-button>
<el-button @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
/>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
prop="jzMc"
show-overflow-tooltip
align="center"
label="警组名称"
>
<template #default="{ row }">
<span>{{ row.jzMc ? row.jzMc : row.fzrXm + "巡组" }}</span>
</template>
</el-table-column>
<el-table-column
prop="ssbm"
label="所属部门"
align="center"
></el-table-column>
<el-table-column
prop="fzrXm"
show-overflow-tooltip
label="警组负责人"
align="center"
>
</el-table-column>
<el-table-column
prop="fzrLxdh"
show-overflow-tooltip
label="负责人联系电话"
align="center"
>
</el-table-column>
</el-table>
</div>
<div class="fenye">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick } from "vue";
import { getSelectDeckList } from "@/api/dpApi/home.js";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleId: {
type: String || Array,
default: "" || []
},
jczid:{
type:String,
default:""
},
//是否单选
Single: {
type: Boolean,
default: true
},
});
const keyid = (row) => {
return row.id;
};
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
jczid:props.jczid
});
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
const closed = () => {
emits("update:modelValue", false);
};
onMounted(() => {
handleFilter();
});
// 重置
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, jczid:props.jczid };
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
if (props.Single) {
ElMessage({ type: "warning", message: "请每次选择一个警组!" });
} else {
emits("choosedUsers", userList);
closed();
}
};
// pageSize 改变触发
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const getListData = async () => {
const params = listQuery.value;
const res = await getSelectDeckList(params);
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
};
//列表回显
function multipleUser(row) {
tableData.value.forEach(item=>{
if(Array.isArray(props.roleId)){
props.roleId.forEach(v=>{
if(v == item.id){
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}else{
if(props.roleId == item.id){
multipleUserRef.value.toggleRowSelection(item, true);
}
}
})
}
// 分页
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
// 多选
const handleSelectionChange = (val) => {
if(props.Single){
if(val.length>1){
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row,false)
}
multipleSelectionUser.value = val;
}else{
multipleSelectionUser.value = val;
}
};
watch(() => props.modelValue,(val) => {
if (val === true) handleFilter();
}
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner{
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox{
display: none;
}
</style>

180
src/components/MyComponents/ChooseUser/AbIndex.vue Normal file
View File

@ -0,0 +1,180 @@
<template>
<el-dialog :title="titleValue" width="1400px" :model-value="modelValue" append-to-body @close="closed">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item label="姓名">
<el-input placeholder="请输入姓名" v-model="listQuery.xm" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" border
:row-key="keyid" style="width: 100%" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column prop="xm" align="center" label="姓名"></el-table-column>
<el-table-column prop="zjhm" align="center" label="证件号码"></el-table-column>
<el-table-column prop="lxdh" align="center" label="联系方式"></el-table-column>
<el-table-column prop="wpdw" align="center" label="外派单位"></el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination class="pagination" @pageSize-change="handleSizeChange" @pageCurrent-change="handleCurrentChange"
:pageCurrent-page="listQuery.pageCurrent" :page-sizes="[10, 20, 50, 100]" :page-pageSize="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet } from "@/api/qcckApi.js";
import * as MOSTY from "@/components/MyComponents/index";
import { defineProps,ref, onMounted, nextTick } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
titleValue: {
type: String,
default: "选择安保"
},
LeaderType: {
type: String,
default: ""
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
},
});
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20
});
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
onMounted(() => {
handleFilter();
});
const closed = () => {
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20 };
getListData();
};
const keyid = (row) => {
return row.id;
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = []
let listId = []
userList.forEach(val => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
let data = { type: props.LeaderType, userList: userList };
emits("choosedUsersLeader", data);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const getListData = () => {
const params = listQuery.value;
qcckGet(params,"/mosty-jbld/tbbary/selectPage").then(res => {
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
});
};
//列表回显
function multipleUser() {
tableData.value.forEach(item => {
if (props.roleIds.some(id => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
/* .el-dialog {
background: #050e33;
}
.el-dialog__title {
color: #fff;
} */
</style>

207
src/components/MyComponents/ChooseUser/index.vue Normal file
View File

@ -0,0 +1,207 @@
<template>
<el-dialog :title="titleValue" width="1400px" :model-value="modelValue" append-to-body @close="closed">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门" v-if="showBm">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item label="用户名">
<el-input placeholder="请输入用户名" v-model="listQuery.loginName" clearable></el-input>
</el-form-item>
<el-form-item label="电话号码">
<el-input placeholder="请输入电话号码" v-model="listQuery.phone" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" border
:row-key="keyid" style="width: 100%" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column prop="loginName" align="center" label="用户名" width="150"></el-table-column>
<el-table-column prop="idEntityCard" align="center" label="身份证号"></el-table-column>
<el-table-column prop="deptName" align="center" label="部门"></el-table-column>
<el-table-column prop="inDustRialId" align="center" width="150" label="警号"></el-table-column>
<el-table-column prop="mobile" width="150" align="center" label="电话"></el-table-column>
<el-table-column prop="sex" align="center" label="性别">
<template #default="{ row }">
<span> {{ row.sex == 1 ? "男" : "女" }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="listQuery.current" :page-sizes="[10, 20, 50, 100]" :page-size="listQuery.size"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick } from "vue";
import { selectUnAccreditPage, selectUserDeptPage } from "@/api/user-manage";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
titleValue: {
type: String,
default: "选择用户"
},
LeaderType: {
type: String,
default: ""
},
//是否单选
Single: {
type: Boolean,
default: true
},
roleIds: {
type: Array,
default: []
}, showBm: {
type: Boolean,
default: true
},
ssbmdm: {
type: String,
default: ""
}
});
const total = ref(0);
const listQuery = ref({
current: 1,
size: 20
});
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
onMounted(() => {
handleFilter();
});
const closed = () => {
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = {
current: 1,
size: 20,
loginName: "",
phone: ""
};
getListData();
};
const keyid = (row) => {
return row.id;
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = []
let listId = []
userList.forEach(val => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
})
emits("choosedUsers", list);
let data = { type: props.LeaderType, userList: userList };
emits("choosedUsersLeader", data);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.size = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.current = currentPage;
getListData();
};
const getListData = () => {
const params = {...listQuery.value, ssbmdm: props.ssbmdm};
selectUserDeptPage(params).then(res => {
tableData.value = res?.records;
total.value = Number(res.total);
multipleUser()
});
};
//列表回显
function multipleUser() {
tableData.value.forEach(item => {
if (props.roleIds.some(id => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
})
}
const handleFilter = () => {
listQuery.value.current = 1;
getListData();
};
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
watch(()=>props.modelValue,()=>{
getListData();
})
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
/* .el-dialog {
background: #050e33;
}
.el-dialog__title {
color: #fff;
} */
</style>

89
src/components/MyComponents/Date/index.vue Normal file
View File

@ -0,0 +1,89 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-date-picker v-bind="$attrs" @change="changeTime" v-if="props.type == 'date'" v-model="modelValue" type="date" value-format="YYYY-MM-DD" placeholder="请选择日期" style="width:100%" />
<el-time-picker v-bind="$attrs" @change="changeTime" v-if="props.type == 'time'" v-model="modelValue" placeholder="选择时间" style="width:100%" />
<el-date-picker v-bind="$attrs" @change="changeTime" v-if="props.type == 'datetime'" v-model="modelValue" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择时间" style="width:100%" />
<el-date-picker v-bind="$attrs" @change="changeTime" v-if="props.type == 'datetimerange'" v-model="modelValue" type="datetimerange" :shortcuts="shortcuts" range-separator="To" value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="选择开始时间" end-placeholder="选择结束时间" style="width:100%" />
<el-date-picker v-bind="$attrs" @change="changeTime" v-if="props.type == 'daterange'" v-model="modelValue" type="daterange" range-separator="To" value-format="YYYY-MM-DD" start-placeholder="选择开始日期" end-placeholder="选择开始日期" style="width:100%" />
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { defineProps, defineEmits } from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请填写",
type: String
},
modelValue: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
},
type:{
default: "date",
type: String
}
});
const emits = defineEmits(["update:modelValue"]);
const shortcuts = [
{
text: "今天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 0);
return [start, end];
}
},
{
text: "昨天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 1);
end.setTime(end.getTime() - 3600 * 1000 * 24 * 1);
return [start, end];
}
},
{
text: "最近7天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
return [start, end];
}
},
{
text: "最近30天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
return [start, end];
}
},
{
text: "最近90天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
return [start, end];
}
}
];
const changeTime = (e) => {
emits("update:modelValue", e);
};
</script>

111
src/components/MyComponents/Department/index.vue Normal file
View File

@ -0,0 +1,111 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-cascader
style="width: 100%"
class="el-cascader-zj"
:show-all-levels="false"
clearable
filterable
:placeholder="modelValue ? placeholder : '请选择部门'"
:options="tableData"
v-model="oldmodelValue"
@change="handleChange"
:props="endProps"
/>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, onMounted, watch } from "vue";
import { selectDeptPage } from "@/api/user-manage";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择",
type: String
},
multiple: {
default: false,
type: Boolean
},
isAll: {
default: 100,
type: Number
},
modelValue: {
type: Array || String,
default: []
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const oldmodelValue = ref([]);
const listQuery = ref({
deptname: "",
deptcode: "",
parentid: ""
});
const depList = ref([]);
//配置项
const endProps = {
children: "childDeptList",
value: "orgCode",
label: "orgName",
checkStrictly: true,
multiple: props.multiple,
lazy: true,
lazyLoad(node, resolve) {
listQuery.value.parentid = node.data.id;
selectDeptPage(listQuery.value).then((res) => {
depList.value = depList.value.concat(res);
//处理部门是否包含下级
for (let i = 0; i < res.length; i++) {
res[i].leaf = !res[i].hasChildren;
}
resolve(res);
});
}
};
const tableData = ref([]);
const getSysMenuTree = async () => {
const res = await selectDeptPage(listQuery.value);
tableData.value = res;
depList.value = res;
};
onMounted(() => {
getSysMenuTree();
});
watch(
() => props.modelValue,
(val) => {
oldmodelValue.value = val;
},
{ deep: true, immediate: true }
);
const emits = defineEmits(["update:modelValue", "getDepValue"]);
const handleChange = (e) => {
if (props.multiple === true) {
const data = e.map((item) => {
return item[item.length - 1];
});
emits("update:modelValue", data);
} else {
const data = e ? e[e.length - 1] : "";
emits("update:modelValue", data);
let obj = depList.value.find((item) => {
return item.orgCode == data;
});
emits("getDepValue", obj);
}
};
</script>
<style lang="scss" scoped>
.el-cascader-zj {
width: 100%;
}
</style>

158
src/components/MyComponents/DepartmentTree/index.vue Normal file
View File

@ -0,0 +1,158 @@
<template>
<div class="departmentTree-box" :style="{ width: width, height: '100%' }">
<div class="depar_hear">
<el-input
v-model="listQuery.deptname"
v-if="filterable"
clearable
:debounce="500"
@input="filterTextChange"
placeholder="请输入筛选条件"
/>
</div>
<div class="depar_foot">
<el-tree
ref="treeRef"
class="filter-tree"
:props="endProps"
lazy
:load="loadNode"
@node-click="nodeClick"
:filter-node-method="filterNode"
:data="treeData"
/>
</div>
</div>
</template>
<script setup>
import { debounce } from "lodash";
import { getItem } from "@/utils/storage";
import { COMPONENT_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, watch, computed, onMounted } from "vue";
import { selectDeptPage, getAllChildDeptList } from "@/api/user-manage";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择",
type: String
},
multiple: {
default: false,
type: Boolean
},
filterable: {
default: false,
type: Boolean
},
modelValue: {
type: Number
},
width: {
default: COMPONENT_WIDTH,
type: String
},
isBmId:{
type:Boolean,
default:false
}
});
const listQuery = ref({
deptname: "",
deptcode: "",
parentid: ""
});
const treeRef = ref(null);
const node_had = ref([]);
const resolve_had = ref([]);
//防抖处理
const filterTextChange = debounce(inputChange, 500);
onMounted(() => {});
//获取部门数据
function getTreeData() {
selectDeptPage(listQuery.value).then((res) => {
for (let i = 0; i < res.length; i++) {
res[i].leaf = !res[i].hasChildren;
}
treeData.value = res;
});
}
//搜索查询
function inputChange(e) {
selectDeptPage(listQuery.value).then((res) => {
treeData.value = res;
});
}
watch(
() => listQuery.value.deptname,
(val) => {
treeRef.value.filter("tree", val);
}
);
const endProps = {
children: "childDeptList",
value: "id",
label: "orgName",
isLeaf: "leaf"
};
const treeData = ref([]);
//懒加载方法
async function loadNode(node, resolve) {
listQuery.value.parentid = node.data.id;
if (node.level === 0) {
node_had.value = node;
resolve_had.value = resolve;
getTreeData();
}
if (node.level >= 1) {
selectDeptPage(listQuery.value).then((res) => {
for (let i = 0; i < res.length; i++) {
res[i].leaf = !res[i].hasChildren;
}
resolve(res);
});
}
}
const filterNode = (value, data) => {
if (!value) return true;
return data.orgName.includes(value);
};
const nodeClick = (node) => {
if(props.isBmId){
emits("update:modelValue", node.id);
}else{
emits("update:modelValue", node.orgCode);
}
};
const emits = defineEmits(["update:modelValue"]);
const handleChange = (e) => {
if (props.multiple === true) {
const data = e.map((item) => {
return item[item.length - 1];
});
emits("update:modelValue", data);
} else {
const data = e[0];
emits("update:modelValue", data);
}
};
</script>
<style lang="scss" scoped>
.depar_hear {
height: 32px;
}
.depar_foot {
height: calc(100% - 32px);
overflow: auto;
width: 280px;
width: 100%;
min-width: 300px;
}
.departmentTree-box {
overflow: auto;
}
</style>

88
src/components/MyComponents/DownLoad/index.vue Normal file
View File

@ -0,0 +1,88 @@
<template>
<el-dialog
title="导出预览"
width="1400px"
:model-value="modelValue"
@close="closed"
>
<el-table :data="data" :id="myId" style="width: 100%" border>
<el-table-column label="序号" type="index" align="center" width="80" />
<el-table-column
v-for="(item, index) in tabOption"
:key="index + 'tab'"
:prop="item.prop"
:label="item.label"
align="center"
>
<template v-if="item.dict" #default="{ row }">
<dict-tag :options="item.dict" :value="row[item.prop]" :tag="false" />
</template>
</el-table-column>
</el-table>
<template #footer>
<span class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="exportExcel">确定</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, ref, onMounted, getCurrentInstance } from "vue";
import FileSaver from "file-saver";
import * as XLSX from "xlsx";
const tabRef = ref(null);
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
tabOption: {
type: Array,
require: []
},
data: {
type: Array,
required: []
},
myId: {
type: String,
require: ""
},
title: {
type: String,
require: ""
}
});
const emits = defineEmits(["update:modelValue"]);
const closed = () => {
emits("update:modelValue", false);
};
const { proxy } = getCurrentInstance();
function exportExcel() {
let xlsxParam = { raw: true };
let wb = XLSX.utils.table_to_book(
document.querySelector("#" + props.myId),
xlsxParam
);
let wbout = XLSX.write(wb, {
bookType: "xlsx",
bookSST: true,
type: "array"
});
closed();
try {
FileSaver.saveAs(
new Blob([wbout], { type: "application/octet-stream" }),
`${props.title}.xlsx`
);
} catch (e) {
if (typeof console !== "undefined") console.log(e, wbout);
}
return wbout;
}
</script>
<style>
</style>

80
src/components/MyComponents/Email/index.vue Normal file
View File

@ -0,0 +1,80 @@
<template>
<div class="form-item-box zj-email-wrap" :style="{ width: width }">
<el-autocomplete v-model="email" v-bind="$attrs" :placeholder="placeholder" :fetch-suggestions="querySearch"
:trigger-on-focus="false" class="inline-input" @select="handleSelect" @input="onInput" />
<!-- <el-icon class="errorIcon">
<circle-close-filled />
</el-icon>
<el-icon class="checkIcon">
<circle-check-filled />
</el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { ref, defineProps, defineEmits, defineExpose, onMounted } from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请填写邮箱",
type: String
},
email: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const emits = defineEmits(["update:email"]);
const onInput = (e) => {
emits("update:email", e);
};
const restaurants = ref([]);
const createFilter = (queryString) => {
return (item) => {
return item.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0;
};
};
const querySearch = (queryString, callback) => {
let results = JSON.parse(JSON.stringify(restaurants.value)); //把数组的浅复制换成深复制
if (queryString.indexOf("@") > -1) {
results.length = 0;
callback(results);
return false;
}
for (let item in results) {
results[item].value = queryString + "" + restaurants.value[item].value;
}
callback(results);
};
const loadAll = () => {
return [
{ value: "@qq.com" },
{ value: "@mosty.com" },
{ value: "@163.com" },
{ value: "@outlook.com" },
{ value: "@sohu.com" }
];
};
const handleSelect = (item) => {
emits("update:email", item.value);
};
onMounted(() => {
restaurants.value = loadAll();
});
</script>
<style lang="scss" scoped>
.zj-email-wrap {
::v-deep .el-autocomplete {
width: 100%;
}
}
</style>

28
src/components/MyComponents/Empty/index.vue Normal file
View File

@ -0,0 +1,28 @@
<template>
<el-empty :description="props.description" :image="require('@/assets/images/icon_043.png')" v-if="props.show" :image-size="props.imgSize" />
</template>
<script setup>
import { ref } from 'vue';
const props = defineProps({
imgSize:{
type:Number,
default:150
},
show:{
type:Boolean,
default:false
},
description:{
type:String,
default:'暂无数据'
}
});
</script>
<style lang="scss" scoped>
::v-deep .el-empty {
--el-empty-padding: 30px 0;
}
</style>

247
src/components/MyComponents/FileUpload/index.vue Normal file
View File

@ -0,0 +1,247 @@
<template>
<div class="main-box">
<div class="file_box" v-for="(item, index) in fileList" :key="index">
<div class="show_file" :style="{ width: width, height: width }">
<div class="icon_box_y" :style="{ width: width, height: width }">
<svg-icon :icon="getSuffix(item.url)" />
<span class="file_name_box">{{ item.name }}</span>
</div>
<div class="load_and_del" :style="{ width: width, height: width }">
<el-icon class="load_and_del_icon" :size="18" color="#aaaaaa">
<DeleteFilled v-if="props.isEdit" @click="delFile(index)" />
</el-icon>
<el-icon class="load_and_del_icon" :size="18" color="#aaaaaa">
<Download @click="downloadFile(item.url)" />
</el-icon>
</div>
</div>
</div>
<div class="file_box" v-if="fileList.length != props.limit && props.isEdit">
<div class="upload_img" :style="{ width: width, height: width }">
<div class="icon_box" :style="{ width: width, height: width }">
<el-icon :size="30" color="#aaaaaa">
<Plus />
</el-icon>
</div>
<div class="file_box_item" :style="{ width: width, height: width }">
<input
type="file"
:style="{ width: width, height: width }"
class="file_input"
id="file"
@change="fileChange"
/>
</div>
</div>
</div>
</div>
</template>
<script setup>
import {
ref,
defineProps,
defineEmits,
defineExpose,
computed,
onMounted
} from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import request from "@/utils/request";
import axios from "axios";
const props = defineProps({
modelValue: {
type: String,
default: ""
},
width: {
type: String,
default: "150px"
},
limit: {
type: Number,
default: 1
},
isEdit: {
type: Boolean,
default: false
}
});
const fileList = ref([]);
const count = ref(0); // 上传的数量
const emits = defineEmits(["update:modelValue", "handleChange"]);
//获取后缀
const getSuffix = (fileName) => {
let suffix = "";
try {
suffix = fileName.substr(fileName.lastIndexOf(".") + 1, 4);
if (suffix.indexOf("?") !== -1) suffix = suffix.replaceAll("?", "");
} catch (err) {
suffix = "";
return "OTHER";
}
// fileName无后缀返回 false
if (!suffix) return "";
// 图片格式
var imglist = ["png", "jpg", "jpeg", "bmp", "gif"];
if (imglist.includes(suffix)) return "IMG";
//txt
if (suffix === "txt") return "TXT";
//excel XLS
const excelist = ["xls", "xlsx"];
if (excelist.includes(suffix)) return "XLS";
// 匹配 word
var wordlist = ["doc", "docx"];
if (wordlist.includes(suffix)) return "DOC";
//pdf
if (suffix === "pdf") return "PDF";
//视频 音频
var videolist = [
"mp4",
"m2v",
"mkv",
"rmvb",
"wmv",
"avi",
"flv",
"mov",
"m4v"
];
if (videolist.includes(suffix)) return "VIDEO";
var musiclist = ["mp3", "wav", "wmv"];
if (musiclist.includes(suffix)) return "MUSIC";
var pptlist = ["ppt", "pptx"];
if (pptlist.includes(suffix)) return "PPT";
//压缩包
var yslist = ["7z", "rar", "zip", "apz", "ar", "hpk", "hyp", "hbc2"];
if (yslist.includes(suffix)) return "YS";
//否则返回other
return "OTHER";
};
// 删除
function delFile(index) {
fileList.value = fileList.value.filter((item, i) => {
return i !== index;
});
}
// 文件下载
function downloadFile(url) {
window.open('/mosty-base/minio/image/download/'+url, "_blank");
}
// 选择文件
function fileChange(e) {
let file = document.getElementById("file").files[0];
let name = file.name;
let formData = new FormData();
formData.append("file", file);
axios
.post("/mosty-base/minio/image/upload/id", formData, {
"Content-type": "multipart/form-data"
})
.then((res) => {
if (res.status == 200 && res.data && res.data.code === 10000) {
let url = res.data.data;
let f = {
url: url,
name: name
};
fileList.value.push(f);
count.value = count.value + 1;
let list = fileList.value.map((item) => {
return item.url;
});
emits("handleChange", JSON.stringify(list));
} else {
ElMessage.warning("文件上传失败");
}
});
}
onMounted(() => {
if (props.modelValue) {
let list = JSON.parse(props.modelValue);
list.forEach((item, index) => {
let temp = {
url: item,
name: "文件" + (index + 1)
};
fileList.value.push(temp);
});
count.value = list.length;
}
});
</script>
<style scoped lang="scss">
.main-box {
width: 100%;
.file_box {
background-color: #112b63;
border: 1px dashed #4579b5;
margin: 10px 0 0 10px;
border-radius: 5px;
position: relative;
.show_file {
overflow: hidden;
box-sizing: border-box;
&:hover > .load_and_del {
display: block;
}
.load_and_del {
display: none;
position: absolute;
top: 0;
left: 0;
.load_and_del_icon {
cursor: pointer;
margin-left:5px;
margin-top: 5px;
}
}
.icon_box_y {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
.file_name_box {
margin-top: 10px;
width: 80%;
line-height: 30px;
height: 30px;
overflow: hidden;
text-align: center;
}
}
::v-deep .svg-icon {
font-size: 48px;
}
}
.upload_img {
position: relative;
.icon_box {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
position: relative;
z-index: 1;
}
.file_box_item {
position: absolute;
opacity: 0;
z-index: 2;
top: 0;
left: 0;
.file_input {
cursor: pointer;
}
}
.file_box_item_show {
position: absolute;
top: 0;
left: 0;
}
}
}
}
</style>

198
src/components/MyComponents/FrameWork/index.vue Normal file
View File

@ -0,0 +1,198 @@
<template>
<div class="form-item-box zk-frameWork-wrap" :style="{ width: width }">
<el-select
:model-value="frameWork"
:placeholder="placeholder"
@clear="handleClear"
@change="selectChange"
:clearable="clearable"
v-bind="$attrs"
:multiple="multiple"
popper-class="frameWork-select"
>
<el-option value="1" style="display: none"></el-option>
<el-input
v-if="filterable"
v-model="filterText"
style="width: 96% !important; margin: 0 2%; font-size: 12px"
:prefix-icon="Search"
/>
<div class="alllist">
<el-tree
ref="tree"
:data="treeData"
:props="defaultConf"
default-expand-all
:filter-node-method="filterNode"
:show-checkbox="multiple"
:node-key="nodeKey"
@check-change="handleCheckChange"
@node-click="clickNode"
/>
</div>
</el-select>
<!-- <el-icon class="errorIcon"><circle-close-filled /></el-icon>
<el-icon class="checkIcon"><circle-check-filled /></el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { nextTick, ref, watch } from "vue";
import { Search } from "@element-plus/icons-vue";
const emits = defineEmits(["handleChange"]); //子组件向父组件事件传递
const props = defineProps({
clearable: {
default: false,
type: Boolean
},
multiple: {
default: false,
type: Boolean
},
filterable: {
default: false,
type: Boolean
},
treeData: {
default: () => [],
type: Array
},
placeholder: {
default: "选择组织机构",
type: String
},
defaultConf: {
type: Object,
default: () => ({
children: "children",
label: "label"
})
},
frameWork: {
type: [String, Array],
default: ""
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const nodeKey = "id";
const filterText = ref("");
const mineStatusValue = ref([]); //选中状态存贮
nextTick(() => {
if (props.frameWork) {
if (typeof props.frameWork === "string") {
//传过来的默认值类型
if (props.frameWork) {
tree.value.setCheckedKeys([props.frameWork], false);
}
} else {
if (props.frameWork.length > 0) {
tree.value.setCheckedKeys(props.frameWork, false);
}
}
mineStatusValue.value = treeValueFind(props.treeData, props.frameWork);
}
});
const tree = ref(null);
let deferTimer;
watch(filterText, (val) => {
tree.value.filter(val);
});
const filterNode = (value, data) => {
if (!value) return true;
return data[props.defaultConf.label].indexOf(value) !== -1;
};
//多选选中
const handleCheckChange = () => {
const res = tree.value.getCheckedNodes(true, true); // 这里两个true，1. 是否只是叶子节点 2. 是否包含半选节点
mineStatusValue.value = res;
clearTimeout(deferTimer);
deferTimer = setTimeout(() => {
emits("handleChange", res);
}, 200);
};
//节点选择
const clickNode = (data, node, obj) => {
if (props.multiple) {
// 多选不执行
const index = mineStatusValue.value.findIndex((d) => d.id === data.id);
if (index > -1) {
tree.value.setChecked(data, false);
} else {
tree.value.setChecked(data, true);
}
return;
}
if (!data.children) {
mineStatusValue.value.push(data.id);
tree.value.setCheckedKeys([data.id], false);
}
};
//select值变化
const selectChange = (e) => {
if (!props.multiple || !props.treeData.length) {
return false;
}
const arrNew = [];
const dataLength = mineStatusValue.value.length;
const eleng = e.length;
for (let i = 0; i < dataLength; i++) {
for (let j = 0; j < eleng; j++) {
if (e[j] === mineStatusValue.value[i][props.defaultConf.label]) {
arrNew.push(mineStatusValue.value[i][nodeKey]);
break;
}
}
}
setTimeout(() => {
tree.value.setCheckedKeys(arrNew, false);
}, 200);
};
//select clear
const handleClear = (e) => {
mineStatusValue.value = [];
tree.value.setCheckedKeys([], false);
};
const treeValueFind = (tree, arr, newArr = []) => {
if (typeof arr === "string") {
tree.forEach((el) => {
if (el[nodeKey] === arr) {
newArr.push(el);
}
if (el[props.defaultConf.children]) {
treeValueFind(el[props.defaultConf.children], arr, newArr);
}
});
} else {
for (let i = arr.length; i >= 0; i--) {
tree.forEach((el) => {
if (el[nodeKey] === arr[i]) {
newArr.push(el);
arr.splice(i, 1);
}
if (el[props.defaultConf.children] && arr.length > 0) {
treeValueFind(el[props.defaultConf.children], arr, newArr);
}
});
}
}
return newArr;
};
</script>
<style lang="scss" scoped>
.optionclass {
height: auto;
padding: 0;
position: relative;
width: 100%;
overflow-y: overflow;
}
.zk-frameWork-wrap {
.el-select {
width: 100%;
}
}
</style>

83
src/components/MyComponents/FrameWork2/index.vue Normal file
View File

@ -0,0 +1,83 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-cascader
class="el-cascader-zj"
:placeholder="placeholder"
:options="tableData"
v-bind="$attrs"
v-model="modelValue"
@change="handleChange"
:props="endProps"
:filterable="filterable"
/>
<!-- <el-icon class="errorIcon"><circle-close-filled /></el-icon>
<el-icon class="checkIcon"><circle-check-filled /></el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { ref, defineProps, defineEmits, defineExpose,computed } from "vue";
import { getSystemMeny } from "@/api/user-manage";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择",
type: String
},
multiple: {
default: false,
type: Boolean
},
filterable: {
default: false,
type: Boolean
},
modelValue: {
default: [],
type: Array
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const endProps = computed(() => {
let re = { children: 'sysMenuList', value: 'id', label: 'menuName' }
if (props.multiple === true) {
re.multiple = true;
}
return re;
})
const tableData = ref([]);
const getSysMenuTree = async () => {
const params = {
menuName: "",
current: 1,
size: 999
}
const res = await getSystemMeny(params);
tableData.value = res?.records;
};
getSysMenuTree();
const emits = defineEmits(["update:modelValue"]);
const handleChange = (e) => {
if (props.multiple === true) {
const data = e.map((item) => {
return item[item.length - 1];
});
emits("update:modelValue", data);
} else {
const data = e ? e[e.length - 1] : ''
emits("update:modelValue", data);
}
};
</script>
<style lang="scss" scoped>
.el-cascader-zj{
width: 100%;
}
</style>

334
src/components/MyComponents/GzSource/index.vue Normal file
View File

@ -0,0 +1,334 @@
<template>
<div>
<el-dialog
:title="titleValue"
width="1400px"
:model-value="gzyModelValue"
@close="closed"
>
<el-form :model="listQuery" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item label="设备编号">
<el-input
v-model="listQuery.sbbh"
placeholder="请填写设备编号"
></el-input>
</el-form-item>
<el-form-item label="感知源名称">
<el-input
v-model="listQuery.sbmc"
placeholder="请填写感知源名称"
></el-input>
</el-form-item>
<el-form-item label="感知源类型">
<el-select v-model="listQuery.sblx">
<el-option
v-for="item in D_BZ_SBLX"
:key="item"
:label="item.label"
:value="item.value"
>{{ item.label }}</el-option
>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" style="margin-top: 0px" v-if="gzyModelValue">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
v-if="props.multiple"
/>
<el-table-column width="55" #default="{ row }" v-else>
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
</el-table-column>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
prop="sbmc"
show-overflow-tooltip
align="center"
label="感知源名称"
/>
<el-table-column
prop="sbbh"
show-overflow-tooltip
align="center"
label="编号"
/>
<el-table-column
prop="dzmc"
show-overflow-tooltip
align="center"
label="地址"
/>
<el-table-column
prop="sblx"
show-overflow-tooltip
align="center"
label="感知源类型"
width="120px"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_SBLX" :value="row.sblx" :tag="false" />
</template>
</el-table-column>
<el-table-column
prop="sblxdm"
show-overflow-tooltip
align="center"
sortable
label="摄像机类型"
width="120px"
>
<template #default="{ row }">
<dict-tag
:options="D_BZ_GZSBLX"
:value="row.sblxdm"
:tag="false"
/>
</template>
</el-table-column>
<el-table-column
prop="ssbm"
show-overflow-tooltip
align="center"
sortable
label="所属部门"
/>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageNum"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import {
defineProps,
watch,
ref,
onMounted,
nextTick,
getCurrentInstance
} from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_SBLX, D_BZ_GZSBLX } = proxy.$dict("D_BZ_SBLX", "D_BZ_GZSBLX");
const props = defineProps({
//是否显示
gzyModelValue: {
type: Boolean,
required: true
},
//标题
titleValue: {
type: String,
default: "选择感知源"
},
//是否多选
multiple: {
default: true,
type: Boolean
},
//已经选中得数据回显
data: {
type: Array,
default: []
}
});
const keyid = (row) => {
return row.id;
};
const total = ref(0);
const ridioIndex = ref(null);
const listQuery = ref({
pageNum: 1,
pageSize: 20,
sblx: "",
sbmc: ""
});
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["close", "choosedGzy"]);
const closed = () => {
emits("close", false);
};
const reset = () => {
listQuery.value = {
pageNum: 1,
pageSize: 20,
sblx: ""
};
getListData();
};
const checkopenList = ref([]);
//确认选中
const onComfirm = () => {
if (props.multiple) {
//多选
const List = multipleSelectionUser.value;
if (List.length === 0) {
proxy.$message.warning("请选择感知源");
return;
}
emits("choosedGzy", [...List, ...checkopenList.value]);
} else {
//单选
if (![ridioIndex.value][0]) {
proxy.$message.warning("请选择感知源");
return;
}
const info = tableData.value.find((item) => {
return item.id === ridioIndex.value;
});
emits("choosedGzy", [info]);
}
closed();
};
onMounted(() => {
getListData();
});
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageNum = currentPage;
getListData();
};
//圈层数据
const getListData = async () => {
qcckPost(listQuery.value, "/mosty-jmxf/tbYsSxt/getPageList").then((res) => {
tableData.value = res?.records;
multipleUser(props.data, tableData.value);
total.value = Number(res.total);
});
};
const handleFilter = () => {
listQuery.value.pageNum = 1;
getListData();
};
const multipleUserRef = ref(null); //表单
//多选选中的数据
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
multipleSelectionUser.value = val;
if (checkopenList.value) {
for (let i = 0; i < multipleSelectionUser.value.length; i++) {
const l = multipleSelectionUser.value[i];
for (let j = 0; j < checkopenList.value.length; j++) {
const z = checkopenList.value[j];
if (l.id == z.id) {
checkopenList.value.splice(j, 1);
}
}
}
}
};
const deweighThree = (arr) => {
let map = new Map();
for (let item of arr) {
if (!map.has(item.id)) {
map.set(item.id, item);
}
}
return [...map.values()];
};
//回显
function multipleUser(row, list) {
if (row) {
row.forEach((item) => {
list.forEach((select) => {
let val = item.id ? item.id : item;
if (val == select.id) {
if (multipleUserRef.value) {
multipleUserRef.value.toggleRowSelection(select, true);
}
}
});
});
}
}
watch(
() => props.gzyModelValue,
(val) => {
if (val === true) {
handleFilter();
}
}
);
watch(
() => props.data,
(val) => {
if (multipleUserRef.value) multipleUser(val, tableData.value);
checkopenList.value = JSON.parse(JSON.stringify(val));
},
{ deep: true, immediate: true }
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
::v-deep .el-form--inline {
padding-left: 0 !important;
}
::v-deep .el-radio__label {
display: none;
}
</style>

38
src/components/MyComponents/IdentityCard/index.vue Normal file
View File

@ -0,0 +1,38 @@
<template>
<div
class="form-item-box"
:style="{ width: width}"
>
<el-input
:placeholder="placeholder"
v-bind="$attrs"
v-model="modelValue"
@input="onInput"
></el-input>
<!-- <el-icon class="errorIcon"><circle-close-filled /></el-icon>
<el-icon class="checkIcon"><circle-check-filled /></el-icon> -->
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { defineProps, defineEmits } from "vue";
const props = defineProps({
placeholder: {
default: "请输入身份证号",
type: String
},
modelValue: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const emits = defineEmits(["update:modelValue"]);
const onInput = (e) => {
emits("update:modelValue", e);
};
</script>

71
src/components/MyComponents/MarkdownEdit/index.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<div class="markdown-wrap">
<!---->
<div id="markdown-box">
<strong v-html="modelValue"></strong>
</div>
<div style="margin-top: 1vw">
<el-link type="primary" @click="saveEdit('detail', row)">确定详情信息</el-link>
</div>
</div>
</template>
<script setup>
import MKEditor from "@toast-ui/editor";
import "@toast-ui/editor/dist/toastui-editor.css";
import "@toast-ui/editor/dist/i18n/zh-cn.js";
import { COMPONENT_WIDTH } from "@/constant";
import {
ref,
defineProps,
defineEmits,
defineExpose,
onMounted,
watch
} from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请填写手机号",
type: String
},
modelValue: {
default: "",
type: String
},
width: {
default: "800px",
type: String
}
});
let mkEditor;
let el;
onMounted(() => {
el = document.querySelector("#markdown-box");
initEditor();
});
const emits = defineEmits(["update:modelValue"]);
const initEditor = () => {
mkEditor = new MKEditor({
el,
height: "700px",
previewStyle: "vertical",
language: "zh-CN",
initiaValue:props.modelValue
});
mkEditor.getMarkdown();
};
const saveEdit = () => {
emits("update:modelValue", mkEditor.getHTML());
};
const onInput = (e) => {
emits("update:modelValue", e);
};
//回显
</script>
<style lang="scss" scoped>
.markdown-wrap {
}
</style>

31
src/components/MyComponents/Other/index.vue Normal file
View File

@ -0,0 +1,31 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-input :placeholder="placeholder" v-bind="$attrs" v-model="modelValue" @input="onInput" ></el-input>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, defineExpose } from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "",
type: String
},
modelValue: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const emits = defineEmits(["update:modelValue"]);
const onInput = (e) => {
emits("update:modelValue", e);
};
</script>

55
src/components/MyComponents/PackageSelect/index.vue Normal file
View File

@ -0,0 +1,55 @@
<template>
<div class="form-item-box zj-packageSelect-wrap" :style="{ width: width }">
<el-select v-bind="$attrs" :model-value="modelValue" @change="hanlderSelect"
:popper-class="selectOption.length > 20 ? 'nation-select' : ''" :placeholder="placeholder">
<el-option v-for="item in selectOption" :key="item.dm" :label="item.zdmc" :value="item.dm">
</el-option>
</el-select>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { nextTick, onBeforeMount, ref } from "vue";
import { getDictInfoByDictEnum } from "@/api/sysDict";
const emits = defineEmits(["handleChange"]); //子组件向父组件事件传递
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择",
type: String
},
modelValue: {
default: "",
type: String
},
dictEnum: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const selectOption = ref([]);
onBeforeMount(async () => {
const res = await getDictInfoByDictEnum({ dictElementEnum: props.dictEnum });
//正常下拉结构
if (res.zdlx === 1) {
selectOption.value = [...res.itemList];
} else {
//树形结构数据
}
});
const hanlderSelect = (data) => {
emits("handleChange", data);
};
</script>
<style lang="scss" scoped>
.zj-packageSelect-wrap {
::v-deep .el-select {
width: 100%;
}
}
</style>

32
src/components/MyComponents/Phone/index.vue Normal file
View File

@ -0,0 +1,32 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-input :placeholder="placeholder" v-bind="$attrs" v-model="modelValue" @input="onInput" ></el-input>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { ref, defineProps, defineEmits, defineExpose } from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请填写手机号",
type: String
},
modelValue: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const emits = defineEmits(["update:modelValue"]);
const onInput = (e) => {
emits("update:modelValue", e);
};
</script>
<style lang="scss" scoped></style>

109
src/components/MyComponents/Provinces/index.vue Normal file
View File

@ -0,0 +1,109 @@
<template>
<div class="form-item-box">
<el-select v-model="province" clearable placeholder="请选择省份">
<el-option v-for="item in areas" :value="item.code" :label="item.name" :key="item.code">{{ item.name }}
</el-option>
</el-select>
<el-select clearable :disabled="!province" style="margin: 0 10px" v-model="city" placeholder="请选择城市">
<el-option v-for="item in selectCity" :value="item.code" :label="item.name" :key="item.code">{{ item.name }}
</el-option>
</el-select>
<el-select clearable :disabled="!province || !city" v-model="area" placeholder="请选择区域">
<el-option v-for="item in selectArea" :value="item.code" :label="item.name" :key="item.code">{{ item.name }}
</el-option>
</el-select>
</div>
</template>
<script setup>
import allAreas from "@/constant/pca-code.json";
import {
ref,
defineProps,
defineEmits,
defineExpose,
computed,
watch
} from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择省市区",
type: String
},
modelValue: {
default: "",
type: String
}
});
let province = ref("");
let city = ref("");
let area = ref("");
let areas = ref(allAreas);
let selectCity = ref([]);
let selectArea = ref([]);
//分发事件给父组件
//分发事件给父组件
const emits = defineEmits(["update:modelValue"]);
//监听省份变化
watch(
() => province.value,
(val) => {
if (val) {
let cities = areas.value.find(
(item) => item.code === province.value
)?.children;
selectCity.value = cities;
}
city.value = "";
area.value = "";
}
);
//监听城市变化
watch(
() => city.value,
(val) => {
if (val) {
let area = selectCity.value.find(
(item) => item.code === city.value
)?.children;
selectArea.value = area;
}
area.value = "";
}
);
//监听区域变化
watch(
() => area.value,
(val) => {
let provinceData = {
code: province.value,
name:
province.value &&
allAreas.find((item) => item.code === province.value).name
};
let cityData = {
code: city.value,
name:
city.value &&
selectCity.value &&
selectCity.value.find((item) => item.code === city.value).name
};
let areaData = {
code: val,
name:
val &&
selectArea.value &&
selectArea.value.find((item) => item.code === val).name
};
emits("update:modelValue", `${provinceData},${cityData},${areaData}`);
}
);
</script>
<style lang="scss" scoped>
</style>

62
src/components/MyComponents/Provinces2/index.vue Normal file
View File

@ -0,0 +1,62 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-cascader class="el-cascader-zj" :props="{ value: 'label', label: 'label', children: 'children' }"
:options="arercity" expand-trigger="hover" change-on-select @change="onInChange" :placeholder="placeholder"
v-bind="$attrs" v-model="value"></el-cascader>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import allAreas from "./provicesData";
import {
ref,
defineProps,
defineEmits,
defineExpose,
computed,
nextTick,
watch
} from "vue";
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择地区位置",
type: String
},
provinces2: {
default: () => [],
type: Array
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const value = ref([]);
nextTick(() => {
if (props.provinces2.length > 0) {
init(props.provinces2);
}
});
const init = (data) => { };
const registerAddress = ref([]);
const arercity = ref(allAreas);
const emits = defineEmits(["update:provinces2"]);
const onInChange = (e) => {
emits("update:provinces2", e);
};
// const onInput = (e) => {
// emits("update:provinces2", e);
// };
</script>
<style lang="scss" scoped>
.el-cascader-zj {
width: 100%;
}
</style>

6138
src/components/MyComponents/Provinces2/provicesData.js Normal file
View File

File diff suppressed because it is too large Load Diff

280
src/components/MyComponents/RichOnly/index.vue Normal file
View File

@ -0,0 +1,280 @@
<template>
<div>
<el-dialog
:title="titleValue"
width="1400px"
:model-value="modelValue"
@close="closed"
>
<el-form :model="listQuery" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item label="圈层名称">
<el-input
v-model="listQuery.qcmc"
placeholder="请输入圈层名称"
clearable
/>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
v-if="props.multiple"
/>
<el-table-column width="55" #default="{ row }" v-else>
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
</el-table-column>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
sortable
prop="ssbm"
label="所属部门"
show-overflow-tooltip
align="center"
></el-table-column>
<el-table-column
sortable
prop="qcmc"
show-overflow-tooltip
label="圈层名称"
align="center"
>
</el-table-column>
<el-table-column
sortable
prop="qclx"
show-overflow-tooltip
label="圈层类型"
align="center"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_QCLX" :value="row.qclx" :tag="false" />
</template>
</el-table-column>
<el-table-column
sortable
prop="qcjb"
show-overflow-tooltip
label="圈层等级"
align="center"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_QCDJ" :value="row.qcjb" :tag="false" />
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import {
defineProps,
watch,
ref,
onMounted,
nextTick,
getCurrentInstance
} from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_QCLX, D_BZ_QCDJ } = proxy.$dict("D_BZ_QCLX", "D_BZ_QCDJ");
const props = defineProps({
//是否显示
modelValue: {
type: Boolean,
required: true
},
//标题
titleValue: {
type: String,
default: "选择圈层"
},
//是否多选
multiple: {
default: true,
type: Boolean
},
//已经选中得数据回显
data: {
type: Array,
default: []
}
});
const keyid = (row) => {
return row.id;
};
const total = ref(0);
const ridioIndex = ref(null);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
qcmc: "",
ssbmdm: ""
});
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["close", "choosedQc"]);
const closed = () => {
emits("close", false);
};
const reset = () => {
listQuery.value = {
pageCurrent: 1,
pageSize: 20,
qcmc: "",
ssbmdm: ""
};
getListData();
};
//确认选中
const onComfirm = () => {
if (props.multiple) {
//多选
const List = JSON.parse(JSON.stringify(multipleSelectionUser.value));
if (List.length === 0) {
proxy.$message.warning("请选择圈层");
return;
}
emits("choosedQc", List);
} else {
//单选
if (![ridioIndex.value][0]) {
proxy.$message.warning("请选择圈层");
return;
}
const info = tableData.value.find((item) => {
return item.id === ridioIndex.value;
});
emits("choosedQc", [info]);
}
closed();
};
onMounted(() => {
getListData();
});
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageSize = currentPage;
getListData();
};
//圈层数据
const getListData = async () => {
qcckGet(listQuery.value, "/mosty-jmxf/qc/selectQcList").then((res) => {
tableData.value = res?.records;
multipleUser(props.data, tableData.value);
total.value = Number(res.total);
});
};
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const multipleUserRef = ref(null); //表单
//多选选中的数据
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
multipleSelectionUser.value = val;
};
//回显
function multipleUser(row, list) {
if (row) {
if (props.multiple) {
row.forEach((item) => {
list.forEach((select) => {
if (item.id == select.id) {
if (multipleUserRef.value) {
multipleUserRef.value.toggleRowSelection(select, true);
}
}
});
});
}
}
}
watch(
() => props.modelValue,
(val) => {
if (val === true) {
handleFilter();
}
}
);
watch(
() => props.data,
(val) => {
if (multipleUserRef.value) multipleUser(val, tableData.value);
}
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
::v-deep .el-form--inline {
padding-left: 0 !important;
}
::v-deep .el-radio__label {
display: none;
}
</style>

49
src/components/MyComponents/Select/index.vue Normal file
View File

@ -0,0 +1,49 @@
<template>
<div class="Select-wrap" :style="{ width: width }">
<el-select :disabled="props.disabled" v-bind="$attrs" v-model="modelValue" @change="hanlderSelect" :popper-class="selectOption.length > 20 ? 'nation-select' : ''" :placeholder="placeholder">
<el-option v-for="item in dictEnum" :key="item.value" :label="item.zdmc || item.label" :value="item.dm || item.value">
</el-option>
</el-select>
</div>
</template>
<script setup>
import { nextTick, onBeforeMount, ref } from "vue";
const emits = defineEmits(["change"]); //子组件向父组件事件传递
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择",
type: String
},
disabled:{
default: false,
type: Boolean
},
modelValue: {
default: "",
type: String
},
dictEnum: {
default: Array,
type: String
},
width: {
default: '100%',
type: String
}
});
const selectOption = ref([]);
const hanlderSelect = (data) => {
emits("change", data);
};
</script>
<style lang="scss" scoped>
.Select-wrap {
::v-deep .el-select {
width: 100%;
}
}
</style>

53
src/components/MyComponents/Sex/index.vue Normal file
View File

@ -0,0 +1,53 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-select :disabled="disabled" v-model="sex" placeholder="请选择性别" @change="onChange">
<el-option
v-for="item in D_BZ_XB"
:key="item"
:label="item.zdmc"
:value="item.dm"
></el-option>
</el-select>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import {
ref,
defineProps,
defineEmits,
defineExpose,
getCurrentInstance,
onBeforeMount
} from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_XB } = proxy.$dict("D_BZ_XB");
const props = defineProps({
//获取组件传值
sex: {
type: String,
default: ""
},
disabled:{
type:Boolean,
default:false
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const emits = defineEmits(["update:sex"]);
const onChange = (e) => {
emits("update:sex", e);
};
</script>
<style lang="scss" scoped>
.manIcon,
.womanIcon {
font-size: 30px;
}
</style>

49
src/components/MyComponents/StationSelect/index.vue Normal file
View File

@ -0,0 +1,49 @@
<template>
<div class="form-item-box zj-packageSelect-wrap" :style="{ width: width }">
<el-select v-bind="$attrs" :model-value="modelValue" @change="hanlderSelect" :popper-class="selectOption.length > 20 ? 'nation-select' : ''">
<el-option v-for="item in selectOption" :key="item.id" :label="item.postName" :value="item.id">
</el-option>
</el-select>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from '@/constant';
import { onBeforeMount, ref } from "vue";
import { selectJobPage } from "@/api/user-manage";
const emits = defineEmits(["handleChange"]); //子组件向父组件事件传递
const props = defineProps({
//获取组件传值
placeholder: {
default: "请选择",
type: String
},
modelValue: {
default: "",
type: String
},
dictEnum: {
default: "",
type: String
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const selectOption = ref([]);
onBeforeMount(async () => {
const res = await selectJobPage({ page: 1, size: 9999 });
selectOption.value = [...res.records];
});
const hanlderSelect = (data) => {
emits("handleChange", data);
};
</script>
<style lang="scss" scoped>
.zj-packageSelect-wrap {
::v-deep .el-select {
width: 100%;
}
}
</style>

319
src/components/MyComponents/Upload/index.vue Normal file
View File

@ -0,0 +1,319 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-upload v-bind="$attrs" :headers="headers" :multiple="false" class="avatar-uploader" :limit="props.limit"
:action="actionUrl" list-type="picture-card" :file-list="fileList" show-file-list :on-exceed="handleExceed"
:on-success="handlerSuccess" :before-upload="beforeImgUpload">
<template #default>
<el-icon>
<Plus />
</el-icon>
</template>
<template #file="{ file }">
<div v-if="props.isImg">
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<el-icon><zoom-in /></el-icon>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)">
<el-icon>
<Delete />
</el-icon>
</span>
</span>
</div>
<div v-else>
<div class="file-wrap">
<span>
<svg-icon :icon="getSuffix(file.name)" />
</span>
<span class="file-name">{{ file.name }}</span>
</div>
<span class="el-upload-list__item-actions">
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDownload(file)">
<el-icon>
<Download />
</el-icon>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)">
<el-icon>
<Delete />
</el-icon>
</span>
</span>
</div>
</template>
</el-upload>
<el-dialog v-model="dialogVisible">
<img style="width: 100%" :src="dialogImageUrl" alt="" />
</el-dialog>
</div>
</template>
<script setup>
import { COMPONENT_WIDTH } from "@/constant";
import { ref, defineProps, defineEmits, defineExpose, computed, watch, onMounted } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import type from "element-plus/es/components/upload/src/upload.type";
import { useStore } from "vuex";
const props = defineProps({
//获取组件传值
modelValue: {
type: Array,
default: []
},
limit: {
type: Number,
default: 1
},
isImg: {
type: Boolean,
default: true
},
width: {
default: COMPONENT_WIDTH,
type: String
}
});
const actionUrl = computed(() =>
props.isImg ? "/mosty-base/minio/image/upload/id" : "/mosty-base/minio/file/upload"
);
const emits = defineEmits(["update:modelValue", "handleChange"]);
//获取后缀
const getSuffix = (fileName) => {
let suffix = "";
try {
suffix = fileName.substr(fileName.lastIndexOf(".") + 1, 4); //截取最后一个点号后4个字符
} catch (err) {
suffix = "";
return "OTHER";
}
// fileName无后缀返回 false
if (!suffix) return "";
// 图片格式
var imglist = ["png", "jpg", "jpeg", "bmp", "gif"];
if (imglist.includes(suffix)) return "IMG";
//txt
if (suffix === "txt") return "TXT";
//excel XLS
const excelist = ["xls", "xlsx"];
if (excelist.includes(suffix)) return "XLS";
// 匹配 word
var wordlist = ["doc", "docx"];
if (wordlist.includes(suffix)) return "DOC";
//pdf
if (suffix === "pdf") return "PDF";
//视频 音频
var videolist = ["mp4", "m2v", "mkv", "rmvb", "wmv", "avi", "flv", "mov", "m4v"];
if (videolist.includes(suffix)) return "VIDEO";
var musiclist = ["mp3", "wav", "wmv"];
if (musiclist.includes(suffix)) return "MUSIC";
var pptlist = ["ppt", "pptx"];
if (pptlist.includes(suffix)) return "PPT";
//压缩包
var yslist = ["7z", "rar", "zip", "apz", "ar", "hpk", "hyp", "hbc2"];
if (yslist.includes(suffix)) return "YS";
//否则返回other
return "OTHER";
};
const imageUrl = ref("");
const store = useStore();
const dialogImageUrl = ref("");
const dialogVisible = ref(false);
const disabled = ref(false);
const headers = ref({
Authorization: store.getters.token
});
const propsModelValue = ref()
const fileList = ref([]);
watch(() => props.modelValue, (val) => {
console.log(val,"xxxxxxxxxxx");
if (Array.isArray(val)) {
propsModelValue.value=val
} else {
propsModelValue.value = val ? val.split(',') : []
}
if (propsModelValue.value) {
fileList.value = propsModelValue.value.map((el) => {
return { url: `/mosty-base/minio/image/download/` + el };
});
}
},{deep:true,immediate:true});
onMounted(() => {
// 初始化数据
// if (propsModelValue.value) {
// fileList.value = propsModelValue.value.map((el) => {
// return { url: `/mosty-base/minio/image/download/` + el };
// });
// }
});
const handlerSuccess = (res, file) => {
file.url = `/mosty-base/minio/image/download/` + res.data;
fileList.value.push(file);
if (Array.isArray(propsModelValue.value)) {
propsModelValue.value.push(res.data);
} else {
propsModelValue.value =propsModelValue.value? propsModelValue.value.split(','):[]
propsModelValue.value.push(res.data);
}
console.log( propsModelValue.value);
emits("update:modelValue", propsModelValue.value.toString());
// emits("handleChange", propsModelValue.value);
};
const handlePreview = (file) => { };
const handleExceed = (files, fileList) => {
ElMessage.warning(`限制，只能上传${props.limit}个文件或图片`);
};
const beforeImgUpload = (file) => {
if (props.isImg) {
let isIMG = false;
if (getSuffix(file.name) === "IMG") {
isIMG = true;
}
const isLt5M = file.size / 1024 / 1024 < 5;
if (!isIMG) {
ElMessage.error("上传图片只能是jpg/png/jpeg/bmp/gif格式!");
}
if (!isLt5M) {
ElMessage.error("上传图片大小不能超过 5MB!");
}
return isIMG && isLt5M;
} else {
return true;
}
};
const handleAvatarSuccess = (res, file) => {
imageUrl.value = URL.createObjectURL(file.raw);
};
//查询图片
const handlePictureCardPreview = (file) => {
dialogImageUrl.value = file.url;
dialogVisible.value = true;
};
const handleDownload = (file) => {
console.log(file);
// window.open(file.response.data);
window.open(file);
};
const handleRemove = (file) => {
let index = fileList.value.findIndex(function (item) {
return item.url === file.url;
});
fileList.value.splice(index, 1);
propsModelValue.value.splice(index, 1);
// emits("handleChange", propsModelValue.value);
emits("update:modelValue", propsModelValue.value.toString());
};
watch(
() => props.modelValue,
(val) => {
let arr = val ? val : [];
if(Array.isArray(arr)){
if (arr && arr.length > 0) {
fileList.value = arr.map((el) => {
return { url: `/mosty-base/minio/image/download/` + el };
});
}
}else{
arr.split(",").map(item=>{
return { url: `/mosty-base/minio/image/download/` + item };
})
}
},
{ immediate: true }
);
</script>
<style lang="scss" scoped>
.avatar-uploader {
width: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.el-icon.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
.file-wrap {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
::v-deep .svg-icon {
font-size: 48px;
margin: 28px 0 2px 0;
}
.file-name {
width: 88%;
font-size: 14px;
line-height: 22px;
text-align: center;
overflow: hidden;
/*将对象作为弹性伸缩盒子模型显示*/
display: -webkit-box;
/*设置子元素排列方式*/
-webkit-box-orient: vertical;
/*设置显示的行数，多出的部分会显示为...*/
-webkit-line-clamp: 2;
}
}
::v-deep .el-upload-list--picture-card {
display: flex;
align-items: center;
padding-top: 7px;
box-sizing: border-box;
}
</style>

223
src/components/MyComponents/choosePolice/index.vue Normal file
View File

@ -0,0 +1,223 @@
<template>
<el-dialog
:title="props.PoliceType == 'MJ' ? '选择民警' : '选择辅警'"
width="1400px"
:model-value="modelValue"
@close="closed"
>
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department
width="100%"
clearable
v-model="listQuery.ssbmdm"
/>
</el-form-item>
<el-form-item label="姓名">
<el-input
placeholder="请输入姓名"
v-model="listQuery.xm"
clearable
></el-input>
</el-form-item>
<el-form-item label="身份证号码">
<el-input
placeholder="请输入身份证号码"
v-model="listQuery.sfzh"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
height="450"
>
<el-table-column type="selection" width="55"/>
<el-table-column
prop="xm"
align="center"
:label="PoliceType == 'MJ' ? '民警姓名' : '辅警姓名'"
></el-table-column>
<el-table-column
sortable
prop="sfzh"
show-overflow-tooltip
align="center"
label="身份证号码"
>
</el-table-column>
<el-table-column
sortable
prop="ssbm"
label="所属部门"
align="center"
></el-table-column>
<el-table-column
sortable
prop="jh"
label="警号"
align="center"
></el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { defineProps, watch, ref, onMounted, nextTick } from "vue";
import { getTbJcglXfll } from "@/api/xfll";
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
roleId: {
type: String,
default: ""
},
PoliceType: {
type: String,
default: ""
},
//是否单选
Single: {
type: Boolean,
default: false
}
});
const total = ref(0);
const listQueryDefault = ref({})
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
ssbmdm:'',
sfzh:''
});
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosedPolice"]);
onMounted(()=>{
listQueryDefault.value = JSON.parse(JSON.stringify(listQuery.value))
handleFilter()
})
// 查询
function handleFilter () {
listQuery.value.pageCurrent = 1;
getListData();
};
// 列表
function getListData () {
const params = listQuery.value;
if (props.roleId) params.roleId = props.roleId;
let lx = props.PoliceType
params.fl = lx =='MJ'?'01': lx =='FJ'?'02':''
tableData.value = [];
getTbJcglXfll(params).then((res)=>{
tableData.value = res?.records;
total.value = Number(res.total);
});
};
// 多选
function handleSelectionChange (val){
if(props.Single){
if(val.length>1){
let del_row = val.shift()
multipleUserRef.value.toggleRowSelection(del_row,false)
}
multipleSelectionUser.value = val;
}else{
multipleSelectionUser.value = val;
}
};
// 确定按钮
function onComfirm() {
const userList = multipleSelectionUser.value
let params = {userList: userList,type: props.PoliceType};
if (props.Single) {
emits("choosedPolice", userList);
} else {
emits("choosedPolice", params);
}
closed();
};
// 关闭弹窗
function closed() {
emits("update:modelValue", false);
};
// 重置弹窗
function reset() {
listQuery.value = JSON.parse(JSON.stringify(listQueryDefault.value))
getListData();
};
// pageSize 改变触发
function handleSizeChange(currentSize){
listQuery.value.pageSize = currentSize;
getListData();
};
// 页码改变触发
function handleCurrentChange (currentPage) {
listQuery.value.pageCurrent = currentPage;
getListData();
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner{
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox{
display: none;
}
</style>

42
src/components/MyComponents/index.js Normal file
View File

@ -0,0 +1,42 @@
import AddressSelect from "./AddressSelect/index.vue";
import FrameWork from "./FrameWork/index.vue";
import FrameWork2 from "./FrameWork2/index.vue";
import Phone from "./Phone/index.vue";
import IdentityCard from "./IdentityCard/index.vue";
import PackageSelect from "./PackageSelect/index.vue";
import Email from "./Email/index.vue";
import Other from "./Other/index.vue";
import Sex from "./Sex/index.vue";
import Select from "./Select/index.vue";
import Upload from "./Upload/index.vue";
import Department from "./Department/index.vue";
import DepartmentTree from "./DepartmentTree/index.vue";
import ChooseIcon from "./ChooseIcon/index.vue";
import StationSelect from "./StationSelect/index.vue";
import Provinces from "./Provinces2/index.vue";
import MarkdownEdit from "./MarkdownEdit/index.vue";
import FileUpload from "./FileUpload/index.vue";
import Date from "./Date/index.vue";
import Empty from "./Empty/index.vue";
export {
AddressSelect,
FrameWork,
Phone,
IdentityCard,
PackageSelect,
Email,
Other,
Sex,
Select,
Upload,
FrameWork2,
Department,
DepartmentTree,
ChooseIcon,
StationSelect,
Provinces,
MarkdownEdit,
FileUpload,
Date,
Empty
};

63
src/components/SvgIcon/index.vue Normal file
View File

@ -0,0 +1,63 @@
<template >
<!---外部图标-->
<div
v-bind="$attrs"
v-if="isExternal"
:style="styleExternalIcon"
class="svg-external-icon svg-icon"
:class="className"
/>
<!--内部图标-->
<svg v-else class="svg-icon" :class="className" aria-hidden="true" v-bind="$attrs">
<use :xlink:href="iconName" />
</svg>
</template>
<script setup>
import { isExternal as external } from '@/utils/validate'
import { defineProps, computed } from 'vue'
const props = defineProps({
// icon 图标
icon: {
type: String,
required: true
},
// 图标类名
className: {
type: String,
default: ''
}
})
/**
* 判断是否为外部图标
*/
const isExternal = computed(() => external(props.icon))
/**
* 外部图标样式
*/
const styleExternalIcon = computed(() => ({
mask: `url(${props.icon}) no-repeat 50% 50%`,
'-webkit-mask': `url(${props.icon}) no-repeat 50% 50%`
}))
/**
* 项目内图标
*/
const iconName = computed(() => `#icon-${props.icon}`)
</script>
<style scoped>
.svg-icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
.svg-external-icon {
background-color: currentColor;
mask-size: cover !important;
display: inline-block;
}
</style>

305
src/components/TagsView/index.vue Normal file
View File

@ -0,0 +1,305 @@
<template>
<div class="tags-view-container">
<Hamburger class="hamburger-container"></Hamburger>
<router-link
@contextmenu.prevent="onContextmenu(tag, $event)"
class="tags-view-item"
:class="isActive(tag) ? 'active' : ''"
v-for="(tag, index) in $store.getters.tagsViewList"
:key="tag.fullPath"
:to="{ path: tag.fullPath }"
>
<span>{{ tag.title || "个人中心" }}</span>
<el-icon
class="el-icon-close"
@click.prevent.stop="onCloseClick(index, isActive(tag))"
>
<close />
</el-icon>
</router-link>
<!-- <span v-if="store.getters.tagsViewList.length > 11">...</span> -->
<div class="icons">
<el-dropdown
@visible-change="checkActive"
@command="dropRoute"
trigger="click"
>
<span class="el-dropdown-link">
<el-icon :class="active ? '_icon icon' : 'icon'" color="#24b6dd"
><ArrowUpBold
/></el-icon>
</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="cxjz">重新加载</el-dropdown-item>
<el-dropdown-item command="close">关闭其他标签</el-dropdown-item>
<el-dropdown-item command="closeAll">关闭全部标签</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
<Contextmenu
ref="contextmenuRef"
:items="contextmenuItems"
@contextmenuItemClick="onContextmenuItem"
/>
</div>
</template>
<script setup>
import Contextmenu from "@/components/contextmenu/index.vue";
import Hamburger from "@/components/Hamburger/index";
import { reactive, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { useStore } from "vuex";
const route = useRoute();
const active = ref(false);
/**
* 是否被选中
*/
const isActive = (tag) => {
return tag.path === route.path;
};
const contextmenuRef = ref(null);
/**
* 关闭 tag 的点击事件
*/
const store = useStore();
const router = useRouter();
const onCloseClick = (index, current) => {
store.commit("app/removeTagsView", {
type: "index",
index: index
});
if (current === true) {
if (store.getters.tagsViewList.length === 0) {
window.location.href = '/'
// router.push("/");
} else if (index > 0) {
router.push(store.getters.tagsViewList[index - 1].fullPath);
} else {
router.push(store.getters.tagsViewList[0].fullPath);
}
}
};
function checkActive(e) {
active.value = e;
}
const onContextmenuItem = async (item) => {
const { name, menu } = item;
switch (name) {
case "refresh":
router.go(0);
break;
case "close":
const index = store.getters.tagsViewList.indexOf(menu);
if (isActive(menu)) {
if (store.getters.tagsViewList.length === 1) {
// router.push("/");
window.location.href = '/'
} else if (index > 0) {
router.push(store.getters.tagsViewList[index - 1].fullPath);
} else if (index == 0) {
router.push(store.getters.tagsViewList[1].fullPath || "/");
}
}
store.commit("app/removeTagsView", {
type: "data",
data: menu
});
break;
case "closeOther":
store.commit("app/clearTag", menu);
router.push(menu.fullPath);
break;
case "closeAll":
store.commit("app/clearTag", null);
// router.push("/");
window.location.href = '/'
break;
// case "fullScreen":
// break;
}
};
/*生成title */
const getTitle = (route) => {
let title = "";
if (!route.meta) {
const pathArr = route.path.split("/");
title = pathArr[pathArr.length - 1];
} else {
title = route.meta.title;
}
return title;
};
function dropRoute(e) {
switch (e) {
case "cxjz":
router.go(0);
break;
case "closeAll":
store.commit("app/clearTag", null);
// router.push("/");
window.location.href = '/'
break;
case "close":
const { fullPath, meta, name, params, path, query } = route;
let menu = {
fullPath,
meta,
name,
params,
path,
query,
title: getTitle(route)
};
store.commit("app/clearTag", menu);
router.push(menu.fullPath);
break;
}
}
const contextmenuItems = reactive([
{ name: "refresh", label: "重新加载", icon: "fa fa-refresh" },
{ name: "close", label: "关闭标签", icon: "fa fa-times" },
{ name: "closeOther", label: "关闭其他标签", icon: "fa fa-minus" },
{ name: "closeAll", label: "关闭全部标签", icon: "fa fa-stop" }
]);
const onContextmenu = (menu, el) => {
// 禁用刷新
contextmenuItems[0].disabled = route.path !== menu.path;
// 禁用关闭其他和关闭全部
contextmenuItems[3].disabled = contextmenuItems[2].disabled = store.getters.tagsViewList.length == 1 ? true : false;
const { clientX, clientY } = el;
contextmenuRef.value.onShowContextmenu(menu, { x: clientX, y: clientY });
};
</script>
<style lang="scss" scoped>
.icons {
position: absolute;
top: 12px;
right: 100px;
}
.tags-view-container::-webkit-scrollbar {
height: 0px;
position: absolute;
}
.tags-view-container {
// width: calc(100vw - 300px);
height: 36px;
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;
border-bottom: 1px solid rgb(7, 55, 109);
.hamburger-container {
line-height: 36px;
}
.tags-view-item {
text-decoration: none;
display: inline-block;
position: relative;
cursor: pointer;
height: 36px;
line-height: 36px;
color: #24b6dd;
font-size: 14px;
margin-left: 5px;
margin-right: 28px;
// display: inline-flex;
align-items: center;
span {
vertical-align: middle;
}
i {
vertical-align: middle;
position: absolute;
right: -18px;
top: 11px;
}
&:first-of-type {
margin-left: 8px;
}
&:last-of-type {
margin-right: 15px;
}
&.active {
color: #61f9ff;
border-bottom: 2px solid #61f9ff;
height: 34px;
font-weight: bold;
// background: linear-gradient(180deg, #89f7fe 100%, #66a6ff 100%);
// -webkit-background-clip: text;
// -webkit-text-fill-color: transparent;
&::before {
content: "";
width: 0px;
height: 0px;
font-size: 0px;
position: absolute;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid transparent;
border-bottom: 6px solid #61f9ff;
bottom: -1px;
left: 50%;
margin-left: -6px;
}
}
// close 按钮
.el-icon-close {
width: 16px;
height: 16px;
line-height: 10px;
border-radius: 50%;
text-align: center;
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transform-origin: 100% 50%;
&:before {
transform: scale(0.6);
display: inline-block;
vertical-align: -3px;
}
&:hover {
background-color: #b4bccc;
color: #fff;
}
}
}
}
.icon._icon {
transform: rotateZ(180deg);
transition: all 0.2s linear;
}
.icon {
transform: rotateZ(0deg);
transition: all 0.2s linear;
}
::v-deep .el-popper.is-light,
::v-deep .el-popper.is-light .el-popper__arrow::before {
background: #0d2944;
border: 1px solid #03438b;
}
::v-deep .el-dropdown-menu {
background-color: transparent;
.el-dropdown-menu__item {
color: #fff;
&:hover {
color: #61f9ff;
background: transparent;
}
}
}
</style>

76
src/components/ThemeSelect/components/SelectColor.vue Normal file
View File

@ -0,0 +1,76 @@
<template>
<el-dialog title="提示" :model-value="modelValue" @closed="closed" width="22%">
<div class="content-wrap">
<p class="title">主题色更换</p>
<el-color-picker v-model="mColor" :predefine="predefineColors"></el-color-picker>
</div>
<template #footer>
<el-button type="primary" @click="clearTheme()">重置</el-button>
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="comfirm">确定</el-button>
</template>
</el-dialog>
</template>
<script setup>
import { useStore } from 'vuex'
import { MAIN_COLOR } from '@/constant';
import { defineProps, defineEmits, ref } from 'vue'
import { generateNewStyle, writeNewStyle } from '@/utils/theme';
import { removeItem } from '@/utils/storage';
import { useRouter } from 'vue-router';
const store = useStore();
defineProps({
modelValue: {
type: Boolean,
required: true
}
})
// 预定义色值
const predefineColors = [
'#409EFF',
'#ff4500',
'#ff8c00',
'#0800FF',
'#1e90ff',
'#c71585',
'rgba(255, 69, 0, 0.68)',
'#C0610D',
'hsl(181, 100%, 37%)',
'#216D6E',
'hsla(209, 100%, 56%, 0.73)',
'#c7158577'
]
//默认色值
const mColor = ref(store.getters.mainColor)
const emits = defineEmits(['update:modelValue']);
const closed = () => {
emits('update:modelValue', false)
}
const comfirm = async () => {
const newStyle = await generateNewStyle(mColor.value);
writeNewStyle(newStyle)
store.commit('theme/setMainColor', mColor.value)
closed();
router.go(0)
}
const router = useRouter();
const clearTheme = () => {
removeItem(MAIN_COLOR);
closed();
router.go(0)
}
</script>
<style lang="scss" scoped>
.content-wrap {
text-align: center;
.title {
margin-bottom: 12px;
}
}
</style>

30
src/components/ThemeSelect/index.vue Normal file
View File

@ -0,0 +1,30 @@
<template>
<div v-bind="$attrs">
<div>
<el-tooltip content="主题色修改" placement="bottom" effect="light">
<span @click="handleSetTheme()">
<SvgIcon icon="change-theme"></SvgIcon>
</span>
</el-tooltip>
</div>
<div>
<SelectColor v-model="selectColorVisible"></SelectColor>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import SvgIcon from '../SvgIcon/index.vue';
import SelectColor from './components/SelectColor.vue'
//dialog 1
const selectColorVisible = ref(false);
const handleSetTheme = command => {
selectColorVisible.value = true;
};
</script>
<style lang="scss" scoped>
</style>

104
src/components/VideoPay/index.vue Normal file
View File

@ -0,0 +1,104 @@
<!-- <template>
id：用于获取video对象
class：video-js vjs-default-skin为video内置的样式名称，样式可根据具体项目进行调整
autoplay：自动播放
muted：设置静音。在最新版的Chrome浏览器（以及所有以Chromium为内核的浏览器）中，已不再允许自动播放音频和视频，设置静音是一种hack手段，参考：https://www.mzwu.com/article.asp?id=4411
preload：提前加载
<video
:id="videoIds"
class="video-js vjs-default-skin video_item"
autoplay
muted
preload="auto"
>
<source :src="props.src" style="width: 100%; height: 100%" />
</video>
</template>
<script setup>
// 引入videojs以及样式文件
import videojs from "video.js/dist/video.min";
import "video.js/dist/video-js.min.css";
import emitter from "@/utils/eventBus.js";
import {
defineComponent,
onMounted,
onBeforeUnmount,
onUnmounted,
ref,
watch,
nextTick,
onUpdated
} from "vue";
const myPlayer = ref(null); //视频对象
const videoIds = ref(0); //视频对象ID
// 在onMounted阶段进行初始化
onMounted(() => {
//设置视频对象ID
let videoCount = window.localStorage.getItem("videoCount");
if (videoCount) {
videoCount++;
window.localStorage.setItem("videoCount", videoCount);
videoIds.value = `video_${videoCount}`;
} else {
window.localStorage.setItem("videoCount", 1);
videoIds.value = `video_${window.localStorage.getItem("videoCount")}`;
}
nextTick(() => {
initVideoSourc();
});
});
onBeforeUnmount(() => {
//销毁视频对象
myPlayer.value.dispose();
});
// 监听视频地址变化
watch(
() => props.src,
(n) => {
changeVideoSource(n);
}
);
//参数
const props = defineProps({
//视频地址
src: String
});
//初始化视频
function initVideoSourc() {
myPlayer.value = videojs(
videoIds.value,
{
bigPlayButton: false, //播放悬浮大按钮
textTrackDisplay: false, //文本轨道
posterImage: false, //封面
errorDisplay: false,
controls: true //显示控件
// ...其他配置参数
},
function () {
this.play();
}
);
}
// 视频地址发生变化时的处理
function changeVideoSource(src) {
if (!src) return;
myPlayer.value.src([
{
src: src,
type: "application/x-mpegURL"
}
]);
myPlayer.value.play();
}
</script>
<style lang="scss" scoped>
.video_item {
width: 100%;
height: 100%;
}
</style>-->

197
src/components/Watermark.vue Normal file
View File

@ -0,0 +1,197 @@
<template>
<div ref="watermarkContainerRef" class="watermark-container">
<!-- 插槽-->
<slot></slot>
</div>
</template>
<script setup>
import { ref, onMounted, watchEffect, onUnmounted, computed } from "vue";
// 使用 defineProps 定义一个组件的 props，这些 props 描述了组件从父组件接收的属性
const props = defineProps({
// 文本内容，类型为字符串，必须提供，默认值为'张苹果博客'
text: {
type: Array,
required: true,
default: []
},
// 字体大小，类型为数字，默认值为10
fontSize: {
type: Number,
default: 15
},
// 间距，类型为数字，默认值为2
gap: {
type: Number,
default: 2
},
// 颜色，类型为字符串，默认值为' rgba(136, 135, 135, 0.58)'
color: {
type: String,
default: "rgba(136, 135, 135, 0.58)"
},
//角度 类型为数字 默认值 -45
angle: {
type: Number,
default: -45
}
});
/**
* 绘制多行文本
* @param ctx canvas对象
* @param words 文本数组
* @param x 坐标
* @param y 坐标(行高)
* @param maxWidth 最大宽度
*/
function drawTextWithWrap(ctx, words, x, y, maxWidth) {
let line = "";
const row = JSON.parse(JSON.stringify(y)); //拷贝一份Y的 行间距
for (let n = 0; n < words.length; n++) {
const testLine = line + words[n];
const metrics = ctx.measureText(testLine);
const testWidth = metrics.width;
if (testWidth > maxWidth) {
ctx.fillText(line, x, y);
line = words[n];
y = row * (n + 1);
} else {
line = testLine;
}
}
ctx.fillText(line, x, y);
}
// 定义一个用于绘制水印的函数，这里可以封装一下单独引入。
// 它是一个计算属性，意味着它的值会根据其依赖的 props 的变化而自动重新计算
const waterMarkBg = (props) => {
return computed(() => {
// 创建一个新的 canvas 元素
const canvas = document.createElement("canvas");
// 获取设备的像素比，如果未定义则默认为1
const devicePixelRatio = window.devicePixelRatio || 1;
// 根据像素比计算字体大小
const fontSize = props.fontSize * devicePixelRatio;
// 设置字体样式
const font = fontSize + "px serif";
// 获取 canvas 的 2D 渲染上下文
const ctx = canvas.getContext("2d");
// 设置字体
ctx.font = font;
// 测量文本的宽度
// const { width } = ctx.measureText(props.text);
// 计算 canvas 的大小，至少为 60，并根据文本宽度和间距因子进行调整
const canvasSize = Math.max(60, 180) * props.gap + devicePixelRatio;
// 设置 canvas 的宽高
canvas.width = canvasSize;
canvas.height = canvasSize;
// 将 canvas 的原点移动到中心
ctx.translate(canvas.width / 5, canvas.height / 5);
// 旋转 canvas 45 度
ctx.rotate((Math.PI / 180) * props.angle);
// 设置填充颜色
ctx.fillStyle = props.color;
// 设置文本对齐方式和基线
ctx.textAlign = "center";
ctx.textBaseline = "middle";
// 再次设置字体
ctx.font = font;
drawTextWithWrap(ctx, props.text, 0, 25, 100);
// 在 canvas 上填充文本
// ctx.fillText(props.text, 0, 0);
// 返回一个对象，包含 base64 编码的图片数据、canvas 的大小和样式尺寸
return {
base64: canvas.toDataURL(),
size: canvasSize,
styleSize: canvasSize / devicePixelRatio
};
});
};
// 用于存储 MutationObserver 的变量
let ob;
// 用于存储水印 div 的变量
let div;
// 调用 waterMarkBg 函数获取水印相关的计算属性
const bg = waterMarkBg(props);
// 创建一个 ref 用于存储水印容器的 DOM 引用
const watermarkContainerRef = ref("");
// 创建一个 ref 用于标记水印是否需要重新生成
const flag = ref(0);
// 在组件挂载后执行
onMounted(() => {
// 创建一个新的 MutationObserver，用于监听水印容器的变化
ob = new MutationObserver((records) => {
// 遍历所有的变化记录
for (const record of records) {
// 遍历所有被移除的节点
for (const dom of record.removedNodes) {
// 如果被移除的节点是水印 div，则更新 flag 的值并返回
if (dom === div) {
flag.value++;
return;
}
}
// 如果变化的节点就是水印 div，则更新 flag 的值并返回
if (record.target === div) {
flag.value++;
return;
}
}
});
// 包括子节点的变化、属性的变化以及子树的变化
ob.observe(watermarkContainerRef.value, {
childList: true,
attributes: true,
subtree: true
});
});
//卸载
onUnmounted(() => {
ob && ob.disconnect();
div = null;
});
// 生成水印
watchEffect(() => {
// 触发 watchEffect 的重新执行
flag.value;
// 如果水印容器没有值，则直接返回，不执行后续操作
if (!watermarkContainerRef.value) {
return;
}
// 如果之前已经存在水印 div，则先移除它
if (div) {
div.remove();
}
// 创建一个新的 div 元素用于作为水印的容器
div = document.createElement("div");
// 从计算属性 bg 中获取 base64 编码的图片数据和样式尺寸
const { base64, styleSize } = bg.value;
// 设置 div 的背景图片为水印图片的 base64 编码
div.style.backgroundImage = `url(${base64})`;
// 设置背景图片的尺寸
div.style.backgroundSize = `${styleSize}px ${styleSize}px`;
// 设置背景图片重复显示
div.style.backgroundRepeat = "repeat";
// 设置水印 div 的 z-index 为 9999，以确保它显示在大多数其他元素之上
div.style.zIndex = 9999;
// 设置水印 div 不响应鼠标事件，如点击、悬停等
div.style.pointerEvents = "none";
// 设置水印 div 的位置为绝对定位
div.style.position = "absolute";
// 使用 inset 属性设置 div 占据整个父容器的空间
div.style.inset = "0";
// 将水印 div 添加到水印容器中
watermarkContainerRef.value.appendChild(div);
});
</script>
<style scoped>
.watermark-container {
position: relative;
height: 100vh;
}
</style>

248
src/components/ZbCalendar/Calendar.vue Normal file
View File

@ -0,0 +1,248 @@
<template>
<!-- 日历组件 -->
<div class="calender">
<div class="date-header">
<!-- 切换日期按钮 -->
<div class="btn-month">
<div>
<!-- <button @click="handleYear(-1)">&lt;&lt;</button> -->
<el-button size="small" @click="handlePrev">
<ArrowLeftBold style="width: 12px; height: 12px" />
</el-button>
</div>
<div class="show-date">{{ year }}年{{ month }}月</div>
<div>
<el-button size="small" @click="handleNext">
<ArrowRightBold style="width: 12px; height: 12px" />
</el-button>
<!-- <button @click="handleYear(1)">&gt;&gt;</button> -->
</div>
</div>
</div>
<div class="date-content">
<div class="week-header">
<div
v-for="item in [
'周日',
'周一',
'周二',
'周三',
'周四',
'周五',
'周六'
]"
:key="item"
>
{{ item }}
</div>
</div>
<div class="week-day">
<div v-for="item in 42" :key="item + 'day'">
<!-- 当月 -->
<div
:class="getDay(item - beginDay()) ? 'active' : ''"
v-if="item - beginDay() > 0 && item - beginDay() <= prevDays(0)"
@click="chack(item - beginDay())"
>
<span class="day">{{ item - beginDay() }}日</span>
<div
class="btn_day"
v-for="(c, i) in data.filter(
(evn) => evn.day * 1 == item - beginDay()
)"
:key="c * i"
>
<div class="tit" :style="{ backgroundColor: c.color }">
{{ c.title }}
</div>
<div class="time">{{ c.time }}</div>
</div>
</div>
<!-- 上月 -->
<div
class="other-day"
v-else-if="item - beginDay() <= 0"
@click="handlePrev"
>
<span class="day">{{ item - beginDay() + prevDays(1) }}日</span>
</div>
<!-- 下月 -->
<div class="other-day" v-else @click="handleNext">
<span class="day">{{ item - beginDay() - prevDays(0) }}日</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, onMounted, defineProps, watch, defineEmits } from "vue";
const emit = defineEmits(["calClick"]);
const props = defineProps({
//数据
list: Array
});
watch(
() => props.list,
() => {
data.value = [...props.list];
},
{ deep: true }
);
const arr = ref([1]);
const active = ref(null);
const year = ref(null);
const month = ref(null);
const day = ref(null);
const curDate = ref(null);
const nextDay = ref(null);
const data = ref([]);
function getInitDate() {
const date = new Date();
year.value = date.getFullYear();
month.value = date.getUTCMonth() + 1;
day.value = date.getDate();
curDate.value = `${year.value}-${month.value}-${day.value}`;
}
// 獲取當天日期
function getDay(e) {
const date = new Date();
const dqTime =
date.getFullYear() + "-" + (date.getMonth() + 1) + date.getDate();
return dqTime === year.value + "-" + month.value + e;
}
//获取1号开始位置
function beginDay() {
return new Date(year.value, month.value - 1, 1).getDay();
}
// 获取某月天数
function prevDays(e) {
return new Date(year.value, month.value - e, 0).getDate();
}
function handlePrev() {
active.value = null;
data.value = [];
if (month.value == 1) {
month.value = 12;
year.value--;
} else {
month.value--;
}
emit("calClick", year.value + "-" + month.value);
}
function handleNext() {
active.value = null;
data.value = [];
if (month.value == 12) {
month.value = 1;
year.value++;
} else {
month.value++;
}
emit("calClick", year.value + "-" + month.value);
}
function handleYear(e) {
active.value = null;
year.value += e;
}
function chack(e) {}
onMounted(() => {
getInitDate();
data.value = props.list;
});
</script>
<style lang="scss" scoped>
.calender {
height: calc(100% - 80px);
// overflow-y: scroll;
.date-header {
padding: 12px 0;
}
.btn-month {
display: flex;
justify-content: center;
.show-date {
font-size: 18px;
margin: 0 24px;
}
}
.date-content {
.week-header {
display: flex;
justify-content: center;
> div {
width: 13%;
text-align: center;
padding: 10px 0;
border-left: 1px solid #266ff8;
border-top: 1px solid #266ff8;
}
> div:nth-child(7) {
border-right: 1px solid #266ff8;
}
}
.week-day {
display: flex;
justify-content: center;
flex-wrap: wrap;
> div:nth-child(7n) {
border-right: 1px solid #266ff8;
}
> div:nth-child(36),
> div:nth-child(37),
> div:nth-child(38),
> div:nth-child(39),
> div:nth-child(40),
> div:nth-child(41),
> div:nth-child(42) {
border-bottom: 1px solid #266ff8;
}
> div {
border-left: 1px solid #266ff8;
border-top: 1px solid #266ff8;
width: 13%;
min-height: 10vh;
.btn_day {
text-align: center;
.tit {
font-size: 16px;
margin: 0 50px;
line-height: 2em;
padding: 0 16px;
border-radius: 4px;
}
.time {
line-height: 2em;
}
}
}
.other-day,
.other-day {
color: #858585;
// height: 11vh;
}
.day {
display: block;
padding: 4px;
text-align: right;
}
.active {
position: relative;
}
.active::after {
content: "当天";
position: absolute;
top: 0;
left: 0;
background: rgb(63, 128, 248);
padding: 4px;
border-radius: 0 0 8px 0;
}
}
}
}
</style>

114
src/components/ZbCalendar/index.vue Normal file
View File

@ -0,0 +1,114 @@
<!-- 全县值班 -->
<template>
<div class="calendar">
<div class="card" ref="cal" @date-click="handleDateClick"></div>
</div>
</template>
<script setup>
import { ref, nextTick, defineEmits, onMounted, watch } from "vue";
import { Calendar } from "@fullcalendar/core";
import dayGridPlugin from "@fullcalendar/daygrid";
import timeGridPlugin from "@fullcalendar/timegrid";
import listPlugin from "@fullcalendar/list";
import interactionPlugin from "@fullcalendar/interaction";
const emit = defineEmits(["calClick"]);
const props = defineProps({
//数据
list: Array,
//是否可点击日程
isClick: Boolean
});
const Tcalendar = ref(null);
function initCalendar() {
Tcalendar.value = new Calendar(cal.value, {
// timeZone: 'UTC',
plugins: [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin],
initialView: "dayGridMonth",
headerToolbar: {
left: "todayCustom",
center: "title",
right: "prevMonthCustom,nextMonthCustom"
},
//自定义按钮
customButtons:{
prevMonthCustom:{
text:'上月',
click:function(){
Tcalendar.value.prev()
Tcalendar.value.render();
}
},
nextMonthCustom:{
text:'下月',
click:function(){
Tcalendar.value.next()
Tcalendar.value.render();
}
},
todayCustom:{
text:'今天',
click:function(){
Tcalendar.value.today()
Tcalendar.value.render();
}
}
},
locale: "zh-cn",
weekNumbers: true, //是否显示一年第几周
selectable: props.isClick, //是否可点击日程 || 日期
dayMaxEvents: true, // 是否可显示弹窗
events: props.list,
displayEventTime: true, // 是否显示时间
eventClick: function (info) {
emit("calClick", info.event._def.extendedProps.myData);
}
});
Tcalendar.value.render();
}
watch(
() => props.list,
() => {
initCalendar()
},{deep:true}
);
const data = ref({});
const cal = ref(null);
onMounted(() => {
initCalendar();
});
</script>
<style lang="scss" scoped>
.calendar {
height: calc(100% - 60px);
.card {
height: 100%;
width: 100%;
}
}
::v-deep .el-dialog__body,::v-deep.fc-toolbar-title {
color: #ffffff;
}
::v-deep .fc-h-event .fc-event-title-container {
text-align: center;
}
::v-deep .fc-theme-standard .fc-scrollgrid {
border: 1px solid #295ead;
}
::v-deep .fc-theme-standard td,
::v-deep .fc-theme-standard th {
border: 0 none;
}
::v-deep .fc-theme-standard td {
border-right: 1px solid #295ead;
}
::v-deep .fc-theme-standard th {
background: #0b4372;
padding: 3px 0;
}
::v-deep .fc-scrollgrid-sync-table tr:nth-child(even) {
background: #062555;
}
</style>

291
src/components/aboutTable/DarkTable.vue Normal file
View File

@ -0,0 +1,291 @@
<template>
<div style="width: 100%">
<!-- hasChildren要在tableData中定义表示当前行有没有下一级 children要在tableData中定义表示下一级的数据-->
<el-table
ref="multipleTableRef"
:data="tableData"
@selection-change="handleSelectionChange"
@current-change="handleCurrentChange"
@row-click="singleElection"
@row-dblclick="rowdbClickHland"
@row-contextmenu="rowcontextmenuHland"
:row-key="getConfiger.rowKey"
:border="getConfiger.border"
:default-expand-all="getConfiger.defaultExpandAll"
:stripe="getConfiger.stripe"
:height="tableHeight"
v-loading="tableConfiger.loading"
:lazy="getConfiger.lazy"
:load="load"
:row-class-name="rowClassName"
:tree-props="treePros"
style="width: 100%; font-size: 16px"
:header-cell-class-name="() => 'myTableHeadBgColorDark'"
:highlight-current-row="getConfiger.showSelectType === 'radio'"
:row-style="{
height:
getConfiger.rowHeight === 'auto'
? getConfiger.rowHeight
: getConfiger.rowHeight + 'px'
}"
>
<el-table-column
type="selection"
width="55"
v-if="getConfiger.showSelectType === 'checkBox'"
/>
<el-table-column
width="55"
v-else-if="getConfiger.showSelectType === 'radio'"
#default="{ row }"
>
<el-radio
class="radio"
v-model="getConfiger.radioChoose"
:label="row[getConfiger.rowKey]"
>&nbsp;</el-radio>
</el-table-column>
<el-table-column
type="index"
label="序号"
v-if="getConfiger.showIndex"
width="60"
:align="getConfiger?.align"
/>
<el-table-column
v-for="(item, index) in tableColumn"
:align="getConfiger?.align"
:prop="item.prop"
:key="index"
:label="item.label"
:width="item.width"
:show-overflow-tooltip="item.showOverflowTooltip || false"
:sortable="item.sortable || false"
>
<!-- 使用自定义表头 -->
<template v-if="item.showSoltHeader" #header="column">
<span class="header-icon">
<slot :name="item.prop+'head'" v-bind="column"></slot>
</span>
</template>
<!-- 使用自定义 -->
<template v-if="item.showSolt" #default="scope">
<slot :name="item.prop" v-bind="scope"></slot>
</template>
<!-- 默认 -->
<template v-else #default="{ row }">
{{ row[item.prop] }}
</template>
</el-table-column>
<!-- 操作 -->
<el-table-column
v-if="getConfiger.haveControls"
:fixed="fixed"
:label="getConfiger.controls"
:width="controlsWidth"
:align="getConfiger?.align"
>
<template #default="scope">
<slot name="controls" v-bind="scope"></slot>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script setup>
import { nextTick, onMounted, reactive, ref, watch, watchEffect } from "vue";
const props = defineProps({
tableConfiger: {
type: Object,
default: () => {}
},
tableData: {
type: Array,
default: () => []
},
tableColumn: {
type: Array,
default: () => {
return [];
}
},
controlsWidth: {
type: Number,
default: 180
},
tableHeight: {
type: Number
},
treePros: {
type: Object,
default: {
children: "children",
hasChildren: "hasChildren"
}
},
fixed: {
type: String,
default: "right"
}
});
// 可选的时候选择的数据
const emit = defineEmits(["chooseData","rowdbClickHland","rowcontextmenuHland"]);
const multipleTableRef = ref();
const currentRow = ref();
let getConfiger = reactive({
showSelectType: null, // 显示多选还是单选还是没有选择 checkBox/radio/null
showIndex: true, // 是否显示索引
rowKey: null, // 如果是树形表格必须设置rowKey
border: true, // 是否显示边框
defaultExpandAll: false, // 是否展开全部
loading: false,
align: "center", // 列的对齐方式 left / center / right
haveControls: true, // 是否有操作列
controls: "操作", // 操作列的表头
stripe: false, // 是否有斑马线
lazy: true, // 树形表格的懒加载必须在tableDatez中给有children的项设置 hasChildren: true,才会显示展开icon
portUrl: "", // 当树形表格使用懒加载的时候传入的请求路径/接口用于懒加载数据
defaultSelectKeys: [], // 默认选中的key集合
radioChoose: "", // 单选时选中的值------------------------------------------- 待完成
rowHeight: "41", // 每行的高度
//用作指定行自定义行样式
rowClassProp:"", //行匹配字段名称
rowClassLinght:"", //行匹配数据
});
watchEffect(() => {
getConfiger = { ...getConfiger, ...props.tableConfiger };
setDefaultChoose();
});
onMounted(() => {
setDefaultChoose();
});
const rowClassName = ({ row, rowIndex }) => {
if(row[getConfiger.rowClassProp] == getConfiger.rowClassLinght){
return "table_light_row";
}
if (rowIndex % 2 == 0) {
return "";
} else {
return "table_blue_row";
}
};
// 可选的时候选择的数据
const handleSelectionChange = (val) => {
emit("chooseData", val);
};
// 单选的时候选择的数据
const handleCurrentChange = (val) => {
currentRow.value = val;
emit("chooseData", val);
};
const singleElection = (val) => {
if (getConfiger.showSelectType === "radio") {
getConfiger.radioChoose = val[getConfiger.rowKey];
// emit("chooseData", val);
}
};
// 懒加载数据的方法
const load = (date, treeNode, resolve) => {
setTimeout(() => {
resolve([
{
id: 31,
date: "2016-05-01",
name: "wangxiaohu",
address: "No. 189, Grove St, Los Angeles"
},
{
id: 32,
date: "2016-05-01",
name: "wangxiaohu",
address: "No. 189, Grove St, Los Angeles"
}
]);
}, 1000);
};
// 设置默认选中（在调用的父页面要确保 tableData传出来了如果延迟传过来默认选中不会生效）
function setDefaultChoose() {
nextTick(() => {
// 多选的默认选中
if (
props.tableConfiger.defaultSelectKeys?.length > 0 &&
props.tableConfiger.showSelectType === "checkBox"
) {
props.tableData.forEach((item) => {
if (
props.tableConfiger.defaultSelectKeys.findIndex(
(v) => v === item[props.tableConfiger.rowKey]
) > -1
) {
multipleTableRef.value.toggleRowSelection(item, true);
}
});
// 单选的默认选中
} else if (
props.tableConfiger.defaultSelectKeys &&
props.tableConfiger.defaultSelectKeys?.length > 0 &&
props.tableConfiger.showSelectType === "radio"
) {
getConfiger.radioChoose = props.tableConfiger.defaultSelectKeys[0];
}
});
}
//当某一行被双击时会触发该事件
const rowdbClickHland = (row) => {
emit("rowdbClickHland", row);
};
//当某一行右键点击时会触发该事件
const rowcontextmenuHland = (row,column,e) => {
e.preventDefault();
emit("rowcontextmenuHland", {row,e});
};
</script>
<style lang = "scss">
.myTableHeadBgColorDark {
background-color: rgba(18, 97, 192, 0.3) !important;
color: #008efc;
}
</style>
<style lang = "scss" scoped>
::v-deep .el-table--enable-row-transition .el-table__body td.el-table__cell {
font-size: 14px;
}
::v-deep .el-table {
background-color: transparent;
--el-table-border-color: transparent;
--el-table-row-hover-bg-color: #008ffd4b;
}
::v-deep .el-table th.el-table__cell {
color: #1f84ff;
border-bottom: none;
}
::v-deep .el-table tr {
background-color: transparent;
color: #fff;
}
::v-deep .el-table td.el-table__cell {
background: transparent;
}
::v-deep .el-table .table_blue_row {
background: #072343;
}
::v-deep .el-table .table_light_row{
background: #6b933d;
}
::v-deep .el-table .cell {
padding: 0;
line-height: unset;
}
::v-deep .el-table__body tr.current-row>td.el-table__cell{
background: #002961;
}
::v-deep .el-table__body-wrapper tr td.el-table-fixed-column--right{
/* background: none !important; */
}
</style>

204
src/components/aboutTable/FormMessage.vue Normal file
View File

@ -0,0 +1,204 @@
<template>
<el-form ref="elform" :model="listQuery" :disabled="disabled" :label-width="props.labelWidth" :rules="props.rules"
:inline="true" label-position="right">
<div class="form-row" v-for="(child, idx) in props.formList" :key="idx"
:style="{ width: Object.prototype.toString.call(child) === '[object Object]' ? child.width : '' }">
<template v-if="Array.isArray(child)">
<el-form-item v-for="(item, childIdx) in child" :key="childIdx" :prop="item.prop" :label="item.label"
:label-width="item.labelWidth" :style="{ width: child.width }">
<!-- input表单 input lx:textarea || number-->
<MOSTY.Other v-if="item.type == 'input'" :type="item.lx" :rows="item.rows || 4" width="100%" clearable
v-model="listQuery[item.prop]" :placeholder="`请输入${item.label}`" :disabled="item.disabled" />
<!-- <el-input v-model="listQuery[item.prop]" v-else-if="item.lx == 'textarea'" type="textarea" :rows="3"
:placeholder="`请输入${item.label}`" :disabled="item.disabled" /> -->
<!-- 数值 number-->
<el-input-number v-else-if="item.type == 'number'" @change="handleNum" v-model="listQuery[item.prop]"
style="width:100%" :min="item.min || 0" :max="item.max || 1000" />
<!--选择 select-->
<MOSTY.Select v-else-if="item.type == 'select'" @change="handleNum" filterable :multiple="item.multiple"
v-model="listQuery[item.prop]" :dictEnum="item.options" width="100%" clearable
:placeholder="`请选择${item.label}`" />
<!-- 选择性别 -->
<MOSTY.Sex v-else-if="item.type == 'Sex'" v-model:sex="listQuery[item.prop]" width="100%" clearable
:placeholder="`请选择${item.label}`" />
<!--其他类型other： lx：EDUCATION（文化程度），NATION（民族）-->
<MOSTY.PackageSelect v-else-if="item.type == 'other'" :dictEnum="item.lx" width="100%"
v-model="listQuery[item.prop]" clearable filterable />
<!-- 部门department -->
<MOSTY.Department style="width:100%" v-else-if="item.type === 'department'" clearable
:placeholder="listQuery.ssbm ? listQuery.ssbm : `请选择${item.label}`" v-model="listQuery[item.prop]" />
<!-- 时间选择 type: date/time/datetime/datetimerange/daterange-->
<MOSTY.Date v-else-if="item.type == 'date'" :type="item.lx ? item.lx : 'date'" width="100%" clearable
v-model="listQuery[item.prop]" />
<!-- 上传 upload limit:'限制张数'-->
<MOSTY.Upload v-else-if="item.type == 'upload'" :isImg="item.isImg" :limit="item.limit" width="100%"
v-model="listQuery[item.prop]" />
<!--选择checkbox -->
<MOSTY.CheckBox v-else-if="item.type == 'checkbox'" width="100%" clearable v-model="listQuery[item.prop]"
:checkList="item.options" :placeholder="`请选择${item.label}`" />
<!-- 单选radio -->
<el-radio-group v-else-if="item.type == 'radio'" v-model="listQuery[item.prop]">
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
</el-radio-group>
<!-- 开关 switch -->
<el-switch v-else-if="item.type == 'switch'" v-model="listQuery[item.prop]" class="ml-2"
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949" />
<!-- 日期段选择器 -->
<el-date-picker v-else-if="item.type === 'daterange'" v-model="searchObj[item.prop]" type="daterange"
unlink-panels :range-separator="item.rangeSeparator" :start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts" value-format="YYYY-MM-DD" />
<el-date-picker v-else-if="item.type == 'datetime'" v-model="searchObj[item.prop]" type="datetime"
value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择时间" />
<el-date-picker v-else-if="item.type === 'date'" v-model="searchObj[item.prop]" type="date"
:placeholder="item.placeholder" :shortcuts="item.shortcuts" value-format="YYYY-MM-DD">
</el-date-picker>
<!-- 插槽 slot -->
<template v-else-if="item.type === 'slot'">
<slot :name="item.prop"></slot>
</template>
</el-form-item>
</template>
<template v-else>
<el-form-item v-if="child.type != 'slot'" :prop="child.prop" :label="child.label"
:style="{ width: child.width }">
<!-- input表单 input lx:textarea || number-->
<MOSTY.Other v-if="child.type == 'input'" :type="child.lx" :rows="child.rows || 4" width="100%" clearable
v-model="listQuery[child.prop]" :placeholder="`请输入${child.label}`" />
<!-- 数值 number-->
<el-input-number v-else-if="child.type == 'number'" @change="handleNum" v-model="listQuery[child.prop]"
style="width:100%" :min="child.min || 0" :max="child.max || 1000" />
<!--选择 select-->
<MOSTY.Select v-else-if="child.type == 'select'" @change="handleNum" filterable :multiple="child.multiple"
v-model="listQuery[child.prop]" :dictEnum="child.options" width="100%" clearable
:placeholder="`请选择${child.label}`" />
<!-- 部门department -->
<MOSTY.Department style="width:100%" v-else-if="child.type === 'department'" clearable
v-model="listQuery[child.prop]" />
<!-- 时间选择 type: date/time/datetime/datetimerange/daterange-->
<MOSTY.Date v-else-if="child.type == 'date'" :type="child.lx ? child.lx : 'date'" width="100%" clearable
v-model="listQuery[child.prop]" />
<!-- 上传 upload limit:'限制张数'-->
<MOSTY.Upload v-else-if="child.type == 'upload'" :isImg="child.isImg" :limit="child.limit" width="100%"
v-model="listQuery[child.prop]" />
<!--选择checkbox -->
<MOSTY.CheckBox v-else-if="child.type == 'checkbox'" width="100%" clearable v-model="listQuery[child.prop]"
:checkList="child.options" :placeholder="`请选择${child.label}`" />
<!-- 单选radio -->
<el-radio-group v-else-if="child.type == 'radio'" v-model="listQuery[child.prop]">
<el-radio v-for="obj in child.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
</el-radio-group>
<!-- 开关 switch -->
<el-switch v-else-if="child.type == 'switch'" v-model="listQuery[child.prop]" class="ml-2"
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949" />
</el-form-item>
<!-- 插槽 slot -->
<template v-if="child.type === 'slot'">
<slot></slot>
</template>
</template>
</div>
</el-form>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { ref, defineProps, defineEmits, defineExpose, watch } from "vue";
const props = defineProps({
//循环的值
formList: {
default: [[]], //二维数组
type: Array
},
rules: {
default: {},
type: Object
},
labelWidth: {
default: "100px",
type: String
},
disabled: {
type: Boolean,
default: false
},
modelValue: {
type: Object,
default: {}
},
});
const elform = ref();
const listQuery = ref({});
const emits = defineEmits(["update:modelValue", 'change']);
// 提交
const submit = (resfun) => {
elform.value.validate((valid) => {
if (!valid) return false;
resfun(listQuery.value);
});
};
const reset = () => {
listQuery.value = {};
elform.value.resetFields();
};
// // 处理表单数据变化
const handleNum = (val) => {
emits('change', listQuery.value);
};
watch(() => props.modelValue, (newVal) => {
listQuery.value = newVal; //赋值
}, { immediate: true, deep: true });
watch(() => listQuery.value, (newVal) => {
emits('update:modelValue', newVal)
}, { immediate: true, deep: true });
defineExpose({ submit, reset });
</script>
<style lang="scss" scoped>
:deep(.el-form-item__label) {
// background-color: #F7FAFB;
// padding: 0px 8px;
// color: #000;
// font-weight: 500;
// border: 1px solid #E3E7ED;
}
.form-row {
width: 100%;
display: flex;
color: #333;
.el-form-item {
flex: 1;
}
}
.upload-group {
display: flex;
.el-form-item {
flex: 1;
}
}
::v-deep .el-input__inner {
height: 36px !important;
line-height: 36px !important;
border-radius: 0;
color: #777575;
}
::v-deep .el-textarea__inner {
border-radius: 0;
}
.el-form-item--default {
// margin-bottom: 0px;
}
</style>

168
src/components/aboutTable/MyTable.vue Normal file
View File

@ -0,0 +1,168 @@
<template>
<div style="width: 100%">
<!-- hasChildren要在tableData中定义表示当前行有没有下一级 children要在tableData中定义表示下一级的数据-->
<el-table ref="multipleTableRef" :data="tableData" @selection-change="handleSelectionChange"
@current-change="handleCurrentChange" @row-click="singleElection" :row-key="getConfiger.rowKey"
:border="getConfiger.border" :default-expand-all="getConfiger.defaultExpandAll" :stripe="getConfiger.stripe"
:height="tableHeight" v-loading="tableConfiger.loading" :lazy="getConfiger.lazy" :load="load"
:tree-props="treePros" style="width: 100%" :header-cell-class-name="() => 'HeadBgColor'"
:highlight-current-row="getConfiger.showSelectType === 'radio'"
:row-style="{ height: getConfiger.rowHeight === 'auto' ? getConfiger.rowHeight : getConfiger.rowHeight + 'px' }">
<el-table-column type="selection" width="55" v-if="getConfiger.showSelectType === 'checkBox'" />
<el-table-column width="55" v-else-if="getConfiger.showSelectType === 'radio'" #default="{ row }">
<el-radio class="radio" v-model="getConfiger.radioChoose" :label="row[getConfiger.rowKey]">&nbsp;</el-radio>
</el-table-column>
<el-table-column type="index" label="序号" v-if="getConfiger.showIndex" width="60" :align="getConfiger?.align" />
<el-table-column v-for="(item, index) in tableColumn" :align="getConfiger?.align" :prop="item.prop" :key="index"
:label="item.label" :width="item.width" style="width: 100%; font-size: 14px"
:show-overflow-tooltip="item.showOverflowTooltip || false" :sortable="item.sortable || false">
<!-- 使用自定义 -->
<template v-if="item.showSolt" #default="scope">
<slot :name="item.prop" v-bind="scope"></slot>
</template>
<!-- 默认 -->
<template v-else #default="{ row }">
{{ row[item.prop] }}
</template>
</el-table-column>
<!-- 操作 -->
<el-table-column v-if="getConfiger.haveControls" :fixed="fixed" :label="getConfiger.controls"
:width="controlsWidth" :align="getConfiger?.align">
<template #default="scope">
<slot name="controls" v-bind="scope" :index="scope.$index"></slot>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script setup>
import { nextTick, onMounted, reactive, ref, watch, watchEffect } from "vue";
const props = defineProps({
tableConfiger: {
type: Object,
default: () => { }
},
tableData: {
type: Array,
default: () => []
},
tableColumn: {
type: Array,
default: () => {
return [];
}
},
controlsWidth: {
type: Number,
default: 180
},
tableHeight: {
type: Number
},
treePros: {
type: Object,
default: {
children: "children",
hasChildren: "hasChildren"
}
},
fixed: {
type: String,
default: "right"
}
});
// 可选的时候选择的数据
const emit = defineEmits(["chooseData"]);
const multipleTableRef = ref();
const currentRow = ref();
let getConfiger = reactive({
showSelectType: null, // 显示多选还是单选还是没有选择 checkBox/radio/null
showIndex: true, // 是否显示索引
rowKey: null, // 如果是树形表格必须设置rowKey
border: true, // 是否显示边框
defaultExpandAll: false, // 是否展开全部
loading: false,
align: "center", // 列的对齐方式 left / center / right
haveControls: true, // 是否有操作列
controls: "操作", // 操作列的表头
stripe: false, // 是否有斑马线
lazy: true, // 树形表格的懒加载必须在tableDatez中给有children的项设置 hasChildren: true,才会显示展开icon
portUrl: "", // 当树形表格使用懒加载的时候传入的请求路径/接口用于懒加载数据
defaultSelectKeys: [], // 默认选中的key集合
radioChoose: "", // 单选时选中的值------------- 待完成
rowHeight: "41" // 每行的高度
});
watchEffect(() => {
getConfiger = { ...getConfiger, ...props.tableConfiger };
console.log(getConfiger,'getConfiger');
setDefaultChoose();
});
onMounted(() => {
setDefaultChoose();
});
// 可选的时候选择的数据
const handleSelectionChange = (val) => {
emit("chooseData", val);
};
// 单选的时候选择的数据
const handleCurrentChange = (val) => {
currentRow.value = val;
emit("chooseData", val);
};
const singleElection = (val) => {
if (getConfiger.showSelectType === "radio") {
getConfiger.radioChoose = val[getConfiger.rowKey];
emit("chooseData", val);
}
};
// 懒加载数据的方法
const load = (date, treeNode, resolve) => {
setTimeout(() => {
resolve([
{
id: 31,
date: "2016-05-01",
name: "wangxiaohu",
address: "No. 189, Grove St, Los Angeles"
},
{
id: 32,
date: "2016-05-01",
name: "wangxiaohu",
address: "No. 189, Grove St, Los Angeles"
}
]);
}, 1000);
};
// 设置默认选中（在调用的父页面要确保 tableData传出来了如果延迟传过来默认选中不会生效）
function setDefaultChoose() {
nextTick(() => {
// 多选的默认选中
if (
props.tableConfiger.defaultSelectKeys?.length > 0 &&
props.tableConfiger.showSelectType === "checkBox"
) {
props.tableData.forEach((item) => {
if (
props.tableConfiger.defaultSelectKeys.findIndex(
(v) => v === item[props.tableConfiger.rowKey]
) > -1
) {
multipleTableRef.value.toggleRowSelection(item, true);
}
});
// 单选的默认选中
} else if (
props.tableConfiger.defaultSelectKeys &&
props.tableConfiger.defaultSelectKeys?.length > 0 &&
props.tableConfiger.showSelectType === "radio"
) {
getConfiger.radioChoose = props.tableConfiger.defaultSelectKeys[0];
}
});
}
</script>
<style lang="scss">
</style>

53
src/components/aboutTable/PageTitle.vue Normal file
View File

@ -0,0 +1,53 @@
<template>
<div class="pageTitle" :style="`margin-bottom: ${marginBottom}px;background-color: ${backgroundColor}`">
<div class="title">
<div class="font">{{ title }}</div>
</div>
<div class="cnetr">
<slot name="center"></slot>
</div>
<div class="right">
<slot> </slot>
</div>
</div>
</template>
<script setup>
defineProps({
title: {
type: String,
default: ""
},
marginBottom: {
type: Number,
default: 0
},
backgroundColor: {
type: String,
default: "rgb(255, 255, 255, 0)"
}
});
</script>
<style lang = "scss" scoped>
.pageTitle {
width: 100%;
padding: 10px 0;
border-radius: 6px;
display: flex;
justify-content: space-between;
align-items: center;
min-height: 52px;
.title {
display: flex;
margin: auto 0;
.icon {
margin: auto 0;
}
.font {
vertical-align: middle;
font-size: 18px;
}
}
}
</style>

91
src/components/aboutTable/Pages.vue Normal file
View File

@ -0,0 +1,91 @@
<!--
* @Author: 表格分页
* @Date: 2023-10-20 09:34:38
* @LastEditTime: 2023-11-13 18:34:05
* @LastEditors: your name
* @Description: In User Settings Edit
* @FilePath: \project\src\components\aboutTable\Pages\index.vue
-->
<template>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
:current-page="
pageData.configer.currentPage ||
pageData.configer.pageNo ||
pageData.configer.current ||
pageData.configer.pageCurrent ||
pageData.configer.pageNum"
:page-size="pageData.configer.pageSize || pageData.configer.size"
:page-sizes="pageSizeArr"
:small="small"
:disabled="disabled"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="pageData.configer.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</template>
<script setup>
import { reactive, ref, watchEffect } from "vue";
const props = defineProps({
pageSizeArr: {
type: Array,
default: () => [10, 20, 50, 100]
},
background: {
type: Boolean,
default: true
},
disabled: {
type: Boolean,
default: false
},
small: {
type: Boolean,
default: false
},
marginTop: {
type: Number,
default: 10
},
tableHeight: {
type: Number
},
pageConfiger: {
type: Object,
default: () => {
return {
pageSize: 10,
currentPage: 1,
total: 0
};
}
}
});
const pageData = reactive({
configer: {}
});
const emit = defineEmits(["changeSize", "changeNo"]);
// 改变每页条数
const handleSizeChange = (val) => {
emit("changeSize", val);
};
// 翻页
const handleCurrentChange = (val) => {
emit("changeNo", val);
};
watchEffect(() => {
pageData.configer = props.pageConfiger;
});
</script>
<style lang="scss" scoped>
::v-deep .el-pagination.is-background .btn-next, ::v-deep .el-pagination.is-background .btn-prev, ::v-deep .el-pagination.is-background .el-pager li{
background-color: transparent;
color: white;
}
</style>

575
src/components/aboutTable/Search.vue Normal file
View File

@ -0,0 +1,575 @@
<template>
<div v-loading="loadingPage" class="pageSearch searchBox"
:style="`margin-bottom: ${marginBottom}px;background-color: ${backgroundColor}`">
<div class="box">
<div v-for="(item, index) in getArr" :key="index" class="item">
<div class="label" v-if="item.label">{{ item.label }}</div>
<!-- select -->
<el-select v-if="item.showType === 'select'" v-model="searchObj[item.prop]" :multiple="item.multiple"
:clearable="item.clearable" :filterable="item.filterable" :placeholder="item.placeholder" collapse-tags
collapse-tags-tooltip>
<el-option v-for="obj in getOptions[item.prop]" :key="obj.value" :label="obj.label || obj.lable"
:value="obj.value" />
</el-select>
<!-- input -->
<el-input v-else-if="item.showType === 'input'" class="input" v-model="searchObj[item.prop]"
:clearable="item.clearable" :placeholder="item.placeholder" />
<!-- 日期段选择器 -->
<el-date-picker v-else-if="item.showType === 'daterange'" v-model="searchObj[item.prop]" type="daterange"
unlink-panels :range-separator="item.rangeSeparator" :start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts" :disabledDate="disabledDate"
value-format="YYYY-MM-DD" />
<!-- 日期段选择器 -->
<el-date-picker v-else-if="item.showType === 'datetimerange'" v-model="searchObj[item.prop]"
type="datetimerange" unlink-panels :range-separator="item.rangeSeparator"
:start-placeholder="item.startPlaceholder" :end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts"
:disabledDate="disabledDate" value-format="YYYY-MM-DD HH:mm:ss" />
<el-date-picker v-else-if="item.showType === 'date'" v-model="searchObj[item.prop]" type="date"
:placeholder="item.placeholder" :disabled-date="disabledDate" :shortcuts="item.shortcuts"
value-format="YYYY-MM-DD">
</el-date-picker>
<template v-else-if="item.showType === 'department'">
<MOSTY.Department clearable v-model="searchObj[item.prop]" />
</template>
<!-- checkbox -->
<template v-else-if="item.showType === 'checkbox'">
<el-checkbox v-if="item.showSelectAll" v-model="item.checkAll" :indeterminate="item.isIndeterminate"
@change="(val) => { handleCheckAllChange(val, item); }">全选</el-checkbox>
<el-checkbox-group v-model="searchObj[item.prop]"
@change="(val) => { handleCheckedCitiesChange(val, item); }">
<el-checkbox v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-checkbox>
</el-checkbox-group>
</template>
<!-- radio -->
<el-radio-group v-else-if="item.showType === 'radio'" v-model="searchObj[item.prop]"
@change="(val) => { handleRadioChange(val, item); }">
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
</el-radio-group>
<!-- 级联选择 -->
<el-cascader v-else-if="item.showType === 'cascader'" @change="changeca" v-model="searchObj[item.prop]"
:props="item.props" :show-all-levels="item.showAllLevels" :clearable="item.clearable"
:options="getOptions[item.prop]" :placeholder="item.placeholder" />
<div v-else-if="item.showType === 'defaultSlot'">
<slot name="defaultSlot"></slot>
</div>
</div>
<div class="butBox">
<el-button type="primary" @click="submit">确定</el-button>
<el-button type="" @click="reset">重置</el-button>
<slot> </slot>
</div>
</div>
</div>
</template>
<script setup>
import { ref, reactive, watch, watchEffect, nextTick, getCurrentInstance, toRefs } from "vue";
import * as MOSTY from "@/components/MyComponents/index";
const { proxy } = getCurrentInstance();
const props = defineProps({
searchArr: {
type: Array,
default: () => {
return [
{
showType: "select",
prop: "selectKey",
options: [
{
value: 1,
label: "选择1"
}
],
defaultVal: "",
label: "选择",
dict: "" // 字典编码
},
{
showType: "input",
prop: "inputKey",
defaultVal: "",
label: "输入"
},
{
showType: "daterange",
prop: "daterangeKey",
defaultVal: "",
label: "输入"
},
{
showType: "datetimerange",
prop: "datetimerangeKey",
defaultVal: "",
label: "输入"
},
{
showType: "date",
prop: "date",
defaultVal: ""
},
{
showType: "checkbox",
prop: "checkboxKey1",
options: [
{
value: 1,
label: "选择1"
}
],
defaultVal: ""
},
{
showType: "cascader",
prop: "cascaderKey",
label: "级联选择",
checkStrictly: false, //点击任意选中
defaultVal: ""
},
{
showType: "radio",
defaultVal: ""
// prop: "cascaderKey",
// label: "级联选择",
// checkStrictly: false //点击任意选中
},
{
showType: "defaultTime",
prop: "timeField",
options: [],
}
];
}
},
marginBottom: {
type: Number,
default: 15
},
backgroundColor: {
type: String,
default: "rgb(255, 255, 255, 1)"
}
});
let loadingPage = ref(false);
const isShowDate = ref(false);
const emit = defineEmits(["submit", "reset"]);
let searchObj = reactive({});
const timeConfig = reactive({ //时间字典筛选和自定义日期组件相关数据
typeValue: "01", //时间字典类型默认
timeArry: [], //时间筛选自定义默认值
})
//全所或自定义选择按钮
const slectType = ref('qs');
// select 的一些默认配置
const selectDefault = {
clearable: true, // 是否可以清空
filterable: true, // 是否可以筛选
multiple: false, // 是否多选
placeholder: "请选择"
};
// 重新定义下拉框的选项
let getOptions = reactive({});
// input 的一些默认配置
const inputDefault = {
clearable: true, // 是否可以清空
placeholder: "请输入"
};
const shortcuts = [
{
text: "今天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 0);
return [start, end];
}
},
{
text: "昨天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 1);
end.setTime(end.getTime() - 3600 * 1000 * 24 * 1);
return [start, end];
}
},
{
text: "最近7天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
return [start, end];
}
},
{
text: "最近30天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
return [start, end];
}
},
{
text: "最近90天",
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
return [start, end];
}
}
];
// daterange 的一些默认配置
const daterangeDefault = {
rangeSeparator: "至",
startPlaceholder: "开始日期",
endPlaceholder: "结束日期",
shortcuts: [], // 快捷选择
defaultShortcuts: true // 是否显示快捷选择 如果要自定义快捷选择传入一个shortcuts就可以了
};
// date 的一些默认配置
const defaultDate = {
clearable: true, // 是否可以清空
placeholder: "请输入",
shortcuts: [], // 快捷选择
defaultShortcuts: true // 是否显示快捷选择 如果要自定义快捷选择传入一个shortcuts就可以了
};
const dateShortcuts = [
{
text: "今天",
value: new Date()
},
{
text: "昨天",
value: () => {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
return date;
}
},
{
text: "7天前",
value: () => {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
return date;
}
},
{
text: "30天前",
value: () => {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 30);
return date;
}
},
{
text: "90天前",
value: () => {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 90);
return date;
}
}
];
//自定义时间选择 item 配置项 value 选中的值
const screenSelect = (item, value) => {
if (value == "08") {
searchObj[item.prop] = value;
isShowDate.value = true;
} else {
timeConfig.typeValue = value;
searchObj[item.prop] = value;
submit();
}
}
//自定义时间确定时间
const chooseDateOk = (item) => {
timeConfig.typeValue = "08";
if (timeConfig.timeArry && timeConfig.timeArry.length) { //选择了时间
searchObj[item.propStart] = timeConfig.timeArry[0];
searchObj[item.propEnd] = timeConfig.timeArry[1];
} else { //清空了时间
searchObj[item.prop] = "01";
timeConfig.typeValue = "01";
}
isShowDate.value = false;
submit();
}
//全所-部门选择回调
const organizatioHland = (val) => {
let item = getArr.find(item => item.showType == 'qsOrZdy');
searchObj[item.propBm] = val?.data?.orgCode || "";
if (!val || val == "") { //清空了部门选择后清空责任区ID
slectType.value = "qs";
delete searchObj[item.propZrq];
}
submit()
};
//全所-责任区回调
const zrqHland = (val) => {
let item = getArr.find(item => item.showType == 'qsOrZdy');
searchObj[item.propZrq] = val || ""; //责任区选择
submit();
};
//自定义时间取消事件
const popoverCancel = (item) => {
isShowDate.value = false;
}
// 设置不可选的日期
const disabledDate = (time) => {
return time.getTime() > Date.now();
};
// checkbox 的一些默认配置
const defaultCheckbox = reactive({
defaultVal: [],
checkAll: false, // 全选的值
isIndeterminate: false, // 控制全选按钮样式
showSelectAll: true // 是否显示全选
});
// 全选复选框的选中与不选中
const handleCheckAllChange = (val, obj) => {
searchObj[obj.prop] = val ? obj.checkboxValueArr : [];
obj.isIndeterminate = false;
};
// 单个复选框的选中与不选中
const handleCheckedCitiesChange = (value, obj) => {
const checkedCount = value.length;
obj.checkAll = checkedCount === obj.checkboxValueArr.length;
obj.isIndeterminate =
checkedCount > 0 && checkedCount < obj.checkboxValueArr.length;
};
//单选
const handleRadioChange = (val, obj) => {
console.log(val, obj);
};
// cascader 的一些默认配置
let defaultCascader = {
filterable: true, // 是否可以搜索
clearable: true, // 是否可以清空
placeholder: "请选择",
checkStrictly: true, // 控制是否父子联动（是否可以选择任意节点）
showAllLevels: false, // 是否显示完整路径
lazy: true, // 是否懒加载 当设置为false时就要传入options
portUrl: "", // 这里必须写 接口地址
props: {
label: "label",
value: "value",
children: "children"
},
options: []
};
// 在懒加载状态下cascader 的props的一些配置
const cascaderLazyProps = reactive({
value: "value",
label: "label",
lazy: true,
lazyLoad(node, resolve) {
// 这里要根据实际情况修改
const { level } = node;
let options = [];
switch (level) {
case 0:
options = [
{
value: 1,
label: "选择1",
leaf: false // 表示有下一级 必须有这个表示 不然获取不到值
},
{
value: 2,
label: "选择2",
leaf: false // 表示有下一级
},
{
value: 3,
label: "选择3",
leaf: false // 表示有下一级
},
{
value: 4,
label: "选择4",
leaf: true // 表示没有下一级了
}
];
break;
case 1:
options = [
{
value: 11,
label: "选择1_1",
leaf: true // 表示没有下一级了
},
{
value: 21,
label: "选择2_1",
leaf: true // 表示没有下一级了
},
{
value: 31,
label: "选择3_1",
leaf: true // 表示没有下一级了
},
{
value: 41,
label: "选择4_1",
leaf: true // 表示没有下一级了
}
];
}
resolve(options);
}
});
// 级联框选择
function changeca(v) {
console.log("vvvv", v);
}
// 获取到传过来的参数
let getArr = reactive([]);
const submit = () => {
emit("submit", searchObj);
};
const reset = () => {
getArr.forEach((item) => {
searchObj[item.prop] = item.defaultVal;
});
emit("submit", searchObj);
emit("reset", false);
};
let dataOptions = reactive([]); //时间字典筛选
watchEffect(() => {
loadingPage.value = true;
getArr = JSON.parse(JSON.stringify(props.searchArr));
getArr = getArr.map((item) => {
switch (item.showType) {
case "select":
item = { ...selectDefault, ...item };
item.options = reactive(item.options);
getOptions[item.prop] = item.options;
break;
case "input":
item = { ...inputDefault, ...item };
break;
case "daterange":
item = { ...daterangeDefault, ...item };
if (item.defaultShortcuts) {
item.shortcuts = shortcuts;
}
break;
case "datetimerange":
item = { ...daterangeDefault, ...item };
if (item.defaultShortcuts) {
item.shortcuts = shortcuts;
}
break;
case "date":
item = { ...defaultDate, ...item };
if (item.defaultShortcuts) {
item.shortcuts = dateShortcuts;
}
break;
case "checkbox":
item = reactive({ ...defaultCheckbox, ...item });
item.checkboxValueArr = item.options.map((obj) => {
return obj.value;
});
break;
case "cascader":
item = { ...defaultCascader, ...item };
if (item.lazy) {
cascaderLazyProps.checkStrictly = item.checkStrictly;
item.props = { ...cascaderLazyProps, ...(item.props || {}) };
delete item.options;
} else {
item.props = {
...defaultCascader.props,
...(item.props || {}),
...{ checkStrictly: item.checkStrictly }
};
getOptions[item.prop] = reactive(item.options);
}
break;
}
loadingPage.value = false;
searchObj[item.prop] = item.defaultVal;
return item;
});
});
</script>
<style lang="scss" scoped>
.pageSearch {
margin-bottom: 15px;
background-color: rgb(255, 255, 255);
.box {
display: flex;
/* justify-content: space-between; */
flex-wrap: wrap;
.item {
display: flex;
margin-right: 20px;
margin-bottom: 15px;
}
.label {
margin: auto;
margin-right: 5px;
white-space: nowrap;
color: #000;
}
}
.butBox {
display: flex;
}
.department_box {
display: flex;
align-items: center;
color: white;
.checkbox-box {
margin-left: 10px;
}
::v-deep .el-radio {
margin-right: 20px;
}
}
}
.default_time {
display: flex;
}
.but_type {
background-color: #002961;
border: 1px solid #23adf3;
border-radius: 50px;
color: #93a1ca;
height: 34px;
line-height: 34px;
min-width: 90px;
text-align: center;
margin-right: 15px;
cursor: pointer;
box-sizing: border-box;
}
.acavte_but {
border: none;
color: white;
background: linear-gradient(#0d66dc 0%, #2dbbfa 100%);
}
.picker-btn {
margin-top: 10px;
text-align: right;
}
</style>

71
src/components/checkBox/index.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<div class="checkBox">
<el-checkbox class="checkall" v-if="showAll" v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAll">全部</el-checkbox>
<el-checkbox-group v-model="hasChecked" @change="handleCheckedChange">
<el-checkbox v-for="(item,idx) in checkedList" :key="idx" :label="item">{{item}}</el-checkbox>
</el-checkbox-group>
</div>
</template>
<script setup>
import { ref, defineProps, watch, defineEmits } from "vue";
const emits = defineEmits(["changeData"]);
const props = defineProps({
data: {
type: Object,
default: {
list: [],
hasChoose: []
}
}, showAll: {
type: Boolean,
default: true
}
});
const checkAll = ref(false);
const isIndeterminate = ref(true);
const hasChecked = ref([]); //已经全选的数据
const checkedList = ref([]);
watch(
() => props.data,
(val) => {
hasChecked.value = val.hasChoose;
checkedList.value = val.list;
handleChange(val.hasChoose); //判断是否全选
},
{
deep: true,
immediate: true
}
);
// 全选
function handleCheckAll(val) {
hasChecked.value = val ? checkedList.value : [];
isIndeterminate.value = false;
emits("changeData", hasChecked.value);
}
// 处理多选框改变
function handleCheckedChange(val) {
handleChange(val);////判断是否全选
emits("changeData", hasChecked.value);
}
//判断是否全选
function handleChange(val) {
let checkCount = val.length;
let len = checkedList.value.length;
checkAll.value = checkCount == len ? true : false;
isIndeterminate.value = checkCount > 0 && checkCount < len ? true : false;
}
</script>
<style lang="scss" scoped>
.checkBox {
display: flex;
flex-wrap:nowrap;
width:100%;
height:100%;
.checkall {
margin: 0 20px 0 4px;
}
}
</style>

117
src/components/contextmenu/index.vue Normal file
View File

@ -0,0 +1,117 @@
<template>
<transition name="el-zoom-in-center">
<div
class="el-popper is-pure is-light el-dropdown__popper ba-contextmenu"
:style="`top: ${state.axis.y + 18}px;left: ${ state.axis.x - 14 }px;width:150px`"
:key="Math.random()"
v-show="state.show"
aria-hidden="false"
data-popper-placement="bottom"
>
<ul class="el-dropdown-menu">
<template v-for="(item, idx) in props.items" :key="idx">
<li
class="el-dropdown-menu__item"
:class="item.disabled ? 'is-disabled' : ''"
tabindex="-1"
@click="onContextmenuItem(item)"
>
<Icon size="12" :name="item.icon" />
<span>{{ item.label }}</span>
</li>
</template>
</ul>
<span
class="el-popper__arrow"
:style="{ left: `${state.arrowAxis}px` }"
></span>
</div>
</transition>
</template>
<script setup>
import {
onMounted,
onUnmounted,
reactive,
toRaw,
defineProps,
defineEmits
} from "vue";
import { useRoute, useRouter } from "vue-router";
import { useStore } from "vuex";
const route = useRoute();
const props = defineProps({
items: {
type: Array,
default: []
}
});
const emits = defineEmits(["contextmenuItemClick"]);
const state = reactive({
show: false,
axis: {
x: 0,
y: 0
},
menu: {},
arrowAxis: 10
});
const onShowContextmenu = (menu, axis) => {
state.menu = menu;
state.axis = axis;
state.show = true;
};
const onContextmenuItem = (item) => {
if (item.disabled) return;
item.menu = toRaw(state.menu);
emits("contextmenuItemClick", item);
};
const onHideContextmenu = () => {
state.show = false;
};
defineExpose({
onShowContextmenu,
onHideContextmenu
});
onMounted(() => {
document.body.addEventListener("click", onHideContextmenu);
});
onUnmounted(() => {
document.body.removeEventListener("click", onHideContextmenu);
});
</script>
<style scoped lang="scss">
.ba-contextmenu {
z-index: 9999;
position: fixed;
}
.el-popper,
.el-popper.is-light .el-popper__arrow::before {
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border: none;
}
.el-dropdown-menu__item {
padding: 8px 20px;
user-select: none;
}
.el-dropdown-menu__item .icon {
margin-right: 5px;
}
.el-dropdown-menu__item:not(.is-disabled) {
&:hover {
background-color: var(--el-dropdown-menuItem-hover-fill);
color: var(--el-dropdown-menuItem-hover-color);
.fa {
color: var(--el-dropdown-menuItem-hover-color) !important;
}
}
}
</style>

175
src/components/echarts/3DbarEcharts.vue Normal file
View File

@ -0,0 +1,175 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import { onMounted, ref, reactive, defineProps, onUnmounted, watch, nextTick } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'lineId'
},
data:{
type:Object,
default:{
list:[],
colors:[]
}
}
});
watch(()=>props.data,val=>{
nextTick(()=>{ haandleData(val) })
},{immediate:true,deep:true})
const haandleData = (data)=>{
let val = [],x_value=[]
let color = data.colors;
let topColor = data.topColor;
data.list.forEach(item=>{
val.push(item.val);
x_value.push(item.label);
})
chartFn(val,x_value,color,topColor)
}
function chartFn(val,x_value,color,topColor) {
var myChart = echarts.init(document.getElementById(props.echartsId));
const sideData1 = val//[100, 110, 120, 134, 190, 230];
const name = ''; //"销量";
var x_value = x_value;//['周一', '周二', '周三', '周四', '周五', '周六', '周日']
var option = {
tooltip: { trigger: 'axis' },
legend: {
show: false,
},
grid: {
top:"20%",
left:"5%",
right:"5%",
bottom:"10%",
containLabel: true
},
toolbox: {
show: true,
},
calculable: true,
xAxis: [
{
type: 'category',
splitLine: {
show: false
},
axisTick: { show: false },
data: x_value,
axisLabel: {
show: true,
interval: 0, // 强制显示所有标签
textStyle: {
color: "#fff" //X轴文字颜色
},
},
}
],
yAxis: [
{
name:'',
nameTextStyle: { color: "#fff" },
type: 'value',
splitLine: { show: false },
axisLabel: {
show: true,
textStyle: {
color: "#fff" //X轴文字颜色
},
},
}
],
series: [
{
name: name,
tooltip: { show: false },
type: 'bar',
barWidth: 12,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
offset: 0,
color: color ? color[0] : '#28EEBF'// 0% 处的颜色
}, {
offset: 1,
color: color ? color[1] : '#0DBAC5', // 100% 处的颜色
}], false)
}
},
data: sideData1,
barGap: 0,
label: {
show: true,
position: 'top',
distance: 10,
textStyle: {
color: '#0EBBC5',
fontSize: 14,
fontWeight: 'bold'
},
formatter: '{c}'
}
},
{
name: name,
type: 'bar',
barWidth: 12,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
offset: 0,
color: color ? color[0] : '#28EEBF'// 0% 处的颜色
}, {
offset: 1,
color: color ? color[1] : '#0DBAC5', // 100% 处的颜色
}], false)
}
},
barGap: 0,
data: sideData1,
label: {
show: true,
position: 'top',
textStyle: {
color: 'rgba(0,0,0,0)',
fontSize: 10
}
}
},
{
name: name,
tooltip: {
show: false
},
type: 'pictorialBar',
itemStyle: {
borderWidth: 1,
borderColor: '#fff',
color: topColor || '#1bd6c2' // 顶部方块的颜色
},
symbol: 'path://M 0,0 l 90,0 l -60,60 l -90,0 z',
symbolSize: ['22', '12'], // 第一个值控制顶部方形大小
symbolOffset: ['-0', '-6'], // 控制顶部放行 左右和上下
symbolRotate: -30,
symbolPosition: 'end',
barGap: 0,
data: sideData1,
z: 3,
}
]
};
option && myChart.setOption(option);
window.addEventListener('resize',function(){
myChart.resize();
})
}
</script>
<style lang="scss" scoped>
</style>

290
src/components/echarts/3DpieEcharts.vue Normal file
View File

@ -0,0 +1,290 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import "echarts-gl";
import { onMounted, toRefs,nextTick, defineProps,ref, reactive } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'lineId'
},
// 传入数据生成 option
data:{
type:Array,
default:[
{
name: "待办",
value: 2056,
itemStyle: {
// color: "#2A71FF"
echarts: "rgba(44,44,44,0.8)"
}
},
{
name: "已办",
value: 4356,
itemStyle: {
color: "#00EDFE"
}
},
]
}
});
watch(()=>props.data,val=>{
nextTick(()=>{
echartInit()
})
},{immediate:true,deep:true})
const echartInit = () => {
var myChart = echarts.init(document.getElementById(props.echartsId));
const series = getPie3D(props.data, 0.8, 240, 28, 26, 0.5);
series.push({
name: "pie2d",
type: "pie",
label: {
// show: false,
opacity: 1,
fontSize: 14,
lineHeight: 20,
textStyle: {
fontSize: 14,
color: "#fff"
}
},
labelLine: {
// show: false,
length: 20,
length2: 25
},
startAngle: -30, //起始角度，支持范围[0, 360]。
clockwise: false, //饼图的扇区是否是顺时针排布。上述这两项配置主要是为了对齐3d的样式
// radius: ["40%", "60%"],
center: ["40%", "50%"],
data: props.data,
itemStyle: {
opacity: 0
}
});
// 准备待返回的配置项，把准备好的 legendData、series 传入。
let option = {
legend: {
show: true,
tooltip: {
show: true
},
orient: "vertical",
data: props.data.map((item) => item.name),
// data: ["待办", "已办", "未处理", "忽略"],
top: "center",
itemGap: 14,
itemHeight: 8,
itemWidth: 17,
right: "2%",
textStyle: {
color: "#fff",
fontSize: 12
}
},
animation: true,
tooltip: {
formatter: (params) => {
if ( params.seriesName !== "mouseoutSeries" && params.seriesName !== "pie2d" ) {
return `${ params.seriesName }<br/><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color };"></span>${option.series[params.seriesIndex].pieData.value + "人"}`;
}
},
textStyle: {
fontSize: 14
}
},
title: {
x: "center",
top: "20",
textStyle: {
color: "#fff",
fontSize: 22
}
},
backgroundColor: "rgba(0, 29, 75, 0.65)",
labelLine: {
show: true,
lineStyle: {
color: "#7BC0CB"
},
normal: {
show: false,
length: 20,
length2: 20
}
},
label: {
show: true,
position: "outside",
formatter: "{b} \n{d}%",
textStyle: {
color: "#fff",
fontSize: "14px"
}
},
xAxis3D: {
min: -1,
max: 1
},
yAxis3D: {
min: -1,
max: 1
},
zAxis3D: {
min: -1,
max: 1
},
grid3D: {
show: false,
boxHeight: 0.01,
bottom: "50%",
left: "-12%",
// environment: "rgba(255,255,255,0)",// 环境颜色
viewControl: {
distance: 180, //圆环的大小 ,值越大换越小
alpha: 25, //倾斜的角度
beta: 0, //旋转的角度
autoRotate: false // 取消自动旋转
}
},
series: series
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
};
function getParametricEquation( startRatio, endRatio, isSelected, isHovered, k, height ) {
// 计算
let midRatio = (startRatio + endRatio) / 2;
let startRadian = startRatio * Math.PI * 2;
let endRadian = endRatio * Math.PI * 2;
let midRadian = midRatio * Math.PI * 2;
// 如果只有一个扇形，则不实现选中效果。
if (startRatio === 0 && endRatio === 1) {
isSelected = false;
}
// 通过扇形内径/外径的值，换算出辅助参数 k（默认值 1/3）
k = typeof k !== "undefined" ? k : 1 / 3;
// 计算选中效果分别在 x 轴、y 轴方向上的位移（未选中，则位移均为 0）
let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0;
let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0;
// 计算高亮效果的放大比例（未高亮，则比例为 1）
let hoverRate = isHovered ? 1.05 : 1;
// 返回曲面参数方程
return {
u: {
min: -Math.PI,
max: Math.PI * 3,
step: Math.PI / 32
},
v: {
min: 0,
max: Math.PI * 2,
step: Math.PI / 20
},
x: function (u, v) {
if (u < startRadian) {
return (offsetX + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate);
}
if (u > endRadian) {
return (offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate);
}
return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate;
},
y: function (u, v) {
if (u < startRadian) {
return (offsetY + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate);
}
if (u > endRadian) {
return ( offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate);
}
return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate;
},
z: function (u, v) {
if (u < -Math.PI * 0.5) {
return Math.sin(u);
}
if (u > Math.PI * 2.5) {
return Math.sin(u);
}
return Math.sin(v) > 0 ? 1 * height : -1;
}
};
}
// 生成模拟 3D 饼图的配置项
function getPie3D(pieData, internalDiameterRatio) {
let series = [];
let sumValue = 0;
let startValue = 0;
let endValue = 0;
let legendData = [];
let k = typeof internalDiameterRatio !== "undefined" ? (1 - internalDiameterRatio) / (1 + internalDiameterRatio) : 1 / 3;
// 为每一个饼图数据，生成一个 series-surface 配置
for (let i = 0; i < pieData.length; i++) {
sumValue += pieData[i].value;
let seriesItem = {
name: typeof pieData[i].name === "undefined" ? `series${i}` : pieData[i].name, type: "surface",
parametric: true,
wireframe: { show: false },
pieData: pieData[i],
pieStatus: {
selected: false,
hovered: false,
k: k
}
};
if (typeof pieData[i].itemStyle != "undefined") {
let itemStyle = {};
typeof pieData[i].itemStyle.color != "undefined" ? (itemStyle.color = pieData[i].itemStyle.color) : null;
typeof pieData[i].itemStyle.opacity != "undefined" ? (itemStyle.opacity = pieData[i].itemStyle.opacity) : null;
seriesItem.itemStyle = itemStyle;
}
series.push(seriesItem);
}
// 使用上一次遍历时，计算出的数据和 sumValue，调用 getParametricEquation 函数，
// 向每个 series-surface 传入不同的参数方程 series-surface.parametricEquation，也就是实现每一个扇形。
for (let i = 0; i < series.length; i++) {
endValue = startValue + series[i].pieData.value;
console.log(series[i]);
series[i].pieData.startRatio = startValue / sumValue;
series[i].pieData.endRatio = endValue / sumValue;
series[i].parametricEquation = getParametricEquation(
series[i].pieData.startRatio,
series[i].pieData.endRatio,
false,
false,
k,
series[i].pieData.value
);
startValue = endValue;
legendData.push(series[i].name);
}
return series;
}
</script>
<style lang='scss' scoped>
</style>

106
src/components/echarts/barEcharts.vue Normal file
View File

@ -0,0 +1,106 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import { onMounted, ref, reactive, defineProps, onUnmounted, watch, nextTick } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'lineId'
},
data:{
type:Object,
default:{
list:[],
colors:[]
}
}
});
watch(()=>props.data,val=>{
nextTick(()=>{
chartFn()
})
},{immediate:true,deep:true})
function chartFn() {
var myChart = echarts.init(document.getElementById(props.echartsId));
var option = {
grid: {
top: "16%",
right: "2%",
left: "2%",
bottom: "4%",
containLabel:true
},
tooltip: {
trigger: "axis",
axisPointer: {
lineStyle: {
color: "#ddd"
}
},
backgroundColor: "rgba(255,255,255,1)",
padding: [5, 10],
textStyle: {
color: "#7588E4"
},
},
xAxis: {
type: "category",
data:props.data.list.map(v=>{return v.label}),
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#fff",magin:20 },
},
yAxis: {
type: "value",
splitLine: {
show:true ,
lineStyle: {
type:'dashed',
color: "rgba(14,95,255,0.5)"
}
},
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#fff" },
},
series: [
{
type: "bar",
barGap:'80%',
barWidth: "20px",
data: props.data.list.map(v=>{return v.val}),
label:{
normal:{show:true,position:'top',color:'#EB00FF'}
},
itemStyle: {
normal: {
color:function name(params) {
let colorList = []
if(props.data.colors && props.data.colors.length>0){
props.data.colors.forEach(item => {
colorList.push(new echarts.graphic.LinearGradient( 0,0,0, 1,[{offset:0,color:item[0]},{offset:1,color:item[1]}]))
});
}
if(colorList.length > 0) return colorList[params.dataIndex]
else return new echarts.graphic.LinearGradient( 0,0,0, 1,[{ offset: 0,color: "rgba(0,244,255,1)"},{ offset: 1, color: "rgba(0,77,167,1)" }])
},
shadowColor: "rgba(0,160,221,1)",
shadowBlur: 2
}
},
}
]
};
option && myChart.setOption(option);
window.addEventListener('resize',function(){
myChart.resize();
})
}
</script>
<style lang="scss" scoped>
</style>

147
src/components/echarts/barHatEcharts.vue Normal file
View File

@ -0,0 +1,147 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import { nextTick , onMounted, watch, defineProps } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'barHatId'
},
textcolor:{
type:String,
default:'#333'
},
barWidth:{
type:String,
default:'20px'
},
data:{
type:Object,
default:{
xDate: ['巴宜区', '工布江达县', '波密县', '朗县', '墨脱县', '察隅县', '米林县'],
list:[
{ name: "总数", value: [10,20,30,40,50,60,70] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'},
{ name: "已处置", value: [10,20,30,40,50,60,70],color:['rgba(24, 232, 229, 1)','rgba(3, 110, 83, 1)'],hatColor:'#00FFFF' },
],
}
}
});
watch(()=>props.data,val=>{
nextTick(()=>{ handleDate() })
},{immediate:true,deep:true})
// 处理数据
function handleDate() {
let xDate = props.data.xDate;
let legend = props.data.list.map(v=>{return {name:v.name}})
let series = props.data.list.map((item,i)=>{
let obj = {
name: item.name,
type: "bar",
data: item.value,
barWidth: props.barWidth || "20px",
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0,0,0,1,[
{ offset: 0, color: item.color ? item.color[0] : "rgba(0,244,255,1)" },
{ offset: 1, color: item.color ? item.color[1] : "rgba(0,77,167,1)" }],false),
}
},
markPoint: {
symbol: 'path://M62 62h900v900h-900v-900z', // 使用 SVG path 绘制扁圆形状
symbolSize: [21, 4], // 设置扁圆的宽和高
itemStyle: { color: item.hatColor || '#087df9' },// 圆盘颜色
data: item.value.map((obj, index) => ({
xAxis: index, // 对应柱子的横坐标
yAxis: obj + 0 // 柱子的值加上一些偏移量
}))
},
}
return obj
})
lineChartFn(xDate,legend,series)
}
function lineChartFn(xDate,legend,series) {
var myChart = echarts.init(document.getElementById(props.echartsId));
var option = {
legend: {
type: "plain",
show: true,
right: 0,
textStyle: { color: "#333" },
data: legend
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow"
}
},
grid: {
top: "25%",
right: "5%",
left: "10%",
bottom: "10%"
},
xAxis: [
{
type: "category",
data: xDate,
axisLine: {
lineStyle: {
color: "rgba(255,255,255,0.12)"
}
},
axisLabel: {
margin: 10,
color: props.textcolor || '#333',
textStyle: {
fontSize: 14
}
}
}
],
yAxis: [
{
// name: '单位：万元',
axisLabel: {
formatter: "{value}",
color: props.textcolor || '#333',
},
axisLine: {
show: false,
lineStyle: {
color: "rgba(255,255,255,1)"
}
},
splitLine: {
lineStyle: {
color: "rgba(255,255,255,0.12)"
}
}
}
],
series: series
};
option && myChart.setOption(option);
window.onresize = function () { myChart.resize(); };
document.getElementById(props.echartsId).setAttribute("_echarts_instance_", "");
}
onMounted(() => {
lineChartFn();
});
</script>
<style lang="scss" scoped>
.circlecz {
height: 100%;
background: rgba(0,29,75,0.6);
border-radius: 0 0 4px 4px;
}
</style>

115
src/components/echarts/lineEcharts.vue Normal file
View File

@ -0,0 +1,115 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import { onMounted, ref, reactive, defineProps, onUnmounted, watch, nextTick } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'lineId'
},
color:{
type:String,
default:'#fff'
},
data:{
type:Array,
default:[]
}
});
watch(()=>props.data,val=>{
nextTick(()=>{ chartFn() })
},{immediate:true,deep:true})
function chartFn() {
var myChart = echarts.init(document.getElementById(props.echartsId));
var option = {
grid: {
top: "8%",
right: "2%",
left: "5%",
bottom: "12%",
containLabel:true
},
tooltip: {
trigger: "axis",
axisPointer: {
lineStyle: {
color: "#ddd"
}
},
backgroundColor: "rgba(255,255,255,1)",
padding: [5, 10],
textStyle: {
color: "#7588E4"
},
extraCssText: "box-shadow: 0 0 5px rgba(0,0,0,0.3)"
},
xAxis: {
type: "category",
data:props.data.map(v=>{return v.label}),
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#fff" },
axisLabel: {
show: true,
color: props.color,
interval: 0, // 强制显示所有标签
// rotate: 15, // 标签旋转角度
}
},
yAxis: {
type: "value",
splitLine: {
show:true ,
lineStyle: {
type:'dashed',
color: "rgba(14,95,255,0.5)"
}
},
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: props.color },
},
series: [
{
type: "line",
smooth:true,
showSymbol:false,
data: props.data.map(v=>{return v.value}),
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(199, 237, 250,0.5)'
}, {
offset: 1,
color: 'rgba(199, 237, 250,0.2)'
}], false)
}
},
itemStyle: {
normal: {
color: "rgb(4, 145, 216)"
}
},
lineStyle: {
normal: {
width: 1,
color:'#00FFFF'
}
}
}
]
};
option && myChart.setOption(option);
window.addEventListener('resize',function(){
myChart.resize();
})
}
</script>
<style lang="scss" scoped>
</style>

113
src/components/echarts/moreBarEcharts.vue Normal file
View File

@ -0,0 +1,113 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import { on } from "element-plus/lib/utils";
import { onMounted, ref, reactive, defineProps, onUnmounted, watch, nextTick } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'moreBarId'
},
data:{
type:Object,
default:{
xData:[], //['巴宜区', '工布江达县', '波密县', '朗县', '墨脱县', '察隅县', '米林县'],
color:[],//['rgba(0,244,255,1)','rgba(0,77,167,1)'],
list:[],//[{label:'总数',val:[]},{label:'已处置',val:[]}
}
}
});
watch(()=>props.data,val=>{
nextTick(()=>{ init(val) })
},{immediate:true,deep:true})
// 初始化
function init (val) {
let color = val.color ? val.color : [];
let list = val.list
let total = 0
let series = list.map((item ,idx)=>{
let obj = {
type: "bar",
stack:'total',
name:item.label,
data:item.val,
barGap:'80%',
barWidth: "30px",
}
if(color.length > 0) obj.itemStyle = {normal: { color: color[idx] }}
if(item.label == '总数'){
obj.stack = ''
obj.z = -1
obj.barGap = '-100%'
obj.label = { normal:{show:true,position:'top',color:'#EB00FF'} }
}
return obj;
})
chartFn(series)
}
function chartFn(series) {
var myChart = echarts.init(document.getElementById(props.echartsId));
var option = {
grid: {
top: "30%",
right: "2%",
left: "2%",
bottom: "3%",
containLabel:true
},
legend:{
data:props.data.list.map(v=>{return v.label}),
textStyle: { color: "#fff"},
icon:'diamond', //arrow,diamond,roundRect,rect,none,circle
itemWidth:16,
itemHeight:8,
itemGap:10
},
tooltip: {
trigger: "axis",
axisPointer: {
lineStyle: { color: "#ddd" }
},
backgroundColor: "rgba(255,255,255,1)",
padding: [5, 10],
textStyle: { color: "#7588E4" },
extraCssText: "box-shadow: 0 0 5px rgba(0,0,0,0.3)"
},
xAxis: {
type: "category",
data:props.data.xData,
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#fff",magin:20 },
},
yAxis: {
type: "value",
splitLine: {
show:true ,
lineStyle: {
type:'dashed',
color: "rgba(14,95,255,0.5)"
}
},
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#fff" },
},
series:series
};
option && myChart.setOption(option);
window.addEventListener('resize',function(){
myChart.resize();
})
}
</script>
<style lang="scss" scoped>
</style>

127
src/components/echarts/moreLineEcharts.vue Normal file
View File

@ -0,0 +1,127 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import { onMounted, ref, reactive, defineProps, onUnmounted, watch, nextTick } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'morelineId'
},
smooth:{
type:Boolean,
default:false
},
data:{
type:Object,
default:{
color:[], //['#EB00FF','#F57100']
list:[], //[{label:'总数',val:[80,70,60,50]}, {label:'已处置',val:[70,40,30,80]}, ]
xData:[] ,//['09-01','09-02','09-03','09-04']
}
}
});
watch(()=>props.data,val=>{
nextTick(()=>{
init(val)
})
},{immediate:true,deep:true})
// 初始化
function init (val) {
let color = val.color;
let list = val.list
let series = list.map((item ,idx)=>{
return {
type: "line",
name:item.label,
data:item.val,
itemStyle:{normal: { color: color[idx] }},
smooth:props.smooth,
showSymbol:false,
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(199, 237, 250,0.5)'
}, {
offset: 1,
color: 'rgba(199, 237, 250,0.2)'
}], false)
}
},
}
})
chartFn(series)
}
function chartFn(series) {
var myChart = echarts.init(document.getElementById(props.echartsId));
var option = {
grid: {
top: "20%",
right: "6%",
left: "2%",
bottom: "3%",
containLabel:true
},
legend:{
data:props.data.list.map(v=>{return v.label}),
textStyle: { color: "#333"},
icon:'diamond', //arrow,diamond,roundRect,rect,none,circle
itemWidth:16,
itemHeight:8,
itemGap:5
},
tooltip: {
trigger: "axis",
axisPointer: {
lineStyle: { color: "#ddd" }
},
backgroundColor: "rgba(255,255,255,1)",
padding: [5, 10],
textStyle: { color: "#7588E4" },
extraCssText: "box-shadow: 0 0 5px rgba(0,0,0,0.3)"
},
xAxis: {
type: "category",
data:props.data.xData,
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#fff" },
axisLabel: {
show: true,
color: "#333",
interval: 0, // 强制显示所有标签
// rotate: 15, // 标签旋转角度
// formatter: function(value) { return value.split("").join("\n");}
}
},
yAxis: {
type: "value",
splitLine: {
show:true ,
lineStyle: {
type:'dashed',
color: "rgba(14,95,255,0.5)"
}
},
axisTick: { show: false },
axisLine: { show: false },
axisLabel: { color: "#333" },
},
series:series
};
option && myChart.setOption(option);
window.addEventListener('resize',function(){
myChart.resize();
})
}
</script>
<style lang="scss" scoped>
</style>

119
src/components/echarts/pieEcharts.vue Normal file
View File

@ -0,0 +1,119 @@
<template>
<div style="height:100%;width:100%" :id="echartsId"></div>
</template>
<script setup>
import * as echarts from "echarts";
import "echarts-gl";
import { ref, watch ,defineProps,nextTick } from "vue";
const props = defineProps({
echartsId:{
type:String,
default:'lineId'
},
color:{
type:String,
default:'lineId'
},
data:{
type:Array,
default:[]
}
});
watch(()=>props.data,val=>{
nextTick(()=>{ handleDate(val) })
},{immediate:true,deep:true})
const handleDate = (val)=>{
let newArray = val.map(v=>{
let obj = {
value: v.value,
name: v.label,
}
if(v.color) obj.itemStyle = { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { offset: 0, color: v.color[0] }, { offset: 1, color: v.color[1] } ])}
return obj
})
initChart(newArray)
}
const initChart = (data) => {
var myChart = echarts.init(document.getElementById(props.echartsId));
const option = {
backgroundColor: "transparent",
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
backgroundColor: "rgba(0,0,0,0.7)",
borderColor: "#0C2E5A",
textStyle: {
color: "#fff"
}
},
legend: {
top: "middle",
right: "5%",
orient: "vertical",
itemGap: 20,
textStyle: {
color: props.color,
fontSize: 14
},
itemWidth: 15,
itemHeight: 15,
icon: "roundRect",
formatter: function (name) {
const data = option.series[0].data;
const target = data.find((item) => item.label === name);
if (target) {
return `${name} ${target.value} ${( (target.value / 50) * 100 ).toFixed(0)}%`;
}
return name;
}
},
series: [
{
name: "情报反馈统计",
type: "pie",
radius: ["40%", "75%"],
center: ["30%", "50%"],
startAngle: 90,
zlevel: 10,
itemStyle: {},
selectedMode: "single",
selectedOffset: 30,
animation: true,
animationType: "scale",
animationEasing: "elasticOut",
label: { show: false },
labelLine: { show: false },
data: data,
zlevel: 10,
emphasis: {
scale: true,
scaleSize: 10,
itemStyle: {
shadowBlur: 30,
shadowColor: "rgba(0,0,0,0.6)"
}
}
}
]
};
option && myChart.setOption(option);
// 监听窗口大小变化
window.addEventListener("resize", () => {
myChart.resize();
});
};
</script>
<style lang="scss" scoped>
.echartsBox {
width: 100%;
height: 100%;
}
</style>

190
src/components/export/index.vue Normal file
View File

@ -0,0 +1,190 @@
<template>
<div class="exportBox">
<el-dialog
v-model="show"
title="导入文件"
width="400px"
:show-close="true"
:center="true"
:before-close="handleClose"
>
<div class="uplodBox">
<el-upload
action="#"
drag
:on-success="handleSuccess"
:on-change="handleChange"
:show-file-list="true"
:file-list="fileDate"
accept=".xls,.xlsx"
:auto-upload="false"
>
<el-icon class="el-icon-upload" size="100"><upload-filled /></el-icon>
<div class="el-upload-text">
拖动或者点击上传或者
<span @click.stop="downloadModel" class="model">下载模板</span>
</div>
<div>仅支持扩展名：.xls , xlsx</div>
</el-upload>
</div>
<div class="check" v-if='props.lx!="xfdwbb"'>
<el-checkbox true-label="true" false-label="false" v-model="isSelect"
>是否替换已存在的数据</el-checkbox
>
</div>
<div class="foot">
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</el-dialog>
</div>
</template>
<script setup>
import axios from "axios";
import { ElMessage } from "element-plus";
import { qcckPost, qcckGet } from "@/api/qcckApi.js";
import { useStore } from "vuex";
import { ref, defineProps, defineEmits, watch } from "vue";
const store = useStore();
const props = defineProps({
show: { type: Boolean, default: false },
lx:{ type: String, default:'policeF'}
});
const headers = ref({
Authorization: "Bearer " + store.getters.token
});
const isSelect = ref(false);
const emits = defineEmits(["closeImport", "handleImport"]);
const fileDate = ref([]);
const filesList = ref({});
const baseUrl = ref('')//上传地址
const modelUrl = ref('')//下载模板地址
watch(()=>props.lx,(val)=>{
let url = ''
let moyRL = ''
switch (val) {
case 'policeF':
baseUrl.value = '/mosty-api/mosty-jmxf/tbJcglXfll/importData'
modelUrl.value = '/mosty-api/mosty-jmxf/tbJcglXfll/importTemplate'
break;
case 'car':
baseUrl.value = '/mosty-api/mosty-jmxf/tpJcglXfcl/importData'
modelUrl.value = '/mosty-api/mosty-jmxf/tpJcglXfcl/importTemplate'
break;
case 'jyqx':
baseUrl.value = '/mosty-api/mosty-jmxf/tpJcglJyqx/importData'
modelUrl.value = '/mosty-api/mosty-jmxf/tpJcglJyqx/importTemplate'
break;
case 'znzb':
baseUrl.value = '/mosty-api/mosty-jmxf/tpjcglZnzb/importData'
modelUrl.value = '/mosty-api/mosty-jmxf/tpjcglZnzb/importTemplate'
break;
case 'xfdwbb':
baseUrl.value = '/mosty-api/mosty-jmxf/xftz/batchExport'
modelUrl.value = 'http://80.93.7.13:9009/file/巡访单位导入模板.xlsx'
break;
default:
break;
}
},{
immediate:true
})
// 关闭
function handleClose() {
fileDate.value = [];
filesList.value = {};
emits("closeImport");
}
// 覆盖前一个文件
function handleChange(file, fileList) {
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1);
let whiteList = ["xls", "xlsx"];
if (!whiteList.includes(fileSuffix)) {
fileList.splice(0, 1);
filesList.value = {};
ElMessage.warning("上传只能是.xls、.xlsx 格式,请重新上传");
return false;
} else {
if (fileList.length > 1) {
fileList.splice(0, 1);
}
filesList.value = file;
}
}
// 上传成功
function handleSuccess(row) {}
// 下载模板
function downloadModel() {
window.open(modelUrl.value, "_self");
}
// 确定上传
function onComfirm() {
if (filesList.value.length <= 0) {
ElMessage.warning("请上传文件");
} else {
let file = filesList.value.raw;
let formData = new FormData();
formData.append("file", file);
if(props.lx!="xfdwbb"){formData.append("updateSupport", isSelect.value);}
axios.post(baseUrl.value, formData, {"Content-type": "multipart/form-data"})
.then((res) => {
if (res.status == 200) {
let { data, message, code } = res.data;
if (code == -1) ElMessage({ type:'warning', message:message, dangerouslyUseHTMLString:true });
if(code == 10000){
if(props.lx!="xfdwbb"){
ElMessage({ type:'success', message:data, dangerouslyUseHTMLString:true });
}else{
ElMessage({ type:'success', message:'上传成功', dangerouslyUseHTMLString:true });
}
}
emits("handleImport");
handleClose();
} else {
ElMessage.warning("文件上传失败");
}
});
}
}
</script>
<style lang="scss" scoped>
.exportBox {
.uplodBox {
width: 100%;
.el-icon {
font-size: 64px;
color: #505050;
}
.el-icon-upload {
top: 33px;
}
::v-deep .el-upload-dragger {
line-height: 50px;
}
.el-upload-text {
color: #505050;
> .model {
color: #409eff;
}
}
}
.foot {
text-align: center;
margin: 10px 0;
}
.check {
height: 20px;
}
}
</style>
<style>
.el-upload-list__item-name {
color: #fff;
}
</style>

311
src/components/h5player/h5player.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

8
src/components/h5player/static/css/antd.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

587
src/components/h5player/static/css/bootstrap-theme.css vendored Normal file
View File

@ -0,0 +1,587 @@
/*!
* Bootstrap v3.4.1 (https://getbootstrap.com/)
* Copyright 2011-2019 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
.btn-default,
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
}
.btn-default:active,
.btn-primary:active,
.btn-success:active,
.btn-info:active,
.btn-warning:active,
.btn-danger:active,
.btn-default.active,
.btn-primary.active,
.btn-success.active,
.btn-info.active,
.btn-warning.active,
.btn-danger.active {
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn-default.disabled,
.btn-primary.disabled,
.btn-success.disabled,
.btn-info.disabled,
.btn-warning.disabled,
.btn-danger.disabled,
.btn-default[disabled],
.btn-primary[disabled],
.btn-success[disabled],
.btn-info[disabled],
.btn-warning[disabled],
.btn-danger[disabled],
fieldset[disabled] .btn-default,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-warning,
fieldset[disabled] .btn-danger {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-default .badge,
.btn-primary .badge,
.btn-success .badge,
.btn-info .badge,
.btn-warning .badge,
.btn-danger .badge {
text-shadow: none;
}
.btn:active,
.btn.active {
background-image: none;
}
.btn-default {
background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #dbdbdb;
text-shadow: 0 1px 0 #fff;
border-color: #ccc;
}
.btn-default:hover,
.btn-default:focus {
background-color: #e0e0e0;
background-position: 0 -15px;
}
.btn-default:active,
.btn-default.active {
background-color: #e0e0e0;
border-color: #dbdbdb;
}
.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
background-color: #e0e0e0;
background-image: none;
}
.btn-primary {
background-image: -webkit-linear-gradient(top, #337ab7 0%, #265a88 100%);
background-image: -o-linear-gradient(top, #337ab7 0%, #265a88 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#265a88));
background-image: linear-gradient(to bottom, #337ab7 0%, #265a88 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #245580;
}
.btn-primary:hover,
.btn-primary:focus {
background-color: #265a88;
background-position: 0 -15px;
}
.btn-primary:active,
.btn-primary.active {
background-color: #265a88;
border-color: #245580;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
background-color: #265a88;
background-image: none;
}
.btn-success {
background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
background-image: -o-linear-gradient(top, #5cb85c 0%, #419641 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #3e8f3e;
}
.btn-success:hover,
.btn-success:focus {
background-color: #419641;
background-position: 0 -15px;
}
.btn-success:active,
.btn-success.active {
background-color: #419641;
border-color: #3e8f3e;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
background-color: #419641;
background-image: none;
}
.btn-info {
background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
background-image: -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2));
background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #28a4c9;
}
.btn-info:hover,
.btn-info:focus {
background-color: #2aabd2;
background-position: 0 -15px;
}
.btn-info:active,
.btn-info.active {
background-color: #2aabd2;
border-color: #28a4c9;
}
.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
background-color: #2aabd2;
background-image: none;
}
.btn-warning {
background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
background-image: -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316));
background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #e38d13;
}
.btn-warning:hover,
.btn-warning:focus {
background-color: #eb9316;
background-position: 0 -15px;
}
.btn-warning:active,
.btn-warning.active {
background-color: #eb9316;
border-color: #e38d13;
}
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled].focus,
fieldset[disabled] .btn-warning.focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
background-color: #eb9316;
background-image: none;
}
.btn-danger {
background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
background-image: -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #b92c28;
}
.btn-danger:hover,
.btn-danger:focus {
background-color: #c12e2a;
background-position: 0 -15px;
}
.btn-danger:active,
.btn-danger.active {
background-color: #c12e2a;
border-color: #b92c28;
}
.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
background-color: #c12e2a;
background-image: none;
}
.thumbnail,
.img-thumbnail {
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
background-repeat: repeat-x;
background-color: #e8e8e8;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
background-repeat: repeat-x;
background-color: #2e6da4;
}
.navbar-default {
background-image: -webkit-linear-gradient(top, #ffffff 0%, #f8f8f8 100%);
background-image: -o-linear-gradient(top, #ffffff 0%, #f8f8f8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f8f8f8));
background-image: linear-gradient(to bottom, #ffffff 0%, #f8f8f8 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .active > a {
background-image: -webkit-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
background-image: -o-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#dbdbdb), to(#e2e2e2));
background-image: linear-gradient(to bottom, #dbdbdb 0%, #e2e2e2 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0);
background-repeat: repeat-x;
-webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.075);
}
.navbar-brand,
.navbar-nav > li > a {
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}
.navbar-inverse {
background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%);
background-image: -o-linear-gradient(top, #3c3c3c 0%, #222 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222));
background-image: linear-gradient(to bottom, #3c3c3c 0%, #222 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
border-radius: 4px;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .active > a {
background-image: -webkit-linear-gradient(top, #080808 0%, #0f0f0f 100%);
background-image: -o-linear-gradient(top, #080808 0%, #0f0f0f 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#080808), to(#0f0f0f));
background-image: linear-gradient(to bottom, #080808 0%, #0f0f0f 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0);
background-repeat: repeat-x;
-webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.25);
box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.25);
}
.navbar-inverse .navbar-brand,
.navbar-inverse .navbar-nav > li > a {
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.navbar-static-top,
.navbar-fixed-top,
.navbar-fixed-bottom {
border-radius: 0;
}
@media (max-width: 767px) {
.navbar .navbar-nav .open .dropdown-menu > .active > a,
.navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #fff;
background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
background-repeat: repeat-x;
}
}
.alert {
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.alert-success {
background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
background-repeat: repeat-x;
border-color: #b2dba1;
}
.alert-info {
background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
background-image: -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
background-repeat: repeat-x;
border-color: #9acfea;
}
.alert-warning {
background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
background-image: -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
background-repeat: repeat-x;
border-color: #f5e79e;
}
.alert-danger {
background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
background-repeat: repeat-x;
border-color: #dca7a7;
}
.progress {
background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
background-image: -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5));
background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar {
background-image: -webkit-linear-gradient(top, #337ab7 0%, #286090 100%);
background-image: -o-linear-gradient(top, #337ab7 0%, #286090 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#286090));
background-image: linear-gradient(to bottom, #337ab7 0%, #286090 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-success {
background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
background-image: -o-linear-gradient(top, #5cb85c 0%, #449d44 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44));
background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-info {
background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
background-image: -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5));
background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-warning {
background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
background-image: -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f));
background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-danger {
background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
background-image: -o-linear-gradient(top, #d9534f 0%, #c9302c 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c));
background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-striped {
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.list-group {
border-radius: 4px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
}
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
text-shadow: 0 -1px 0 #286090;
background-image: -webkit-linear-gradient(top, #337ab7 0%, #2b669a 100%);
background-image: -o-linear-gradient(top, #337ab7 0%, #2b669a 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2b669a));
background-image: linear-gradient(to bottom, #337ab7 0%, #2b669a 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0);
background-repeat: repeat-x;
border-color: #2b669a;
}
.list-group-item.active .badge,
.list-group-item.active:hover .badge,
.list-group-item.active:focus .badge {
text-shadow: none;
}
.panel {
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.panel-default > .panel-heading {
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
background-repeat: repeat-x;
}
.panel-primary > .panel-heading {
background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
background-repeat: repeat-x;
}
.panel-success > .panel-heading {
background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
background-image: -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6));
background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
background-repeat: repeat-x;
}
.panel-info > .panel-heading {
background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
background-image: -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3));
background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
background-repeat: repeat-x;
}
.panel-warning > .panel-heading {
background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
background-image: -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc));
background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
background-repeat: repeat-x;
}
.panel-danger > .panel-heading {
background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
background-image: -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc));
background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
background-repeat: repeat-x;
}
.well {
background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
background-image: -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5));
background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
background-repeat: repeat-x;
border-color: #dcdcdc;
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.1);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.1);
}
/*# sourceMappingURL=bootstrap-theme.css.map */

1
src/components/h5player/static/css/bootstrap-theme.css.map Normal file
View File

File diff suppressed because one or more lines are too long

6
src/components/h5player/static/css/bootstrap-theme.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
src/components/h5player/static/css/bootstrap-theme.min.css.map Normal file
View File

File diff suppressed because one or more lines are too long

6834
src/components/h5player/static/css/bootstrap.css vendored Normal file
View File

File diff suppressed because it is too large Load Diff

1
src/components/h5player/static/css/bootstrap.css.map Normal file
View File

File diff suppressed because one or more lines are too long

6
src/components/h5player/static/css/bootstrap.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
src/components/h5player/static/css/bootstrap.min.css.map Normal file
View File

File diff suppressed because one or more lines are too long

BIN
src/components/h5player/static/fonts/glyphicons-halflings-regular.eot Normal file
View File

Binary file not shown.

288
src/components/h5player/static/fonts/glyphicons-halflings-regular.svg Normal file
View File

@ -0,0 +1,288 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata></metadata>
<defs>
<font id="glyphicons_halflingsregular" horiz-adv-x="1200" >
<font-face units-per-em="1200" ascent="960" descent="-240" />
<missing-glyph horiz-adv-x="500" />
<glyph horiz-adv-x="0" />
<glyph horiz-adv-x="400" />
<glyph unicode=" " />
<glyph unicode="*" d="M600 1100q15 0 34 -1.5t30 -3.5l11 -1q10 -2 17.5 -10.5t7.5 -18.5v-224l158 158q7 7 18 8t19 -6l106 -106q7 -8 6 -19t-8 -18l-158 -158h224q10 0 18.5 -7.5t10.5 -17.5q6 -41 6 -75q0 -15 -1.5 -34t-3.5 -30l-1 -11q-2 -10 -10.5 -17.5t-18.5 -7.5h-224l158 -158 q7 -7 8 -18t-6 -19l-106 -106q-8 -7 -19 -6t-18 8l-158 158v-224q0 -10 -7.5 -18.5t-17.5 -10.5q-41 -6 -75 -6q-15 0 -34 1.5t-30 3.5l-11 1q-10 2 -17.5 10.5t-7.5 18.5v224l-158 -158q-7 -7 -18 -8t-19 6l-106 106q-7 8 -6 19t8 18l158 158h-224q-10 0 -18.5 7.5 t-10.5 17.5q-6 41 -6 75q0 15 1.5 34t3.5 30l1 11q2 10 10.5 17.5t18.5 7.5h224l-158 158q-7 7 -8 18t6 19l106 106q8 7 19 6t18 -8l158 -158v224q0 10 7.5 18.5t17.5 10.5q41 6 75 6z" />
<glyph unicode="+" d="M450 1100h200q21 0 35.5 -14.5t14.5 -35.5v-350h350q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-350v-350q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v350h-350q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5 h350v350q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xa0;" />
<glyph unicode="&#xa5;" d="M825 1100h250q10 0 12.5 -5t-5.5 -13l-364 -364q-6 -6 -11 -18h268q10 0 13 -6t-3 -14l-120 -160q-6 -8 -18 -14t-22 -6h-125v-100h275q10 0 13 -6t-3 -14l-120 -160q-6 -8 -18 -14t-22 -6h-125v-174q0 -11 -7.5 -18.5t-18.5 -7.5h-148q-11 0 -18.5 7.5t-7.5 18.5v174 h-275q-10 0 -13 6t3 14l120 160q6 8 18 14t22 6h125v100h-275q-10 0 -13 6t3 14l120 160q6 8 18 14t22 6h118q-5 12 -11 18l-364 364q-8 8 -5.5 13t12.5 5h250q25 0 43 -18l164 -164q8 -8 18 -8t18 8l164 164q18 18 43 18z" />
<glyph unicode="&#x2000;" horiz-adv-x="650" />
<glyph unicode="&#x2001;" horiz-adv-x="1300" />
<glyph unicode="&#x2002;" horiz-adv-x="650" />
<glyph unicode="&#x2003;" horiz-adv-x="1300" />
<glyph unicode="&#x2004;" horiz-adv-x="433" />
<glyph unicode="&#x2005;" horiz-adv-x="325" />
<glyph unicode="&#x2006;" horiz-adv-x="216" />
<glyph unicode="&#x2007;" horiz-adv-x="216" />
<glyph unicode="&#x2008;" horiz-adv-x="162" />
<glyph unicode="&#x2009;" horiz-adv-x="260" />
<glyph unicode="&#x200a;" horiz-adv-x="72" />
<glyph unicode="&#x202f;" horiz-adv-x="260" />
<glyph unicode="&#x205f;" horiz-adv-x="325" />
<glyph unicode="&#x20ac;" d="M744 1198q242 0 354 -189q60 -104 66 -209h-181q0 45 -17.5 82.5t-43.5 61.5t-58 40.5t-60.5 24t-51.5 7.5q-19 0 -40.5 -5.5t-49.5 -20.5t-53 -38t-49 -62.5t-39 -89.5h379l-100 -100h-300q-6 -50 -6 -100h406l-100 -100h-300q9 -74 33 -132t52.5 -91t61.5 -54.5t59 -29 t47 -7.5q22 0 50.5 7.5t60.5 24.5t58 41t43.5 61t17.5 80h174q-30 -171 -128 -278q-107 -117 -274 -117q-206 0 -324 158q-36 48 -69 133t-45 204h-217l100 100h112q1 47 6 100h-218l100 100h134q20 87 51 153.5t62 103.5q117 141 297 141z" />
<glyph unicode="&#x20bd;" d="M428 1200h350q67 0 120 -13t86 -31t57 -49.5t35 -56.5t17 -64.5t6.5 -60.5t0.5 -57v-16.5v-16.5q0 -36 -0.5 -57t-6.5 -61t-17 -65t-35 -57t-57 -50.5t-86 -31.5t-120 -13h-178l-2 -100h288q10 0 13 -6t-3 -14l-120 -160q-6 -8 -18 -14t-22 -6h-138v-175q0 -11 -5.5 -18 t-15.5 -7h-149q-10 0 -17.5 7.5t-7.5 17.5v175h-267q-10 0 -13 6t3 14l120 160q6 8 18 14t22 6h117v100h-267q-10 0 -13 6t3 14l120 160q6 8 18 14t22 6h117v475q0 10 7.5 17.5t17.5 7.5zM600 1000v-300h203q64 0 86.5 33t22.5 119q0 84 -22.5 116t-86.5 32h-203z" />
<glyph unicode="&#x2212;" d="M250 700h800q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#x231b;" d="M1000 1200v-150q0 -21 -14.5 -35.5t-35.5 -14.5h-50v-100q0 -91 -49.5 -165.5t-130.5 -109.5q81 -35 130.5 -109.5t49.5 -165.5v-150h50q21 0 35.5 -14.5t14.5 -35.5v-150h-800v150q0 21 14.5 35.5t35.5 14.5h50v150q0 91 49.5 165.5t130.5 109.5q-81 35 -130.5 109.5 t-49.5 165.5v100h-50q-21 0 -35.5 14.5t-14.5 35.5v150h800zM400 1000v-100q0 -60 32.5 -109.5t87.5 -73.5q28 -12 44 -37t16 -55t-16 -55t-44 -37q-55 -24 -87.5 -73.5t-32.5 -109.5v-150h400v150q0 60 -32.5 109.5t-87.5 73.5q-28 12 -44 37t-16 55t16 55t44 37 q55 24 87.5 73.5t32.5 109.5v100h-400z" />
<glyph unicode="&#x25fc;" horiz-adv-x="500" d="M0 0z" />
<glyph unicode="&#x2601;" d="M503 1089q110 0 200.5 -59.5t134.5 -156.5q44 14 90 14q120 0 205 -86.5t85 -206.5q0 -121 -85 -207.5t-205 -86.5h-750q-79 0 -135.5 57t-56.5 137q0 69 42.5 122.5t108.5 67.5q-2 12 -2 37q0 153 108 260.5t260 107.5z" />
<glyph unicode="&#x26fa;" d="M774 1193.5q16 -9.5 20.5 -27t-5.5 -33.5l-136 -187l467 -746h30q20 0 35 -18.5t15 -39.5v-42h-1200v42q0 21 15 39.5t35 18.5h30l468 746l-135 183q-10 16 -5.5 34t20.5 28t34 5.5t28 -20.5l111 -148l112 150q9 16 27 20.5t34 -5zM600 200h377l-182 112l-195 534v-646z " />
<glyph unicode="&#x2709;" d="M25 1100h1150q10 0 12.5 -5t-5.5 -13l-564 -567q-8 -8 -18 -8t-18 8l-564 567q-8 8 -5.5 13t12.5 5zM18 882l264 -264q8 -8 8 -18t-8 -18l-264 -264q-8 -8 -13 -5.5t-5 12.5v550q0 10 5 12.5t13 -5.5zM918 618l264 264q8 8 13 5.5t5 -12.5v-550q0 -10 -5 -12.5t-13 5.5 l-264 264q-8 8 -8 18t8 18zM818 482l364 -364q8 -8 5.5 -13t-12.5 -5h-1150q-10 0 -12.5 5t5.5 13l364 364q8 8 18 8t18 -8l164 -164q8 -8 18 -8t18 8l164 164q8 8 18 8t18 -8z" />
<glyph unicode="&#x270f;" d="M1011 1210q19 0 33 -13l153 -153q13 -14 13 -33t-13 -33l-99 -92l-214 214l95 96q13 14 32 14zM1013 800l-615 -614l-214 214l614 614zM317 96l-333 -112l110 335z" />
<glyph unicode="&#xe001;" d="M700 650v-550h250q21 0 35.5 -14.5t14.5 -35.5v-50h-800v50q0 21 14.5 35.5t35.5 14.5h250v550l-500 550h1200z" />
<glyph unicode="&#xe002;" d="M368 1017l645 163q39 15 63 0t24 -49v-831q0 -55 -41.5 -95.5t-111.5 -63.5q-79 -25 -147 -4.5t-86 75t25.5 111.5t122.5 82q72 24 138 8v521l-600 -155v-606q0 -42 -44 -90t-109 -69q-79 -26 -147 -5.5t-86 75.5t25.5 111.5t122.5 82.5q72 24 138 7v639q0 38 14.5 59 t53.5 34z" />
<glyph unicode="&#xe003;" d="M500 1191q100 0 191 -39t156.5 -104.5t104.5 -156.5t39 -191l-1 -2l1 -5q0 -141 -78 -262l275 -274q23 -26 22.5 -44.5t-22.5 -42.5l-59 -58q-26 -20 -46.5 -20t-39.5 20l-275 274q-119 -77 -261 -77l-5 1l-2 -1q-100 0 -191 39t-156.5 104.5t-104.5 156.5t-39 191 t39 191t104.5 156.5t156.5 104.5t191 39zM500 1022q-88 0 -162 -43t-117 -117t-43 -162t43 -162t117 -117t162 -43t162 43t117 117t43 162t-43 162t-117 117t-162 43z" />
<glyph unicode="&#xe005;" d="M649 949q48 68 109.5 104t121.5 38.5t118.5 -20t102.5 -64t71 -100.5t27 -123q0 -57 -33.5 -117.5t-94 -124.5t-126.5 -127.5t-150 -152.5t-146 -174q-62 85 -145.5 174t-150 152.5t-126.5 127.5t-93.5 124.5t-33.5 117.5q0 64 28 123t73 100.5t104 64t119 20 t120.5 -38.5t104.5 -104z" />
<glyph unicode="&#xe006;" d="M407 800l131 353q7 19 17.5 19t17.5 -19l129 -353h421q21 0 24 -8.5t-14 -20.5l-342 -249l130 -401q7 -20 -0.5 -25.5t-24.5 6.5l-343 246l-342 -247q-17 -12 -24.5 -6.5t-0.5 25.5l130 400l-347 251q-17 12 -14 20.5t23 8.5h429z" />
<glyph unicode="&#xe007;" d="M407 800l131 353q7 19 17.5 19t17.5 -19l129 -353h421q21 0 24 -8.5t-14 -20.5l-342 -249l130 -401q7 -20 -0.5 -25.5t-24.5 6.5l-343 246l-342 -247q-17 -12 -24.5 -6.5t-0.5 25.5l130 400l-347 251q-17 12 -14 20.5t23 8.5h429zM477 700h-240l197 -142l-74 -226 l193 139l195 -140l-74 229l192 140h-234l-78 211z" />
<glyph unicode="&#xe008;" d="M600 1200q124 0 212 -88t88 -212v-250q0 -46 -31 -98t-69 -52v-75q0 -10 6 -21.5t15 -17.5l358 -230q9 -5 15 -16.5t6 -21.5v-93q0 -10 -7.5 -17.5t-17.5 -7.5h-1150q-10 0 -17.5 7.5t-7.5 17.5v93q0 10 6 21.5t15 16.5l358 230q9 6 15 17.5t6 21.5v75q-38 0 -69 52 t-31 98v250q0 124 88 212t212 88z" />
<glyph unicode="&#xe009;" d="M25 1100h1150q10 0 17.5 -7.5t7.5 -17.5v-1050q0 -10 -7.5 -17.5t-17.5 -7.5h-1150q-10 0 -17.5 7.5t-7.5 17.5v1050q0 10 7.5 17.5t17.5 7.5zM100 1000v-100h100v100h-100zM875 1000h-550q-10 0 -17.5 -7.5t-7.5 -17.5v-350q0 -10 7.5 -17.5t17.5 -7.5h550 q10 0 17.5 7.5t7.5 17.5v350q0 10 -7.5 17.5t-17.5 7.5zM1000 1000v-100h100v100h-100zM100 800v-100h100v100h-100zM1000 800v-100h100v100h-100zM100 600v-100h100v100h-100zM1000 600v-100h100v100h-100zM875 500h-550q-10 0 -17.5 -7.5t-7.5 -17.5v-350q0 -10 7.5 -17.5 t17.5 -7.5h550q10 0 17.5 7.5t7.5 17.5v350q0 10 -7.5 17.5t-17.5 7.5zM100 400v-100h100v100h-100zM1000 400v-100h100v100h-100zM100 200v-100h100v100h-100zM1000 200v-100h100v100h-100z" />
<glyph unicode="&#xe010;" d="M50 1100h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM650 1100h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v400 q0 21 14.5 35.5t35.5 14.5zM50 500h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM650 500h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400 q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe011;" d="M50 1100h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM450 1100h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200 q0 21 14.5 35.5t35.5 14.5zM850 1100h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM50 700h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200 q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM450 700h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM850 700h200q21 0 35.5 -14.5t14.5 -35.5v-200 q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM50 300h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM450 300h200 q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM850 300h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5 t35.5 14.5z" />
<glyph unicode="&#xe012;" d="M50 1100h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM450 1100h700q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5v200 q0 21 14.5 35.5t35.5 14.5zM50 700h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM450 700h700q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-700 q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM50 300h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5zM450 300h700q21 0 35.5 -14.5t14.5 -35.5v-200 q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe013;" d="M465 477l571 571q8 8 18 8t17 -8l177 -177q8 -7 8 -17t-8 -18l-783 -784q-7 -8 -17.5 -8t-17.5 8l-384 384q-8 8 -8 18t8 17l177 177q7 8 17 8t18 -8l171 -171q7 -7 18 -7t18 7z" />
<glyph unicode="&#xe014;" d="M904 1083l178 -179q8 -8 8 -18.5t-8 -17.5l-267 -268l267 -268q8 -7 8 -17.5t-8 -18.5l-178 -178q-8 -8 -18.5 -8t-17.5 8l-268 267l-268 -267q-7 -8 -17.5 -8t-18.5 8l-178 178q-8 8 -8 18.5t8 17.5l267 268l-267 268q-8 7 -8 17.5t8 18.5l178 178q8 8 18.5 8t17.5 -8 l268 -267l268 268q7 7 17.5 7t18.5 -7z" />
<glyph unicode="&#xe015;" d="M507 1177q98 0 187.5 -38.5t154.5 -103.5t103.5 -154.5t38.5 -187.5q0 -141 -78 -262l300 -299q8 -8 8 -18.5t-8 -18.5l-109 -108q-7 -8 -17.5 -8t-18.5 8l-300 299q-119 -77 -261 -77q-98 0 -188 38.5t-154.5 103t-103 154.5t-38.5 188t38.5 187.5t103 154.5 t154.5 103.5t188 38.5zM506.5 1023q-89.5 0 -165.5 -44t-120 -120.5t-44 -166t44 -165.5t120 -120t165.5 -44t166 44t120.5 120t44 165.5t-44 166t-120.5 120.5t-166 44zM425 900h150q10 0 17.5 -7.5t7.5 -17.5v-75h75q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5 t-17.5 -7.5h-75v-75q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v75h-75q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5h75v75q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe016;" d="M507 1177q98 0 187.5 -38.5t154.5 -103.5t103.5 -154.5t38.5 -187.5q0 -141 -78 -262l300 -299q8 -8 8 -18.5t-8 -18.5l-109 -108q-7 -8 -17.5 -8t-18.5 8l-300 299q-119 -77 -261 -77q-98 0 -188 38.5t-154.5 103t-103 154.5t-38.5 188t38.5 187.5t103 154.5 t154.5 103.5t188 38.5zM506.5 1023q-89.5 0 -165.5 -44t-120 -120.5t-44 -166t44 -165.5t120 -120t165.5 -44t166 44t120.5 120t44 165.5t-44 166t-120.5 120.5t-166 44zM325 800h350q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-350q-10 0 -17.5 7.5 t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe017;" d="M550 1200h100q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM800 975v166q167 -62 272 -209.5t105 -331.5q0 -117 -45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5 t-184.5 123t-123 184.5t-45.5 224q0 184 105 331.5t272 209.5v-166q-103 -55 -165 -155t-62 -220q0 -116 57 -214.5t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5q0 120 -62 220t-165 155z" />
<glyph unicode="&#xe018;" d="M1025 1200h150q10 0 17.5 -7.5t7.5 -17.5v-1150q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v1150q0 10 7.5 17.5t17.5 7.5zM725 800h150q10 0 17.5 -7.5t7.5 -17.5v-750q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v750 q0 10 7.5 17.5t17.5 7.5zM425 500h150q10 0 17.5 -7.5t7.5 -17.5v-450q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v450q0 10 7.5 17.5t17.5 7.5zM125 300h150q10 0 17.5 -7.5t7.5 -17.5v-250q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5 v250q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe019;" d="M600 1174q33 0 74 -5l38 -152l5 -1q49 -14 94 -39l5 -2l134 80q61 -48 104 -105l-80 -134l3 -5q25 -44 39 -93l1 -6l152 -38q5 -43 5 -73q0 -34 -5 -74l-152 -38l-1 -6q-15 -49 -39 -93l-3 -5l80 -134q-48 -61 -104 -105l-134 81l-5 -3q-44 -25 -94 -39l-5 -2l-38 -151 q-43 -5 -74 -5q-33 0 -74 5l-38 151l-5 2q-49 14 -94 39l-5 3l-134 -81q-60 48 -104 105l80 134l-3 5q-25 45 -38 93l-2 6l-151 38q-6 42 -6 74q0 33 6 73l151 38l2 6q13 48 38 93l3 5l-80 134q47 61 105 105l133 -80l5 2q45 25 94 39l5 1l38 152q43 5 74 5zM600 815 q-89 0 -152 -63t-63 -151.5t63 -151.5t152 -63t152 63t63 151.5t-63 151.5t-152 63z" />
<glyph unicode="&#xe020;" d="M500 1300h300q41 0 70.5 -29.5t29.5 -70.5v-100h275q10 0 17.5 -7.5t7.5 -17.5v-75h-1100v75q0 10 7.5 17.5t17.5 7.5h275v100q0 41 29.5 70.5t70.5 29.5zM500 1200v-100h300v100h-300zM1100 900v-800q0 -41 -29.5 -70.5t-70.5 -29.5h-700q-41 0 -70.5 29.5t-29.5 70.5 v800h900zM300 800v-700h100v700h-100zM500 800v-700h100v700h-100zM700 800v-700h100v700h-100zM900 800v-700h100v700h-100z" />
<glyph unicode="&#xe021;" d="M18 618l620 608q8 7 18.5 7t17.5 -7l608 -608q8 -8 5.5 -13t-12.5 -5h-175v-575q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v375h-300v-375q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v575h-175q-10 0 -12.5 5t5.5 13z" />
<glyph unicode="&#xe022;" d="M600 1200v-400q0 -41 29.5 -70.5t70.5 -29.5h300v-650q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v1100q0 21 14.5 35.5t35.5 14.5h450zM1000 800h-250q-21 0 -35.5 14.5t-14.5 35.5v250z" />
<glyph unicode="&#xe023;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5t-57 214.5t-155.5 155.5t-214.5 57zM525 900h50q10 0 17.5 -7.5t7.5 -17.5v-275h175q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v350q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe024;" d="M1300 0h-538l-41 400h-242l-41 -400h-538l431 1200h209l-21 -300h162l-20 300h208zM515 800l-27 -300h224l-27 300h-170z" />
<glyph unicode="&#xe025;" d="M550 1200h200q21 0 35.5 -14.5t14.5 -35.5v-450h191q20 0 25.5 -11.5t-7.5 -27.5l-327 -400q-13 -16 -32 -16t-32 16l-327 400q-13 16 -7.5 27.5t25.5 11.5h191v450q0 21 14.5 35.5t35.5 14.5zM1125 400h50q10 0 17.5 -7.5t7.5 -17.5v-350q0 -10 -7.5 -17.5t-17.5 -7.5 h-1050q-10 0 -17.5 7.5t-7.5 17.5v350q0 10 7.5 17.5t17.5 7.5h50q10 0 17.5 -7.5t7.5 -17.5v-175h900v175q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe026;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5t-57 214.5t-155.5 155.5t-214.5 57zM525 900h150q10 0 17.5 -7.5t7.5 -17.5v-275h137q21 0 26 -11.5t-8 -27.5l-223 -275q-13 -16 -32 -16t-32 16l-223 275q-13 16 -8 27.5t26 11.5h137v275q0 10 7.5 17.5t17.5 7.5z " />
<glyph unicode="&#xe027;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5t-57 214.5t-155.5 155.5t-214.5 57zM632 914l223 -275q13 -16 8 -27.5t-26 -11.5h-137v-275q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v275h-137q-21 0 -26 11.5t8 27.5l223 275q13 16 32 16 t32 -16z" />
<glyph unicode="&#xe028;" d="M225 1200h750q10 0 19.5 -7t12.5 -17l186 -652q7 -24 7 -49v-425q0 -12 -4 -27t-9 -17q-12 -6 -37 -6h-1100q-12 0 -27 4t-17 8q-6 13 -6 38l1 425q0 25 7 49l185 652q3 10 12.5 17t19.5 7zM878 1000h-556q-10 0 -19 -7t-11 -18l-87 -450q-2 -11 4 -18t16 -7h150 q10 0 19.5 -7t11.5 -17l38 -152q2 -10 11.5 -17t19.5 -7h250q10 0 19.5 7t11.5 17l38 152q2 10 11.5 17t19.5 7h150q10 0 16 7t4 18l-87 450q-2 11 -11 18t-19 7z" />
<glyph unicode="&#xe029;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5t-57 214.5t-155.5 155.5t-214.5 57zM540 820l253 -190q17 -12 17 -30t-17 -30l-253 -190q-16 -12 -28 -6.5t-12 26.5v400q0 21 12 26.5t28 -6.5z" />
<glyph unicode="&#xe030;" d="M947 1060l135 135q7 7 12.5 5t5.5 -13v-362q0 -10 -7.5 -17.5t-17.5 -7.5h-362q-11 0 -13 5.5t5 12.5l133 133q-109 76 -238 76q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5h150q0 -117 -45.5 -224 t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5q192 0 347 -117z" />
<glyph unicode="&#xe031;" d="M947 1060l135 135q7 7 12.5 5t5.5 -13v-361q0 -11 -7.5 -18.5t-18.5 -7.5h-361q-11 0 -13 5.5t5 12.5l134 134q-110 75 -239 75q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5h-150q0 117 45.5 224t123 184.5t184.5 123t224 45.5q192 0 347 -117zM1027 600h150 q0 -117 -45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5q-192 0 -348 118l-134 -134q-7 -8 -12.5 -5.5t-5.5 12.5v360q0 11 7.5 18.5t18.5 7.5h360q10 0 12.5 -5.5t-5.5 -12.5l-133 -133q110 -76 240 -76q116 0 214.5 57t155.5 155.5t57 214.5z" />
<glyph unicode="&#xe032;" d="M125 1200h1050q10 0 17.5 -7.5t7.5 -17.5v-1150q0 -10 -7.5 -17.5t-17.5 -7.5h-1050q-10 0 -17.5 7.5t-7.5 17.5v1150q0 10 7.5 17.5t17.5 7.5zM1075 1000h-850q-10 0 -17.5 -7.5t-7.5 -17.5v-850q0 -10 7.5 -17.5t17.5 -7.5h850q10 0 17.5 7.5t7.5 17.5v850 q0 10 -7.5 17.5t-17.5 7.5zM325 900h50q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-50q-10 0 -17.5 7.5t-7.5 17.5v50q0 10 7.5 17.5t17.5 7.5zM525 900h450q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-450q-10 0 -17.5 7.5t-7.5 17.5v50 q0 10 7.5 17.5t17.5 7.5zM325 700h50q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-50q-10 0 -17.5 7.5t-7.5 17.5v50q0 10 7.5 17.5t17.5 7.5zM525 700h450q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-450q-10 0 -17.5 7.5t-7.5 17.5v50 q0 10 7.5 17.5t17.5 7.5zM325 500h50q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-50q-10 0 -17.5 7.5t-7.5 17.5v50q0 10 7.5 17.5t17.5 7.5zM525 500h450q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-450q-10 0 -17.5 7.5t-7.5 17.5v50 q0 10 7.5 17.5t17.5 7.5zM325 300h50q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-50q-10 0 -17.5 7.5t-7.5 17.5v50q0 10 7.5 17.5t17.5 7.5zM525 300h450q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-450q-10 0 -17.5 7.5t-7.5 17.5v50 q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe033;" d="M900 800v200q0 83 -58.5 141.5t-141.5 58.5h-300q-82 0 -141 -59t-59 -141v-200h-100q-41 0 -70.5 -29.5t-29.5 -70.5v-600q0 -41 29.5 -70.5t70.5 -29.5h900q41 0 70.5 29.5t29.5 70.5v600q0 41 -29.5 70.5t-70.5 29.5h-100zM400 800v150q0 21 15 35.5t35 14.5h200 q20 0 35 -14.5t15 -35.5v-150h-300z" />
<glyph unicode="&#xe034;" d="M125 1100h50q10 0 17.5 -7.5t7.5 -17.5v-1075h-100v1075q0 10 7.5 17.5t17.5 7.5zM1075 1052q4 0 9 -2q16 -6 16 -23v-421q0 -6 -3 -12q-33 -59 -66.5 -99t-65.5 -58t-56.5 -24.5t-52.5 -6.5q-26 0 -57.5 6.5t-52.5 13.5t-60 21q-41 15 -63 22.5t-57.5 15t-65.5 7.5 q-85 0 -160 -57q-7 -5 -15 -5q-6 0 -11 3q-14 7 -14 22v438q22 55 82 98.5t119 46.5q23 2 43 0.5t43 -7t32.5 -8.5t38 -13t32.5 -11q41 -14 63.5 -21t57 -14t63.5 -7q103 0 183 87q7 8 18 8z" />
<glyph unicode="&#xe035;" d="M600 1175q116 0 227 -49.5t192.5 -131t131 -192.5t49.5 -227v-300q0 -10 -7.5 -17.5t-17.5 -7.5h-50q-10 0 -17.5 7.5t-7.5 17.5v300q0 127 -70.5 231.5t-184.5 161.5t-245 57t-245 -57t-184.5 -161.5t-70.5 -231.5v-300q0 -10 -7.5 -17.5t-17.5 -7.5h-50 q-10 0 -17.5 7.5t-7.5 17.5v300q0 116 49.5 227t131 192.5t192.5 131t227 49.5zM220 500h160q8 0 14 -6t6 -14v-460q0 -8 -6 -14t-14 -6h-160q-8 0 -14 6t-6 14v460q0 8 6 14t14 6zM820 500h160q8 0 14 -6t6 -14v-460q0 -8 -6 -14t-14 -6h-160q-8 0 -14 6t-6 14v460 q0 8 6 14t14 6z" />
<glyph unicode="&#xe036;" d="M321 814l258 172q9 6 15 2.5t6 -13.5v-750q0 -10 -6 -13.5t-15 2.5l-258 172q-21 14 -46 14h-250q-10 0 -17.5 7.5t-7.5 17.5v350q0 10 7.5 17.5t17.5 7.5h250q25 0 46 14zM900 668l120 120q7 7 17 7t17 -7l34 -34q7 -7 7 -17t-7 -17l-120 -120l120 -120q7 -7 7 -17 t-7 -17l-34 -34q-7 -7 -17 -7t-17 7l-120 119l-120 -119q-7 -7 -17 -7t-17 7l-34 34q-7 7 -7 17t7 17l119 120l-119 120q-7 7 -7 17t7 17l34 34q7 8 17 8t17 -8z" />
<glyph unicode="&#xe037;" d="M321 814l258 172q9 6 15 2.5t6 -13.5v-750q0 -10 -6 -13.5t-15 2.5l-258 172q-21 14 -46 14h-250q-10 0 -17.5 7.5t-7.5 17.5v350q0 10 7.5 17.5t17.5 7.5h250q25 0 46 14zM766 900h4q10 -1 16 -10q96 -129 96 -290q0 -154 -90 -281q-6 -9 -17 -10l-3 -1q-9 0 -16 6 l-29 23q-7 7 -8.5 16.5t4.5 17.5q72 103 72 229q0 132 -78 238q-6 8 -4.5 18t9.5 17l29 22q7 5 15 5z" />
<glyph unicode="&#xe038;" d="M967 1004h3q11 -1 17 -10q135 -179 135 -396q0 -105 -34 -206.5t-98 -185.5q-7 -9 -17 -10h-3q-9 0 -16 6l-42 34q-8 6 -9 16t5 18q111 150 111 328q0 90 -29.5 176t-84.5 157q-6 9 -5 19t10 16l42 33q7 5 15 5zM321 814l258 172q9 6 15 2.5t6 -13.5v-750q0 -10 -6 -13.5 t-15 2.5l-258 172q-21 14 -46 14h-250q-10 0 -17.5 7.5t-7.5 17.5v350q0 10 7.5 17.5t17.5 7.5h250q25 0 46 14zM766 900h4q10 -1 16 -10q96 -129 96 -290q0 -154 -90 -281q-6 -9 -17 -10l-3 -1q-9 0 -16 6l-29 23q-7 7 -8.5 16.5t4.5 17.5q72 103 72 229q0 132 -78 238 q-6 8 -4.5 18.5t9.5 16.5l29 22q7 5 15 5z" />
<glyph unicode="&#xe039;" d="M500 900h100v-100h-100v-100h-400v-100h-100v600h500v-300zM1200 700h-200v-100h200v-200h-300v300h-200v300h-100v200h600v-500zM100 1100v-300h300v300h-300zM800 1100v-300h300v300h-300zM300 900h-100v100h100v-100zM1000 900h-100v100h100v-100zM300 500h200v-500 h-500v500h200v100h100v-100zM800 300h200v-100h-100v-100h-200v100h-100v100h100v200h-200v100h300v-300zM100 400v-300h300v300h-300zM300 200h-100v100h100v-100zM1200 200h-100v100h100v-100zM700 0h-100v100h100v-100zM1200 0h-300v100h300v-100z" />
<glyph unicode="&#xe040;" d="M100 200h-100v1000h100v-1000zM300 200h-100v1000h100v-1000zM700 200h-200v1000h200v-1000zM900 200h-100v1000h100v-1000zM1200 200h-200v1000h200v-1000zM400 0h-300v100h300v-100zM600 0h-100v91h100v-91zM800 0h-100v91h100v-91zM1100 0h-200v91h200v-91z" />
<glyph unicode="&#xe041;" d="M500 1200l682 -682q8 -8 8 -18t-8 -18l-464 -464q-8 -8 -18 -8t-18 8l-682 682l1 475q0 10 7.5 17.5t17.5 7.5h474zM319.5 1024.5q-29.5 29.5 -71 29.5t-71 -29.5t-29.5 -71.5t29.5 -71.5t71 -29.5t71 29.5t29.5 71.5t-29.5 71.5z" />
<glyph unicode="&#xe042;" d="M500 1200l682 -682q8 -8 8 -18t-8 -18l-464 -464q-8 -8 -18 -8t-18 8l-682 682l1 475q0 10 7.5 17.5t17.5 7.5h474zM800 1200l682 -682q8 -8 8 -18t-8 -18l-464 -464q-8 -8 -18 -8t-18 8l-56 56l424 426l-700 700h150zM319.5 1024.5q-29.5 29.5 -71 29.5t-71 -29.5 t-29.5 -71.5t29.5 -71.5t71 -29.5t71 29.5t29.5 71.5t-29.5 71.5z" />
<glyph unicode="&#xe043;" d="M300 1200h825q75 0 75 -75v-900q0 -25 -18 -43l-64 -64q-8 -8 -13 -5.5t-5 12.5v950q0 10 -7.5 17.5t-17.5 7.5h-700q-25 0 -43 -18l-64 -64q-8 -8 -5.5 -13t12.5 -5h700q10 0 17.5 -7.5t7.5 -17.5v-950q0 -10 -7.5 -17.5t-17.5 -7.5h-850q-10 0 -17.5 7.5t-7.5 17.5v975 q0 25 18 43l139 139q18 18 43 18z" />
<glyph unicode="&#xe044;" d="M250 1200h800q21 0 35.5 -14.5t14.5 -35.5v-1150l-450 444l-450 -445v1151q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe045;" d="M822 1200h-444q-11 0 -19 -7.5t-9 -17.5l-78 -301q-7 -24 7 -45l57 -108q6 -9 17.5 -15t21.5 -6h450q10 0 21.5 6t17.5 15l62 108q14 21 7 45l-83 301q-1 10 -9 17.5t-19 7.5zM1175 800h-150q-10 0 -21 -6.5t-15 -15.5l-78 -156q-4 -9 -15 -15.5t-21 -6.5h-550 q-10 0 -21 6.5t-15 15.5l-78 156q-4 9 -15 15.5t-21 6.5h-150q-10 0 -17.5 -7.5t-7.5 -17.5v-650q0 -10 7.5 -17.5t17.5 -7.5h150q10 0 17.5 7.5t7.5 17.5v150q0 10 7.5 17.5t17.5 7.5h750q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 7.5 -17.5t17.5 -7.5h150q10 0 17.5 7.5 t7.5 17.5v650q0 10 -7.5 17.5t-17.5 7.5zM850 200h-500q-10 0 -19.5 -7t-11.5 -17l-38 -152q-2 -10 3.5 -17t15.5 -7h600q10 0 15.5 7t3.5 17l-38 152q-2 10 -11.5 17t-19.5 7z" />
<glyph unicode="&#xe046;" d="M500 1100h200q56 0 102.5 -20.5t72.5 -50t44 -59t25 -50.5l6 -20h150q41 0 70.5 -29.5t29.5 -70.5v-600q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5v600q0 41 29.5 70.5t70.5 29.5h150q2 8 6.5 21.5t24 48t45 61t72 48t102.5 21.5zM900 800v-100 h100v100h-100zM600 730q-95 0 -162.5 -67.5t-67.5 -162.5t67.5 -162.5t162.5 -67.5t162.5 67.5t67.5 162.5t-67.5 162.5t-162.5 67.5zM600 603q43 0 73 -30t30 -73t-30 -73t-73 -30t-73 30t-30 73t30 73t73 30z" />
<glyph unicode="&#xe047;" d="M681 1199l385 -998q20 -50 60 -92q18 -19 36.5 -29.5t27.5 -11.5l10 -2v-66h-417v66q53 0 75 43.5t5 88.5l-82 222h-391q-58 -145 -92 -234q-11 -34 -6.5 -57t25.5 -37t46 -20t55 -6v-66h-365v66q56 24 84 52q12 12 25 30.5t20 31.5l7 13l399 1006h93zM416 521h340 l-162 457z" />
<glyph unicode="&#xe048;" d="M753 641q5 -1 14.5 -4.5t36 -15.5t50.5 -26.5t53.5 -40t50.5 -54.5t35.5 -70t14.5 -87q0 -67 -27.5 -125.5t-71.5 -97.5t-98.5 -66.5t-108.5 -40.5t-102 -13h-500v89q41 7 70.5 32.5t29.5 65.5v827q0 24 -0.5 34t-3.5 24t-8.5 19.5t-17 13.5t-28 12.5t-42.5 11.5v71 l471 -1q57 0 115.5 -20.5t108 -57t80.5 -94t31 -124.5q0 -51 -15.5 -96.5t-38 -74.5t-45 -50.5t-38.5 -30.5zM400 700h139q78 0 130.5 48.5t52.5 122.5q0 41 -8.5 70.5t-29.5 55.5t-62.5 39.5t-103.5 13.5h-118v-350zM400 200h216q80 0 121 50.5t41 130.5q0 90 -62.5 154.5 t-156.5 64.5h-159v-400z" />
<glyph unicode="&#xe049;" d="M877 1200l2 -57q-83 -19 -116 -45.5t-40 -66.5l-132 -839q-9 -49 13 -69t96 -26v-97h-500v97q186 16 200 98l173 832q3 17 3 30t-1.5 22.5t-9 17.5t-13.5 12.5t-21.5 10t-26 8.5t-33.5 10q-13 3 -19 5v57h425z" />
<glyph unicode="&#xe050;" d="M1300 900h-50q0 21 -4 37t-9.5 26.5t-18 17.5t-22 11t-28.5 5.5t-31 2t-37 0.5h-200v-850q0 -22 25 -34.5t50 -13.5l25 -2v-100h-400v100q4 0 11 0.5t24 3t30 7t24 15t11 24.5v850h-200q-25 0 -37 -0.5t-31 -2t-28.5 -5.5t-22 -11t-18 -17.5t-9.5 -26.5t-4 -37h-50v300 h1000v-300zM175 1000h-75v-800h75l-125 -167l-125 167h75v800h-75l125 167z" />
<glyph unicode="&#xe051;" d="M1100 900h-50q0 21 -4 37t-9.5 26.5t-18 17.5t-22 11t-28.5 5.5t-31 2t-37 0.5h-200v-650q0 -22 25 -34.5t50 -13.5l25 -2v-100h-400v100q4 0 11 0.5t24 3t30 7t24 15t11 24.5v650h-200q-25 0 -37 -0.5t-31 -2t-28.5 -5.5t-22 -11t-18 -17.5t-9.5 -26.5t-4 -37h-50v300 h1000v-300zM1167 50l-167 -125v75h-800v-75l-167 125l167 125v-75h800v75z" />
<glyph unicode="&#xe052;" d="M50 1100h600q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-600q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 800h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5v100 q0 21 14.5 35.5t35.5 14.5zM50 500h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 200h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe053;" d="M250 1100h700q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 800h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v100 q0 21 14.5 35.5t35.5 14.5zM250 500h700q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 200h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe054;" d="M500 950v100q0 21 14.5 35.5t35.5 14.5h600q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-600q-21 0 -35.5 14.5t-14.5 35.5zM100 650v100q0 21 14.5 35.5t35.5 14.5h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1000 q-21 0 -35.5 14.5t-14.5 35.5zM300 350v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5zM0 50v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100 q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5z" />
<glyph unicode="&#xe055;" d="M50 1100h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 800h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v100 q0 21 14.5 35.5t35.5 14.5zM50 500h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 200h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe056;" d="M50 1100h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM350 1100h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v100 q0 21 14.5 35.5t35.5 14.5zM50 800h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM350 800h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-800 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 500h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM350 500h800q21 0 35.5 -14.5t14.5 -35.5v-100 q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 200h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM350 200h800 q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe057;" d="M400 0h-100v1100h100v-1100zM550 1100h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM550 800h500q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-500 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM267 550l-167 -125v75h-200v100h200v75zM550 500h300q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-300q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM550 200h600 q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-600q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe058;" d="M50 1100h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM900 0h-100v1100h100v-1100zM50 800h500q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-500 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM1100 600h200v-100h-200v-75l-167 125l167 125v-75zM50 500h300q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-300q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5zM50 200h600 q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-600q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe059;" d="M75 1000h750q31 0 53 -22t22 -53v-650q0 -31 -22 -53t-53 -22h-750q-31 0 -53 22t-22 53v650q0 31 22 53t53 22zM1200 300l-300 300l300 300v-600z" />
<glyph unicode="&#xe060;" d="M44 1100h1112q18 0 31 -13t13 -31v-1012q0 -18 -13 -31t-31 -13h-1112q-18 0 -31 13t-13 31v1012q0 18 13 31t31 13zM100 1000v-737l247 182l298 -131l-74 156l293 318l236 -288v500h-1000zM342 884q56 0 95 -39t39 -94.5t-39 -95t-95 -39.5t-95 39.5t-39 95t39 94.5 t95 39z" />
<glyph unicode="&#xe062;" d="M648 1169q117 0 216 -60t156.5 -161t57.5 -218q0 -115 -70 -258q-69 -109 -158 -225.5t-143 -179.5l-54 -62q-9 8 -25.5 24.5t-63.5 67.5t-91 103t-98.5 128t-95.5 148q-60 132 -60 249q0 88 34 169.5t91.5 142t137 96.5t166.5 36zM652.5 974q-91.5 0 -156.5 -65 t-65 -157t65 -156.5t156.5 -64.5t156.5 64.5t65 156.5t-65 157t-156.5 65z" />
<glyph unicode="&#xe063;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 173v854q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57z" />
<glyph unicode="&#xe064;" d="M554 1295q21 -72 57.5 -143.5t76 -130t83 -118t82.5 -117t70 -116t49.5 -126t18.5 -136.5q0 -71 -25.5 -135t-68.5 -111t-99 -82t-118.5 -54t-125.5 -23q-84 5 -161.5 34t-139.5 78.5t-99 125t-37 164.5q0 69 18 136.5t49.5 126.5t69.5 116.5t81.5 117.5t83.5 119 t76.5 131t58.5 143zM344 710q-23 -33 -43.5 -70.5t-40.5 -102.5t-17 -123q1 -37 14.5 -69.5t30 -52t41 -37t38.5 -24.5t33 -15q21 -7 32 -1t13 22l6 34q2 10 -2.5 22t-13.5 19q-5 4 -14 12t-29.5 40.5t-32.5 73.5q-26 89 6 271q2 11 -6 11q-8 1 -15 -10z" />
<glyph unicode="&#xe065;" d="M1000 1013l108 115q2 1 5 2t13 2t20.5 -1t25 -9.5t28.5 -21.5q22 -22 27 -43t0 -32l-6 -10l-108 -115zM350 1100h400q50 0 105 -13l-187 -187h-368q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v182l200 200v-332 q0 -165 -93.5 -257.5t-256.5 -92.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400q0 165 92.5 257.5t257.5 92.5zM1009 803l-362 -362l-161 -50l55 170l355 355z" />
<glyph unicode="&#xe066;" d="M350 1100h361q-164 -146 -216 -200h-195q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5l200 153v-103q0 -165 -92.5 -257.5t-257.5 -92.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400q0 165 92.5 257.5t257.5 92.5z M824 1073l339 -301q8 -7 8 -17.5t-8 -17.5l-340 -306q-7 -6 -12.5 -4t-6.5 11v203q-26 1 -54.5 0t-78.5 -7.5t-92 -17.5t-86 -35t-70 -57q10 59 33 108t51.5 81.5t65 58.5t68.5 40.5t67 24.5t56 13.5t40 4.5v210q1 10 6.5 12.5t13.5 -4.5z" />
<glyph unicode="&#xe067;" d="M350 1100h350q60 0 127 -23l-178 -177h-349q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v69l200 200v-219q0 -165 -92.5 -257.5t-257.5 -92.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400q0 165 92.5 257.5t257.5 92.5z M643 639l395 395q7 7 17.5 7t17.5 -7l101 -101q7 -7 7 -17.5t-7 -17.5l-531 -532q-7 -7 -17.5 -7t-17.5 7l-248 248q-7 7 -7 17.5t7 17.5l101 101q7 7 17.5 7t17.5 -7l111 -111q8 -7 18 -7t18 7z" />
<glyph unicode="&#xe068;" d="M318 918l264 264q8 8 18 8t18 -8l260 -264q7 -8 4.5 -13t-12.5 -5h-170v-200h200v173q0 10 5 12t13 -5l264 -260q8 -7 8 -17.5t-8 -17.5l-264 -265q-8 -7 -13 -5t-5 12v173h-200v-200h170q10 0 12.5 -5t-4.5 -13l-260 -264q-8 -8 -18 -8t-18 8l-264 264q-8 8 -5.5 13 t12.5 5h175v200h-200v-173q0 -10 -5 -12t-13 5l-264 265q-8 7 -8 17.5t8 17.5l264 260q8 7 13 5t5 -12v-173h200v200h-175q-10 0 -12.5 5t5.5 13z" />
<glyph unicode="&#xe069;" d="M250 1100h100q21 0 35.5 -14.5t14.5 -35.5v-438l464 453q15 14 25.5 10t10.5 -25v-1000q0 -21 -10.5 -25t-25.5 10l-464 453v-438q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v1000q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe070;" d="M50 1100h100q21 0 35.5 -14.5t14.5 -35.5v-438l464 453q15 14 25.5 10t10.5 -25v-438l464 453q15 14 25.5 10t10.5 -25v-1000q0 -21 -10.5 -25t-25.5 10l-464 453v-438q0 -21 -10.5 -25t-25.5 10l-464 453v-438q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5 t-14.5 35.5v1000q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe071;" d="M1200 1050v-1000q0 -21 -10.5 -25t-25.5 10l-464 453v-438q0 -21 -10.5 -25t-25.5 10l-492 480q-15 14 -15 35t15 35l492 480q15 14 25.5 10t10.5 -25v-438l464 453q15 14 25.5 10t10.5 -25z" />
<glyph unicode="&#xe072;" d="M243 1074l814 -498q18 -11 18 -26t-18 -26l-814 -498q-18 -11 -30.5 -4t-12.5 28v1000q0 21 12.5 28t30.5 -4z" />
<glyph unicode="&#xe073;" d="M250 1000h200q21 0 35.5 -14.5t14.5 -35.5v-800q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v800q0 21 14.5 35.5t35.5 14.5zM650 1000h200q21 0 35.5 -14.5t14.5 -35.5v-800q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v800 q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe074;" d="M1100 950v-800q0 -21 -14.5 -35.5t-35.5 -14.5h-800q-21 0 -35.5 14.5t-14.5 35.5v800q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5z" />
<glyph unicode="&#xe075;" d="M500 612v438q0 21 10.5 25t25.5 -10l492 -480q15 -14 15 -35t-15 -35l-492 -480q-15 -14 -25.5 -10t-10.5 25v438l-464 -453q-15 -14 -25.5 -10t-10.5 25v1000q0 21 10.5 25t25.5 -10z" />
<glyph unicode="&#xe076;" d="M1048 1102l100 1q20 0 35 -14.5t15 -35.5l5 -1000q0 -21 -14.5 -35.5t-35.5 -14.5l-100 -1q-21 0 -35.5 14.5t-14.5 35.5l-2 437l-463 -454q-14 -15 -24.5 -10.5t-10.5 25.5l-2 437l-462 -455q-15 -14 -25.5 -9.5t-10.5 24.5l-5 1000q0 21 10.5 25.5t25.5 -10.5l466 -450 l-2 438q0 20 10.5 24.5t25.5 -9.5l466 -451l-2 438q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe077;" d="M850 1100h100q21 0 35.5 -14.5t14.5 -35.5v-1000q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v438l-464 -453q-15 -14 -25.5 -10t-10.5 25v1000q0 21 10.5 25t25.5 -10l464 -453v438q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe078;" d="M686 1081l501 -540q15 -15 10.5 -26t-26.5 -11h-1042q-22 0 -26.5 11t10.5 26l501 540q15 15 36 15t36 -15zM150 400h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe079;" d="M885 900l-352 -353l352 -353l-197 -198l-552 552l552 550z" />
<glyph unicode="&#xe080;" d="M1064 547l-551 -551l-198 198l353 353l-353 353l198 198z" />
<glyph unicode="&#xe081;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM650 900h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-150h-150 q-21 0 -35.5 -14.5t-14.5 -35.5v-100q0 -21 14.5 -35.5t35.5 -14.5h150v-150q0 -21 14.5 -35.5t35.5 -14.5h100q21 0 35.5 14.5t14.5 35.5v150h150q21 0 35.5 14.5t14.5 35.5v100q0 21 -14.5 35.5t-35.5 14.5h-150v150q0 21 -14.5 35.5t-35.5 14.5z" />
<glyph unicode="&#xe082;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM850 700h-500q-21 0 -35.5 -14.5t-14.5 -35.5v-100q0 -21 14.5 -35.5 t35.5 -14.5h500q21 0 35.5 14.5t14.5 35.5v100q0 21 -14.5 35.5t-35.5 14.5z" />
<glyph unicode="&#xe083;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM741.5 913q-12.5 0 -21.5 -9l-120 -120l-120 120q-9 9 -21.5 9 t-21.5 -9l-141 -141q-9 -9 -9 -21.5t9 -21.5l120 -120l-120 -120q-9 -9 -9 -21.5t9 -21.5l141 -141q9 -9 21.5 -9t21.5 9l120 120l120 -120q9 -9 21.5 -9t21.5 9l141 141q9 9 9 21.5t-9 21.5l-120 120l120 120q9 9 9 21.5t-9 21.5l-141 141q-9 9 -21.5 9z" />
<glyph unicode="&#xe084;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM546 623l-84 85q-7 7 -17.5 7t-18.5 -7l-139 -139q-7 -8 -7 -18t7 -18 l242 -241q7 -8 17.5 -8t17.5 8l375 375q7 7 7 17.5t-7 18.5l-139 139q-7 7 -17.5 7t-17.5 -7z" />
<glyph unicode="&#xe085;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM588 941q-29 0 -59 -5.5t-63 -20.5t-58 -38.5t-41.5 -63t-16.5 -89.5 q0 -25 20 -25h131q30 -5 35 11q6 20 20.5 28t45.5 8q20 0 31.5 -10.5t11.5 -28.5q0 -23 -7 -34t-26 -18q-1 0 -13.5 -4t-19.5 -7.5t-20 -10.5t-22 -17t-18.5 -24t-15.5 -35t-8 -46q-1 -8 5.5 -16.5t20.5 -8.5h173q7 0 22 8t35 28t37.5 48t29.5 74t12 100q0 47 -17 83 t-42.5 57t-59.5 34.5t-64 18t-59 4.5zM675 400h-150q-10 0 -17.5 -7.5t-7.5 -17.5v-150q0 -10 7.5 -17.5t17.5 -7.5h150q10 0 17.5 7.5t7.5 17.5v150q0 10 -7.5 17.5t-17.5 7.5z" />
<glyph unicode="&#xe086;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM675 1000h-150q-10 0 -17.5 -7.5t-7.5 -17.5v-150q0 -10 7.5 -17.5 t17.5 -7.5h150q10 0 17.5 7.5t7.5 17.5v150q0 10 -7.5 17.5t-17.5 7.5zM675 700h-250q-10 0 -17.5 -7.5t-7.5 -17.5v-50q0 -10 7.5 -17.5t17.5 -7.5h75v-200h-75q-10 0 -17.5 -7.5t-7.5 -17.5v-50q0 -10 7.5 -17.5t17.5 -7.5h350q10 0 17.5 7.5t7.5 17.5v50q0 10 -7.5 17.5 t-17.5 7.5h-75v275q0 10 -7.5 17.5t-17.5 7.5z" />
<glyph unicode="&#xe087;" d="M525 1200h150q10 0 17.5 -7.5t7.5 -17.5v-194q103 -27 178.5 -102.5t102.5 -178.5h194q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-194q-27 -103 -102.5 -178.5t-178.5 -102.5v-194q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v194 q-103 27 -178.5 102.5t-102.5 178.5h-194q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5h194q27 103 102.5 178.5t178.5 102.5v194q0 10 7.5 17.5t17.5 7.5zM700 893v-168q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v168q-68 -23 -119 -74 t-74 -119h168q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-168q23 -68 74 -119t119 -74v168q0 10 7.5 17.5t17.5 7.5h150q10 0 17.5 -7.5t7.5 -17.5v-168q68 23 119 74t74 119h-168q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5h168 q-23 68 -74 119t-119 74z" />
<glyph unicode="&#xe088;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5t-57 214.5t-155.5 155.5t-214.5 57zM759 823l64 -64q7 -7 7 -17.5t-7 -17.5l-124 -124l124 -124q7 -7 7 -17.5t-7 -17.5l-64 -64q-7 -7 -17.5 -7t-17.5 7l-124 124l-124 -124q-7 -7 -17.5 -7t-17.5 7l-64 64 q-7 7 -7 17.5t7 17.5l124 124l-124 124q-7 7 -7 17.5t7 17.5l64 64q7 7 17.5 7t17.5 -7l124 -124l124 124q7 7 17.5 7t17.5 -7z" />
<glyph unicode="&#xe089;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5t57 -214.5 t155.5 -155.5t214.5 -57t214.5 57t155.5 155.5t57 214.5t-57 214.5t-155.5 155.5t-214.5 57zM782 788l106 -106q7 -7 7 -17.5t-7 -17.5l-320 -321q-8 -7 -18 -7t-18 7l-202 203q-8 7 -8 17.5t8 17.5l106 106q7 8 17.5 8t17.5 -8l79 -79l197 197q7 7 17.5 7t17.5 -7z" />
<glyph unicode="&#xe090;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM600 1027q-116 0 -214.5 -57t-155.5 -155.5t-57 -214.5q0 -120 65 -225 l587 587q-105 65 -225 65zM965 819l-584 -584q104 -62 219 -62q116 0 214.5 57t155.5 155.5t57 214.5q0 115 -62 219z" />
<glyph unicode="&#xe091;" d="M39 582l522 427q16 13 27.5 8t11.5 -26v-291h550q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-550v-291q0 -21 -11.5 -26t-27.5 8l-522 427q-16 13 -16 32t16 32z" />
<glyph unicode="&#xe092;" d="M639 1009l522 -427q16 -13 16 -32t-16 -32l-522 -427q-16 -13 -27.5 -8t-11.5 26v291h-550q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5h550v291q0 21 11.5 26t27.5 -8z" />
<glyph unicode="&#xe093;" d="M682 1161l427 -522q13 -16 8 -27.5t-26 -11.5h-291v-550q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v550h-291q-21 0 -26 11.5t8 27.5l427 522q13 16 32 16t32 -16z" />
<glyph unicode="&#xe094;" d="M550 1200h200q21 0 35.5 -14.5t14.5 -35.5v-550h291q21 0 26 -11.5t-8 -27.5l-427 -522q-13 -16 -32 -16t-32 16l-427 522q-13 16 -8 27.5t26 11.5h291v550q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe095;" d="M639 1109l522 -427q16 -13 16 -32t-16 -32l-522 -427q-16 -13 -27.5 -8t-11.5 26v291q-94 -2 -182 -20t-170.5 -52t-147 -92.5t-100.5 -135.5q5 105 27 193.5t67.5 167t113 135t167 91.5t225.5 42v262q0 21 11.5 26t27.5 -8z" />
<glyph unicode="&#xe096;" d="M850 1200h300q21 0 35.5 -14.5t14.5 -35.5v-300q0 -21 -10.5 -25t-24.5 10l-94 94l-249 -249q-8 -7 -18 -7t-18 7l-106 106q-7 8 -7 18t7 18l249 249l-94 94q-14 14 -10 24.5t25 10.5zM350 0h-300q-21 0 -35.5 14.5t-14.5 35.5v300q0 21 10.5 25t24.5 -10l94 -94l249 249 q8 7 18 7t18 -7l106 -106q7 -8 7 -18t-7 -18l-249 -249l94 -94q14 -14 10 -24.5t-25 -10.5z" />
<glyph unicode="&#xe097;" d="M1014 1120l106 -106q7 -8 7 -18t-7 -18l-249 -249l94 -94q14 -14 10 -24.5t-25 -10.5h-300q-21 0 -35.5 14.5t-14.5 35.5v300q0 21 10.5 25t24.5 -10l94 -94l249 249q8 7 18 7t18 -7zM250 600h300q21 0 35.5 -14.5t14.5 -35.5v-300q0 -21 -10.5 -25t-24.5 10l-94 94 l-249 -249q-8 -7 -18 -7t-18 7l-106 106q-7 8 -7 18t7 18l249 249l-94 94q-14 14 -10 24.5t25 10.5z" />
<glyph unicode="&#xe101;" d="M600 1177q117 0 224 -45.5t184.5 -123t123 -184.5t45.5 -224t-45.5 -224t-123 -184.5t-184.5 -123t-224 -45.5t-224 45.5t-184.5 123t-123 184.5t-45.5 224t45.5 224t123 184.5t184.5 123t224 45.5zM704 900h-208q-20 0 -32 -14.5t-8 -34.5l58 -302q4 -20 21.5 -34.5 t37.5 -14.5h54q20 0 37.5 14.5t21.5 34.5l58 302q4 20 -8 34.5t-32 14.5zM675 400h-150q-10 0 -17.5 -7.5t-7.5 -17.5v-150q0 -10 7.5 -17.5t17.5 -7.5h150q10 0 17.5 7.5t7.5 17.5v150q0 10 -7.5 17.5t-17.5 7.5z" />
<glyph unicode="&#xe102;" d="M260 1200q9 0 19 -2t15 -4l5 -2q22 -10 44 -23l196 -118q21 -13 36 -24q29 -21 37 -12q11 13 49 35l196 118q22 13 45 23q17 7 38 7q23 0 47 -16.5t37 -33.5l13 -16q14 -21 18 -45l25 -123l8 -44q1 -9 8.5 -14.5t17.5 -5.5h61q10 0 17.5 -7.5t7.5 -17.5v-50 q0 -10 -7.5 -17.5t-17.5 -7.5h-50q-10 0 -17.5 -7.5t-7.5 -17.5v-175h-400v300h-200v-300h-400v175q0 10 -7.5 17.5t-17.5 7.5h-50q-10 0 -17.5 7.5t-7.5 17.5v50q0 10 7.5 17.5t17.5 7.5h61q11 0 18 3t7 8q0 4 9 52l25 128q5 25 19 45q2 3 5 7t13.5 15t21.5 19.5t26.5 15.5 t29.5 7zM915 1079l-166 -162q-7 -7 -5 -12t12 -5h219q10 0 15 7t2 17l-51 149q-3 10 -11 12t-15 -6zM463 917l-177 157q-8 7 -16 5t-11 -12l-51 -143q-3 -10 2 -17t15 -7h231q11 0 12.5 5t-5.5 12zM500 0h-375q-10 0 -17.5 7.5t-7.5 17.5v375h400v-400zM1100 400v-375 q0 -10 -7.5 -17.5t-17.5 -7.5h-375v400h400z" />
<glyph unicode="&#xe103;" d="M1165 1190q8 3 21 -6.5t13 -17.5q-2 -178 -24.5 -323.5t-55.5 -245.5t-87 -174.5t-102.5 -118.5t-118 -68.5t-118.5 -33t-120 -4.5t-105 9.5t-90 16.5q-61 12 -78 11q-4 1 -12.5 0t-34 -14.5t-52.5 -40.5l-153 -153q-26 -24 -37 -14.5t-11 43.5q0 64 42 102q8 8 50.5 45 t66.5 58q19 17 35 47t13 61q-9 55 -10 102.5t7 111t37 130t78 129.5q39 51 80 88t89.5 63.5t94.5 45t113.5 36t129 31t157.5 37t182 47.5zM1116 1098q-8 9 -22.5 -3t-45.5 -50q-38 -47 -119 -103.5t-142 -89.5l-62 -33q-56 -30 -102 -57t-104 -68t-102.5 -80.5t-85.5 -91 t-64 -104.5q-24 -56 -31 -86t2 -32t31.5 17.5t55.5 59.5q25 30 94 75.5t125.5 77.5t147.5 81q70 37 118.5 69t102 79.5t99 111t86.5 148.5q22 50 24 60t-6 19z" />
<glyph unicode="&#xe104;" d="M653 1231q-39 -67 -54.5 -131t-10.5 -114.5t24.5 -96.5t47.5 -80t63.5 -62.5t68.5 -46.5t65 -30q-4 7 -17.5 35t-18.5 39.5t-17 39.5t-17 43t-13 42t-9.5 44.5t-2 42t4 43t13.5 39t23 38.5q96 -42 165 -107.5t105 -138t52 -156t13 -159t-19 -149.5q-13 -55 -44 -106.5 t-68 -87t-78.5 -64.5t-72.5 -45t-53 -22q-72 -22 -127 -11q-31 6 -13 19q6 3 17 7q13 5 32.5 21t41 44t38.5 63.5t21.5 81.5t-6.5 94.5t-50 107t-104 115.5q10 -104 -0.5 -189t-37 -140.5t-65 -93t-84 -52t-93.5 -11t-95 24.5q-80 36 -131.5 114t-53.5 171q-2 23 0 49.5 t4.5 52.5t13.5 56t27.5 60t46 64.5t69.5 68.5q-8 -53 -5 -102.5t17.5 -90t34 -68.5t44.5 -39t49 -2q31 13 38.5 36t-4.5 55t-29 64.5t-36 75t-26 75.5q-15 85 2 161.5t53.5 128.5t85.5 92.5t93.5 61t81.5 25.5z" />
<glyph unicode="&#xe105;" d="M600 1094q82 0 160.5 -22.5t140 -59t116.5 -82.5t94.5 -95t68 -95t42.5 -82.5t14 -57.5t-14 -57.5t-43 -82.5t-68.5 -95t-94.5 -95t-116.5 -82.5t-140 -59t-159.5 -22.5t-159.5 22.5t-140 59t-116.5 82.5t-94.5 95t-68.5 95t-43 82.5t-14 57.5t14 57.5t42.5 82.5t68 95 t94.5 95t116.5 82.5t140 59t160.5 22.5zM888 829q-15 15 -18 12t5 -22q25 -57 25 -119q0 -124 -88 -212t-212 -88t-212 88t-88 212q0 59 23 114q8 19 4.5 22t-17.5 -12q-70 -69 -160 -184q-13 -16 -15 -40.5t9 -42.5q22 -36 47 -71t70 -82t92.5 -81t113 -58.5t133.5 -24.5 t133.5 24t113 58.5t92.5 81.5t70 81.5t47 70.5q11 18 9 42.5t-14 41.5q-90 117 -163 189zM448 727l-35 -36q-15 -15 -19.5 -38.5t4.5 -41.5q37 -68 93 -116q16 -13 38.5 -11t36.5 17l35 34q14 15 12.5 33.5t-16.5 33.5q-44 44 -89 117q-11 18 -28 20t-32 -12z" />
<glyph unicode="&#xe106;" d="M592 0h-148l31 120q-91 20 -175.5 68.5t-143.5 106.5t-103.5 119t-66.5 110t-22 76q0 21 14 57.5t42.5 82.5t68 95t94.5 95t116.5 82.5t140 59t160.5 22.5q61 0 126 -15l32 121h148zM944 770l47 181q108 -85 176.5 -192t68.5 -159q0 -26 -19.5 -71t-59.5 -102t-93 -112 t-129 -104.5t-158 -75.5l46 173q77 49 136 117t97 131q11 18 9 42.5t-14 41.5q-54 70 -107 130zM310 824q-70 -69 -160 -184q-13 -16 -15 -40.5t9 -42.5q18 -30 39 -60t57 -70.5t74 -73t90 -61t105 -41.5l41 154q-107 18 -178.5 101.5t-71.5 193.5q0 59 23 114q8 19 4.5 22 t-17.5 -12zM448 727l-35 -36q-15 -15 -19.5 -38.5t4.5 -41.5q37 -68 93 -116q16 -13 38.5 -11t36.5 17l12 11l22 86l-3 4q-44 44 -89 117q-11 18 -28 20t-32 -12z" />
<glyph unicode="&#xe107;" d="M-90 100l642 1066q20 31 48 28.5t48 -35.5l642 -1056q21 -32 7.5 -67.5t-50.5 -35.5h-1294q-37 0 -50.5 34t7.5 66zM155 200h345v75q0 10 7.5 17.5t17.5 7.5h150q10 0 17.5 -7.5t7.5 -17.5v-75h345l-445 723zM496 700h208q20 0 32 -14.5t8 -34.5l-58 -252 q-4 -20 -21.5 -34.5t-37.5 -14.5h-54q-20 0 -37.5 14.5t-21.5 34.5l-58 252q-4 20 8 34.5t32 14.5z" />
<glyph unicode="&#xe108;" d="M650 1200q62 0 106 -44t44 -106v-339l363 -325q15 -14 26 -38.5t11 -44.5v-41q0 -20 -12 -26.5t-29 5.5l-359 249v-263q100 -93 100 -113v-64q0 -21 -13 -29t-32 1l-205 128l-205 -128q-19 -9 -32 -1t-13 29v64q0 20 100 113v263l-359 -249q-17 -12 -29 -5.5t-12 26.5v41 q0 20 11 44.5t26 38.5l363 325v339q0 62 44 106t106 44z" />
<glyph unicode="&#xe109;" d="M850 1200h100q21 0 35.5 -14.5t14.5 -35.5v-50h50q21 0 35.5 -14.5t14.5 -35.5v-150h-1100v150q0 21 14.5 35.5t35.5 14.5h50v50q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-50h500v50q0 21 14.5 35.5t35.5 14.5zM1100 800v-750q0 -21 -14.5 -35.5 t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5v750h1100zM100 600v-100h100v100h-100zM300 600v-100h100v100h-100zM500 600v-100h100v100h-100zM700 600v-100h100v100h-100zM900 600v-100h100v100h-100zM100 400v-100h100v100h-100zM300 400v-100h100v100h-100zM500 400 v-100h100v100h-100zM700 400v-100h100v100h-100zM900 400v-100h100v100h-100zM100 200v-100h100v100h-100zM300 200v-100h100v100h-100zM500 200v-100h100v100h-100zM700 200v-100h100v100h-100zM900 200v-100h100v100h-100z" />
<glyph unicode="&#xe110;" d="M1135 1165l249 -230q15 -14 15 -35t-15 -35l-249 -230q-14 -14 -24.5 -10t-10.5 25v150h-159l-600 -600h-291q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h209l600 600h241v150q0 21 10.5 25t24.5 -10zM522 819l-141 -141l-122 122h-209q-21 0 -35.5 14.5 t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h291zM1135 565l249 -230q15 -14 15 -35t-15 -35l-249 -230q-14 -14 -24.5 -10t-10.5 25v150h-241l-181 181l141 141l122 -122h159v150q0 21 10.5 25t24.5 -10z" />
<glyph unicode="&#xe111;" d="M100 1100h1000q41 0 70.5 -29.5t29.5 -70.5v-600q0 -41 -29.5 -70.5t-70.5 -29.5h-596l-304 -300v300h-100q-41 0 -70.5 29.5t-29.5 70.5v600q0 41 29.5 70.5t70.5 29.5z" />
<glyph unicode="&#xe112;" d="M150 1200h200q21 0 35.5 -14.5t14.5 -35.5v-250h-300v250q0 21 14.5 35.5t35.5 14.5zM850 1200h200q21 0 35.5 -14.5t14.5 -35.5v-250h-300v250q0 21 14.5 35.5t35.5 14.5zM1100 800v-300q0 -41 -3 -77.5t-15 -89.5t-32 -96t-58 -89t-89 -77t-129 -51t-174 -20t-174 20 t-129 51t-89 77t-58 89t-32 96t-15 89.5t-3 77.5v300h300v-250v-27v-42.5t1.5 -41t5 -38t10 -35t16.5 -30t25.5 -24.5t35 -19t46.5 -12t60 -4t60 4.5t46.5 12.5t35 19.5t25 25.5t17 30.5t10 35t5 38t2 40.5t-0.5 42v25v250h300z" />
<glyph unicode="&#xe113;" d="M1100 411l-198 -199l-353 353l-353 -353l-197 199l551 551z" />
<glyph unicode="&#xe114;" d="M1101 789l-550 -551l-551 551l198 199l353 -353l353 353z" />
<glyph unicode="&#xe115;" d="M404 1000h746q21 0 35.5 -14.5t14.5 -35.5v-551h150q21 0 25 -10.5t-10 -24.5l-230 -249q-14 -15 -35 -15t-35 15l-230 249q-14 14 -10 24.5t25 10.5h150v401h-381zM135 984l230 -249q14 -14 10 -24.5t-25 -10.5h-150v-400h385l215 -200h-750q-21 0 -35.5 14.5 t-14.5 35.5v550h-150q-21 0 -25 10.5t10 24.5l230 249q14 15 35 15t35 -15z" />
<glyph unicode="&#xe116;" d="M56 1200h94q17 0 31 -11t18 -27l38 -162h896q24 0 39 -18.5t10 -42.5l-100 -475q-5 -21 -27 -42.5t-55 -21.5h-633l48 -200h535q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-50v-50q0 -21 -14.5 -35.5t-35.5 -14.5t-35.5 14.5t-14.5 35.5v50h-300v-50 q0 -21 -14.5 -35.5t-35.5 -14.5t-35.5 14.5t-14.5 35.5v50h-31q-18 0 -32.5 10t-20.5 19l-5 10l-201 961h-54q-20 0 -35 14.5t-15 35.5t15 35.5t35 14.5z" />
<glyph unicode="&#xe117;" d="M1200 1000v-100h-1200v100h200q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5h500zM0 800h1200v-800h-1200v800z" />
<glyph unicode="&#xe118;" d="M200 800l-200 -400v600h200q0 41 29.5 70.5t70.5 29.5h300q42 0 71 -29.5t29 -70.5h500v-200h-1000zM1500 700l-300 -700h-1200l300 700h1200z" />
<glyph unicode="&#xe119;" d="M635 1184l230 -249q14 -14 10 -24.5t-25 -10.5h-150v-601h150q21 0 25 -10.5t-10 -24.5l-230 -249q-14 -15 -35 -15t-35 15l-230 249q-14 14 -10 24.5t25 10.5h150v601h-150q-21 0 -25 10.5t10 24.5l230 249q14 15 35 15t35 -15z" />
<glyph unicode="&#xe120;" d="M936 864l249 -229q14 -15 14 -35.5t-14 -35.5l-249 -229q-15 -15 -25.5 -10.5t-10.5 24.5v151h-600v-151q0 -20 -10.5 -24.5t-25.5 10.5l-249 229q-14 15 -14 35.5t14 35.5l249 229q15 15 25.5 10.5t10.5 -25.5v-149h600v149q0 21 10.5 25.5t25.5 -10.5z" />
<glyph unicode="&#xe121;" d="M1169 400l-172 732q-5 23 -23 45.5t-38 22.5h-672q-20 0 -38 -20t-23 -41l-172 -739h1138zM1100 300h-1000q-41 0 -70.5 -29.5t-29.5 -70.5v-100q0 -41 29.5 -70.5t70.5 -29.5h1000q41 0 70.5 29.5t29.5 70.5v100q0 41 -29.5 70.5t-70.5 29.5zM800 100v100h100v-100h-100 zM1000 100v100h100v-100h-100z" />
<glyph unicode="&#xe122;" d="M1150 1100q21 0 35.5 -14.5t14.5 -35.5v-850q0 -21 -14.5 -35.5t-35.5 -14.5t-35.5 14.5t-14.5 35.5v850q0 21 14.5 35.5t35.5 14.5zM1000 200l-675 200h-38l47 -276q3 -16 -5.5 -20t-29.5 -4h-7h-84q-20 0 -34.5 14t-18.5 35q-55 337 -55 351v250v6q0 16 1 23.5t6.5 14 t17.5 6.5h200l675 250v-850zM0 750v-250q-4 0 -11 0.5t-24 6t-30 15t-24 30t-11 48.5v50q0 26 10.5 46t25 30t29 16t25.5 7z" />
<glyph unicode="&#xe123;" d="M553 1200h94q20 0 29 -10.5t3 -29.5l-18 -37q83 -19 144 -82.5t76 -140.5l63 -327l118 -173h17q19 0 33 -14.5t14 -35t-13 -40.5t-31 -27q-8 -4 -23 -9.5t-65 -19.5t-103 -25t-132.5 -20t-158.5 -9q-57 0 -115 5t-104 12t-88.5 15.5t-73.5 17.5t-54.5 16t-35.5 12l-11 4 q-18 8 -31 28t-13 40.5t14 35t33 14.5h17l118 173l63 327q15 77 76 140t144 83l-18 32q-6 19 3.5 32t28.5 13zM498 110q50 -6 102 -6q53 0 102 6q-12 -49 -39.5 -79.5t-62.5 -30.5t-63 30.5t-39 79.5z" />
<glyph unicode="&#xe124;" d="M800 946l224 78l-78 -224l234 -45l-180 -155l180 -155l-234 -45l78 -224l-224 78l-45 -234l-155 180l-155 -180l-45 234l-224 -78l78 224l-234 45l180 155l-180 155l234 45l-78 224l224 -78l45 234l155 -180l155 180z" />
<glyph unicode="&#xe125;" d="M650 1200h50q40 0 70 -40.5t30 -84.5v-150l-28 -125h328q40 0 70 -40.5t30 -84.5v-100q0 -45 -29 -74l-238 -344q-16 -24 -38 -40.5t-45 -16.5h-250q-7 0 -42 25t-66 50l-31 25h-61q-45 0 -72.5 18t-27.5 57v400q0 36 20 63l145 196l96 198q13 28 37.5 48t51.5 20z M650 1100l-100 -212l-150 -213v-375h100l136 -100h214l250 375v125h-450l50 225v175h-50zM50 800h100q21 0 35.5 -14.5t14.5 -35.5v-500q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v500q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe126;" d="M600 1100h250q23 0 45 -16.5t38 -40.5l238 -344q29 -29 29 -74v-100q0 -44 -30 -84.5t-70 -40.5h-328q28 -118 28 -125v-150q0 -44 -30 -84.5t-70 -40.5h-50q-27 0 -51.5 20t-37.5 48l-96 198l-145 196q-20 27 -20 63v400q0 39 27.5 57t72.5 18h61q124 100 139 100z M50 1000h100q21 0 35.5 -14.5t14.5 -35.5v-500q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v500q0 21 14.5 35.5t35.5 14.5zM636 1000l-136 -100h-100v-375l150 -213l100 -212h50v175l-50 225h450v125l-250 375h-214z" />
<glyph unicode="&#xe127;" d="M356 873l363 230q31 16 53 -6l110 -112q13 -13 13.5 -32t-11.5 -34l-84 -121h302q84 0 138 -38t54 -110t-55 -111t-139 -39h-106l-131 -339q-6 -21 -19.5 -41t-28.5 -20h-342q-7 0 -90 81t-83 94v525q0 17 14 35.5t28 28.5zM400 792v-503l100 -89h293l131 339 q6 21 19.5 41t28.5 20h203q21 0 30.5 25t0.5 50t-31 25h-456h-7h-6h-5.5t-6 0.5t-5 1.5t-5 2t-4 2.5t-4 4t-2.5 4.5q-12 25 5 47l146 183l-86 83zM50 800h100q21 0 35.5 -14.5t14.5 -35.5v-500q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v500 q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe128;" d="M475 1103l366 -230q2 -1 6 -3.5t14 -10.5t18 -16.5t14.5 -20t6.5 -22.5v-525q0 -13 -86 -94t-93 -81h-342q-15 0 -28.5 20t-19.5 41l-131 339h-106q-85 0 -139.5 39t-54.5 111t54 110t138 38h302l-85 121q-11 15 -10.5 34t13.5 32l110 112q22 22 53 6zM370 945l146 -183 q17 -22 5 -47q-2 -2 -3.5 -4.5t-4 -4t-4 -2.5t-5 -2t-5 -1.5t-6 -0.5h-6h-6.5h-6h-475v-100h221q15 0 29 -20t20 -41l130 -339h294l106 89v503l-342 236zM1050 800h100q21 0 35.5 -14.5t14.5 -35.5v-500q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5 v500q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe129;" d="M550 1294q72 0 111 -55t39 -139v-106l339 -131q21 -6 41 -19.5t20 -28.5v-342q0 -7 -81 -90t-94 -83h-525q-17 0 -35.5 14t-28.5 28l-9 14l-230 363q-16 31 6 53l112 110q13 13 32 13.5t34 -11.5l121 -84v302q0 84 38 138t110 54zM600 972v203q0 21 -25 30.5t-50 0.5 t-25 -31v-456v-7v-6v-5.5t-0.5 -6t-1.5 -5t-2 -5t-2.5 -4t-4 -4t-4.5 -2.5q-25 -12 -47 5l-183 146l-83 -86l236 -339h503l89 100v293l-339 131q-21 6 -41 19.5t-20 28.5zM450 200h500q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-500 q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe130;" d="M350 1100h500q21 0 35.5 14.5t14.5 35.5v100q0 21 -14.5 35.5t-35.5 14.5h-500q-21 0 -35.5 -14.5t-14.5 -35.5v-100q0 -21 14.5 -35.5t35.5 -14.5zM600 306v-106q0 -84 -39 -139t-111 -55t-110 54t-38 138v302l-121 -84q-15 -12 -34 -11.5t-32 13.5l-112 110 q-22 22 -6 53l230 363q1 2 3.5 6t10.5 13.5t16.5 17t20 13.5t22.5 6h525q13 0 94 -83t81 -90v-342q0 -15 -20 -28.5t-41 -19.5zM308 900l-236 -339l83 -86l183 146q22 17 47 5q2 -1 4.5 -2.5t4 -4t2.5 -4t2 -5t1.5 -5t0.5 -6v-5.5v-6v-7v-456q0 -22 25 -31t50 0.5t25 30.5 v203q0 15 20 28.5t41 19.5l339 131v293l-89 100h-503z" />
<glyph unicode="&#xe131;" d="M600 1178q118 0 225 -45.5t184.5 -123t123 -184.5t45.5 -225t-45.5 -225t-123 -184.5t-184.5 -123t-225 -45.5t-225 45.5t-184.5 123t-123 184.5t-45.5 225t45.5 225t123 184.5t184.5 123t225 45.5zM914 632l-275 223q-16 13 -27.5 8t-11.5 -26v-137h-275 q-10 0 -17.5 -7.5t-7.5 -17.5v-150q0 -10 7.5 -17.5t17.5 -7.5h275v-137q0 -21 11.5 -26t27.5 8l275 223q16 13 16 32t-16 32z" />
<glyph unicode="&#xe132;" d="M600 1178q118 0 225 -45.5t184.5 -123t123 -184.5t45.5 -225t-45.5 -225t-123 -184.5t-184.5 -123t-225 -45.5t-225 45.5t-184.5 123t-123 184.5t-45.5 225t45.5 225t123 184.5t184.5 123t225 45.5zM561 855l-275 -223q-16 -13 -16 -32t16 -32l275 -223q16 -13 27.5 -8 t11.5 26v137h275q10 0 17.5 7.5t7.5 17.5v150q0 10 -7.5 17.5t-17.5 7.5h-275v137q0 21 -11.5 26t-27.5 -8z" />
<glyph unicode="&#xe133;" d="M600 1178q118 0 225 -45.5t184.5 -123t123 -184.5t45.5 -225t-45.5 -225t-123 -184.5t-184.5 -123t-225 -45.5t-225 45.5t-184.5 123t-123 184.5t-45.5 225t45.5 225t123 184.5t184.5 123t225 45.5zM855 639l-223 275q-13 16 -32 16t-32 -16l-223 -275q-13 -16 -8 -27.5 t26 -11.5h137v-275q0 -10 7.5 -17.5t17.5 -7.5h150q10 0 17.5 7.5t7.5 17.5v275h137q21 0 26 11.5t-8 27.5z" />
<glyph unicode="&#xe134;" d="M600 1178q118 0 225 -45.5t184.5 -123t123 -184.5t45.5 -225t-45.5 -225t-123 -184.5t-184.5 -123t-225 -45.5t-225 45.5t-184.5 123t-123 184.5t-45.5 225t45.5 225t123 184.5t184.5 123t225 45.5zM675 900h-150q-10 0 -17.5 -7.5t-7.5 -17.5v-275h-137q-21 0 -26 -11.5 t8 -27.5l223 -275q13 -16 32 -16t32 16l223 275q13 16 8 27.5t-26 11.5h-137v275q0 10 -7.5 17.5t-17.5 7.5z" />
<glyph unicode="&#xe135;" d="M600 1176q116 0 222.5 -46t184 -123.5t123.5 -184t46 -222.5t-46 -222.5t-123.5 -184t-184 -123.5t-222.5 -46t-222.5 46t-184 123.5t-123.5 184t-46 222.5t46 222.5t123.5 184t184 123.5t222.5 46zM627 1101q-15 -12 -36.5 -20.5t-35.5 -12t-43 -8t-39 -6.5 q-15 -3 -45.5 0t-45.5 -2q-20 -7 -51.5 -26.5t-34.5 -34.5q-3 -11 6.5 -22.5t8.5 -18.5q-3 -34 -27.5 -91t-29.5 -79q-9 -34 5 -93t8 -87q0 -9 17 -44.5t16 -59.5q12 0 23 -5t23.5 -15t19.5 -14q16 -8 33 -15t40.5 -15t34.5 -12q21 -9 52.5 -32t60 -38t57.5 -11 q7 -15 -3 -34t-22.5 -40t-9.5 -38q13 -21 23 -34.5t27.5 -27.5t36.5 -18q0 -7 -3.5 -16t-3.5 -14t5 -17q104 -2 221 112q30 29 46.5 47t34.5 49t21 63q-13 8 -37 8.5t-36 7.5q-15 7 -49.5 15t-51.5 19q-18 0 -41 -0.5t-43 -1.5t-42 -6.5t-38 -16.5q-51 -35 -66 -12 q-4 1 -3.5 25.5t0.5 25.5q-6 13 -26.5 17.5t-24.5 6.5q1 15 -0.5 30.5t-7 28t-18.5 11.5t-31 -21q-23 -25 -42 4q-19 28 -8 58q6 16 22 22q6 -1 26 -1.5t33.5 -4t19.5 -13.5q7 -12 18 -24t21.5 -20.5t20 -15t15.5 -10.5l5 -3q2 12 7.5 30.5t8 34.5t-0.5 32q-3 18 3.5 29 t18 22.5t15.5 24.5q6 14 10.5 35t8 31t15.5 22.5t34 22.5q-6 18 10 36q8 0 24 -1.5t24.5 -1.5t20 4.5t20.5 15.5q-10 23 -31 42.5t-37.5 29.5t-49 27t-43.5 23q0 1 2 8t3 11.5t1.5 10.5t-1 9.5t-4.5 4.5q31 -13 58.5 -14.5t38.5 2.5l12 5q5 28 -9.5 46t-36.5 24t-50 15 t-41 20q-18 -4 -37 0zM613 994q0 -17 8 -42t17 -45t9 -23q-8 1 -39.5 5.5t-52.5 10t-37 16.5q3 11 16 29.5t16 25.5q10 -10 19 -10t14 6t13.5 14.5t16.5 12.5z" />
<glyph unicode="&#xe136;" d="M756 1157q164 92 306 -9l-259 -138l145 -232l251 126q6 -89 -34 -156.5t-117 -110.5q-60 -34 -127 -39.5t-126 16.5l-596 -596q-15 -16 -36.5 -16t-36.5 16l-111 110q-15 15 -15 36.5t15 37.5l600 599q-34 101 5.5 201.5t135.5 154.5z" />
<glyph unicode="&#xe137;" horiz-adv-x="1220" d="M100 1196h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5v100q0 41 29.5 70.5t70.5 29.5zM1100 1096h-200v-100h200v100zM100 796h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000 q-41 0 -70.5 29.5t-29.5 70.5v100q0 41 29.5 70.5t70.5 29.5zM1100 696h-500v-100h500v100zM100 396h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5v100q0 41 29.5 70.5t70.5 29.5zM1100 296h-300v-100h300v100z " />
<glyph unicode="&#xe138;" d="M150 1200h900q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-900q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM700 500v-300l-200 -200v500l-350 500h900z" />
<glyph unicode="&#xe139;" d="M500 1200h200q41 0 70.5 -29.5t29.5 -70.5v-100h300q41 0 70.5 -29.5t29.5 -70.5v-400h-500v100h-200v-100h-500v400q0 41 29.5 70.5t70.5 29.5h300v100q0 41 29.5 70.5t70.5 29.5zM500 1100v-100h200v100h-200zM1200 400v-200q0 -41 -29.5 -70.5t-70.5 -29.5h-1000 q-41 0 -70.5 29.5t-29.5 70.5v200h1200z" />
<glyph unicode="&#xe140;" d="M50 1200h300q21 0 25 -10.5t-10 -24.5l-94 -94l199 -199q7 -8 7 -18t-7 -18l-106 -106q-8 -7 -18 -7t-18 7l-199 199l-94 -94q-14 -14 -24.5 -10t-10.5 25v300q0 21 14.5 35.5t35.5 14.5zM850 1200h300q21 0 35.5 -14.5t14.5 -35.5v-300q0 -21 -10.5 -25t-24.5 10l-94 94 l-199 -199q-8 -7 -18 -7t-18 7l-106 106q-7 8 -7 18t7 18l199 199l-94 94q-14 14 -10 24.5t25 10.5zM364 470l106 -106q7 -8 7 -18t-7 -18l-199 -199l94 -94q14 -14 10 -24.5t-25 -10.5h-300q-21 0 -35.5 14.5t-14.5 35.5v300q0 21 10.5 25t24.5 -10l94 -94l199 199 q8 7 18 7t18 -7zM1071 271l94 94q14 14 24.5 10t10.5 -25v-300q0 -21 -14.5 -35.5t-35.5 -14.5h-300q-21 0 -25 10.5t10 24.5l94 94l-199 199q-7 8 -7 18t7 18l106 106q8 7 18 7t18 -7z" />
<glyph unicode="&#xe141;" d="M596 1192q121 0 231.5 -47.5t190 -127t127 -190t47.5 -231.5t-47.5 -231.5t-127 -190.5t-190 -127t-231.5 -47t-231.5 47t-190.5 127t-127 190.5t-47 231.5t47 231.5t127 190t190.5 127t231.5 47.5zM596 1010q-112 0 -207.5 -55.5t-151 -151t-55.5 -207.5t55.5 -207.5 t151 -151t207.5 -55.5t207.5 55.5t151 151t55.5 207.5t-55.5 207.5t-151 151t-207.5 55.5zM454.5 905q22.5 0 38.5 -16t16 -38.5t-16 -39t-38.5 -16.5t-38.5 16.5t-16 39t16 38.5t38.5 16zM754.5 905q22.5 0 38.5 -16t16 -38.5t-16 -39t-38 -16.5q-14 0 -29 10l-55 -145 q17 -23 17 -51q0 -36 -25.5 -61.5t-61.5 -25.5t-61.5 25.5t-25.5 61.5q0 32 20.5 56.5t51.5 29.5l122 126l1 1q-9 14 -9 28q0 23 16 39t38.5 16zM345.5 709q22.5 0 38.5 -16t16 -38.5t-16 -38.5t-38.5 -16t-38.5 16t-16 38.5t16 38.5t38.5 16zM854.5 709q22.5 0 38.5 -16 t16 -38.5t-16 -38.5t-38.5 -16t-38.5 16t-16 38.5t16 38.5t38.5 16z" />
<glyph unicode="&#xe142;" d="M546 173l469 470q91 91 99 192q7 98 -52 175.5t-154 94.5q-22 4 -47 4q-34 0 -66.5 -10t-56.5 -23t-55.5 -38t-48 -41.5t-48.5 -47.5q-376 -375 -391 -390q-30 -27 -45 -41.5t-37.5 -41t-32 -46.5t-16 -47.5t-1.5 -56.5q9 -62 53.5 -95t99.5 -33q74 0 125 51l548 548 q36 36 20 75q-7 16 -21.5 26t-32.5 10q-26 0 -50 -23q-13 -12 -39 -38l-341 -338q-15 -15 -35.5 -15.5t-34.5 13.5t-14 34.5t14 34.5q327 333 361 367q35 35 67.5 51.5t78.5 16.5q14 0 29 -1q44 -8 74.5 -35.5t43.5 -68.5q14 -47 2 -96.5t-47 -84.5q-12 -11 -32 -32 t-79.5 -81t-114.5 -115t-124.5 -123.5t-123 -119.5t-96.5 -89t-57 -45q-56 -27 -120 -27q-70 0 -129 32t-93 89q-48 78 -35 173t81 163l511 511q71 72 111 96q91 55 198 55q80 0 152 -33q78 -36 129.5 -103t66.5 -154q17 -93 -11 -183.5t-94 -156.5l-482 -476 q-15 -15 -36 -16t-37 14t-17.5 34t14.5 35z" />
<glyph unicode="&#xe143;" d="M649 949q48 68 109.5 104t121.5 38.5t118.5 -20t102.5 -64t71 -100.5t27 -123q0 -57 -33.5 -117.5t-94 -124.5t-126.5 -127.5t-150 -152.5t-146 -174q-62 85 -145.5 174t-150 152.5t-126.5 127.5t-93.5 124.5t-33.5 117.5q0 64 28 123t73 100.5t104 64t119 20 t120.5 -38.5t104.5 -104zM896 972q-33 0 -64.5 -19t-56.5 -46t-47.5 -53.5t-43.5 -45.5t-37.5 -19t-36 19t-40 45.5t-43 53.5t-54 46t-65.5 19q-67 0 -122.5 -55.5t-55.5 -132.5q0 -23 13.5 -51t46 -65t57.5 -63t76 -75l22 -22q15 -14 44 -44t50.5 -51t46 -44t41 -35t23 -12 t23.5 12t42.5 36t46 44t52.5 52t44 43q4 4 12 13q43 41 63.5 62t52 55t46 55t26 46t11.5 44q0 79 -53 133.5t-120 54.5z" />
<glyph unicode="&#xe144;" d="M776.5 1214q93.5 0 159.5 -66l141 -141q66 -66 66 -160q0 -42 -28 -95.5t-62 -87.5l-29 -29q-31 53 -77 99l-18 18l95 95l-247 248l-389 -389l212 -212l-105 -106l-19 18l-141 141q-66 66 -66 159t66 159l283 283q65 66 158.5 66zM600 706l105 105q10 -8 19 -17l141 -141 q66 -66 66 -159t-66 -159l-283 -283q-66 -66 -159 -66t-159 66l-141 141q-66 66 -66 159.5t66 159.5l55 55q29 -55 75 -102l18 -17l-95 -95l247 -248l389 389z" />
<glyph unicode="&#xe145;" d="M603 1200q85 0 162 -15t127 -38t79 -48t29 -46v-953q0 -41 -29.5 -70.5t-70.5 -29.5h-600q-41 0 -70.5 29.5t-29.5 70.5v953q0 21 30 46.5t81 48t129 37.5t163 15zM300 1000v-700h600v700h-600zM600 254q-43 0 -73.5 -30.5t-30.5 -73.5t30.5 -73.5t73.5 -30.5t73.5 30.5 t30.5 73.5t-30.5 73.5t-73.5 30.5z" />
<glyph unicode="&#xe146;" d="M902 1185l283 -282q15 -15 15 -36t-14.5 -35.5t-35.5 -14.5t-35 15l-36 35l-279 -267v-300l-212 210l-308 -307l-280 -203l203 280l307 308l-210 212h300l267 279l-35 36q-15 14 -15 35t14.5 35.5t35.5 14.5t35 -15z" />
<glyph unicode="&#xe148;" d="M700 1248v-78q38 -5 72.5 -14.5t75.5 -31.5t71 -53.5t52 -84t24 -118.5h-159q-4 36 -10.5 59t-21 45t-40 35.5t-64.5 20.5v-307l64 -13q34 -7 64 -16.5t70 -32t67.5 -52.5t47.5 -80t20 -112q0 -139 -89 -224t-244 -97v-77h-100v79q-150 16 -237 103q-40 40 -52.5 93.5 t-15.5 139.5h139q5 -77 48.5 -126t117.5 -65v335l-27 8q-46 14 -79 26.5t-72 36t-63 52t-40 72.5t-16 98q0 70 25 126t67.5 92t94.5 57t110 27v77h100zM600 754v274q-29 -4 -50 -11t-42 -21.5t-31.5 -41.5t-10.5 -65q0 -29 7 -50.5t16.5 -34t28.5 -22.5t31.5 -14t37.5 -10 q9 -3 13 -4zM700 547v-310q22 2 42.5 6.5t45 15.5t41.5 27t29 42t12 59.5t-12.5 59.5t-38 44.5t-53 31t-66.5 24.5z" />
<glyph unicode="&#xe149;" d="M561 1197q84 0 160.5 -40t123.5 -109.5t47 -147.5h-153q0 40 -19.5 71.5t-49.5 48.5t-59.5 26t-55.5 9q-37 0 -79 -14.5t-62 -35.5q-41 -44 -41 -101q0 -26 13.5 -63t26.5 -61t37 -66q6 -9 9 -14h241v-100h-197q8 -50 -2.5 -115t-31.5 -95q-45 -62 -99 -112 q34 10 83 17.5t71 7.5q32 1 102 -16t104 -17q83 0 136 30l50 -147q-31 -19 -58 -30.5t-55 -15.5t-42 -4.5t-46 -0.5q-23 0 -76 17t-111 32.5t-96 11.5q-39 -3 -82 -16t-67 -25l-23 -11l-55 145q4 3 16 11t15.5 10.5t13 9t15.5 12t14.5 14t17.5 18.5q48 55 54 126.5 t-30 142.5h-221v100h166q-23 47 -44 104q-7 20 -12 41.5t-6 55.5t6 66.5t29.5 70.5t58.5 71q97 88 263 88z" />
<glyph unicode="&#xe150;" d="M400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM935 1184l230 -249q14 -14 10 -24.5t-25 -10.5h-150v-900h-200v900h-150q-21 0 -25 10.5t10 24.5l230 249q14 15 35 15t35 -15z" />
<glyph unicode="&#xe151;" d="M1000 700h-100v100h-100v-100h-100v500h300v-500zM400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM801 1100v-200h100v200h-100zM1000 350l-200 -250h200v-100h-300v150l200 250h-200v100h300v-150z " />
<glyph unicode="&#xe152;" d="M400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM1000 1050l-200 -250h200v-100h-300v150l200 250h-200v100h300v-150zM1000 0h-100v100h-100v-100h-100v500h300v-500zM801 400v-200h100v200h-100z " />
<glyph unicode="&#xe153;" d="M400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM1000 700h-100v400h-100v100h200v-500zM1100 0h-100v100h-200v400h300v-500zM901 400v-200h100v200h-100z" />
<glyph unicode="&#xe154;" d="M400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM1100 700h-100v100h-200v400h300v-500zM901 1100v-200h100v200h-100zM1000 0h-100v400h-100v100h200v-500z" />
<glyph unicode="&#xe155;" d="M400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM900 1000h-200v200h200v-200zM1000 700h-300v200h300v-200zM1100 400h-400v200h400v-200zM1200 100h-500v200h500v-200z" />
<glyph unicode="&#xe156;" d="M400 300h150q21 0 25 -11t-10 -25l-230 -250q-14 -15 -35 -15t-35 15l-230 250q-14 14 -10 25t25 11h150v900h200v-900zM1200 1000h-500v200h500v-200zM1100 700h-400v200h400v-200zM1000 400h-300v200h300v-200zM900 100h-200v200h200v-200z" />
<glyph unicode="&#xe157;" d="M350 1100h400q162 0 256 -93.5t94 -256.5v-400q0 -165 -93.5 -257.5t-256.5 -92.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400q0 165 92.5 257.5t257.5 92.5zM800 900h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5 v500q0 41 -29.5 70.5t-70.5 29.5z" />
<glyph unicode="&#xe158;" d="M350 1100h400q165 0 257.5 -92.5t92.5 -257.5v-400q0 -165 -92.5 -257.5t-257.5 -92.5h-400q-163 0 -256.5 92.5t-93.5 257.5v400q0 163 94 256.5t256 93.5zM800 900h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5 v500q0 41 -29.5 70.5t-70.5 29.5zM440 770l253 -190q17 -12 17 -30t-17 -30l-253 -190q-16 -12 -28 -6.5t-12 26.5v400q0 21 12 26.5t28 -6.5z" />
<glyph unicode="&#xe159;" d="M350 1100h400q163 0 256.5 -94t93.5 -256v-400q0 -165 -92.5 -257.5t-257.5 -92.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400q0 163 92.5 256.5t257.5 93.5zM800 900h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5 v500q0 41 -29.5 70.5t-70.5 29.5zM350 700h400q21 0 26.5 -12t-6.5 -28l-190 -253q-12 -17 -30 -17t-30 17l-190 253q-12 16 -6.5 28t26.5 12z" />
<glyph unicode="&#xe160;" d="M350 1100h400q165 0 257.5 -92.5t92.5 -257.5v-400q0 -163 -92.5 -256.5t-257.5 -93.5h-400q-163 0 -256.5 94t-93.5 256v400q0 165 92.5 257.5t257.5 92.5zM800 900h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5 v500q0 41 -29.5 70.5t-70.5 29.5zM580 693l190 -253q12 -16 6.5 -28t-26.5 -12h-400q-21 0 -26.5 12t6.5 28l190 253q12 17 30 17t30 -17z" />
<glyph unicode="&#xe161;" d="M550 1100h400q165 0 257.5 -92.5t92.5 -257.5v-400q0 -165 -92.5 -257.5t-257.5 -92.5h-400q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h450q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5h-450q-21 0 -35.5 14.5t-14.5 35.5v100 q0 21 14.5 35.5t35.5 14.5zM338 867l324 -284q16 -14 16 -33t-16 -33l-324 -284q-16 -14 -27 -9t-11 26v150h-250q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5h250v150q0 21 11 26t27 -9z" />
<glyph unicode="&#xe162;" d="M793 1182l9 -9q8 -10 5 -27q-3 -11 -79 -225.5t-78 -221.5l300 1q24 0 32.5 -17.5t-5.5 -35.5q-1 0 -133.5 -155t-267 -312.5t-138.5 -162.5q-12 -15 -26 -15h-9l-9 8q-9 11 -4 32q2 9 42 123.5t79 224.5l39 110h-302q-23 0 -31 19q-10 21 6 41q75 86 209.5 237.5 t228 257t98.5 111.5q9 16 25 16h9z" />
<glyph unicode="&#xe163;" d="M350 1100h400q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-450q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h450q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400 q0 165 92.5 257.5t257.5 92.5zM938 867l324 -284q16 -14 16 -33t-16 -33l-324 -284q-16 -14 -27 -9t-11 26v150h-250q-21 0 -35.5 14.5t-14.5 35.5v200q0 21 14.5 35.5t35.5 14.5h250v150q0 21 11 26t27 -9z" />
<glyph unicode="&#xe164;" d="M750 1200h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -10.5 -25t-24.5 10l-109 109l-312 -312q-15 -15 -35.5 -15t-35.5 15l-141 141q-15 15 -15 35.5t15 35.5l312 312l-109 109q-14 14 -10 24.5t25 10.5zM456 900h-156q-41 0 -70.5 -29.5t-29.5 -70.5v-500 q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v148l200 200v-298q0 -165 -93.5 -257.5t-256.5 -92.5h-400q-165 0 -257.5 92.5t-92.5 257.5v400q0 165 92.5 257.5t257.5 92.5h300z" />
<glyph unicode="&#xe165;" d="M600 1186q119 0 227.5 -46.5t187 -125t125 -187t46.5 -227.5t-46.5 -227.5t-125 -187t-187 -125t-227.5 -46.5t-227.5 46.5t-187 125t-125 187t-46.5 227.5t46.5 227.5t125 187t187 125t227.5 46.5zM600 1022q-115 0 -212 -56.5t-153.5 -153.5t-56.5 -212t56.5 -212 t153.5 -153.5t212 -56.5t212 56.5t153.5 153.5t56.5 212t-56.5 212t-153.5 153.5t-212 56.5zM600 794q80 0 137 -57t57 -137t-57 -137t-137 -57t-137 57t-57 137t57 137t137 57z" />
<glyph unicode="&#xe166;" d="M450 1200h200q21 0 35.5 -14.5t14.5 -35.5v-350h245q20 0 25 -11t-9 -26l-383 -426q-14 -15 -33.5 -15t-32.5 15l-379 426q-13 15 -8.5 26t25.5 11h250v350q0 21 14.5 35.5t35.5 14.5zM50 300h1000q21 0 35.5 -14.5t14.5 -35.5v-250h-1100v250q0 21 14.5 35.5t35.5 14.5z M900 200v-50h100v50h-100z" />
<glyph unicode="&#xe167;" d="M583 1182l378 -435q14 -15 9 -31t-26 -16h-244v-250q0 -20 -17 -35t-39 -15h-200q-20 0 -32 14.5t-12 35.5v250h-250q-20 0 -25.5 16.5t8.5 31.5l383 431q14 16 33.5 17t33.5 -14zM50 300h1000q21 0 35.5 -14.5t14.5 -35.5v-250h-1100v250q0 21 14.5 35.5t35.5 14.5z M900 200v-50h100v50h-100z" />
<glyph unicode="&#xe168;" d="M396 723l369 369q7 7 17.5 7t17.5 -7l139 -139q7 -8 7 -18.5t-7 -17.5l-525 -525q-7 -8 -17.5 -8t-17.5 8l-292 291q-7 8 -7 18t7 18l139 139q8 7 18.5 7t17.5 -7zM50 300h1000q21 0 35.5 -14.5t14.5 -35.5v-250h-1100v250q0 21 14.5 35.5t35.5 14.5zM900 200v-50h100v50 h-100z" />
<glyph unicode="&#xe169;" d="M135 1023l142 142q14 14 35 14t35 -14l77 -77l-212 -212l-77 76q-14 15 -14 36t14 35zM655 855l210 210q14 14 24.5 10t10.5 -25l-2 -599q-1 -20 -15.5 -35t-35.5 -15l-597 -1q-21 0 -25 10.5t10 24.5l208 208l-154 155l212 212zM50 300h1000q21 0 35.5 -14.5t14.5 -35.5 v-250h-1100v250q0 21 14.5 35.5t35.5 14.5zM900 200v-50h100v50h-100z" />
<glyph unicode="&#xe170;" d="M350 1200l599 -2q20 -1 35 -15.5t15 -35.5l1 -597q0 -21 -10.5 -25t-24.5 10l-208 208l-155 -154l-212 212l155 154l-210 210q-14 14 -10 24.5t25 10.5zM524 512l-76 -77q-15 -14 -36 -14t-35 14l-142 142q-14 14 -14 35t14 35l77 77zM50 300h1000q21 0 35.5 -14.5 t14.5 -35.5v-250h-1100v250q0 21 14.5 35.5t35.5 14.5zM900 200v-50h100v50h-100z" />
<glyph unicode="&#xe171;" d="M1200 103l-483 276l-314 -399v423h-399l1196 796v-1096zM483 424v-230l683 953z" />
<glyph unicode="&#xe172;" d="M1100 1000v-850q0 -21 -14.5 -35.5t-35.5 -14.5h-150v400h-700v-400h-150q-21 0 -35.5 14.5t-14.5 35.5v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100zM700 1000h-100v200h100v-200z" />
<glyph unicode="&#xe173;" d="M1100 1000l-2 -149l-299 -299l-95 95q-9 9 -21.5 9t-21.5 -9l-149 -147h-312v-400h-150q-21 0 -35.5 14.5t-14.5 35.5v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100zM700 1000h-100v200h100v-200zM1132 638l106 -106q7 -7 7 -17.5t-7 -17.5l-420 -421q-8 -7 -18 -7 t-18 7l-202 203q-8 7 -8 17.5t8 17.5l106 106q7 8 17.5 8t17.5 -8l79 -79l297 297q7 7 17.5 7t17.5 -7z" />
<glyph unicode="&#xe174;" d="M1100 1000v-269l-103 -103l-134 134q-15 15 -33.5 16.5t-34.5 -12.5l-266 -266h-329v-400h-150q-21 0 -35.5 14.5t-14.5 35.5v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100zM700 1000h-100v200h100v-200zM1202 572l70 -70q15 -15 15 -35.5t-15 -35.5l-131 -131 l131 -131q15 -15 15 -35.5t-15 -35.5l-70 -70q-15 -15 -35.5 -15t-35.5 15l-131 131l-131 -131q-15 -15 -35.5 -15t-35.5 15l-70 70q-15 15 -15 35.5t15 35.5l131 131l-131 131q-15 15 -15 35.5t15 35.5l70 70q15 15 35.5 15t35.5 -15l131 -131l131 131q15 15 35.5 15 t35.5 -15z" />
<glyph unicode="&#xe175;" d="M1100 1000v-300h-350q-21 0 -35.5 -14.5t-14.5 -35.5v-150h-500v-400h-150q-21 0 -35.5 14.5t-14.5 35.5v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100zM700 1000h-100v200h100v-200zM850 600h100q21 0 35.5 -14.5t14.5 -35.5v-250h150q21 0 25 -10.5t-10 -24.5 l-230 -230q-14 -14 -35 -14t-35 14l-230 230q-14 14 -10 24.5t25 10.5h150v250q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe176;" d="M1100 1000v-400l-165 165q-14 15 -35 15t-35 -15l-263 -265h-402v-400h-150q-21 0 -35.5 14.5t-14.5 35.5v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100zM700 1000h-100v200h100v-200zM935 565l230 -229q14 -15 10 -25.5t-25 -10.5h-150v-250q0 -20 -14.5 -35 t-35.5 -15h-100q-21 0 -35.5 15t-14.5 35v250h-150q-21 0 -25 10.5t10 25.5l230 229q14 15 35 15t35 -15z" />
<glyph unicode="&#xe177;" d="M50 1100h1100q21 0 35.5 -14.5t14.5 -35.5v-150h-1200v150q0 21 14.5 35.5t35.5 14.5zM1200 800v-550q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v550h1200zM100 500v-200h400v200h-400z" />
<glyph unicode="&#xe178;" d="M935 1165l248 -230q14 -14 14 -35t-14 -35l-248 -230q-14 -14 -24.5 -10t-10.5 25v150h-400v200h400v150q0 21 10.5 25t24.5 -10zM200 800h-50q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h50v-200zM400 800h-100v200h100v-200zM18 435l247 230 q14 14 24.5 10t10.5 -25v-150h400v-200h-400v-150q0 -21 -10.5 -25t-24.5 10l-247 230q-15 14 -15 35t15 35zM900 300h-100v200h100v-200zM1000 500h51q20 0 34.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-34.5 -14.5h-51v200z" />
<glyph unicode="&#xe179;" d="M862 1073l276 116q25 18 43.5 8t18.5 -41v-1106q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v397q-4 1 -11 5t-24 17.5t-30 29t-24 42t-11 56.5v359q0 31 18.5 65t43.5 52zM550 1200q22 0 34.5 -12.5t14.5 -24.5l1 -13v-450q0 -28 -10.5 -59.5 t-25 -56t-29 -45t-25.5 -31.5l-10 -11v-447q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v447q-4 4 -11 11.5t-24 30.5t-30 46t-24 55t-11 60v450q0 2 0.5 5.5t4 12t8.5 15t14.5 12t22.5 5.5q20 0 32.5 -12.5t14.5 -24.5l3 -13v-350h100v350v5.5t2.5 12 t7 15t15 12t25.5 5.5q23 0 35.5 -12.5t13.5 -24.5l1 -13v-350h100v350q0 2 0.5 5.5t3 12t7 15t15 12t24.5 5.5z" />
<glyph unicode="&#xe180;" d="M1200 1100v-56q-4 0 -11 -0.5t-24 -3t-30 -7.5t-24 -15t-11 -24v-888q0 -22 25 -34.5t50 -13.5l25 -2v-56h-400v56q75 0 87.5 6.5t12.5 43.5v394h-500v-394q0 -37 12.5 -43.5t87.5 -6.5v-56h-400v56q4 0 11 0.5t24 3t30 7.5t24 15t11 24v888q0 22 -25 34.5t-50 13.5 l-25 2v56h400v-56q-75 0 -87.5 -6.5t-12.5 -43.5v-394h500v394q0 37 -12.5 43.5t-87.5 6.5v56h400z" />
<glyph unicode="&#xe181;" d="M675 1000h375q21 0 35.5 -14.5t14.5 -35.5v-150h-105l-295 -98v98l-200 200h-400l100 100h375zM100 900h300q41 0 70.5 -29.5t29.5 -70.5v-500q0 -41 -29.5 -70.5t-70.5 -29.5h-300q-41 0 -70.5 29.5t-29.5 70.5v500q0 41 29.5 70.5t70.5 29.5zM100 800v-200h300v200 h-300zM1100 535l-400 -133v163l400 133v-163zM100 500v-200h300v200h-300zM1100 398v-248q0 -21 -14.5 -35.5t-35.5 -14.5h-375l-100 -100h-375l-100 100h400l200 200h105z" />
<glyph unicode="&#xe182;" d="M17 1007l162 162q17 17 40 14t37 -22l139 -194q14 -20 11 -44.5t-20 -41.5l-119 -118q102 -142 228 -268t267 -227l119 118q17 17 42.5 19t44.5 -12l192 -136q19 -14 22.5 -37.5t-13.5 -40.5l-163 -162q-3 -1 -9.5 -1t-29.5 2t-47.5 6t-62.5 14.5t-77.5 26.5t-90 42.5 t-101.5 60t-111 83t-119 108.5q-74 74 -133.5 150.5t-94.5 138.5t-60 119.5t-34.5 100t-15 74.5t-4.5 48z" />
<glyph unicode="&#xe183;" d="M600 1100q92 0 175 -10.5t141.5 -27t108.5 -36.5t81.5 -40t53.5 -37t31 -27l9 -10v-200q0 -21 -14.5 -33t-34.5 -9l-202 34q-20 3 -34.5 20t-14.5 38v146q-141 24 -300 24t-300 -24v-146q0 -21 -14.5 -38t-34.5 -20l-202 -34q-20 -3 -34.5 9t-14.5 33v200q3 4 9.5 10.5 t31 26t54 37.5t80.5 39.5t109 37.5t141 26.5t175 10.5zM600 795q56 0 97 -9.5t60 -23.5t30 -28t12 -24l1 -10v-50l365 -303q14 -15 24.5 -40t10.5 -45v-212q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v212q0 20 10.5 45t24.5 40l365 303v50 q0 4 1 10.5t12 23t30 29t60 22.5t97 10z" />
<glyph unicode="&#xe184;" d="M1100 700l-200 -200h-600l-200 200v500h200v-200h200v200h200v-200h200v200h200v-500zM250 400h700q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-12l137 -100h-950l137 100h-12q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM50 100h1100q21 0 35.5 -14.5 t14.5 -35.5v-50h-1200v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe185;" d="M700 1100h-100q-41 0 -70.5 -29.5t-29.5 -70.5v-1000h300v1000q0 41 -29.5 70.5t-70.5 29.5zM1100 800h-100q-41 0 -70.5 -29.5t-29.5 -70.5v-700h300v700q0 41 -29.5 70.5t-70.5 29.5zM400 0h-300v400q0 41 29.5 70.5t70.5 29.5h100q41 0 70.5 -29.5t29.5 -70.5v-400z " />
<glyph unicode="&#xe186;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM500 700h-200v-100h200v-300h-300v100h200v100h-200v300h300v-100zM900 700v-300l-100 -100h-200v500h200z M700 700v-300h100v300h-100z" />
<glyph unicode="&#xe187;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM500 300h-100v200h-100v-200h-100v500h100v-200h100v200h100v-500zM900 700v-300l-100 -100h-200v500h200z M700 700v-300h100v300h-100z" />
<glyph unicode="&#xe188;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM500 700h-200v-300h200v-100h-300v500h300v-100zM900 700h-200v-300h200v-100h-300v500h300v-100z" />
<glyph unicode="&#xe189;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM500 400l-300 150l300 150v-300zM900 550l-300 -150v300z" />
<glyph unicode="&#xe190;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM900 300h-700v500h700v-500zM800 700h-130q-38 0 -66.5 -43t-28.5 -108t27 -107t68 -42h130v300zM300 700v-300 h130q41 0 68 42t27 107t-28.5 108t-66.5 43h-130z" />
<glyph unicode="&#xe191;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM500 700h-200v-100h200v-300h-300v100h200v100h-200v300h300v-100zM900 300h-100v400h-100v100h200v-500z M700 300h-100v100h100v-100z" />
<glyph unicode="&#xe192;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM300 700h200v-400h-300v500h100v-100zM900 300h-100v400h-100v100h200v-500zM300 600v-200h100v200h-100z M700 300h-100v100h100v-100z" />
<glyph unicode="&#xe193;" d="M200 1100h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212v500q0 124 88 212t212 88zM100 900v-700h900v700h-900zM500 500l-199 -200h-100v50l199 200v150h-200v100h300v-300zM900 300h-100v400h-100v100h200v-500zM701 300h-100 v100h100v-100z" />
<glyph unicode="&#xe194;" d="M600 1191q120 0 229.5 -47t188.5 -126t126 -188.5t47 -229.5t-47 -229.5t-126 -188.5t-188.5 -126t-229.5 -47t-229.5 47t-188.5 126t-126 188.5t-47 229.5t47 229.5t126 188.5t188.5 126t229.5 47zM600 1021q-114 0 -211 -56.5t-153.5 -153.5t-56.5 -211t56.5 -211 t153.5 -153.5t211 -56.5t211 56.5t153.5 153.5t56.5 211t-56.5 211t-153.5 153.5t-211 56.5zM800 700h-300v-200h300v-100h-300l-100 100v200l100 100h300v-100z" />
<glyph unicode="&#xe195;" d="M600 1191q120 0 229.5 -47t188.5 -126t126 -188.5t47 -229.5t-47 -229.5t-126 -188.5t-188.5 -126t-229.5 -47t-229.5 47t-188.5 126t-126 188.5t-47 229.5t47 229.5t126 188.5t188.5 126t229.5 47zM600 1021q-114 0 -211 -56.5t-153.5 -153.5t-56.5 -211t56.5 -211 t153.5 -153.5t211 -56.5t211 56.5t153.5 153.5t56.5 211t-56.5 211t-153.5 153.5t-211 56.5zM800 700v-100l-50 -50l100 -100v-50h-100l-100 100h-150v-100h-100v400h300zM500 700v-100h200v100h-200z" />
<glyph unicode="&#xe197;" d="M503 1089q110 0 200.5 -59.5t134.5 -156.5q44 14 90 14q120 0 205 -86.5t85 -207t-85 -207t-205 -86.5h-128v250q0 21 -14.5 35.5t-35.5 14.5h-300q-21 0 -35.5 -14.5t-14.5 -35.5v-250h-222q-80 0 -136 57.5t-56 136.5q0 69 43 122.5t108 67.5q-2 19 -2 37q0 100 49 185 t134 134t185 49zM525 500h150q10 0 17.5 -7.5t7.5 -17.5v-275h137q21 0 26 -11.5t-8 -27.5l-223 -244q-13 -16 -32 -16t-32 16l-223 244q-13 16 -8 27.5t26 11.5h137v275q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe198;" d="M502 1089q110 0 201 -59.5t135 -156.5q43 15 89 15q121 0 206 -86.5t86 -206.5q0 -99 -60 -181t-150 -110l-378 360q-13 16 -31.5 16t-31.5 -16l-381 -365h-9q-79 0 -135.5 57.5t-56.5 136.5q0 69 43 122.5t108 67.5q-2 19 -2 38q0 100 49 184.5t133.5 134t184.5 49.5z M632 467l223 -228q13 -16 8 -27.5t-26 -11.5h-137v-275q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v275h-137q-21 0 -26 11.5t8 27.5q199 204 223 228q19 19 31.5 19t32.5 -19z" />
<glyph unicode="&#xe199;" d="M700 100v100h400l-270 300h170l-270 300h170l-300 333l-300 -333h170l-270 -300h170l-270 -300h400v-100h-50q-21 0 -35.5 -14.5t-14.5 -35.5v-50h400v50q0 21 -14.5 35.5t-35.5 14.5h-50z" />
<glyph unicode="&#xe200;" d="M600 1179q94 0 167.5 -56.5t99.5 -145.5q89 -6 150.5 -71.5t61.5 -155.5q0 -61 -29.5 -112.5t-79.5 -82.5q9 -29 9 -55q0 -74 -52.5 -126.5t-126.5 -52.5q-55 0 -100 30v-251q21 0 35.5 -14.5t14.5 -35.5v-50h-300v50q0 21 14.5 35.5t35.5 14.5v251q-45 -30 -100 -30 q-74 0 -126.5 52.5t-52.5 126.5q0 18 4 38q-47 21 -75.5 65t-28.5 97q0 74 52.5 126.5t126.5 52.5q5 0 23 -2q0 2 -1 10t-1 13q0 116 81.5 197.5t197.5 81.5z" />
<glyph unicode="&#xe201;" d="M1010 1010q111 -111 150.5 -260.5t0 -299t-150.5 -260.5q-83 -83 -191.5 -126.5t-218.5 -43.5t-218.5 43.5t-191.5 126.5q-111 111 -150.5 260.5t0 299t150.5 260.5q83 83 191.5 126.5t218.5 43.5t218.5 -43.5t191.5 -126.5zM476 1065q-4 0 -8 -1q-121 -34 -209.5 -122.5 t-122.5 -209.5q-4 -12 2.5 -23t18.5 -14l36 -9q3 -1 7 -1q23 0 29 22q27 96 98 166q70 71 166 98q11 3 17.5 13.5t3.5 22.5l-9 35q-3 13 -14 19q-7 4 -15 4zM512 920q-4 0 -9 -2q-80 -24 -138.5 -82.5t-82.5 -138.5q-4 -13 2 -24t19 -14l34 -9q4 -1 8 -1q22 0 28 21 q18 58 58.5 98.5t97.5 58.5q12 3 18 13.5t3 21.5l-9 35q-3 12 -14 19q-7 4 -15 4zM719.5 719.5q-49.5 49.5 -119.5 49.5t-119.5 -49.5t-49.5 -119.5t49.5 -119.5t119.5 -49.5t119.5 49.5t49.5 119.5t-49.5 119.5zM855 551q-22 0 -28 -21q-18 -58 -58.5 -98.5t-98.5 -57.5 q-11 -4 -17 -14.5t-3 -21.5l9 -35q3 -12 14 -19q7 -4 15 -4q4 0 9 2q80 24 138.5 82.5t82.5 138.5q4 13 -2.5 24t-18.5 14l-34 9q-4 1 -8 1zM1000 515q-23 0 -29 -22q-27 -96 -98 -166q-70 -71 -166 -98q-11 -3 -17.5 -13.5t-3.5 -22.5l9 -35q3 -13 14 -19q7 -4 15 -4 q4 0 8 1q121 34 209.5 122.5t122.5 209.5q4 12 -2.5 23t-18.5 14l-36 9q-3 1 -7 1z" />
<glyph unicode="&#xe202;" d="M700 800h300v-380h-180v200h-340v-200h-380v755q0 10 7.5 17.5t17.5 7.5h575v-400zM1000 900h-200v200zM700 300h162l-212 -212l-212 212h162v200h100v-200zM520 0h-395q-10 0 -17.5 7.5t-7.5 17.5v395zM1000 220v-195q0 -10 -7.5 -17.5t-17.5 -7.5h-195z" />
<glyph unicode="&#xe203;" d="M700 800h300v-520l-350 350l-550 -550v1095q0 10 7.5 17.5t17.5 7.5h575v-400zM1000 900h-200v200zM862 200h-162v-200h-100v200h-162l212 212zM480 0h-355q-10 0 -17.5 7.5t-7.5 17.5v55h380v-80zM1000 80v-55q0 -10 -7.5 -17.5t-17.5 -7.5h-155v80h180z" />
<glyph unicode="&#xe204;" d="M1162 800h-162v-200h100l100 -100h-300v300h-162l212 212zM200 800h200q27 0 40 -2t29.5 -10.5t23.5 -30t7 -57.5h300v-100h-600l-200 -350v450h100q0 36 7 57.5t23.5 30t29.5 10.5t40 2zM800 400h240l-240 -400h-800l300 500h500v-100z" />
<glyph unicode="&#xe205;" d="M650 1100h100q21 0 35.5 -14.5t14.5 -35.5v-50h50q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-300q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h50v50q0 21 14.5 35.5t35.5 14.5zM1000 850v150q41 0 70.5 -29.5t29.5 -70.5v-800 q0 -41 -29.5 -70.5t-70.5 -29.5h-600q-1 0 -20 4l246 246l-326 326v324q0 41 29.5 70.5t70.5 29.5v-150q0 -62 44 -106t106 -44h300q62 0 106 44t44 106zM412 250l-212 -212v162h-200v100h200v162z" />
<glyph unicode="&#xe206;" d="M450 1100h100q21 0 35.5 -14.5t14.5 -35.5v-50h50q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-300q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h50v50q0 21 14.5 35.5t35.5 14.5zM800 850v150q41 0 70.5 -29.5t29.5 -70.5v-500 h-200v-300h200q0 -36 -7 -57.5t-23.5 -30t-29.5 -10.5t-40 -2h-600q-41 0 -70.5 29.5t-29.5 70.5v800q0 41 29.5 70.5t70.5 29.5v-150q0 -62 44 -106t106 -44h300q62 0 106 44t44 106zM1212 250l-212 -212v162h-200v100h200v162z" />
<glyph unicode="&#xe209;" d="M658 1197l637 -1104q23 -38 7 -65.5t-60 -27.5h-1276q-44 0 -60 27.5t7 65.5l637 1104q22 39 54 39t54 -39zM704 800h-208q-20 0 -32 -14.5t-8 -34.5l58 -302q4 -20 21.5 -34.5t37.5 -14.5h54q20 0 37.5 14.5t21.5 34.5l58 302q4 20 -8 34.5t-32 14.5zM500 300v-100h200 v100h-200z" />
<glyph unicode="&#xe210;" d="M425 1100h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5zM425 800h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5 t17.5 7.5zM825 800h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5zM25 500h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150 q0 10 7.5 17.5t17.5 7.5zM425 500h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5zM825 500h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5 v150q0 10 7.5 17.5t17.5 7.5zM25 200h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5zM425 200h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5 t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5zM825 200h250q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-250q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe211;" d="M700 1200h100v-200h-100v-100h350q62 0 86.5 -39.5t-3.5 -94.5l-66 -132q-41 -83 -81 -134h-772q-40 51 -81 134l-66 132q-28 55 -3.5 94.5t86.5 39.5h350v100h-100v200h100v100h200v-100zM250 400h700q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-12l137 -100 h-950l138 100h-13q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM50 100h1100q21 0 35.5 -14.5t14.5 -35.5v-50h-1200v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe212;" d="M600 1300q40 0 68.5 -29.5t28.5 -70.5h-194q0 41 28.5 70.5t68.5 29.5zM443 1100h314q18 -37 18 -75q0 -8 -3 -25h328q41 0 44.5 -16.5t-30.5 -38.5l-175 -145h-678l-178 145q-34 22 -29 38.5t46 16.5h328q-3 17 -3 25q0 38 18 75zM250 700h700q21 0 35.5 -14.5 t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-150v-200l275 -200h-950l275 200v200h-150q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM50 100h1100q21 0 35.5 -14.5t14.5 -35.5v-50h-1200v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe213;" d="M600 1181q75 0 128 -53t53 -128t-53 -128t-128 -53t-128 53t-53 128t53 128t128 53zM602 798h46q34 0 55.5 -28.5t21.5 -86.5q0 -76 39 -183h-324q39 107 39 183q0 58 21.5 86.5t56.5 28.5h45zM250 400h700q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-13 l138 -100h-950l137 100h-12q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM50 100h1100q21 0 35.5 -14.5t14.5 -35.5v-50h-1200v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe214;" d="M600 1300q47 0 92.5 -53.5t71 -123t25.5 -123.5q0 -78 -55.5 -133.5t-133.5 -55.5t-133.5 55.5t-55.5 133.5q0 62 34 143l144 -143l111 111l-163 163q34 26 63 26zM602 798h46q34 0 55.5 -28.5t21.5 -86.5q0 -76 39 -183h-324q39 107 39 183q0 58 21.5 86.5t56.5 28.5h45 zM250 400h700q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-13l138 -100h-950l137 100h-12q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM50 100h1100q21 0 35.5 -14.5t14.5 -35.5v-50h-1200v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe215;" d="M600 1200l300 -161v-139h-300q0 -57 18.5 -108t50 -91.5t63 -72t70 -67.5t57.5 -61h-530q-60 83 -90.5 177.5t-30.5 178.5t33 164.5t87.5 139.5t126 96.5t145.5 41.5v-98zM250 400h700q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-13l138 -100h-950l137 100 h-12q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5zM50 100h1100q21 0 35.5 -14.5t14.5 -35.5v-50h-1200v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe216;" d="M600 1300q41 0 70.5 -29.5t29.5 -70.5v-78q46 -26 73 -72t27 -100v-50h-400v50q0 54 27 100t73 72v78q0 41 29.5 70.5t70.5 29.5zM400 800h400q54 0 100 -27t72 -73h-172v-100h200v-100h-200v-100h200v-100h-200v-100h200q0 -83 -58.5 -141.5t-141.5 -58.5h-400 q-83 0 -141.5 58.5t-58.5 141.5v400q0 83 58.5 141.5t141.5 58.5z" />
<glyph unicode="&#xe218;" d="M150 1100h900q21 0 35.5 -14.5t14.5 -35.5v-500q0 -21 -14.5 -35.5t-35.5 -14.5h-900q-21 0 -35.5 14.5t-14.5 35.5v500q0 21 14.5 35.5t35.5 14.5zM125 400h950q10 0 17.5 -7.5t7.5 -17.5v-50q0 -10 -7.5 -17.5t-17.5 -7.5h-283l224 -224q13 -13 13 -31.5t-13 -32 t-31.5 -13.5t-31.5 13l-88 88h-524l-87 -88q-13 -13 -32 -13t-32 13.5t-13 32t13 31.5l224 224h-289q-10 0 -17.5 7.5t-7.5 17.5v50q0 10 7.5 17.5t17.5 7.5zM541 300l-100 -100h324l-100 100h-124z" />
<glyph unicode="&#xe219;" d="M200 1100h800q83 0 141.5 -58.5t58.5 -141.5v-200h-100q0 41 -29.5 70.5t-70.5 29.5h-250q-41 0 -70.5 -29.5t-29.5 -70.5h-100q0 41 -29.5 70.5t-70.5 29.5h-250q-41 0 -70.5 -29.5t-29.5 -70.5h-100v200q0 83 58.5 141.5t141.5 58.5zM100 600h1000q41 0 70.5 -29.5 t29.5 -70.5v-300h-1200v300q0 41 29.5 70.5t70.5 29.5zM300 100v-50q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v50h200zM1100 100v-50q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v50h200z" />
<glyph unicode="&#xe221;" d="M480 1165l682 -683q31 -31 31 -75.5t-31 -75.5l-131 -131h-481l-517 518q-32 31 -32 75.5t32 75.5l295 296q31 31 75.5 31t76.5 -31zM108 794l342 -342l303 304l-341 341zM250 100h800q21 0 35.5 -14.5t14.5 -35.5v-50h-900v50q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe223;" d="M1057 647l-189 506q-8 19 -27.5 33t-40.5 14h-400q-21 0 -40.5 -14t-27.5 -33l-189 -506q-8 -19 1.5 -33t30.5 -14h625v-150q0 -21 14.5 -35.5t35.5 -14.5t35.5 14.5t14.5 35.5v150h125q21 0 30.5 14t1.5 33zM897 0h-595v50q0 21 14.5 35.5t35.5 14.5h50v50 q0 21 14.5 35.5t35.5 14.5h48v300h200v-300h47q21 0 35.5 -14.5t14.5 -35.5v-50h50q21 0 35.5 -14.5t14.5 -35.5v-50z" />
<glyph unicode="&#xe224;" d="M900 800h300v-575q0 -10 -7.5 -17.5t-17.5 -7.5h-375v591l-300 300v84q0 10 7.5 17.5t17.5 7.5h375v-400zM1200 900h-200v200zM400 600h300v-575q0 -10 -7.5 -17.5t-17.5 -7.5h-650q-10 0 -17.5 7.5t-7.5 17.5v950q0 10 7.5 17.5t17.5 7.5h375v-400zM700 700h-200v200z " />
<glyph unicode="&#xe225;" d="M484 1095h195q75 0 146 -32.5t124 -86t89.5 -122.5t48.5 -142q18 -14 35 -20q31 -10 64.5 6.5t43.5 48.5q10 34 -15 71q-19 27 -9 43q5 8 12.5 11t19 -1t23.5 -16q41 -44 39 -105q-3 -63 -46 -106.5t-104 -43.5h-62q-7 -55 -35 -117t-56 -100l-39 -234q-3 -20 -20 -34.5 t-38 -14.5h-100q-21 0 -33 14.5t-9 34.5l12 70q-49 -14 -91 -14h-195q-24 0 -65 8l-11 -64q-3 -20 -20 -34.5t-38 -14.5h-100q-21 0 -33 14.5t-9 34.5l26 157q-84 74 -128 175l-159 53q-19 7 -33 26t-14 40v50q0 21 14.5 35.5t35.5 14.5h124q11 87 56 166l-111 95 q-16 14 -12.5 23.5t24.5 9.5h203q116 101 250 101zM675 1000h-250q-10 0 -17.5 -7.5t-7.5 -17.5v-50q0 -10 7.5 -17.5t17.5 -7.5h250q10 0 17.5 7.5t7.5 17.5v50q0 10 -7.5 17.5t-17.5 7.5z" />
<glyph unicode="&#xe226;" d="M641 900l423 247q19 8 42 2.5t37 -21.5l32 -38q14 -15 12.5 -36t-17.5 -34l-139 -120h-390zM50 1100h106q67 0 103 -17t66 -71l102 -212h823q21 0 35.5 -14.5t14.5 -35.5v-50q0 -21 -14 -40t-33 -26l-737 -132q-23 -4 -40 6t-26 25q-42 67 -100 67h-300q-62 0 -106 44 t-44 106v200q0 62 44 106t106 44zM173 928h-80q-19 0 -28 -14t-9 -35v-56q0 -51 42 -51h134q16 0 21.5 8t5.5 24q0 11 -16 45t-27 51q-18 28 -43 28zM550 727q-32 0 -54.5 -22.5t-22.5 -54.5t22.5 -54.5t54.5 -22.5t54.5 22.5t22.5 54.5t-22.5 54.5t-54.5 22.5zM130 389 l152 130q18 19 34 24t31 -3.5t24.5 -17.5t25.5 -28q28 -35 50.5 -51t48.5 -13l63 5l48 -179q13 -61 -3.5 -97.5t-67.5 -79.5l-80 -69q-47 -40 -109 -35.5t-103 51.5l-130 151q-40 47 -35.5 109.5t51.5 102.5zM380 377l-102 -88q-31 -27 2 -65l37 -43q13 -15 27.5 -19.5 t31.5 6.5l61 53q19 16 14 49q-2 20 -12 56t-17 45q-11 12 -19 14t-23 -8z" />
<glyph unicode="&#xe227;" d="M625 1200h150q10 0 17.5 -7.5t7.5 -17.5v-109q79 -33 131 -87.5t53 -128.5q1 -46 -15 -84.5t-39 -61t-46 -38t-39 -21.5l-17 -6q6 0 15 -1.5t35 -9t50 -17.5t53 -30t50 -45t35.5 -64t14.5 -84q0 -59 -11.5 -105.5t-28.5 -76.5t-44 -51t-49.5 -31.5t-54.5 -16t-49.5 -6.5 t-43.5 -1v-75q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v75h-100v-75q0 -10 -7.5 -17.5t-17.5 -7.5h-150q-10 0 -17.5 7.5t-7.5 17.5v75h-175q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5h75v600h-75q-10 0 -17.5 7.5t-7.5 17.5v150 q0 10 7.5 17.5t17.5 7.5h175v75q0 10 7.5 17.5t17.5 7.5h150q10 0 17.5 -7.5t7.5 -17.5v-75h100v75q0 10 7.5 17.5t17.5 7.5zM400 900v-200h263q28 0 48.5 10.5t30 25t15 29t5.5 25.5l1 10q0 4 -0.5 11t-6 24t-15 30t-30 24t-48.5 11h-263zM400 500v-200h363q28 0 48.5 10.5 t30 25t15 29t5.5 25.5l1 10q0 4 -0.5 11t-6 24t-15 30t-30 24t-48.5 11h-363z" />
<glyph unicode="&#xe230;" d="M212 1198h780q86 0 147 -61t61 -147v-416q0 -51 -18 -142.5t-36 -157.5l-18 -66q-29 -87 -93.5 -146.5t-146.5 -59.5h-572q-82 0 -147 59t-93 147q-8 28 -20 73t-32 143.5t-20 149.5v416q0 86 61 147t147 61zM600 1045q-70 0 -132.5 -11.5t-105.5 -30.5t-78.5 -41.5 t-57 -45t-36 -41t-20.5 -30.5l-6 -12l156 -243h560l156 243q-2 5 -6 12.5t-20 29.5t-36.5 42t-57 44.5t-79 42t-105 29.5t-132.5 12zM762 703h-157l195 261z" />
<glyph unicode="&#xe231;" d="M475 1300h150q103 0 189 -86t86 -189v-500q0 -41 -42 -83t-83 -42h-450q-41 0 -83 42t-42 83v500q0 103 86 189t189 86zM700 300v-225q0 -21 -27 -48t-48 -27h-150q-21 0 -48 27t-27 48v225h300z" />
<glyph unicode="&#xe232;" d="M475 1300h96q0 -150 89.5 -239.5t239.5 -89.5v-446q0 -41 -42 -83t-83 -42h-450q-41 0 -83 42t-42 83v500q0 103 86 189t189 86zM700 300v-225q0 -21 -27 -48t-48 -27h-150q-21 0 -48 27t-27 48v225h300z" />
<glyph unicode="&#xe233;" d="M1294 767l-638 -283l-378 170l-78 -60v-224l100 -150v-199l-150 148l-150 -149v200l100 150v250q0 4 -0.5 10.5t0 9.5t1 8t3 8t6.5 6l47 40l-147 65l642 283zM1000 380l-350 -166l-350 166v147l350 -165l350 165v-147z" />
<glyph unicode="&#xe234;" d="M250 800q62 0 106 -44t44 -106t-44 -106t-106 -44t-106 44t-44 106t44 106t106 44zM650 800q62 0 106 -44t44 -106t-44 -106t-106 -44t-106 44t-44 106t44 106t106 44zM1050 800q62 0 106 -44t44 -106t-44 -106t-106 -44t-106 44t-44 106t44 106t106 44z" />
<glyph unicode="&#xe235;" d="M550 1100q62 0 106 -44t44 -106t-44 -106t-106 -44t-106 44t-44 106t44 106t106 44zM550 700q62 0 106 -44t44 -106t-44 -106t-106 -44t-106 44t-44 106t44 106t106 44zM550 300q62 0 106 -44t44 -106t-44 -106t-106 -44t-106 44t-44 106t44 106t106 44z" />
<glyph unicode="&#xe236;" d="M125 1100h950q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-950q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5zM125 700h950q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-950q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5 t17.5 7.5zM125 300h950q10 0 17.5 -7.5t7.5 -17.5v-150q0 -10 -7.5 -17.5t-17.5 -7.5h-950q-10 0 -17.5 7.5t-7.5 17.5v150q0 10 7.5 17.5t17.5 7.5z" />
<glyph unicode="&#xe237;" d="M350 1200h500q162 0 256 -93.5t94 -256.5v-500q0 -165 -93.5 -257.5t-256.5 -92.5h-500q-165 0 -257.5 92.5t-92.5 257.5v500q0 165 92.5 257.5t257.5 92.5zM900 1000h-600q-41 0 -70.5 -29.5t-29.5 -70.5v-600q0 -41 29.5 -70.5t70.5 -29.5h600q41 0 70.5 29.5 t29.5 70.5v600q0 41 -29.5 70.5t-70.5 29.5zM350 900h500q21 0 35.5 -14.5t14.5 -35.5v-300q0 -21 -14.5 -35.5t-35.5 -14.5h-500q-21 0 -35.5 14.5t-14.5 35.5v300q0 21 14.5 35.5t35.5 14.5zM400 800v-200h400v200h-400z" />
<glyph unicode="&#xe238;" d="M150 1100h1000q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-50v-200h50q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-50v-200h50q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5t-35.5 -14.5h-50v-200h50q21 0 35.5 -14.5t14.5 -35.5t-14.5 -35.5 t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5h50v200h-50q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5h50v200h-50q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5h50v200h-50q-21 0 -35.5 14.5t-14.5 35.5t14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe239;" d="M650 1187q87 -67 118.5 -156t0 -178t-118.5 -155q-87 66 -118.5 155t0 178t118.5 156zM300 800q124 0 212 -88t88 -212q-124 0 -212 88t-88 212zM1000 800q0 -124 -88 -212t-212 -88q0 124 88 212t212 88zM300 500q124 0 212 -88t88 -212q-124 0 -212 88t-88 212z M1000 500q0 -124 -88 -212t-212 -88q0 124 88 212t212 88zM700 199v-144q0 -21 -14.5 -35.5t-35.5 -14.5t-35.5 14.5t-14.5 35.5v142q40 -4 43 -4q17 0 57 6z" />
<glyph unicode="&#xe240;" d="M745 878l69 19q25 6 45 -12l298 -295q11 -11 15 -26.5t-2 -30.5q-5 -14 -18 -23.5t-28 -9.5h-8q1 0 1 -13q0 -29 -2 -56t-8.5 -62t-20 -63t-33 -53t-51 -39t-72.5 -14h-146q-184 0 -184 288q0 24 10 47q-20 4 -62 4t-63 -4q11 -24 11 -47q0 -288 -184 -288h-142 q-48 0 -84.5 21t-56 51t-32 71.5t-16 75t-3.5 68.5q0 13 2 13h-7q-15 0 -27.5 9.5t-18.5 23.5q-6 15 -2 30.5t15 25.5l298 296q20 18 46 11l76 -19q20 -5 30.5 -22.5t5.5 -37.5t-22.5 -31t-37.5 -5l-51 12l-182 -193h891l-182 193l-44 -12q-20 -5 -37.5 6t-22.5 31t6 37.5 t31 22.5z" />
<glyph unicode="&#xe241;" d="M1200 900h-50q0 21 -4 37t-9.5 26.5t-18 17.5t-22 11t-28.5 5.5t-31 2t-37 0.5h-200v-850q0 -22 25 -34.5t50 -13.5l25 -2v-100h-400v100q4 0 11 0.5t24 3t30 7t24 15t11 24.5v850h-200q-25 0 -37 -0.5t-31 -2t-28.5 -5.5t-22 -11t-18 -17.5t-9.5 -26.5t-4 -37h-50v300 h1000v-300zM500 450h-25q0 15 -4 24.5t-9 14.5t-17 7.5t-20 3t-25 0.5h-100v-425q0 -11 12.5 -17.5t25.5 -7.5h12v-50h-200v50q50 0 50 25v425h-100q-17 0 -25 -0.5t-20 -3t-17 -7.5t-9 -14.5t-4 -24.5h-25v150h500v-150z" />
<glyph unicode="&#xe242;" d="M1000 300v50q-25 0 -55 32q-14 14 -25 31t-16 27l-4 11l-289 747h-69l-300 -754q-18 -35 -39 -56q-9 -9 -24.5 -18.5t-26.5 -14.5l-11 -5v-50h273v50q-49 0 -78.5 21.5t-11.5 67.5l69 176h293l61 -166q13 -34 -3.5 -66.5t-55.5 -32.5v-50h312zM412 691l134 342l121 -342 h-255zM1100 150v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5v100q0 21 14.5 35.5t35.5 14.5h1000q21 0 35.5 -14.5t14.5 -35.5z" />
<glyph unicode="&#xe243;" d="M50 1200h1100q21 0 35.5 -14.5t14.5 -35.5v-1100q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5v1100q0 21 14.5 35.5t35.5 14.5zM611 1118h-70q-13 0 -18 -12l-299 -753q-17 -32 -35 -51q-18 -18 -56 -34q-12 -5 -12 -18v-50q0 -8 5.5 -14t14.5 -6 h273q8 0 14 6t6 14v50q0 8 -6 14t-14 6q-55 0 -71 23q-10 14 0 39l63 163h266l57 -153q11 -31 -6 -55q-12 -17 -36 -17q-8 0 -14 -6t-6 -14v-50q0 -8 6 -14t14 -6h313q8 0 14 6t6 14v50q0 7 -5.5 13t-13.5 7q-17 0 -42 25q-25 27 -40 63h-1l-288 748q-5 12 -19 12zM639 611 h-197l103 264z" />
<glyph unicode="&#xe244;" d="M1200 1100h-1200v100h1200v-100zM50 1000h400q21 0 35.5 -14.5t14.5 -35.5v-900q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v900q0 21 14.5 35.5t35.5 14.5zM650 1000h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400 q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM700 900v-300h300v300h-300z" />
<glyph unicode="&#xe245;" d="M50 1200h400q21 0 35.5 -14.5t14.5 -35.5v-900q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v900q0 21 14.5 35.5t35.5 14.5zM650 700h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v400 q0 21 14.5 35.5t35.5 14.5zM700 600v-300h300v300h-300zM1200 0h-1200v100h1200v-100z" />
<glyph unicode="&#xe246;" d="M50 1000h400q21 0 35.5 -14.5t14.5 -35.5v-350h100v150q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-150h100v-100h-100v-150q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v150h-100v-350q0 -21 -14.5 -35.5t-35.5 -14.5h-400 q-21 0 -35.5 14.5t-14.5 35.5v800q0 21 14.5 35.5t35.5 14.5zM700 700v-300h300v300h-300z" />
<glyph unicode="&#xe247;" d="M100 0h-100v1200h100v-1200zM250 1100h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM300 1000v-300h300v300h-300zM250 500h900q21 0 35.5 -14.5t14.5 -35.5v-400 q0 -21 -14.5 -35.5t-35.5 -14.5h-900q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe248;" d="M600 1100h150q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-150v-100h450q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-900q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5h350v100h-150q-21 0 -35.5 14.5 t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5h150v100h100v-100zM400 1000v-300h300v300h-300z" />
<glyph unicode="&#xe249;" d="M1200 0h-100v1200h100v-1200zM550 1100h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM600 1000v-300h300v300h-300zM50 500h900q21 0 35.5 -14.5t14.5 -35.5v-400 q0 -21 -14.5 -35.5t-35.5 -14.5h-900q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5z" />
<glyph unicode="&#xe250;" d="M865 565l-494 -494q-23 -23 -41 -23q-14 0 -22 13.5t-8 38.5v1000q0 25 8 38.5t22 13.5q18 0 41 -23l494 -494q14 -14 14 -35t-14 -35z" />
<glyph unicode="&#xe251;" d="M335 635l494 494q29 29 50 20.5t21 -49.5v-1000q0 -41 -21 -49.5t-50 20.5l-494 494q-14 14 -14 35t14 35z" />
<glyph unicode="&#xe252;" d="M100 900h1000q41 0 49.5 -21t-20.5 -50l-494 -494q-14 -14 -35 -14t-35 14l-494 494q-29 29 -20.5 50t49.5 21z" />
<glyph unicode="&#xe253;" d="M635 865l494 -494q29 -29 20.5 -50t-49.5 -21h-1000q-41 0 -49.5 21t20.5 50l494 494q14 14 35 14t35 -14z" />
<glyph unicode="&#xe254;" d="M700 741v-182l-692 -323v221l413 193l-413 193v221zM1200 0h-800v200h800v-200z" />
<glyph unicode="&#xe255;" d="M1200 900h-200v-100h200v-100h-300v300h200v100h-200v100h300v-300zM0 700h50q0 21 4 37t9.5 26.5t18 17.5t22 11t28.5 5.5t31 2t37 0.5h100v-550q0 -22 -25 -34.5t-50 -13.5l-25 -2v-100h400v100q-4 0 -11 0.5t-24 3t-30 7t-24 15t-11 24.5v550h100q25 0 37 -0.5t31 -2 t28.5 -5.5t22 -11t18 -17.5t9.5 -26.5t4 -37h50v300h-800v-300z" />
<glyph unicode="&#xe256;" d="M800 700h-50q0 21 -4 37t-9.5 26.5t-18 17.5t-22 11t-28.5 5.5t-31 2t-37 0.5h-100v-550q0 -22 25 -34.5t50 -14.5l25 -1v-100h-400v100q4 0 11 0.5t24 3t30 7t24 15t11 24.5v550h-100q-25 0 -37 -0.5t-31 -2t-28.5 -5.5t-22 -11t-18 -17.5t-9.5 -26.5t-4 -37h-50v300 h800v-300zM1100 200h-200v-100h200v-100h-300v300h200v100h-200v100h300v-300z" />
<glyph unicode="&#xe257;" d="M701 1098h160q16 0 21 -11t-7 -23l-464 -464l464 -464q12 -12 7 -23t-21 -11h-160q-13 0 -23 9l-471 471q-7 8 -7 18t7 18l471 471q10 9 23 9z" />
<glyph unicode="&#xe258;" d="M339 1098h160q13 0 23 -9l471 -471q7 -8 7 -18t-7 -18l-471 -471q-10 -9 -23 -9h-160q-16 0 -21 11t7 23l464 464l-464 464q-12 12 -7 23t21 11z" />
<glyph unicode="&#xe259;" d="M1087 882q11 -5 11 -21v-160q0 -13 -9 -23l-471 -471q-8 -7 -18 -7t-18 7l-471 471q-9 10 -9 23v160q0 16 11 21t23 -7l464 -464l464 464q12 12 23 7z" />
<glyph unicode="&#xe260;" d="M618 993l471 -471q9 -10 9 -23v-160q0 -16 -11 -21t-23 7l-464 464l-464 -464q-12 -12 -23 -7t-11 21v160q0 13 9 23l471 471q8 7 18 7t18 -7z" />
<glyph unicode="&#xf8ff;" d="M1000 1200q0 -124 -88 -212t-212 -88q0 124 88 212t212 88zM450 1000h100q21 0 40 -14t26 -33l79 -194q5 1 16 3q34 6 54 9.5t60 7t65.5 1t61 -10t56.5 -23t42.5 -42t29 -64t5 -92t-19.5 -121.5q-1 -7 -3 -19.5t-11 -50t-20.5 -73t-32.5 -81.5t-46.5 -83t-64 -70 t-82.5 -50q-13 -5 -42 -5t-65.5 2.5t-47.5 2.5q-14 0 -49.5 -3.5t-63 -3.5t-43.5 7q-57 25 -104.5 78.5t-75 111.5t-46.5 112t-26 90l-7 35q-15 63 -18 115t4.5 88.5t26 64t39.5 43.5t52 25.5t58.5 13t62.5 2t59.5 -4.5t55.5 -8l-147 192q-12 18 -5.5 30t27.5 12z" />
<glyph unicode="&#x1f511;" d="M250 1200h600q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-150v-500l-255 -178q-19 -9 -32 -1t-13 29v650h-150q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM400 1100v-100h300v100h-300z" />
<glyph unicode="&#x1f6aa;" d="M250 1200h750q39 0 69.5 -40.5t30.5 -84.5v-933l-700 -117v950l600 125h-700v-1000h-100v1025q0 23 15.5 49t34.5 26zM500 525v-100l100 20v100z" />
</font>
</defs></svg>
Side by Side

After

Width:  |  Height:  |  Size: 106 KiB

BIN
src/components/h5player/static/fonts/glyphicons-halflings-regular.ttf Normal file
View File

Binary file not shown.

Some files were not shown because too many files have changed in this diff Show More