Commit 1be4c741 by 无尘

add: 增加图标

parent 78b2ad9b
......@@ -8,8 +8,9 @@
<span class="template-title-span">员工档案设置</span>
</div>
<div class="template-btns flex-1 flex-r">
<el-button plain @click="saveAndBack('preview')">预览</el-button>
<el-button plain @click="changeRoute('/')">返 回</el-button>
<el-button type="primary" @click="saveAndBack">保存并启用</el-button>
<el-button type="primary" @click="saveAndBack('save')">保存并启用</el-button>
</div>
</div>
<!-- 模板body -->
......@@ -507,7 +508,24 @@
</div>
</div>
</div>
<div class="qr-dialog-content" style="opacity: 1;" v-show="dialogVisible">
<div class="qr-mask" @click.stop="closeDialog"></div>
<div class="qr-dialog">
<div class="qr-dialog__hd">
<strong class="qr-dialog__title">预览</strong>
<i class="el-icon-close" @click.stop="closeDialog"></i>
</div>
<div class="qr-dialog__bd">
<div id="qrcode"></div>
<div class="qr-dialog__p">请使用好办 APP 扫一扫预览</div>
</div>
<div class="qr--dialog__ft">
</div>
</div>
</div>
<!-- <vue-gic-footer></vue-gic-footer> -->
</div>
</template>
<script>
......@@ -515,6 +533,7 @@ import draggable from 'vuedraggable';
import AddInput from '@/components/templateSet/add-input';
import limitInput from '@/components/limit-input.vue';
import QRCode from 'qrcodejs2'
import allInfo from '@/components/contacts/staffInfoTemplate';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
......@@ -531,6 +550,8 @@ export default {
// right tab
rightName: 'first',
dialogVisible: false,
bodyHeight: (document.documentElement.clientHeight || document.body.clientHeight) + 'px',
// option
......@@ -749,6 +770,10 @@ export default {
// 已经选择的字段集合
setList: [],
// 二维码
qrcodeCase: '', // 二维码实例
qrcodeNum: '',
}
},
created() {
......@@ -920,7 +945,7 @@ export default {
*/
addItem(evt) {
const that = this;
console.log("中间add:",evt,that.tempaletDataList)
// console.log("中间add:",evt,that.tempaletDataList)
},
/**
......@@ -928,7 +953,7 @@ export default {
*/
addDragItem(evt) {
const that = this;
console.log("中间 child-add:",evt,that.tempaletDataList)
// console.log("中间 child-add:",evt,that.tempaletDataList)
return false;
},
......@@ -937,12 +962,12 @@ export default {
*/
selectChildItem(key,index,ind,list) {
const that = this
console.log(key,index,ind,list)
// console.log(key,index,ind,list)
that.currentIndex = null;
that.currentChildKey = key
that.childIndex = index
that.currentChildIndex = ind;
console.log(that.tempaletDataList)
// console.log(that.tempaletDataList)
},
/**
......@@ -950,7 +975,7 @@ export default {
*/
deleteChildItem(key,index,ind,list,childItem) {
const that = this
console.log(key,index,ind,list)
// console.log(key,index,ind,list)
that.childIndex = index
that.currentIndex = null;
that.currentChildKey = that.tempaletDataList[index].children[ind].fieldCode;
......@@ -963,7 +988,7 @@ export default {
that.tempaletDataList[index].children.splice(ind,1)
// 重新设置左侧的 fixed
console.log(childItem.parentCode)
// console.log(childItem.parentCode)
that[childItem.parentCode].forEach(function(ele,index){
if (ele.fieldCode === key) {
ele.fixed = false;
......@@ -985,12 +1010,12 @@ export default {
*/
delChildItem(index,ind,item) {
const that = this
console.log(index,ind,item)
// console.log(index,ind,item)
item.fieldOperations.fieldContent.splice(ind,1)
},
addChildItem(index,ind,item) {
const that = this
console.log(index,ind,item)
// console.log(index,ind,item)
// 多选
if (ind == 19) {
......@@ -1093,7 +1118,7 @@ export default {
/**
* 保存
*/
saveAndBack() {
saveAndBack(opt) {
const that = this
let data = JSON.parse(JSON.stringify(that.tempaletDataList))
let tagObj = that.checkTag(data)
......@@ -1148,8 +1173,12 @@ export default {
// })
// console.log(JSON.stringify(data))
if (opt === 'save') {
that.saveAllData(data)
}else {
that.postPreview(data)
}
that.saveAllData(data)
},
/**
......@@ -1183,10 +1212,72 @@ export default {
},
/**
* 获取所有系统模板信息---api
* 预览---api
*/
postPreview(data) {
const that = this;
let para = {
templateContent: JSON.stringify(data)
}
postRequest('/haoban-manage-web/record/record-template-preview.json',para)
.then((res) => {
// console.log(res.data)
let resData = res.data
if (resData.errorCode == 1) {
// 生成二维码需要的 url
let webUrl= `${window.location.origin}/${resData.result}`;
that.qrcode(webUrl)
that.dialogVisible = true;
return;
}
errMsg.errorMsg(resData)
})
.catch(function (error) {
// console.log(error);
that.$message.error({
duration: 1000,
message: error.message
})
});
},
/**
* 生成二维码
*/
qrcode (text) {
const that = this;
if (!!that.qrcodeCase) {
document.getElementById("qrcode").innerHTML = '';
that.qrcodeCase.clear(); // 先清除原有的
}
that.qrcodeCase = new QRCode('qrcode',
{
width: 210,
height: 210, // 高度
text: text, // 二维码内容 //
//render: 'canvas', // 设置渲染方式(有两种方式 table和canvas,默认是canvas) //
//background: '#f0f',
//foreground: '#ff0'
}
)
console.log(that.qrcodeCase)
},
/**
* 关闭预览窗口
*/
closeDialog() {
const that = this;
that.dialogVisible = false;
},
/**
* 获取所有字段
*/
getAllFields() {
const that = this
const that = this;
postRequest('/haoban-manage-web/record/employee-find-system-template.json',{})
.then((res) => {
// console.log(res.data)
......@@ -1311,7 +1402,7 @@ export default {
that.setList.push(ele.fieldCode)
}
})
// console.log(JSON.stringify(that.treeData(data)))
that.tempaletDataList = that.treeData(data)
that.setFixed();
},
......@@ -1381,6 +1472,83 @@ export default {
margin: 0 auto;
}
.qr-mask {
position: fixed;
z-index: 1000;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(0, 0, 0, .6);
cursor: pointer;
}
.qr-dialog {
position: fixed;
z-index: 5000;
width: 80%;
max-width: 300px;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #fff;
text-align: center;
border-radius: 3px;
overflow: hidden;
.qr-dialog__hd {
position: relative;
.qr-dialog__title {
display: block;
padding: 32px 0;
font-size: 18px;
color: #303133;
}
i {
position: absolute;
top: 0;
right: 0;
display: block;
width: 46px;
height: 46px;
line-height: 46px;
text-align: center;
font-size: 10px;
color: #9b9da3;
cursor: pointer;
}
}
.qr-dialog__bd {
padding: 0 1.6em 0.8em;
min-height: 40px;
font-size: 15px;
line-height: 1.3;
word-wrap: break-word;
word-break: break-all;
color: #808080;
#qrcode {
display: -webkit-flex;
display: flex;
justify-content: center;
align-items: center;
}
.qr-dialog__p {
padding: 20px 0;
font-size: 14px;
color: #606266;
}
}
.qr-dialog__ft {
}
}
.template-head {
display: -webkit-box;
display: -webkit-flex;
......
......@@ -2,18 +2,32 @@
<div class="review-wrap">
<!-- 公共头部菜单插件 -->
<vue-office-header :projectName="projectName" @collapseTag="collapseTag" @toRouterView="toRouterView"></vue-office-header>
<div class="review-wrap__body">
<div class="setting-wrap__body">
<div id="content" class="content">
<div class="content-body" :style="{height: contentHeight}">
<div class="left-menu" :style="{height: contentHeight}">
<vue-office-aside ref="asideMenu" :projectName="projectName" :collapseFlag="collapseFlag"></vue-office-aside>
</div>
<transition name="fade" mode="out-in">
<!-- 缓存已经填好内容的页面 -->
<!-- <keep-alive include="editGroupGrade"> -->
<router-view></router-view>
<!-- </keep-alive > -->
</transition>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "review",
name: "reviewed",
data() {
return {
projectName: 'gic-clique', // 当前项目名
collapseFlag: false, // 折叠参数
contentHeight: '0px', //页面内容高度
}
},
computed: {
......@@ -43,11 +57,45 @@ export default {
},
},
mounted() {
const that = this
that.contentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 64 +'px';
},
}
</script>
<style lang="less" scoped>
.setting-wrap__body{
.content{
padding-top: 64px;
/* height: calc(100% - 64px);
overflow-y: auto;*/
min-width: 1400px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.content-body {
display: flex;
overflow: hidden;
.common-set-wrap {
position: relative;
width: 100%;
height: 100%;
overflow-y: auto;
.right-content {
/*width: 100%;*/
padding: 24px;
min-height: calc(100% - 240px);
.right-box {
background: #fff;
padding: 24px;
}
}
}
}
}
}
</style>
<template>
<div class="reviewed-wrap">
<div class="reviewed-wrap common-set-wrap">
<nav-crumb :navpath="navpath"></nav-crumb>
<div class="right-content">
<div class="right-box">
<div class="reviewed-body-head">
<el-select v-model="filterValue" placeholder="全部状态" @change="getTableList">
<el-option
v-for="item in filterOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-input
placeholder="请输入提交人姓名或门店名称"
prefix-icon="el-icon-search"
v-model="searchValue">
</el-input>
</div>
<div class="reviewed-body-content">
<el-table
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
label="审核事项">
<template slot-scope="scope">
{{ scope.row.auditingType == 0? '门店信息变更': scope.row.auditingType == 0? '新增成员': '成员离职'}}
</template>
</el-table-column>
<el-table-column
label="提交人"
show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
label="详情"
show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
prop="address"
label="提交时间"
show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
label="操作"
width="100">
<template slot-scope="scope">
<el-button @click="handleClick(scope.$index,scope.row)" type="text" size="small">同意</el-button>
<el-button @click="handleClick(scope.$index,scope.row,'refuse')" type="text" size="small">拒绝</el-button>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right" v-if="tableData.length!=0">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import strLength from '@/common/js/strlen';
import { _debounce } from "@/common/js/public";
import { getRequest, postRequest, postJson, postForm } from '@/api/api';
export default {
name: "reviewed",
data() {
return {
// 面包屑参数
navpath: [
{
name: '首页',
path: '/index',
relocation: true
},
{
name: '审核中心',
path: '/unreview'
},
{
name: '已审核',
path: ''
}
],
filterValue: '',
filterOptions: [
{
label: '待审核',
value: '0'
},
{
label: '已同意',
value: '1'
},
{
label: '已拒绝',
value: '2'
}
],
searchValue: '', // 搜索
tableData: [
{
enterpriseAuditingId: 1,
auditingType: 0,// 审核类型(0:门店信息变更,1:新增成员,2:成员离职)
detail: '',
relationId: 112,
applyId: '12223233',
applyName: '测试',
headPic: '',
storeName: '测试',
refuseReason: '111111',
auditingStatus: 0, //审核状态 (0:待审核 ,1: 已同意,2:已拒绝)
beforeContent: '',
afterContent: '',
createTime: '2018-12-09 14:34:56'
}
],
multipleSelection: [],
// 分页参数
currentPage: 1,
pageSize: 20,
total: 0,
}
},
computed: {
},
methods: {
/**
* 表格---多选
*/
handleSelectionChange(val) {
const that = this
that.multipleSelection = val;
},
/**
* 分页---页码变化
*/
handleSizeChange(val) {
const that = this
// console.log(`每页 ${val} 条`);
that.pageSize = val;
that.getTableList();
},
/**
* 分页---当前页变化
*/
handleCurrentChange(val) {
const that = this
// console.log(`当前页: ${val}`);
that.currentPage = val;
let fullPath = that.$route.fullPath;
that.getTableList();
},
/**
* 获取列表数据
*/
getTableList(val) {
const that = this
const para = {
auditingType: '',
auditingStatus: that.filterValue,
search: that.searchValue || '', // 搜索字段
curPage: that.currentPage, // 当前页
pageSize: that.pageSize, // 一页显示个数
}
getRequest('/haoban-manage-web/audit/auditing-list.json',para)
.then((res) => {
// console.log(res,res.data,res.data.errorCode)
var resData = res.data
if (resData.errorCode == 1) {
that.tableData = resData.result.list;
that.total = resData.result.total;
return;
}
errMsg.errorMsg(resData)
})
.catch(function (error) {
console.log(error);
that.$message.error({
duration: 1000,
message: error.message
})
});
},
},
mounted() {
},
components: {
navCrumb
}
}
</script>
<style lang="less" scoped>
.right-content {
/*width: 100%;*/
padding: 24px;
min-height: calc(100% - 240px);
.right-box {
background: #fff;
min-height: 500px;
padding: 24px;
.w-280 {
width: 280px;
}
.w-514 {
width: 514px;
}
.m-l-20 {
margin-left: 20px;
}
.m-t-45 {
margin-top: 45px;
}
.v-align-b {
vertical-align: bottom;
}
.text-center {
text-align: center;
}
}
}
</style>
<template>
<div class="unreview-wrap">
<div class="unreview-wrap common-set-wrap">
<nav-crumb :navpath="navpath"></nav-crumb>
<div class="right-content">
<div class="right-box">
<div class="reviewed-body-head">
<el-select v-model="filterValue" placeholder="全部事项" @change="getTableList">
<el-option
v-for="item in filterOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-button type="primary">批量同意</el-button>
</div>
<div class="reviewed-body-content">
<el-table
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
label="审核事项">
<template slot-scope="scope">
{{ scope.row.auditingType == 0? '门店信息变更': scope.row.auditingType == 0? '新增成员': '成员离职'}}
</template>
</el-table-column>
<el-table-column
label="提交人"
show-overflow-tooltip>
<template slot-scope="scope">
<el-popover
placement="top-start"
width="400"
height="180"
trigger="hover"
@show="showSingleInfo(scope.row.applyId)">
<div slot="reference">
<div class="flex">
<img :src="scope.row.headPic" alt="">
<div class="flex flex-column">
<span>{{scope.row.applyName}}</span>
<span>{{scope.row.storeName}}</span>
</div>
</div>
</div>
</el-popover>
</template>
</el-table-column>
<el-table-column
label="详情"
show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
prop="address"
label="提交时间"
show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
label="操作"
width="100">
<template slot-scope="scope">
<el-button @click="handleClick(scope.$index,scope.row)" type="text" size="small">同意</el-button>
<el-button @click="handleClick(scope.$index,scope.row,'refuse')" type="text" size="small">拒绝</el-button>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right" v-if="tableData.length!=0">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import strLength from '@/common/js/strlen';
import { _debounce } from "@/common/js/public";
import { getRequest, postRequest, postJson, postForm } from '@/api/api';
export default {
name: "unreview",
data() {
return {
// 面包屑参数
navpath: [
{
name: '首页',
path: '/index',
relocation: true
},
{
name: '审核中心',
path: '/unreview'
},
{
name: '待审核',
path: ''
}
],
filterValue: '',
filterOptions: [
{
label: '门店信息变更',
value: '0'
},
{
label: '新增成员',
value: '1'
},
{
label: '成员离职',
value: '2'
}
],
tableData: [
{
enterpriseAuditingId: 1,
auditingType: 0,//审核类型(0:门店信息变更,1:新增成员,2:成员离职)
detail: '',
relationId: 112,
applyId: '12223233',
applyName: '测试',
headPic: '',
storeName: '测试门店',
refuseReason: '111111',
auditingStatus: 0, //审核状态 (0:待审核 ,1: 已同意,2:已拒绝)
beforeContent: '',
afterContent: '',
createTime: '2018-12-09 14:34:56'
}
],
multipleSelection: [],
// 分页参数
currentPage: 1,
pageSize: 20,
total: 0,
}
},
computed: {
},
methods: {
/**
* 表格---多选
*/
handleSelectionChange(val) {
const that = this
that.multipleSelection = val;
},
/**
* 分页---页码变化
*/
handleSizeChange(val) {
const that = this
// console.log(`每页 ${val} 条`);
that.pageSize = val;
that.getTableList();
},
/**
* 分页---当前页变化
*/
handleCurrentChange(val) {
const that = this
// console.log(`当前页: ${val}`);
that.currentPage = val;
let fullPath = that.$route.fullPath;
that.getTableList();
},
/**
* 获取头像处显示信息
*/
showSingleInfo(memberId) {
const that = this
},
/**
* 获取列表数据
*/
getTableList(val) {
const that = this
const para = {
auditingType: that.filterValue,
auditingStatus: '',
search: '', // 搜索字段
curPage: that.currentPage, // 当前页
pageSize: that.pageSize, // 一页显示个数
}
getRequest('/haoban-manage-web/audit/auditing-list.json',para)
.then((res) => {
// console.log(res,res.data,res.data.errorCode)
var resData = res.data
if (resData.errorCode == 1) {
that.tableData = resData.result.list;
that.total = resData.result.total;
return;
}
errMsg.errorMsg(resData)
})
.catch(function (error) {
console.log(error);
that.$message.error({
duration: 1000,
message: error.message
})
});
},
},
mounted() {
},
components: {
navCrumb
}
}
</script>
<style lang="less" scoped>
/* flex */
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.flex-1 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.flex-column {
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
}
.flex-row {
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
}
.flex-align-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.flex-pack-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.flex-wrap {
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
}
.right-content {
/*width: 100%;*/
padding: 24px;
min-height: calc(100% - 240px);
.right-box {
background: #fff;
min-height: 500px;
padding: 24px;
.w-280 {
width: 280px;
}
.w-514 {
width: 514px;
}
.m-l-20 {
margin-left: 20px;
}
.m-t-45 {
margin-top: 45px;
}
.v-align-b {
vertical-align: bottom;
}
.text-center {
text-align: center;
}
}
}
</style>
......@@ -270,6 +270,12 @@
<div class="fontclass">.icon-xinxixianshi</div>
</li>
<li>
<i class="icon iconfont icon-yewuduanmorentouxian"></i>
<div class="name">morentouxian</div>
<div class="fontclass">.icon-yewuduanmorentouxian</div>
</li>
</ul>
<h2 id="font-class-">font-class引用</h2>
......
......@@ -371,6 +371,14 @@
<div class="fontclass">#icon-xinxixianshi</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yewuduanmorentouxian"></use>
</svg>
<div class="name">morentouxian</div>
<div class="fontclass">#icon-yewuduanmorentouxian</div>
</li>
</ul>
......
......@@ -290,6 +290,12 @@
<div class="code">&amp;#xe74f;</div>
</li>
<li>
<i class="icon iconfont">&#xe7a3;</i>
<div class="name">morentouxian</div>
<div class="code">&amp;#xe7a3;</div>
</li>
</ul>
<h2 id="unicode-">unicode引用</h2>
<hr>
......
No preview for this file type
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -149,6 +149,9 @@ Created by iconfont
<glyph glyph-name="xinxixianshi" unicode="&#59215;" d="M486.4 477.696h68.096V128H486.4V477.696zM512-42.496c239.104 0 426.496 187.904 426.496 426.496S751.104 810.496 512 810.496 85.504 623.104 85.504 384s187.392-426.496 426.496-426.496z m0-85.504C230.4-128 0 102.4 0 384S230.4 896 512 896s512-230.4 512-512-230.4-512-512-512zM520.704 568.32m-51.2 0a51.2 51.2 0 1 1 102.4 0 51.2 51.2 0 1 1-102.4 0Z" horiz-adv-x="1024" />
<glyph glyph-name="yewuduanmorentouxian" unicode="&#59299;" d="M506.368 365.056c146.944 0 266.24 117.76 266.24 262.656s-119.296 262.656-266.24 262.656-266.24-117.76-266.24-262.656 119.296-262.656 266.24-262.656z m105.984-46.592h-199.68c-185.344 0-335.872-148.48-335.872-331.264v-19.968C76.8-128 225.28-128 412.672-128h199.168c180.224 0 335.872 0 335.872 95.232v19.968c0.512 182.272-150.528 331.264-335.36 331.264z" horiz-adv-x="1024" />
</font>
......
No preview for this file type
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment