修改部分自写公共组件代码
This commit is contained in:
parent
c3d4f1d78c
commit
1aa502103b
|
|
@ -105,7 +105,7 @@ import { computed } from 'vue';
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
.shadow{
|
.shadow{
|
||||||
box-shadow: 0 0 10px #999;
|
box-shadow: 0 0 10px #aaa;
|
||||||
}
|
}
|
||||||
.btn {
|
.btn {
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<view class="my-radio u-font-28 u-flex color-333" @tap.stop="changeVal" >
|
<view class="my-radio u-font-28 u-flex color-333" @tap.stop="changeVal">
|
||||||
<view class="circle u-flex u-row-center" :style="computedStyle()" :class="{active:modelValue,square:shape==='square'}">
|
<view class="circle u-flex u-row-center" :style="computedStyle()"
|
||||||
|
:class="{active:modelValue,square:shape==='square'}">
|
||||||
<uni-icons type="checkmarkempty" v-if="modelValue" :size="size-4" color="#fff"></uni-icons>
|
<uni-icons type="checkmarkempty" v-if="modelValue" :size="size-4" color="#fff"></uni-icons>
|
||||||
</view>
|
</view>
|
||||||
<view class="u-m-l-12">
|
<view class="u-m-l-12">
|
||||||
{{text}}
|
<slot>{{text}}</slot>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -14,11 +15,11 @@
|
||||||
} from 'vue'
|
} from 'vue'
|
||||||
import color from '@/commons/color.js'
|
import color from '@/commons/color.js'
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
disabled:{
|
disabled: {
|
||||||
type: [Boolean],
|
type: [Boolean],
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
borderColor:{
|
borderColor: {
|
||||||
type: String,
|
type: String,
|
||||||
default: '#bbb',
|
default: '#bbb',
|
||||||
},
|
},
|
||||||
|
|
@ -29,10 +30,10 @@
|
||||||
},
|
},
|
||||||
// v-modal
|
// v-modal
|
||||||
modelValue: {
|
modelValue: {
|
||||||
type: [Number,Boolean],
|
type: [Number, Boolean],
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
shape:{
|
shape: {
|
||||||
//circle square
|
//circle square
|
||||||
type: String,
|
type: String,
|
||||||
default: 'circle',
|
default: 'circle',
|
||||||
|
|
@ -52,18 +53,19 @@
|
||||||
`
|
`
|
||||||
}
|
}
|
||||||
const emits = defineEmits(['update:modelValue', 'change'])
|
const emits = defineEmits(['update:modelValue', 'change'])
|
||||||
|
|
||||||
function changeVal() {
|
function changeVal() {
|
||||||
if(props.disabled){
|
if (props.disabled) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
emits('click')
|
emits('click')
|
||||||
let currentVal=props.modelValue
|
let currentVal = props.modelValue
|
||||||
let type=typeof currentVal
|
let type = typeof currentVal
|
||||||
if(type==='number'){
|
if (type === 'number') {
|
||||||
currentVal=currentVal===0?1:0
|
currentVal = currentVal === 0 ? 1 : 0
|
||||||
}
|
}
|
||||||
if(type==='boolean'){
|
if (type === 'boolean') {
|
||||||
currentVal=!currentVal
|
currentVal = !currentVal
|
||||||
}
|
}
|
||||||
emits('update:modelValue', currentVal)
|
emits('update:modelValue', currentVal)
|
||||||
emits('change', currentVal)
|
emits('change', currentVal)
|
||||||
|
|
@ -75,7 +77,7 @@
|
||||||
|
|
||||||
.circle {
|
.circle {
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
background-color: $my-main-color;
|
background-color: $my-main-color;
|
||||||
border-color: $my-main-color;
|
border-color: $my-main-color;
|
||||||
|
|
@ -84,7 +86,8 @@
|
||||||
border: 1px solid #707070;
|
border: 1px solid #707070;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
&.square{
|
|
||||||
|
&.square {
|
||||||
border-radius: 8rpx;
|
border-radius: 8rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<view class="left-line" :class="{hide:index==list.length-1}"></view>
|
<view class="left-line" :class="{hide:index==list.length-1}"></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="u-p-l-12 ">
|
<view class="u-p-l-12 ">
|
||||||
<view class="u-font-20">{{item[titleKey]||''}}</view>
|
<view class="u-font-20">{{formatTitle(item[titleKey]||'') }}</view>
|
||||||
<view class="u-font-24 u-m-t-2">{{item[contentKey]||''}}</view>
|
<view class="u-font-24 u-m-t-2">{{item[contentKey]||''}}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -14,6 +14,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import dayjs from 'dayjs';
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
active: {
|
active: {
|
||||||
type: [String, Number],
|
type: [String, Number],
|
||||||
|
|
@ -32,6 +33,10 @@
|
||||||
default: 'content'
|
default: 'content'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
function formatTitle(time){
|
||||||
|
return dayjs(time).format('YYYY-M-D HH:MM:ss')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
|
||||||
|
|
@ -1,69 +1,103 @@
|
||||||
<template>
|
<template>
|
||||||
<up-upload :fileList="images" @afterRead="afterRead" @delete="deletePic" :multiple="multiple"
|
<up-upload :fileList="images" @afterRead="afterRead" @delete="deletePic" :multiple="multiple" :width="width"
|
||||||
:width="width" :height="height"
|
:height="height" :maxCount="maxCount"></up-upload>
|
||||||
:maxCount="10"></up-upload>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import {$uploadFile} from '@/http/yskApi/file.js'
|
|
||||||
import {
|
import {
|
||||||
ref, watch
|
$uploadFile
|
||||||
|
} from '@/http/yskApi/file.js'
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
watch
|
||||||
} from 'vue';
|
} from 'vue';
|
||||||
|
|
||||||
const props=defineProps({
|
const props = defineProps({
|
||||||
modelValue:{
|
modelValue: {
|
||||||
type:Array,
|
type: Array,
|
||||||
default:()=>[]
|
default: () => []
|
||||||
},
|
},
|
||||||
width:{
|
width: {
|
||||||
type:[String,Number],
|
type: [String, Number],
|
||||||
default:60
|
default: 60
|
||||||
},
|
},
|
||||||
height:{
|
height: {
|
||||||
type:[String,Number],
|
type: [String, Number],
|
||||||
default:60
|
default: 60
|
||||||
},
|
},
|
||||||
multiple:{
|
maxCount: {
|
||||||
type:Boolean,
|
type: [Number],
|
||||||
default:true
|
default: 10
|
||||||
|
},
|
||||||
|
multiple: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
const emits=defineEmits(['update:modelValue'])
|
const emits = defineEmits(['update:modelValue'])
|
||||||
const images = ref(props.modelValue)
|
const images = ref(props.modelValue)
|
||||||
function afterRead(e){
|
|
||||||
for(let i in e.file){
|
function afterRead(e) {
|
||||||
const file=e.file[i].file
|
console.log(e);
|
||||||
|
if (Array.isArray(e)) {
|
||||||
|
for (let i in e.file) {
|
||||||
|
const file = e.file[i].file
|
||||||
|
$uploadFile(file).then(res => {
|
||||||
|
console.log(res);
|
||||||
|
images.value.push({
|
||||||
|
url: e.file[i].url,
|
||||||
|
serveUrl: res.data[0]
|
||||||
|
})
|
||||||
|
}).catch(res => {
|
||||||
|
console.log(res);
|
||||||
|
if (res.errMsg) {
|
||||||
|
images.value.splice(i, 1)
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片大小超出限制',
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
const i=0
|
||||||
|
const file = e.file.file
|
||||||
$uploadFile(file).then(res => {
|
$uploadFile(file).then(res => {
|
||||||
console.log(res);
|
console.log(res);
|
||||||
images.value.push({
|
images.value.push({
|
||||||
url: e.file[i].url,
|
url: e.file.url,
|
||||||
serveUrl: res.data[0]
|
serveUrl: res.data[0]
|
||||||
})
|
})
|
||||||
}).catch(res=>{
|
}).catch(res => {
|
||||||
console.log(res);
|
console.log(res);
|
||||||
if(res.errMsg){
|
if (res.errMsg) {
|
||||||
images.value.splice(i,1)
|
images.value.splice(i, 1)
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title:'图片大小超出限制',
|
title: '图片大小超出限制',
|
||||||
icon:'error'
|
icon: 'error'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
function deletePic(e){
|
|
||||||
const {index}=e
|
function deletePic(e) {
|
||||||
images.value.splice(index,1)
|
const {
|
||||||
|
index
|
||||||
|
} = e
|
||||||
|
images.value.splice(index, 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(()=>images.value,(newval)=>{
|
watch(() => images.value, (newval) => {
|
||||||
emits('update:modelValue',newval)
|
emits('update:modelValue', newval)
|
||||||
})
|
})
|
||||||
watch(()=>props.modelValue,(newval)=>{
|
watch(() => props.modelValue, (newval) => {
|
||||||
images.value=newval
|
images.value = newval
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue