Min5203
4 years ago
11 changed files with 508 additions and 15 deletions
@ -1,8 +1,26 @@ |
|||
// 默认主题文件 |
|||
.theme-default { |
|||
background-color: #333; |
|||
background-color: #F3F3F3; |
|||
.u-card { |
|||
font-size: 24px !important; |
|||
color: #0f0; |
|||
font-size: 16px !important; |
|||
background-color: #F3F3F3 !important; |
|||
.deliverHead{ |
|||
align-items: center; |
|||
} |
|||
.btns u-button{ |
|||
margin: 0 !important; |
|||
} |
|||
.active{ |
|||
background-color: #2979FF; |
|||
color: #FFFFFF; |
|||
} |
|||
.mask{ |
|||
position:absolute; |
|||
top: 0; |
|||
left:0; |
|||
width: 100%; |
|||
height: 100%; |
|||
z-index: 100; |
|||
} |
|||
} |
|||
} |
|||
|
|||
@ -0,0 +1,19 @@ |
|||
<template> |
|||
<!-- 标题部分 --> |
|||
<view> |
|||
ssss |
|||
</view> |
|||
<!-- 输入框 --> |
|||
<view> |
|||
|
|||
</view> |
|||
<!-- 按钮 --> |
|||
</template> |
|||
|
|||
<script> |
|||
|
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,91 @@ |
|||
<template> |
|||
<view class="deliverFoot border border-solid border-gray-300 rounded-md mt-3 p-2"> |
|||
<view class="top flex justify-between"> |
|||
<view class="mr-3"> |
|||
审核人 |
|||
</view> |
|||
<!-- 展示选择的审核人 --> |
|||
<view class="flex approver item-center truncate justify-end flex-1 text-sm" v-show="isUicon"> |
|||
<view v-for="item in computedDelivers"> |
|||
<view v-show="item.checked" class="mx-1"> |
|||
{{item.name}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- 点击更换图标 --> |
|||
<view> |
|||
<u-icon v-if="isUicon" name="arrow-down" @click="changeIcon"></u-icon> |
|||
<u-icon v-else="isUicon" name="arrow-up" @click="changeIcon"></u-icon> |
|||
</view> |
|||
</view> |
|||
<!-- 隐藏的审核人选项 --> |
|||
<view v-show="!isUicon" class="foot mt-2 flex flex-wrap"> |
|||
<u-button |
|||
v-for="item in delivers" |
|||
size="mini" class="my-1 mx-2" |
|||
@click="item.checked = !item.checked" |
|||
:class="item.checked ? 'active' : '' " |
|||
> |
|||
{{item.name}} |
|||
</u-button> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
|
|||
import {ref , reactive , computed }from 'vue' |
|||
// 图标切换 |
|||
let isUicon = ref('true') |
|||
// 审核人员列表 |
|||
const delivers = reactive([ |
|||
{ |
|||
checked:true, |
|||
name:'冯教授' |
|||
}, |
|||
{ |
|||
checked:false, |
|||
name:'陈历珺' |
|||
}, |
|||
{ |
|||
checked:false, |
|||
name:'张野' |
|||
}, |
|||
{ |
|||
checked:false, |
|||
name:'宋瑞芳' |
|||
}, |
|||
{ |
|||
checked:false, |
|||
name:'张斌' |
|||
}, |
|||
{ |
|||
checked:false, |
|||
name:'孙方圆' |
|||
} |
|||
]) |
|||
|
|||
// 显示已选择的审核人 |
|||
const computedDelivers = computed(()=>{ |
|||
let arr = []; |
|||
delivers.forEach((item)=>{ |
|||
if(item.checked){ |
|||
arr.push(item) |
|||
} |
|||
if(arr.length>3){ |
|||
arr = arr.splice(0,3) |
|||
arr[3] = {checked:true,name:'...'} |
|||
} |
|||
}) |
|||
return arr |
|||
}) |
|||
|
|||
// 点击切换箭头图标 |
|||
function changeIcon(){ |
|||
isUicon.value = !isUicon.value |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
|
|||
</style> |
|||
@ -0,0 +1,26 @@ |
|||
<template> |
|||
<theme class="h-full w-full pt-1"> |
|||
<view class="bg-white m-5 rounded-md p-3"> |
|||
<view class="flex justify-between text-gray-400 mb-2"> |
|||
<view>插件名</view> <view>提交时间</view> |
|||
</view> |
|||
<view class="text-blue-400 mb-2"> |
|||
链接 |
|||
</view> |
|||
<view class="mb-2">审核人</view> |
|||
</view> |
|||
</theme> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
}; |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
|
|||
</style> |
|||
@ -1,9 +1,202 @@ |
|||
<template> |
|||
<view class="deliver-container">p-deliver</view> |
|||
<!-- <view class="deliver-container">p-deliver</view> --> |
|||
|
|||
<view class="my-2 bg-white p-2 rounded-md relative" @longpress="logoTime" v-if="deliverRef"> |
|||
<!-- 插件名称输入和提交 --> |
|||
<view class=" flex item-center justify-between py-3 pl-2" :class="inputRef"> |
|||
<u-input v-model="iptValue" type="text" :border="false" placeholder="请编辑交付物名称" /> |
|||
<view class="self-center" :class="viewRef">{{iptValue}}</view> |
|||
<u-button type="primary" size="mini" @click="submit" class="self-center" :disabled="sbumitState">提交</u-button> |
|||
<u-icon v-show="historyIcon" name="arrow-right" class="ml-1" @click="historical"></u-icon> |
|||
</view> |
|||
<view :class="viewRef" class="py-3 pl-2"> |
|||
<span class="relative px-1"> |
|||
<u-badge :is-dot="true" is-center></u-badge> |
|||
{{iptValue}} |
|||
</span> |
|||
</view> |
|||
<!-- 插件上传方式 --> |
|||
<view> |
|||
<u-input v-model="linkValue" type="text" :border="true" placeholder="请输入交付物地址/链接"> |
|||
</u-input> |
|||
<view class="btns flexitems-start mt-3"> |
|||
<u-button size="mini" :plain="true" style="color: #007AFF;" class="mr-3" @click="paste">粘贴</u-button> |
|||
<u-button size="mini" :plain="true" style="color: #007AFF;" class="mr-3" @click="getfile">文件</u-button> |
|||
<u-button size="mini" :plain="true" style="color: #007AFF;" class="mr-3" @click="photos">拍照</u-button> |
|||
</view> |
|||
</view> |
|||
<!-- 提示框 --> |
|||
<u-toast ref="tips" /> |
|||
|
|||
<!-- 取消和确定 --> |
|||
<u-mask :show="showRef" @click="showRef = false"> |
|||
<view class="warp"> |
|||
<view class="rect rounded-md" @tap.stop> |
|||
<view class="text-center my-7 font-semibold"> |
|||
交付物标题名称 |
|||
</view> |
|||
<view class=""> |
|||
<u-input :border="true" class="m-5" placeholder="请输入交付物名称" v-model="newInputRef"/> |
|||
</view> |
|||
<view class="flex justify-around h-12 mt-7 justify-self-stretch" style="border-top: 1px solid #D1D5DB;"> |
|||
<view class="leading-12 flex-1 text-center" style="border-right: 1px solid #D1D5DB;" @click="cancelClick"> |
|||
取消 |
|||
</view> |
|||
<view class="text-blue-700 leading-12 flex-1 text-center" @click="sureClick"> |
|||
确定 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</u-mask> |
|||
|
|||
<!-- 编辑和删除的遮罩层 --> |
|||
<view class="mask flex items-center justify-center bg-grey" :class="maskRef" @click="close" > |
|||
<view class="bg-yellow-500 text-white w-12 h-12 text-center leading-12 rounded-w-12 mx-8" @click="revisePlugin" @tap.stop>修改</view> |
|||
<view class="bg-red-500 text-white w-12 h-12 text-center leading-12 rounded-w-12 mx-8" @click="deletePlugin" @tap.stop>删除</view> |
|||
</view> |
|||
<!-- 插件审核人员选择 --> |
|||
<Reviewer/> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</template> |
|||
|
|||
<script setup> |
|||
import {ref,computed,reactive} from 'vue' |
|||
// 插件名称 |
|||
const deliverRef = ref(true) |
|||
const iptValue = ref('') |
|||
const linkValue = ref('') |
|||
const historyIcon = ref(false) |
|||
const tips = ref('') |
|||
const showRef = ref(false) |
|||
const maskRef = ref('hidden') |
|||
const inputRef = ref('block') |
|||
const viewRef = ref('hidden') |
|||
const newInputRef = ref('') |
|||
const submitHistory = reactive([]) |
|||
|
|||
// 判断提交按钮的状态 |
|||
const sbumitState = computed(()=>!(iptValue.value && linkValue.value)) |
|||
|
|||
// 获取当前时间 |
|||
function getTime(){ |
|||
const MM = uni.$dayjs().$M+1 |
|||
const DD = uni.$dayjs().$D |
|||
const HH = uni.$dayjs().$H |
|||
const mm = uni.$dayjs().$m |
|||
const getTime = MM + '/' + DD + ' ' + HH + ':' + (mm < 10 ? '0' + mm : mm) |
|||
return getTime |
|||
} |
|||
// 提交后验证链接并修改状态 |
|||
function submit(){ |
|||
const reg=/^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- ./?%&=]*)?$/; |
|||
if(!reg.test(linkValue.value)){ |
|||
// 显示toast信息 |
|||
uni.$ui.showToast('请输入正确的链接') |
|||
}else{ |
|||
inputRef.value = 'hidden' |
|||
viewRef.value = 'block' |
|||
const time = getTime() |
|||
const obj = {} |
|||
obj.name = iptValue.value |
|||
obj.time = time |
|||
obj.link = linkValue.value |
|||
submitHistory.push(obj) |
|||
console.log(submitHistory) |
|||
} |
|||
} |
|||
|
|||
// 查看历史记录 |
|||
function historical(){ |
|||
uni.navigateTo({ |
|||
url: '/pages/submitList/submitList' |
|||
}); |
|||
|
|||
} |
|||
|
|||
// 粘贴上传 |
|||
function paste(){ |
|||
uni.getClipboardData({ |
|||
success: function (res) { |
|||
linkValue.value = res.data |
|||
} |
|||
}); |
|||
} |
|||
|
|||
// 文件上传 |
|||
function getfile (){ |
|||
uni.chooseFile({ |
|||
count: 1, //默认100 |
|||
extension:['.zip','.doc'], |
|||
success: function (res) { |
|||
linkValue.value = JSON.stringify(res.tempFilePaths) |
|||
} |
|||
}); |
|||
} |
|||
|
|||
// 拍照上传 |
|||
function photos (){ |
|||
uni.chooseImage({ |
|||
count: 1, //默认9 |
|||
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有 |
|||
sourceType: ['album','camera'], //从相册选择 |
|||
success: function (res) { |
|||
linkValue.value = JSON.stringify(res.tempFilePaths) |
|||
} |
|||
}); |
|||
} |
|||
|
|||
function close(){ |
|||
maskRef.value = 'hidden' |
|||
} |
|||
|
|||
// 长按出现遮罩（编辑和删除按钮） |
|||
function logoTime(){ |
|||
if( viewRef.value === 'block'){ |
|||
maskRef.value = 'block' |
|||
} |
|||
} |
|||
// 修改插件按钮 |
|||
function revisePlugin(){ |
|||
showRef.value = true |
|||
} |
|||
|
|||
// 修改界面的取消按钮事件 |
|||
function cancelClick(){ |
|||
showRef.value = false |
|||
// maskRef.value = 'hidden' |
|||
} |
|||
// 修改界面的确定按钮事件 |
|||
function sureClick (){ |
|||
iptValue.value = newInputRef.value |
|||
newInputRef.value = '' |
|||
inputRef.value = 'block' |
|||
viewRef.value = 'hidden' |
|||
historyIcon.value = true |
|||
showRef.value = false |
|||
maskRef.value = 'hidden' |
|||
} |
|||
// 删除插件按钮 |
|||
function deletePlugin(){ |
|||
deliverRef.value = false |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<style lang="scss"></style> |
|||
<style lang="scss"> |
|||
.warp { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
height: 80%; |
|||
} |
|||
.rect { |
|||
width: 80%; |
|||
height: 380rpx; |
|||
background-color: #fff; |
|||
} |
|||
|
|||
</style> |
|||
|
|||
@ -1,10 +1,12 @@ |
|||
<template> |
|||
<!-- 任务名插件 --> |
|||
<theme> |
|||
<view>{{ task.name }}</view> |
|||
<theme class="my-2"> |
|||
<view class="bg-white rounded-md h-10 leading-10 pl-2">{{ task.name }}</view> |
|||
</theme> |
|||
</template> |
|||
|
|||
<script setup> |
|||
defineProps({ task: { type: Object, default: () => {} } }); |
|||
</script> |
|||
|
|||
|
|||
|
|||
@ -0,0 +1,69 @@ |
|||
{ |
|||
"description": "项目配置文件", |
|||
"packOptions": { |
|||
"ignore": [] |
|||
}, |
|||
"setting": { |
|||
"bundle": false, |
|||
"userConfirmedBundleSwitch": false, |
|||
"urlCheck": true, |
|||
"scopeDataCheck": false, |
|||
"coverView": true, |
|||
"es6": true, |
|||
"postcss": true, |
|||
"compileHotReLoad": false, |
|||
"lazyloadPlaceholderEnable": false, |
|||
"preloadBackgroundData": false, |
|||
"minified": true, |
|||
"autoAudits": false, |
|||
"newFeature": false, |
|||
"uglifyFileName": false, |
|||
"uploadWithSourceMap": true, |
|||
"useIsolateContext": true, |
|||
"nodeModules": false, |
|||
"enhance": true, |
|||
"useMultiFrameRuntime": true, |
|||
"useApiHook": true, |
|||
"useApiHostProcess": true, |
|||
"showShadowRootInWxmlPanel": true, |
|||
"packNpmManually": false, |
|||
"enableEngineNative": false, |
|||
"packNpmRelationList": [], |
|||
"minifyWXSS": true, |
|||
"showES6CompileOption": false, |
|||
"minifyWXML": true |
|||
}, |
|||
"compileType": "miniprogram", |
|||
"libVersion": "2.21.3", |
|||
"appid": "wx0d9aabee071e228e", |
|||
"projectname": "TALL", |
|||
"debugOptions": { |
|||
"hidedInDevtools": [] |
|||
}, |
|||
"scripts": {}, |
|||
"staticServerOptions": { |
|||
"baseURL": "", |
|||
"servePath": "" |
|||
}, |
|||
"isGameTourist": false, |
|||
"condition": { |
|||
"search": { |
|||
"list": [] |
|||
}, |
|||
"conversation": { |
|||
"list": [] |
|||
}, |
|||
"game": { |
|||
"list": [] |
|||
}, |
|||
"plugin": { |
|||
"list": [] |
|||
}, |
|||
"gamePlugin": { |
|||
"list": [] |
|||
}, |
|||
"miniprogram": { |
|||
"list": [] |
|||
} |
|||
} |
|||
} |
|||
Loading…
Reference in new issue