# Conflicts:
#	src/views/login/components/Forget.vue
#	src/views/login/components/Login.vue
#	src/views/login/index.vue
bak
elseif 1 year ago
commit e803af9e6e

@ -42,3 +42,14 @@ export async function forgetPassword(params: any) {
params,
})
}
/**
*
*/
export async function updateSUser(params: any) {
return http.request({
url: `/ocr/sUser/updateSUser`,
method: 'post',
params,
})
}

@ -1,11 +1,10 @@
import { http } from '@/utils/http/axios'
import type { PageParam, PictureSortParam, SetTFParam } from '/#/api'
/**
*
* @returns
*/
export async function getMessageList(params: PageParam) {
export async function getMessageList(params) {
const res = await http.request({
url: `/ocr/msg/systemPage`,
method: 'get',
@ -14,3 +13,45 @@ export async function getMessageList(params: PageParam) {
return res
}
/**
*
* @returns
*/
export async function msgOne(params) {
const res = await http.request({
url: `/ocr/msg/msgOne`,
method: 'get',
params,
})
return res
}
/**
*
* @returns
*/
export async function readMsg(params) {
const res = await http.request({
url: `/ocr/msg/eliminateUnreadone`,
method: 'post',
params,
})
return res
}
/**
*
* @returns
*/
export async function readAllMsg(params) {
const res = await http.request({
url: `/ocr/msg/eliminateUnreadfull`,
method: 'post',
params,
})
return res
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 494 B

@ -1,17 +1,17 @@
<script lang="ts">
import { useUser } from "@/store/modules/user";
import { getImgUrl } from "@/utils/urlUtils";
import { useDialog, useMessage } from "naive-ui";
import { defineComponent, reactive, ref, toRefs, unref, watch } from "vue";
import { useRoute, useRouter } from "vue-router";
import QuillModal from "./QuillModal.vue";
import RecycleModal from "./RecycleModal.vue";
import SearchModal from "./SearchModal.vue";
import ShortcutModal from "./ShortcutModal.vue";
import UserSettings from "./UserSettings.vue";
import { useDialog, useMessage } from 'naive-ui'
import { defineComponent, reactive, ref, toRefs, unref, watch } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import QuillModal from './QuillModal.vue'
import RecycleModal from './RecycleModal.vue'
import SearchModal from './SearchModal.vue'
import ShortcutModal from './ShortcutModal.vue'
import UserSettings from './UserSettings.vue'
import { getImgUrl } from '@/utils/urlUtils'
import { useUser } from '@/store/modules/user'
export default defineComponent({
name: "PageHeader",
name: 'PageHeader',
components: {
UserSettings,
QuillModal,
@ -27,108 +27,112 @@ export default defineComponent({
type: Boolean,
},
},
emits: ["update:collapsed"],
emits: ['update:collapsed'],
setup() {
const message = useMessage();
const dialog = useDialog();
const message = useMessage()
const dialog = useDialog()
const userStore = useUser();
const useInfo = userStore.getUserInfo;
const userStore = useUser()
const useInfo = userStore.getUserInfo
const name = "";
const name = ''
const state = reactive({
username: name ?? "",
fullscreenIcon: "FullscreenOutlined",
});
username: name ?? '',
fullscreenIcon: 'FullscreenOutlined',
})
const router = useRouter();
const route = useRoute();
const routename = ref(route.meta.title);
const router = useRouter()
const route = useRoute()
const routename = ref(route.meta.title)
watch(
() => route.fullPath,
() => {
routename.value = route.meta.title;
}
);
routename.value = route.meta.title
},
)
const dropdownSelect = (key) => {
router.push({ name: key });
};
router.push({ name: key })
}
// 退
const doLogout = () => {
dialog.info({
title: "提示",
content: "您确定要退出登录吗",
positiveText: "确定",
negativeText: "取消",
title: '提示',
content: '您确定要退出登录吗',
positiveText: '确定',
negativeText: '取消',
onPositiveClick: () => {
userStore.logout().then(() => {
message.success("成功退出登录");
message.success('成功退出登录')
router
.replace({
name: "Login",
name: 'Login',
query: {
redirect: route.fullPath,
},
})
.finally(() => location.reload());
});
.finally(() => location.reload())
})
},
onNegativeClick: () => {},
});
};
})
}
const quillModalRef = ref(null);
const shortcutModal = ref(null);
const recycleModalRef = ref(null);
const SearchModalRef = ref(null);
const quillModalRef = ref(null)
const shortcutModal = ref(null)
const recycleModalRef = ref(null)
const SearchModalRef = ref(null)
function quillHandler() {
const modal = unref(quillModalRef)! as any;
modal.showModal();
const modal = unref(quillModalRef)! as any
modal.showModal()
}
function shortcutHandler() {
const modal = unref(shortcutModal)! as any;
modal.showModal();
const modal = unref(shortcutModal)! as any
modal.showModal()
}
function recycleHandler() {
const modal = unref(recycleModalRef)! as any;
modal.showModal();
const modal = unref(recycleModalRef)! as any
modal.showModal()
}
function searchHandler() {
const modal = unref(SearchModalRef)! as any;
modal.showModal();
const modal = unref(SearchModalRef)! as any
modal.showModal()
}
function goMessage() {
router.push({ name: 'message-main' })
}
//
const iconList = [
{
icon: "magnifying-1",
icon: 'magnifying-1',
handle: searchHandler,
},
{
icon: "shortcut-keys",
icon: 'shortcut-keys',
handle: shortcutHandler,
},
{
icon: "suspicious-folder",
icon: 'suspicious-folder',
handle: recycleHandler,
},
{
icon: "memo",
icon: 'memo',
handle: quillHandler,
},
{
icon: "newmessage",
handle: shortcutHandler,
icon: 'newmessage',
handle: goMessage,
},
];
]
return {
...toRefs(state),
@ -146,9 +150,9 @@ export default defineComponent({
recycleHandler,
useInfo,
getImgUrl,
};
}
},
});
})
</script>
<template>

@ -23,8 +23,9 @@ const routes: Array<RouteRecordRaw> = [
permissions: ['worksheet-main'],
svgname: 'worksheet',
svgsize: 22,
sort: 2,
sort: 5,
disabled: true,
hidden: true,
},
children: [
{

@ -1,13 +1,7 @@
<script lang="ts" setup>
import { computed, reactive, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { reactive, ref } from 'vue'
import { useMessage } from 'naive-ui'
// import captcha from './captcha.vue'
import { PageEnum } from '@/enums/pageEnum'
import { useUserStore } from '@/store/modules/user'
import { ResultEnum } from '@/enums/httpEnum'
import { forgetPassword, getCode } from '@/api/login/login'
import { forgetPassword, getCode, updateSUser } from '@/api/login/login'
const emit = defineEmits(['close', 'forget'])
interface FormState {
@ -24,36 +18,46 @@ interface FormForget {
phonecode: string
}
interface FormSure {
newPassword: string
rePasswrod: string
loginname: string
}
const formRef = ref()
const formRefSure = ref()
const message = useMessage()
const loading = ref(false)
const autoLogin = ref(true)
const LOGIN_NAME = PageEnum.BASE_LOGIN_NAME
const userStore = useUserStore()
const router = useRouter()
const route = useRoute()
const show = ref(false)
const flag = ref(false)
const flag = ref(true)
const formForget: FormForget = reactive({
agentcode: '三方系统标识8',
loginname: '13311111111',
phone: '13311111111',
phonecode: '',
})
const formInline: FormState = reactive({
enterprisecode: '三方系统标识8',
username: '13311111111',
password: '123456',
captcha: '',
})
const formSure: FormSure = reactive({
newPassword: '',
rePasswrod: '',
loginname: '13311111111',
})
const tab = ref(0)
const countTime = ref('获取验证码')
const rules = {
enterprisecode: { required: true, message: '请输入企业编码', trigger: 'blur' },
loginname: { required: true, message: '请输入用户名', trigger: 'blur' },
password: { required: true, message: '请输入密码', trigger: 'blur' },
captcha: { required: true, message: '请输入验证码', trigger: 'blur' },
reenteredPassword: [
phonecode: { required: true, message: '请输入验证码', trigger: 'blur' },
newPassword: { required: true, message: '请输入新密码', trigger: 'blur' },
rePasswrod: [
{
required: true,
message: '请再次输入密码',
@ -68,7 +72,7 @@ const rules = {
}
function validatePasswordSame(rule: any, value: string): boolean {
return value === formInline.password
return value === formSure.newPassword
}
function handleSubmit(e) {
@ -76,7 +80,6 @@ function handleSubmit(e) {
formRef.value.validate(async (errors) => {
if (!errors) {
const { loginname, phone, phonecode, agentcode } = formForget
message.loading('登录中...')
loading.value = true
const params = {
@ -88,27 +91,48 @@ function handleSubmit(e) {
try {
const res = await forgetPassword(params)
const { code, message: msg } = await userStore.login(params)
await userStore.getInformation()
message.destroyAll()
if (code === ResultEnum.SUCCESS) {
const toPath = decodeURIComponent((route.query?.redirect || '/') as string)
message.success('登录成功,即将进入系统')
if (route.name === LOGIN_NAME)
router.replace('/')
else router.replace(toPath)
if (res.code === 'OK') {
formSure.loginname = res.data.loginname
tab.value = 1
}
}
finally {
loading.value = false
}
}
else {
message.info(msg || '登录失败')
message.error('请填写完整信息')
}
})
}
function handleSure(e) {
e.preventDefault()
formRefSure.value.validate(async (errors) => {
if (!errors) {
const { newPassword, rePasswrod, loginname } = formSure
loading.value = true
const params = {
newPassword,
rePasswrod,
loginname,
}
try {
const res = await updateSUser(params)
if (res.code === 'OK')
message.success('修改成功')
else
message.error(res.message)
}
finally {
loading.value = false
}
}
else {
message.error('请填写完整信息,并且进行验证码校验')
message.error('请填写完整信息')
}
})
}
@ -125,7 +149,13 @@ function computedForm() {
return !formInline.enterprisecode || !formInline.username || !formInline.password
}
function computedFormSure() {
return !formSure.newPassword || !formSure.rePasswrod
}
async function sendCode(value) {
if (!flag.value)
return
flag.value = false
const res = await getCode({
phone: 13311111111,
agentcode: '三方系统标识8',
@ -141,7 +171,7 @@ function startCount() {
if (time === 0) {
clearInterval(timer)
countTime.value = '获取验证码'
flag.value = false
flag.value = true
}
}, 1000)
}
@ -205,23 +235,23 @@ function forget() {
</n-form>
</div>
<div v-if="tab === 1" class="form-1">
<n-form ref="formRef" label-placement="left" size="large" :model="formInline" :rules="rules">
<n-form-item class="form-item" path="password">
<n-input v-model:value="formInline.password" class="item-input" type="password" show-password-on="click" placeholder="请输入8-16位密码必须包含英文及数字">
<n-form ref="formRefSure" label-placement="left" size="large" :model="formSure" :rules="rules">
<n-form-item class="form-item" path="newPassword">
<n-input v-model:value="formSure.newPassword" class="item-input" type="password" show-password-on="click" placeholder="请输入8-16位密码必须包含英文及数字">
<template #prefix>
<svg-icon size="20" name="password" />
</template>
</n-input>
</n-form-item>
<n-form-item class="form-item" path="password">
<n-input v-model:value="formInline.password" class="item-input" type="password" show-password-on="click" placeholder="请再次确认输入新密码">
<n-form-item class="form-item" path="rePasswrod">
<n-input v-model:value="formSure.rePasswrod" class="item-input" type="password" show-password-on="click" placeholder="请再次确认输入新密码">
<template #prefix>
<svg-icon size="20" name="password" />
</template>
</n-input>
</n-form-item>
<n-form-item class="form-item">
<n-button :class="{ 'btn-disabled': computedForm() }" class="btn" type="primary" size="large" :loading="loading" block @click="handleSubmit">
<n-button :class="{ 'btn-disabled': computedFormSure() }" class="btn" type="primary" size="large" :loading="loading" block @click="handleSure">
确定
</n-button>
</n-form-item>

@ -32,10 +32,12 @@ const userStore = useUserStore()
const router = useRouter()
const route = useRoute()
const show = ref(false)
const flag = ref(true)
const formInline: FormState = reactive({
enterprisecode: ' 演示公司',
username: 'yanshi01',
password: '123456',
enterprisecode: '三方系统标识8',
username: '13311111111',
password: '12345678l',
})
const formSms: FormSms = reactive({
@ -72,23 +74,10 @@ function handleSubmit(e) {
try {
const { code, message: msg } = await userStore.login(params)
if (code === ResultEnum.SUCCESS) {
await userStore.getInformation()
// const response = await getFilter()
// //
// if (response.data === null) {
// const systemConfig = await getConfig()
// const onList: string[] = []
// Object.keys(systemConfig.data).forEach((key) => {
// //
// if (key.startsWith('iz') && systemConfig.data[key] === 'Y' && asideMap[key]?.isDefaultFilter)
// onList.push(key)
// })
// await setFilter({ searchcount: onList.join(',') })
// }
message.destroyAll()
if (code === ResultEnum.SUCCESS) {
const toPath = decodeURIComponent((route.query?.redirect || '/') as string)
message.success('登录成功,即将进入系统')
if (route.name === LOGIN_NAME)
@ -96,6 +85,7 @@ function handleSubmit(e) {
else router.replace(toPath)
}
else {
message.destroyAll()
message.info(msg || '登录失败')
}
}
@ -123,11 +113,12 @@ function handleSmsSubmit(e) {
agentcode,
phonecode,
})
console.log(res)
const { code, message: msg } = res
if (code === ResultEnum.SUCCESS) {
// const { code, message: msg } = await userStore.login(params)
await userStore.getInformation()
message.destroyAll()
if (code === ResultEnum.SUCCESS) {
const toPath = decodeURIComponent((route.query?.redirect || '/') as string)
message.success('登录成功,即将进入系统')
if (route.name === LOGIN_NAME)
@ -135,6 +126,7 @@ function handleSmsSubmit(e) {
else router.replace(toPath)
}
else {
message.destroyAll()
message.info(msg || '登录失败')
}
}
@ -161,11 +153,14 @@ function computedForm() {
}
async function sendCode(value) {
if (!flag.value)
return
flag.value = false
const res = await getCode({
phone: 13311111111,
agentcode: '三方系统标识8',
})
console.log(res)
startCount()
}
@ -177,7 +172,7 @@ function startCount() {
if (time === 0) {
clearInterval(timer)
countTime.value = '重新获取'
// this.flag = false;
flag.value = true
}
}, 1000)
}

@ -1,38 +1,11 @@
<script lang="ts" setup>
import { reactive, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { useMessage } from 'naive-ui'
import { ref } from 'vue'
import Login from './components/Login.vue'
import Forget from './components/Forget.vue'
import { PageEnum } from '@/enums/pageEnum'
import { useUserStore } from '@/store/modules/user'
interface FormState {
enterprisecode?: string
username: string
password: string
captcha: string
}
const formRef = ref()
const message = useMessage()
const loading = ref(false)
const autoLogin = ref(true)
const LOGIN_NAME = PageEnum.BASE_LOGIN_NAME
const userStore = useUserStore()
const router = useRouter()
const route = useRoute()
const show = ref(true)
const showForget = ref(true)
const show = ref(false)
const ifLogin = ref(true)
const formInline: FormState = reactive({
enterprisecode: '三方系统标识8',
username: '13311111111',
password: '123456',
captcha: '',
})
function showLogin() {
show.value = true
}

@ -1,163 +0,0 @@
<script lang="ts" setup>
import { computed, defineOptions, nextTick, onBeforeMount, onMounted, reactive, ref, unref } from 'vue'
import CustomFieldModalVue from '../modal/CustomFieldModal.vue'
import WorkSheetList from './WorkSheetList.vue'
import { useWindowSizeFn } from '@/hooks/event/useWindowSizeFn'
import { getViewportOffset } from '@/utils/domUtils'
import type { PackageListItem } from '/#/workorder'
import { useWorkOrder } from '@/store/modules/workOrder'
defineOptions({ name: 'AsideContent' })
const collapse = ref(false)
const workStore = useWorkOrder()
const filterModalRef = ref(null)
function collapseHandler() {
collapse.value = !collapse.value
}
const asideWidth = computed(() => {
return collapse.value ? 0 : 308
})
const asideStyle = computed(() => {
return {
width: `${asideWidth.value}px`,
}
})
const collapseIcon = computed(() => {
return collapse.value ? 'expand-cir' : 'collapse-cir'
})
const listHeight = ref(700)
function computeListHeight() {
const listEl = document.querySelector('.work-sheet-list')!
const { bottomIncludeBody } = getViewportOffset(listEl)
const height = bottomIncludeBody
listHeight.value = height - 25
}
const listStyle = computed(() => {
return {
height: `${listHeight.value}px`,
}
})
useWindowSizeFn(computeListHeight, 280)
onMounted(() => {
nextTick(() => {
computeListHeight()
})
})
const data = ref<PackageListItem[]>([])
const pagination = reactive({
pageNo: 1,
pageSize: 10,
})
onBeforeMount(async () => {
const orderList = await workStore.fetchOrderList(pagination)
data.value = orderList
})
const asideEnter = ref(false)
const showCollapse = computed(() => {
return collapse.value ? true : asideEnter.value
})
function showFilter() {
const modal = unref(filterModalRef)! as any
modal.showModal()
}
</script>
<template>
<div class="aside" :style="asideStyle" @mouseenter="asideEnter = true" @mouseleave="asideEnter = false">
111fsfsf发送到发
<div v-show="showCollapse" class="aside-collapse">
<div class="aside-collapse-btn" @click="collapseHandler">
<SvgIcon :name="collapseIcon" size="40" />
</div>
</div>
<div class="aside-header">
<div class="aside-header-left">
<svg-icon name="all-worksheet" size="32" />
<span style="margin-left: 8px;">所有工单</span>
</div>
<div class="aside-header-right">
<SvgIcon style="cursor: pointer;margin-left: 10px;" size="18" name="magnifying-1" />
<SvgIcon style="cursor: pointer;margin-left: 10px;" size="18" name="filter" @click="showFilter" />
</div>
</div>
<WorkSheetList :style="listStyle" class="work-sheet-list" :data="data" :active-id="workStore.getActiveId" />
<CustomFieldModalVue ref="filterModalRef" />
</div>
</template>
<style lang="less" scoped>
.aside {
display: flex;
position: relative;
flex-direction: column;
background: #FFF;
border: 1px solid rgb(239, 239, 245);
border-radius: 3px;
box-sizing: border-box;
&-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 16px;
width: 100%;
overflow: hidden;
&-left {
display: flex;
align-items: center;
overflow: hidden;
}
&-right {
display: flex;
align-items: center;
overflow: hidden;
}
}
&-divider {
margin-left: 16px;
width: 292px;
height: 1px;
background-color: #e8e8e8;
}
&-collapse {
width: 2px;
height: 100%;
background: #507afd;
position: absolute;
right: 0;
top: 0;
}
&-collapse-btn {
position: absolute;
cursor: pointer;
width: 40px;
height: 40px;
top: calc(15%);
right: -20px;
z-index: 10;
}
}
</style>
../types

@ -1,90 +0,0 @@
<script lang="ts" setup>
import { computed } from 'vue'
import type { PackageListItem } from '/#/workorder'
defineOptions({ name: 'ListItem' })
const props = defineProps({
selected: {
type: Boolean,
default: false,
},
listItem: {
type: Object as PropType<PackageListItem>,
required: true,
},
})
const svgName = computed(() => {
return props.selected ? 'taskpack-select' : 'taskpack'
})
</script>
<template>
<div class="list-item" :class="{ 'list-item-selected': selected }">
<div class="list-item-header">
<div style="display: flex;">
<SvgIcon :name="svgName" size="28" />
<span class="list-item-header-name" :class="{ 'list-item-header-selected': selected }">
{{ listItem.packagename }}
</span>
<span class="list-item-header-selected">({{ listItem.pictureno }})</span>
</div>
<SvgIcon v-show="selected" size="14" name="more-ver" />
</div>
<ul class="list-item-detail">
<li>筛选时间{{ listItem.createTime }}</li>
<li>执行人{{ listItem.createBy }}</li>
</ul>
<div class="list-item-divider" />
</div>
</template>
<style lang="less" scoped>
.list-item {
padding: 12px 0px 12px 16px;
position: relative;
&-header {
display: flex;
align-items: center;
&-name {
font-size: 16px;
font-weight: bold;
color: #333333;
line-height: 22px;
margin: 0px 0px 8px 8px;
}
&-selected {
color: #507AFD;
}
}
&-selected {
background-color: #f2f5fe;
}
&-detail {
margin-left: 36px;
li {
font-size: 13px;
color: #666666;
line-height: 18px;
margin-bottom: 8px;
}
}
&-divider {
width: 100%;
height: 1px;
background-color: #e8e8e8;
position: absolute;
bottom: 0px;
}
}
</style>
../types

@ -1,37 +0,0 @@
<script lang="ts" setup>
import type { PackageListItem } from '/#/workorder'
import ListItem from './ListItem.vue'
import { useWorkOrder } from '@/store/modules/workOrder'
defineOptions({ name: 'WorkSheetList' })
defineProps({
activeId: {
type: String,
required: true,
},
data: {
type: Object as PropType<PackageListItem[]>,
required: true,
},
})
const workStore = useWorkOrder()
function selectHandler(id: string, index: number) {
workStore.setActive(index)
}
</script>
<template>
<n-scrollbar>
<ListItem
v-for="(item, index) in data" :key="item.id" :selected="activeId === item.id" :list-item="item"
@click="selectHandler(item.id, index)"
/>
</n-scrollbar>
</template>
<style lang="less" scoped>
</style>
../types

@ -1,33 +1,48 @@
<script lang="ts" setup>
import { onUnmounted, reactive, ref } from 'vue'
import { reactive, ref, toRefs } from 'vue'
import { useMessage } from 'naive-ui'
import type { SetTFParam } from '/#/api'
import { useWorkOrder } from '@/store/modules/workOrder'
import { clearTF } from '@/api/work/work'
import { format } from 'date-fns'
import { msgOne, readMsg } from '@/api/message/message'
const props = defineProps({
id: {
type: String,
default: '',
},
})
const message = useMessage()
const state: any = reactive({
detail: {},
})
const { detail } = toRefs(state)
const workStore = useWorkOrder()
const selectTask = ref<any>(null)
async function getDetail() {
const res = await msgOne({ id: props.id })
if (!state.detail.readFlag)
clearMsg()
const taskDetailInfo = ref<any>({})
if (res.code === 'OK')
state.detail = res.data
async function getDetail() {
const res = await clearTF(workStore.activeId, selectTask.value.id)
if (res.code === 'OK') {
taskDetailInfo.value.iztrueorfalse = null
message.info('清除标记成功')
else
message.error(res.message)
}
else { message.error(res.message) }
async function clearMsg() {
const res = await readMsg({ msgid: props.id })
}
getDetail()
</script>
<template>
<div class="wrapper-message">
<div class="left-card">
<div class="title">
关于系统升级的通知
{{ detail.titile }}
</div>
<div class="content" v-html="detail.msgContent" />
</div>
<div class="right-card">
<img class="icon-set" src="@/assets/images/message/set.png" alt="">
@ -41,7 +56,7 @@ async function getDetail() {
创建人
</div>
<div class="value">
系统管理员
{{ detail.userNcame }}
</div>
</div>
<div class="form-item flex">
@ -50,7 +65,7 @@ async function getDetail() {
发布时间
</div>
<div class="value time">
2023-10-31 23:12:00
{{ format(detail.sendTime * 1000, 'yyyy-MM-dd HH:mm:ss') }}
</div>
</div>
<div class="form-item flex margin-no">
@ -60,7 +75,7 @@ async function getDetail() {
</div>
<div class="value">
<div class="tag">
系统消息
{{ detail.msgCategory === 1 ? '审批通知' : '系统通知' }}
</div>
</div>
</div>
@ -93,7 +108,13 @@ async function getDetail() {
text-align: center;
color: #333333;
line-height: 40px;
margin-bottom: 32px;
}
.content{
padding: 0 32px;
}
}
.right-card{

@ -1,9 +1,7 @@
<script lang="ts" setup>
import { onUnmounted, reactive, ref, toRefs, watch } from 'vue'
import type { PictureSortParam } from '/#/api'
import { useWorkOrder } from '@/store/modules/workOrder'
import { getPackageTaskList, getTaskDetailInfo, getTaskDetailPictureList } from '@/api/work/work'
import { getMessageList } from '@/api/message/message'
import { reactive, ref, toRefs } from 'vue'
import { format } from 'date-fns'
import { getMessageList, readAllMsg, readMsg } from '@/api/message/message'
import iconApproveActive from '@/assets/images/message/approve-active.png'
import iconApprove from '@/assets/images/message/approve.png'
import iconSystemActive from '@/assets/images/message/system-active.png'
@ -11,10 +9,11 @@ import iconSystem from '@/assets/images/message/system.png'
import iconArrowActive from '@/assets/images/message/arrow-active.png'
import iconArrow from '@/assets/images/message/arrow.png'
import iconClear from '@/assets/images/message/clear.png'
import iconArrowDown from '@/assets/images/message/arrow-down.png'
const emit = defineEmits(['goDetail'])
const totalCount = ref(0)
const hasNextPage = ref(false)
const state = reactive({
tabList: [
@ -22,78 +21,68 @@ const state = reactive({
name: '审批通知',
icon: iconApprove,
activeIcon: iconApproveActive,
value: 0,
value: 1,
},
{
name: '系统消息',
icon: iconSystem,
activeIcon: iconSystemActive,
value: 1,
value: 2,
},
],
list: [] as any,
pageNo: 1,
})
const { list, tabList } = toRefs(state)
const packagepagination = reactive({
pageNo: 1,
pageSize: 10,
})
const taskpagination = reactive({
pageNo: 1,
pageSize: 10,
})
const sortBy: PictureSortParam = {
orderbyname: 'desc',
orderbyvalue: 'fromuptime',
}
const workStore = useWorkOrder()
const selectTask = ref<any>(null)
const taskList = ref<any[]>([])
const taskDetailInfo = ref<any>({})
const taskDetailPictureList = ref<any[]>([])
const tab = ref(0)
const tab = ref(1)
async function getList(value) {
async function getList() {
const res = await getMessageList({
pageNo: '1',
pageNo: state.pageNo,
pageSize: '10',
msgCategory: value,
msgCategory: tab.value,
})
console.log(res)
state.list = res.list
if (res.code === 'OK') {
hasNextPage.value = res.data.hasNextPage
state.list = state.list.concat(res.data.list)
}
}
getList('1')
getList()
watch(() => workStore.activeId, async (newValue, oldValue) => {
const res = await getPackageTaskList(newValue, packagepagination)
const { data } = res
taskList.value = data
async function clearMsg() {
const res = await readAllMsg({ msgCategory: tab.value })
if (res.code === 'OK') {
state.list = []
state.pageNo = 1
getList()
}
}
if (taskList.value.length > 0)
handleSelect(taskList.value[0])
})
function switchTab(type: number) {
tab.value = type
state.list = []
state.pageNo = 1
getList()
}
async function handleSelect(item: any) {
selectTask.value = item
const taskId = item.id
taskDetailInfo.value = await getTaskDetailInfo(taskId, workStore.activeId)
function goDetail(item) {
if (tab.value === 1)
clearMsgOne(item.id)
const { data, total } = await getTaskDetailPictureList(workStore.activeId, taskId, { ...taskpagination, ...sortBy })
taskDetailPictureList.value = data
totalCount.value = total
else
emit('goDetail', item.id)
}
function switchTab(type: number) {
tab.value = type
getList(type)
async function clearMsgOne(id) {
const res = await readMsg({ msgid: id })
}
function goDetail(id) {
emit('goDetail', id)
function getMore() {
state.pageNo += 1
getList()
}
</script>
@ -103,7 +92,7 @@ function goDetail(id) {
<div class="header-title">
消息通知
</div>
<div class="clear">
<div class="clear" @click="clearMsg">
<img class="icon-clear" :src="iconClear" alt="">
清除未读
</div>
@ -128,14 +117,14 @@ function goDetail(id) {
</div>
</div>
<div class="list">
<div v-for="(item, index) in list" :key="item.id" :class="index === 0 ? 'pt0' : ''" class="item" @click="goDetail(item)">
<div v-for="(item, index) in list" :key="item.id" :class="{ 'pt0': index === 0, 'item-disabled': item.readFlag }" class="item" @click="goDetail(item)">
<div class="left left">
<div class="num">
{{ item.pictureno }}
<div class="point" />
{{ format(item.sendTime * 1000, 'dd') }}
<div v-if="!item.readFlag" class="point" />
</div>
<div class="date">
{{ item.createTime }}
{{ format(item.sendTime * 1000, 'yyyy-MM') }}
</div>
</div>
<div class="middle">
@ -152,13 +141,17 @@ function goDetail(id) {
</div> -->
<div class="subtitle">
<span class="name">{{ item.userName }}</span>
<span class="time">{{ item.createTime }}</span>
<span class="time">{{ format(item.sendTime * 1000, 'yyyy-MM-dd HH:mm:ss') }}</span>
</div>
</div>
<div class="look">
查看
</div>
</div>
<div v-if="hasNextPage" class="more" @click="getMore">
查看更多<img class="icon-more" :src="iconArrowDown" alt="">
</div>
</div>
</div>
</div>
@ -173,6 +166,7 @@ function goDetail(id) {
background: #FFF;
border-radius: 3px;
height: calc(100vh - 88px);
position: relative;
.header{
padding: 24px;
@ -264,6 +258,31 @@ function goDetail(id) {
.list{
margin-left: 24px;
flex: 1;
overflow-y: auto;
padding-bottom: 97px;
box-sizing: border-box;
height: calc(100vh - 88px - 76px);
.more{
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
font-family: PingFang SC, PingFang SC-Regular;
text-align: left;
color: #666666;
position: absolute;
bottom: 40px;
left: 50%;
background: #fff;
cursor: pointer;
.icon-more{
width: 14px;
height: 14px;
margin-left: 6px;
}
}
.item{
display: flex;
@ -272,6 +291,10 @@ function goDetail(id) {
flex: 1;
padding: 16px 0 16px 25px;
border-bottom: 1px solid #eeeeee;
&-disabled{
opacity: 0.5;
}
}
.pt0{

@ -1,8 +1,6 @@
<script lang="ts" setup>
import { onUnmounted, reactive, ref } from 'vue'
import Aside from './aside/Aside.vue'
import Content from './content/Content.vue'
import { ref } from 'vue'
import List from './content/List.vue'
import Detail from './content/Detail.vue'
const type = ref('1')
@ -16,12 +14,8 @@ function goDetail(value) {
<template>
<div class="main">
<!-- 侧边 -->
<!-- <Aside /> -->
<!-- 内容 -->
<Content v-if="type === '1'" @go-detail="goDetail" />
<Detail v-else />
<List v-if="type === '1'" @go-detail="goDetail" />
<Detail v-else :id="id" />
</div>
</template>

@ -1,167 +0,0 @@
<script lang="ts" setup>
import { computed, onBeforeMount, ref } from 'vue'
import { useDictionary } from '@/store/modules/dictonary'
const emit = defineEmits<{
(e: 'commit', id: any, desc: null | string)
}>()
const dictonaryStore = useDictionary()
const show = ref(false)
const cardStyle = {
'width': '520px',
'--n-padding-bottom': '10px',
'--n-padding-left': '0px',
}
function showModal() {
show.value = true
}
function closeModal() {
show.value = false
}
defineExpose({
showModal,
})
const options = ref<any[]>([])
const selectId = ref(null)
const otherValue = ref(null)
const showOther = computed(() => {
for (const item of options.value) {
if (item.value === selectId.value && item.label === '其他')
return true
}
return false
})
async function handleSumbit(e: MouseEvent) {
e.preventDefault()
closeModal()
emit('commit', selectId.value, otherValue.value)
}
onBeforeMount(async () => {
const tfList = await dictonaryStore.fetchTFList()
options.value = tfList
})
</script>
<template>
<n-modal v-model:show="show" transform-origin="center">
<n-card :style="cardStyle" :bordered="false" size="huge" role="dialog" aria-modal="true">
<div class="wrapper">
<div class="wrapper-header">
<span class="wrapper-left">选择判假原因</span>
<div class="wrapper-right">
<div class="wrapper-right-close" @pointerdown="closeModal">
<div class="wrapper-right-icon" />
</div>
</div>
</div>
<div class="wrapper-content">
<span>判假原因</span>
<n-select v-model:value="selectId" style="margin-top: 10px;" :options="options" />
<n-input v-show="showOther" v-model:value="otherValue" style="margin-top: 10px;" type="textarea" />
</div>
</div>
<template #footer>
<div class="wrapper-footer">
<n-button type="info" @click="handleSumbit">
确认
</n-button>
<n-button secondary style="margin-left:15px" @click="closeModal">
取消
</n-button>
</div>
</template>
</n-card>
</n-modal>
</template>
<style lang="less" scoped>
.wrapper {
&-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
}
&-left {
font-weight: bold;
font-size: 16px;
}
&-right {
&-close {
width: 18px;
height: 18px;
cursor: pointer;
}
&-icon {
background: #000;
display: inline-block;
width: 18px;
height: 1px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
margin-bottom: 8px;
&:after {
content: '';
display: block;
width: 18px;
height: 1px;
background: #000;
transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
}
}
}
&-content {
padding: 18px 10px;
}
&-footer {
display: flex;
justify-content: flex-end;
}
&-info {
font-weight: bold;
position: relative;
&:before {
background-color: #1980ff;
content: '';
width: 5px;
border-radius: 2px;
top: 0;
bottom: 0;
position: absolute;
}
}
}
::v-deep(.n-card.n-card--content-segmented > .n-card__content:not(:first-child)) {
border: 0px;
}
::v-deep(.n-card > .n-card-header) {
--n-padding-top: 0px;
--n-padding-bottom: 12px;
}
::v-deep(.n-divider:not(.n-divider--vertical)) {
margin-top: 0px;
margin-bottom: 0px;
}
</style>

@ -1,384 +0,0 @@
<script lang="ts" setup>
import { computed, ref, watch } from 'vue'
import { difference } from 'lodash-es'
import { VueDraggable } from 'vue-draggable-plus'
import { workPackageMap } from '@/config/workorder'
//
const offList = ref<any[]>([])
//
const onList = ref<any[]>([])
const allCount = computed(() => {
return `全部筛选(共${offList.value.length - 1}个)`
})
const selectCount = computed(() => {
return `全部筛选(共${onList.value.length}个)`
})
function generatList() {
const keys = Object.keys(workPackageMap)
let showList: object[] = []
const hideList: object[] = []
const showStr = 'status'
const showKeys = showStr.split(',').map((key: string) => key.toLowerCase())
for (const key of keys) {
const name = workPackageMap[key]?.label
const isDefault = workPackageMap[key]?.isDefault
// Y
if (!isDefault) {
hideList.push({
id: key,
name: name || '未配置',
fix: isDefault,
checked: workPackageMap[key].isDefault,
})
}
}
showList = showKeys.reduce((acc, key) => {
const config = {
id: key,
name: workPackageMap[key].label || '未配置',
fix: workPackageMap[key].isDefault,
}
return [...acc, config]
}, [])
const fixedList = generateDefaultList()
hideList.unshift(...fixedList)
showList.unshift(...fixedList)
onList.value = showList
offList.value = hideList
return { showList, hideList }
}
function generateDefaultList() {
return Object.keys(workPackageMap).reduce((acc, key) => {
const { label, isDefault } = workPackageMap[key]
if (isDefault) {
const config = {
id: key,
name: label || '未配置',
fix: true,
checked: true,
}
return [...acc, config]
}
else {
return acc
}
}, [])
}
const show = ref(false)
const checkAll = ref(false)
function showModal() {
show.value = true
}
function closeModal() {
show.value = false
}
async function handleSumbit(e: MouseEvent) {
e.preventDefault()
closeModal()
}
defineExpose({
showModal,
})
generatList()
const selectIds = ref<string[]>([])
function onCheckAllChange(value) {
const ids: string[] = []
for (const item of offList.value) {
if (!item.fix) {
item.checked = value
ids.push(item.id)
}
}
selectIds.value = value ? ids : []
}
function onCheckChange(checked: any, item: any) {
const index = selectIds.value.indexOf(item.id)
item.checked = checked
if (index === -1 && checked)
selectIds.value.push(item.id)
else
selectIds.value.splice(index, 1)
}
const showIds = computed(() => {
return onList.value.map((item) => {
return item.id
})
})
watch(
() => selectIds.value.length,
(newVal, oldVal) => {
if (newVal === oldVal)
return
const action = newVal > oldVal ? 'add' : 'remove'
const diff = action === 'add' ? difference(selectIds.value, showIds.value) : difference(showIds.value, selectIds.value)
if (diff.length === 0)
return
if (action === 'add') {
for (const item of offList.value) {
if (!item.fix && diff.includes(item.id)) {
onList.value.push({
id: item.id,
name: item.name || '未配置',
fix: item.fix || false,
})
}
}
}
else {
const list = onList.value
for (let index = 0; index < list.length; index++) {
const item = list[index]
if (!item.fix && diff.includes(item.id)) {
list.splice(index, 1)
index--
}
}
}
},
)
watch(
() => showIds.value.length,
(newVal, oldVal) => {
if (newVal === oldVal)
return
const diff = difference(selectIds.value, showIds.value)
if (diff.length === 0)
return
for (const item of offList.value) {
if (!item.fix && diff.includes(item.id)) {
const index = selectIds.value.indexOf(item.id)
item.checked = false
selectIds.value.splice(index, 1)
}
}
},
)
function clearDragSource() {
onList.value = onList.value.filter((item) => {
return item.fix === true
})
}
function removeHandler(id: string) {
const index = onList.value.findIndex((item) => {
return item.id === id
})
if (index !== -1)
onList.value.splice(index, 1)
}
</script>
<template>
<n-modal v-model:show="show" transform-origin="center">
<n-card class="cardstyle" :bordered="false" size="huge" role="dialog" aria-modal="true">
<div class="wrapper">
<span class="wrapper-title">自定义任务包字段</span>
<div class="wrapper-bar">
<div class="wrapper-info">
<span :style="{ 'margin-left': '18px' }">字段信息</span>
</div>
</div>
<n-grid cols="4" class="mt-4 proCard" responsive="screen" :x-gap="24">
<n-grid-item span="3">
<NCard
:title="allCount" class="dragcardStyle" :segmented="{ content: true, footer: true }" size="small"
:bordered="false"
>
<div>
<n-input placeholder="搜索关键字">
<template #suffix>
<SvgIcon size="14px" name="magnifying-1" />
</template>
</n-input>
<div class="draggable-ul">
<div class="draggable-li">
<n-checkbox v-model:checked="checkAll" label="全部" @update:checked="onCheckAllChange" />
</div>
<div class="content">
<div
v-for="item in offList" :key="item.id" style="width: 170px;"
:class="{ 'disable-check': item.fix }" class="draggable-li"
>
<n-checkbox
v-model:checked="item.checked" :label="item.name" :disabled="item.fix"
@update:checked="onCheckChange($event, item)"
/>
</div>
</div>
</div>
</div>
</NCard>
</n-grid-item>
<n-grid-item>
<NCard
:title="selectCount" class="dragcardStyle" :segmented="{ content: true, footer: true }" size="small"
:bordered="false"
>
<template #header-extra>
<span class="textbtnStyle" @click="clearDragSource"></span>
</template>
<div>
<n-input placeholder="搜索关键字">
<template #suffix>
<SvgIcon size="14px" name="magnifying-1" />
</template>
</n-input>
<VueDraggable v-model="onList" class="draggable-ul" :animation="150" group="shared">
<div
v-for="item in onList" :key="item.id" :class="{ fix: item.fix }"
class="cursor-move draggable-item"
>
<span class="ml-2">{{ item.name }}</span>
<SvgIcon
v-if="!item.fix" size="16px" style="display: block; margin-left: auto; cursor: pointer"
name="clear" @click="removeHandler(item.id)"
/>
</div>
</VueDraggable>
</div>
</NCard>
</n-grid-item>
</n-grid>
</div>
<template #footer>
<div class="wrapper-footer">
<n-button type="info" @click="handleSumbit">
确认
</n-button>
<n-button secondary style="margin-left:15px" @click="closeModal">
取消
</n-button>
</div>
</template>
</n-card>
</n-modal>
</template>
<style lang="less" scoped>
.wrapper {
display: flex;
flex-direction: column;
&-title {
font-weight: bold;
font-size: 16px;
}
&-bar {
background-color: #e8e8e8;
width: 100%;
margin-top: 20px;
}
&-footer {
display: flex;
justify-content: flex-end;
}
&-info {
font-weight: bold;
position: relative;
&:before {
background-color: #1980ff;
content: '';
width: 5px;
border-radius: 2px;
top: 0;
bottom: 0;
position: absolute;
}
}
}
.dragcardStyle {
--n-padding-bottom: 0px !important;
--n-padding-left: 0px !important;
}
.cardstyle {
width: 820px;
--n-padding-bottom: 20px;
--n-padding-left: 24px;
}
.textbtnStyle {
cursor: pointer;
color: #1980ff;
}
.draggable-ul {
width: 100%;
overflow: hidden;
border: 1px solid #cad2dd;
border-top: 0px;
border-radius: 2px;
display: block;
.content {
display: flex;
flex-wrap: wrap;
}
.draggable-li {
padding: 10px 16px;
color: #333;
}
.draggable-item {
padding: 10px 16px;
color: #333;
display: flex;
align-items: center;
}
.disable-check {
color: gainsboro;
}
}
::v-deep(.n-card.n-card--content-segmented > .n-card__content:not(:first-child)) {
border: 0px;
}
::v-deep(.n-card > .n-card-header) {
--n-padding-top: 0px;
--n-padding-bottom: 12px;
}
</style>
Loading…
Cancel
Save