guoxiangbin
/
ocr-web
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

任务审批UII

Browse Source
pull/1/head
Dragon 1 year ago
parent 25e5f5f898
commit b0b80ec70a
9 changed files with 74 additions and 134 deletions
Show Stats Download Patch File Download Diff File

6
components.d.ts vendored
Unescape View File

@ -21,8 +21,10 @@ declare module 'vue' {
NDialogProvider: typeof import('naive-ui')['NDialogProvider'] NDialogProvider: typeof import('naive-ui')['NDialogProvider']
NDivider: typeof import('naive-ui')['NDivider'] NDivider: typeof import('naive-ui')['NDivider']
NDropdown: typeof import('naive-ui')['NDropdown'] NDropdown: typeof import('naive-ui')['NDropdown']
NEmpty: typeof import('naive-ui')['NEmpty']
NForm: typeof import('naive-ui')['NForm'] NForm: typeof import('naive-ui')['NForm']
NFormItem: typeof import('naive-ui')['NFormItem'] NFormItem: typeof import('naive-ui')['NFormItem']
NGi: typeof import('naive-ui')['NGi']
NGrid: typeof import('naive-ui')['NGrid'] NGrid: typeof import('naive-ui')['NGrid']
NGridItem: typeof import('naive-ui')['NGridItem'] NGridItem: typeof import('naive-ui')['NGridItem']
NImage: typeof import('naive-ui')['NImage'] NImage: typeof import('naive-ui')['NImage']
@ -39,7 +41,11 @@ declare module 'vue' {
NSpace: typeof import('naive-ui')['NSpace'] NSpace: typeof import('naive-ui')['NSpace']
NSpin: typeof import('naive-ui')['NSpin'] NSpin: typeof import('naive-ui')['NSpin']
NSwitch: typeof import('naive-ui')['NSwitch'] NSwitch: typeof import('naive-ui')['NSwitch']
NTabPane: typeof import('naive-ui')['NTabPane']
NTabs: typeof import('naive-ui')['NTabs']
NTag: typeof import('naive-ui')['NTag'] NTag: typeof import('naive-ui')['NTag']
NTimeline: typeof import('naive-ui')['NTimeline']
NTimelineItem: typeof import('naive-ui')['NTimelineItem']
NTooltip: typeof import('naive-ui')['NTooltip'] NTooltip: typeof import('naive-ui')['NTooltip']
NUpload: typeof import('naive-ui')['NUpload'] NUpload: typeof import('naive-ui')['NUpload']
NUploadDragger: typeof import('naive-ui')['NUploadDragger'] NUploadDragger: typeof import('naive-ui')['NUploadDragger']

26
src/assets/icons/arrow-left.svg
Unescape View File

@ -1,25 +1 @@
<?xml version="1.0" encoding="UTF-8"?> <?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 t="1711414535036" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7149" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M938.672 0A85.328 85.328 0 0 1 1024 85.328v853.344A85.328 85.328 0 0 1 938.672 1024H85.328A85.328 85.328 0 0 1 0 938.672V85.328A85.328 85.328 0 0 1 85.328 0h853.344z m0 42.672H85.328a42.672 42.672 0 0 0-42.576 39.968l-0.08 2.688v853.344a42.672 42.672 0 0 0 39.968 42.576l2.688 0.08h853.344a42.672 42.672 0 0 0 42.576-39.968l0.08-2.688V85.328a42.672 42.672 0 0 0-39.968-42.576l-2.688-0.08z" fill="#CFE4FF" p-id="7150"></path><path d="M384.192 522.352c0.256 5.088 2.336 10.096 6.224 13.984l8.96 8.96c0.736 0.752 1.52 1.44 2.352 2.048L611.472 757.04a10.672 10.672 0 0 0 15.072 0l24.048-24.048a10.672 10.672 0 0 0 0-15.072L453.76 521.072 650.592 324.24a10.672 10.672 0 0 0 1.12-13.76l-1.12-1.328-24.048-24.032a10.672 10.672 0 0 0-15.072 0l-209.76 209.696c-0.8 0.624-1.6 1.296-2.352 2.048l-8.96 8.96c-3.872 3.888-5.952 8.896-6.208 13.984z" fill="#1880FF" p-id="7151"></path></svg>
<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>切换_左</title>
<defs>
<rect id="path-1" x="0" y="0" width="37.3333333" height="37.3333333"></rect>
</defs>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="PrevailCloud-Design-图标集" transform="translate(-664.000000, -4463.000000)">
<g id="切换_左" transform="translate(664.000000, 4463.000000)">
<rect id="矩形备份-2" stroke="#CFE4FF" stroke-width="2.66666667" x="1.33333333" y="1.33333333" width="61.3333333" height="61.3333333" rx="5.33333333"></rect>
<g id="箭头备份" transform="translate(32.000000, 32.000000) scale(-1, 1) rotate(-270.000000) translate(-32.000000, -32.000000) translate(13.333333, 13.333333)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="蒙版"></g>
<g id="编组" mask="url(#mask-2)" fill="#1980FF">
<g transform="translate(4.360436, 8.660698)" id="形状结合">
<path d="M6.52026692,8.34350016 C6.53646644,8.02535456 6.66606265,7.711906 6.90905555,7.46891311 L6.90905555,7.46891311 L7.46891311,6.90905555 C7.51559647,6.86237218 7.56488031,6.81987422 7.61629834,6.78156167 L20.7250613,-6.32500477 C20.9854108,-6.5853543 21.4075208,-6.5853543 21.6678703,-6.32500477 L23.1705369,-4.82233817 C23.4308865,-4.56198864 23.4308865,-4.13987866 23.1705369,-3.87952913 L10.8682669,8.42273308 L23.1705369,20.7250613 C23.4048515,20.9593759 23.428283,21.3247164 23.2408313,21.5852362 L23.1705369,21.6678703 L21.6678703,23.1705369 C21.4075208,23.4308865 20.9854108,23.4308865 20.7250613,23.1705369 L20.7250613,23.1705369 L7.61629834,10.0639705 C7.56488031,10.0256579 7.51559647,9.98315998 7.46891311,9.93647662 L6.90905555,9.37661906 C6.66606265,9.13362617 6.53646644,8.82017761 6.52026692,8.50203201 Z" transform="translate(14.943033, 8.422766) scale(-1, -1) rotate(-90.000000) translate(-14.943033, -8.422766) "></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

26
src/assets/icons/arrow-right.svg
Unescape View File

@ -1,25 +1 @@
<?xml version="1.0" encoding="UTF-8"?> <?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 t="1711414527948" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6999" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M938.672 0A85.328 85.328 0 0 1 1024 85.328v853.344A85.328 85.328 0 0 1 938.672 1024H85.328A85.328 85.328 0 0 1 0 938.672V85.328A85.328 85.328 0 0 1 85.328 0h853.344z m0 42.672H85.328a42.672 42.672 0 0 0-42.576 39.968l-0.08 2.688v853.344a42.672 42.672 0 0 0 39.968 42.576l2.688 0.08h853.344a42.672 42.672 0 0 0 42.576-39.968l0.08-2.688V85.328a42.672 42.672 0 0 0-39.968-42.576l-2.688-0.08z" fill="#CFE4FF" p-id="7000"></path><path d="M653.712 522.352c-0.256 5.088-2.336 10.096-6.208 13.984l-8.96 8.96c-0.752 0.752-1.536 1.44-2.368 2.048l-209.744 209.696c-4.16 4.16-10.912 4.16-15.072 0L387.312 733.008a10.672 10.672 0 0 1 0-15.072L584.144 521.072 387.312 324.24a10.672 10.672 0 0 1-1.12-13.76l1.12-1.328 24.048-24.032a10.672 10.672 0 0 1 15.072 0l209.76 209.696c0.8 0.624 1.6 1.296 2.352 2.048l8.96 8.96c3.872 3.888 5.952 8.896 6.208 13.984z" fill="#1880FF" p-id="7001"></path></svg>
<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>切换_右</title>
<defs>
<rect id="path-1" x="0" y="0" width="37.3333333" height="37.3333333"></rect>
</defs>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="PrevailCloud-Design-图标集" transform="translate(-928.000000, -4463.000000)">
<g id="切换_右" transform="translate(928.000000, 4463.000000)">
<g id="箭头" transform="translate(32.000000, 32.000000) rotate(-270.000000) translate(-32.000000, -32.000000) translate(13.333333, 13.333333)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="蒙版"></g>
<g id="编组" mask="url(#mask-2)" fill="#1880FF">
<g transform="translate(4.291360, 9.809710)" id="形状结合">
<path d="M6.52026692,8.34350016 C6.53646644,8.02535456 6.66606265,7.711906 6.90905555,7.46891311 L6.90905555,7.46891311 L7.46891311,6.90905555 C7.51559647,6.86237218 7.56488031,6.81987422 7.61629834,6.78156167 L20.7250613,-6.32500477 C20.9854108,-6.5853543 21.4075208,-6.5853543 21.6678703,-6.32500477 L23.1705369,-4.82233817 C23.4308865,-4.56198864 23.4308865,-4.13987866 23.1705369,-3.87952913 L10.8682669,8.42273308 L23.1705369,20.7250613 C23.4048515,20.9593759 23.428283,21.3247164 23.2408313,21.5852362 L23.1705369,21.6678703 L21.6678703,23.1705369 C21.4075208,23.4308865 20.9854108,23.4308865 20.7250613,23.1705369 L20.7250613,23.1705369 L7.61629834,10.0639705 C7.56488031,10.0256579 7.51559647,9.98315998 7.46891311,9.93647662 L6.90905555,9.37661906 C6.66606265,9.13362617 6.53646644,8.82017761 6.52026692,8.50203201 Z" transform="translate(14.943033, 8.422766) scale(-1, -1) rotate(-90.000000) translate(-14.943033, -8.422766) "></path>
</g>
</g>
</g>
<rect id="矩形" stroke="#CFE4FF" stroke-width="2.66666667" x="1.33333333" y="1.33333333" width="61.3333333" height="61.3333333" rx="5.33333333"></rect>
</g>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

36
src/assets/icons/batch.svg
Unescape View File

@ -0,0 +1,36 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="96px" height="96px" viewBox="0 0 96 96" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>批量审批</title>
<defs>
<rect id="path-1" x="0" y="0" width="96" height="96"></rect>
<linearGradient x1="-22.3619338%" y1="76.1321669%" x2="117.972308%" y2="50%" id="linearGradient-3">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</linearGradient>
<filter x="-122.7%" y="-69.2%" width="345.5%" height="238.5%" filterUnits="objectBoundingBox" id="filter-4">
<feGaussianBlur stdDeviation="9.55102041" in="SourceGraphic"></feGaussianBlur>
</filter>
<linearGradient x1="14.9908397%" y1="-71.2671%" x2="47.6080819%" y2="303.1339%" id="linearGradient-5">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#F1FFF6" offset="100%"></stop>
</linearGradient>
</defs>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="无法上传iconfont" transform="translate(-392.000000, -80.000000)">
<g id="批量审批" transform="translate(392.000000, 80.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="路径"></g>
<g id="Group-1822" mask="url(#mask-2)">
<g transform="translate(6.368194, 19.102041)">
<path d="M49.463055,49.6015194 L49.463055,24.323152 C49.463055,20.3860092 46.2687692,17.1917235 42.3316264,17.1917235 L39.583055,17.1917235 L39.583055,18.5713153 L39.5724427,18.645601 C39.540606,20.1843765 38.2777488,21.4260092 36.7283611,21.4260092 L19.8336672,21.4260092 L19.7699937,21.4260092 C18.220606,21.3941725 16.9789733,20.1313153 16.9789733,18.5713153 L16.9789733,17.1917235 L14.2304019,17.1917235 C10.293259,17.1917235 7.09897333,20.3860092 7.09897333,24.323152 L7.09897333,49.6015194 C7.09897333,53.5386623 10.293259,56.732948 14.2304019,56.732948 L42.3316264,56.732948 C46.2687692,56.732948 49.463055,53.5386623 49.463055,49.6015194 Z" id="Union" stroke="none" fill-opacity="0.600000024" fill="#F4FFF8" transform="translate(28.281014, 36.962336) rotate(-30.460000) translate(-28.281014, -36.962336) "></path>
<path d="M35.8342197,7.32322251 L35.8342197,10.2829337 C35.8342197,11.0044191 36.1111226,11.6607322 36.5650893,12.1512141 C37.0143978,12.636663 37.6367523,12.960043 38.3350711,13.0234495 L38.3350711,13.0234495 L61.3588209,13.0336572 C62.0803063,13.0336572 62.7366194,12.7567544 63.2271013,12.3027877 C63.7130458,11.8530205 64.0365903,11.2298538 64.09953,10.5306669 L64.09953,10.5306669 L64.1146901,7.32426948 L68.9147392,7.32426948 C71.8137163,7.32426948 74.4453735,8.47911287 76.3740413,10.3536539 C78.3118962,12.2371241 79.5396361,14.8470931 79.6165151,17.7413959 L79.6165151,17.7413959 L79.6203422,52.1057908 C79.6203422,55.0047678 78.4654988,57.6364251 76.5909578,59.5650929 C74.7074862,61.5029492 72.0975148,62.7306895 69.2032095,62.8075669 L69.2032095,62.8075669 L31.0290249,62.8113938 C28.1300479,62.8113938 25.4983906,61.6565504 23.5697229,59.7820094 C21.631868,57.8985391 20.4041281,55.2885701 20.327249,52.3942673 L20.327249,52.3942673 L20.323422,18.0298724 C20.323422,15.1308954 21.4782654,12.4992381 23.3528064,10.5705704 C25.2361737,8.63282142 27.8459603,7.40510979 30.7400738,7.32810915 L30.7400738,7.32810915 L35.8342197,7.32322251 Z M57.5494395,-1.09090909 C59.14008,-1.09090909 60.313592,-0.652974173 61.12441,0.1087034 C61.9490359,0.883351956 62.4414688,2.02617884 62.4888004,3.59725381 L62.4888004,3.59725381 L62.4925935,5.66693878 C62.4925935,7.25757933 62.0546586,8.43109126 61.292981,9.24190932 C60.5181849,10.0666922 59.3750704,10.5591556 57.8035332,10.6063267 L57.8035332,10.6063267 L42.405766,10.6100928 C40.8151255,10.6100928 39.6416135,10.1721578 38.8307955,9.41048027 C38.0061696,8.63583172 37.5137367,7.49300484 37.4664051,5.92192987 L37.4664051,5.92192987 L37.462612,3.8522449 C37.462612,2.26160435 37.9005469,1.08809242 38.6622245,0.277274355 C39.4370206,-0.547508531 40.5801351,-1.03997191 42.1516723,-1.08714299 L42.1516723,-1.08714299 Z" id="Union" stroke="url(#linearGradient-3)" stroke-width="2.18181818" fill-opacity="0.35" fill="#FCFCFC"></path>
<path d="M23.420377,36.9093878 C23.9191525,48.6146939 23.9191525,58.7918367 25.9142545,60.3093878 C27.9093566,61.837551 41.8750709,53.1885714 45.8652749,44.5395918 C49.0595607,37.6204082 42.2146627,24.6946939 38.3836423,19.1020408 L24.9167035,22.1583673 C24.2587443,23.1771429 23.0277239,27.5493878 23.420377,36.9093878 Z" id="路径" stroke="none" fill="#C1D7FF" filter="url(#filter-4)"></path>
<path d="M47.2331446,39.7010427 L47.2331446,36.3914559 C44.8150436,35.3332024 43.1250841,32.9174856 43.1250841,30.1155683 C43.1250841,26.3342271 46.1981823,23.268801 49.9718515,23.268801 C53.7531928,23.268801 56.8186189,26.342052 56.8186189,30.1155683 C56.8186189,32.9219483 55.1259085,35.333936 52.7105585,36.3911503 L52.7105585,39.7010427 L58.8687367,39.7010427 C60.7615316,39.7010427 62.2960328,41.2206582 62.2960328,43.1245181 L62.2960328,46.54781 L37.6477314,46.54781 L37.6477314,43.1243652 C37.6477314,41.2337099 39.1895989,39.7010427 41.0749664,39.7010427 L47.2331446,39.7010427 L47.2331446,39.7010427 Z M39.0170543,47.9171635 L60.9265265,47.9171635 L60.9265265,50.6558705 L39.0170543,50.6558705 L39.0170543,47.9171635 L39.0170543,47.9171635 Z" id="形状" stroke="none" fill="url(#linearGradient-5)"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

34
src/assets/icons/p1.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

Before

Width:  |  Height:  |  Size: 230 KiB

38
src/assets/icons/p2.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

Before

Width:  |  Height:  |  Size: 230 KiB

BIN
src/assets/images/not_pass.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
src/assets/images/pass.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

42
src/views/task/content/Content.vue
Unescape View File

@ -78,10 +78,22 @@ const imageRef = ref<ComponentElRef | null>()
let processItems: any[] = [] let processItems: any[] = []
onMounted(() => { onMounted(() => {
window.addEventListener('keydown', handleKeydown)
if (route.query.id) if (route.query.id)
getDetail(route.query.id, route.query.packageid) getDetail(route.query.id, route.query.packageid)
}) })
// 键盘左右箭头快捷切换
function handleKeydown(event) {
console.log(event)
if (event.key === 'ArrowLeft')
backHandler()
// 在这里执行左箭头的逻辑
else if (event.key === 'ArrowRight')
forwardHandler()
// 在这里执行右箭头的逻辑
}
// 从任务终审列表跳转过来的 // 从任务终审列表跳转过来的
async function getDetail(taskId, packageid) { async function getDetail(taskId, packageid) {
taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid) taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid)
@ -320,9 +332,10 @@ watch(
}, },
) )
// 从store里面获取任务id
const currentTaskId = computed(() => { const currentTaskId = computed(() => {
const index = taskStore.getCurrentIndex const index = taskStore.getCurrentIndex
return taskStore.getApprovalList[index]?.formid || '' return taskStore.getApprovalList[index]?.id || ''
}) })
function overTaskHandle() { function overTaskHandle() {
@ -347,6 +360,7 @@ function showActionsModal() {
onUnmounted(() => { onUnmounted(() => {
taskStore.reset() taskStore.reset()
window.removeEventListener('keydown', handleKeydown)
}) })
const mark = computed(() => { const mark = computed(() => {
@ -401,7 +415,7 @@ function getPercent(pictureid: string) {
@click="setBatch(true)" @click="setBatch(true)"
> >
<div class="btn"> <div class="btn">
<SvgIcon style="margin-right: 6px" size="14" name="tf" /> <SvgIcon style="margin-right: 6px" size="22" name="batch" />
批量审批 批量审批
</div> </div>
<SvgIcon <SvgIcon
@ -466,8 +480,8 @@ function getPercent(pictureid: string) {
/> />
</div> </div>
<div class="status"> <div class="status">
<SvgIcon v-show="taskDetailInfo?.userapprove?.statshis === 3" width="134" height="129" name="p1" /> <img v-show="taskDetailInfo?.userapprove?.statshis === 2" class="img-status" src="@/assets/images/pass.png" alt="">
<SvgIcon v-show="taskDetailInfo?.userapprove?.statshis === 2" width="134" height="129" name="p2" /> <img v-show="taskDetailInfo?.userapprove?.statshis === 3" class="img-status" src="@/assets/images/not_pass.png" alt="">
</div> </div>
<div class="mark"> <div class="mark">
<SvgIcon <SvgIcon
@ -655,11 +669,10 @@ function getPercent(pictureid: string) {
} }
.font { .font {
font-size: 18px; font-size: 20px;
font-weight: bold; font-family: PingFang SC, PingFang SC-Medium;
color: #333333; font-weight: 500;
line-height: 25px; color: #0d0b22;
margin-left: 12px;
} }
} }
@ -748,14 +761,19 @@ function getPercent(pictureid: string) {
.status{ .status{
position: absolute; position: absolute;
z-index: 3; z-index: 3;
left: 3%; left: 0;
top: 3%; top: 0;
.img-status{
width: 133px;
height: 129px;
}
} }
} }
.right { .right {
flex: 0.5; flex: 0.5;
background: #fafafa; background: #F6F9FD;
border-radius: 8px; border-radius: 8px;
margin-left: 20px; margin-left: 20px;
padding: 24px; padding: 24px;

Write Preview
Loading…
Cancel
Save