all
This commit is contained in:
@@ -551,7 +551,7 @@ html #layuicss-laydate {
|
||||
box-sizing: border-box;
|
||||
input{
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
// padding: 0;
|
||||
}
|
||||
}
|
||||
.layui-input {
|
||||
|
||||
@@ -396,6 +396,7 @@ const onChange = () => {
|
||||
// @ts-ignore
|
||||
dropdownRef.value.hide();
|
||||
$emits("update:modelValue", dateValue.value);
|
||||
$emits("change", dateValue.value);
|
||||
};
|
||||
|
||||
provide("datePicker", {
|
||||
|
||||
@@ -30,6 +30,7 @@ export interface InputProps {
|
||||
max?: number;
|
||||
min?: number;
|
||||
qfw?: boolean;
|
||||
align?: string;
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<InputProps>(), {
|
||||
@@ -41,6 +42,7 @@ const props = withDefaults(defineProps<InputProps>(), {
|
||||
modelValue: "",
|
||||
size: "md",
|
||||
qfw: false,
|
||||
align: "left",
|
||||
});
|
||||
|
||||
interface InputEmits {
|
||||
@@ -217,6 +219,9 @@ const showPassword = () => {
|
||||
></lay-icon>
|
||||
</span>
|
||||
<input
|
||||
:style="{
|
||||
textAlign: align,
|
||||
}"
|
||||
:type="type"
|
||||
:name="name"
|
||||
:disabled="disabled"
|
||||
|
||||
@@ -249,7 +249,8 @@ const renderFixedClassName = (column: any, columnIndex: number) => {
|
||||
left = false;
|
||||
}
|
||||
}
|
||||
return left ? `layui-table-fixed-left-last` : "";
|
||||
// return left ? `layui-table-fixed-left-last` : "";
|
||||
return "";
|
||||
} else {
|
||||
var right = true;
|
||||
for (var i = 0; i < columnIndex; i++) {
|
||||
@@ -261,7 +262,8 @@ const renderFixedClassName = (column: any, columnIndex: number) => {
|
||||
right = false;
|
||||
}
|
||||
}
|
||||
return right ? `layui-table-fixed-right-first` : "";
|
||||
return "";
|
||||
// return right ? `layui-table-fixed-right-first` : "";
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -728,6 +730,6 @@ const radioProps = props.getRadioProps(props.data, props.index);
|
||||
|
||||
<style scoped>
|
||||
.layui-table-cell :deep(.layui-input input) {
|
||||
padding-left: 0;
|
||||
/*padding-left: 0;*/
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -340,6 +340,7 @@ watch(
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
watch(tableDataSource, () => {
|
||||
console.log("tableDataSource更新", tableDataSource.value);
|
||||
if (!props.page || props.serverpage) {
|
||||
datalist.value = tableDataSource.value;
|
||||
} else {
|
||||
@@ -515,24 +516,28 @@ const sortTable = (e: any, key: string, sort: string, issoul = false) => {
|
||||
e.target.parentNode.setAttribute("lay-sort", "");
|
||||
tableDataSource.value = [...props.dataSource];
|
||||
} else {
|
||||
console.log("排序了");
|
||||
e.target.parentNode.setAttribute("lay-sort", "desc");
|
||||
tableDataSource.value.sort((x, y) => {
|
||||
if (x[key] < y[key]) return 1;
|
||||
else if (x[key] > y[key]) return -1;
|
||||
else return 0;
|
||||
});
|
||||
tableDataSource.value = [...tableDataSource.value];
|
||||
}
|
||||
} else {
|
||||
if (currentSort === sort && !issoul) {
|
||||
e.target.parentNode.setAttribute("lay-sort", "");
|
||||
tableDataSource.value = [...props.dataSource];
|
||||
} else {
|
||||
console.log("排序了");
|
||||
e.target.parentNode.setAttribute("lay-sort", "asc");
|
||||
tableDataSource.value.sort((x, y) => {
|
||||
if (x[key] < y[key]) return -1;
|
||||
else if (x[key] > y[key]) return 1;
|
||||
else return 0;
|
||||
});
|
||||
tableDataSource.value = [...tableDataSource.value];
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -748,7 +753,8 @@ const renderFixedClassName = (column: any, columnIndex: number) => {
|
||||
left = false;
|
||||
}
|
||||
}
|
||||
return left ? `layui-table-fixed-left-last` : "";
|
||||
return "";
|
||||
// return left ? `layui-table-fixed-left-last` : "";
|
||||
} else {
|
||||
var right = true;
|
||||
for (var i = 0; i < columnIndex; i++) {
|
||||
@@ -760,7 +766,8 @@ const renderFixedClassName = (column: any, columnIndex: number) => {
|
||||
right = false;
|
||||
}
|
||||
}
|
||||
return right ? `layui-table-fixed-right-first` : "";
|
||||
return "";
|
||||
// return right ? `layui-table-fixed-right-first` : "";
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
export const TAG_COLORS = ["primary", "normal", "warm", "danger"] as const;
|
||||
|
||||
export type TagType = typeof TAG_COLORS[number];
|
||||
export type TagType = (typeof TAG_COLORS)[number];
|
||||
|
||||
export type TagShape = "square" | "round";
|
||||
|
||||
|
||||
@@ -4,6 +4,8 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<script lang="ts" setup>
|
||||
// @ts-ignore
|
||||
import ImageCompressor from "js-image-compressor";
|
||||
import "./index.less";
|
||||
import { Recordable } from "../../types";
|
||||
import { layer } from "@layui/layer-vue";
|
||||
@@ -73,6 +75,27 @@ export interface UploadProps {
|
||||
dragText?: string;
|
||||
modelValue?: any;
|
||||
auto?: boolean;
|
||||
sizeOutMsg?: string;
|
||||
quality?: number;
|
||||
}
|
||||
|
||||
function imgcomp(file: any): Promise<Blob> {
|
||||
return new Promise((resolve, reject) => {
|
||||
var options = {
|
||||
file: file,
|
||||
quality: props.quality,
|
||||
mimeType: "image/jpeg",
|
||||
maxWidth: 2000,
|
||||
maxHeight: 2000,
|
||||
convertSize: Infinity,
|
||||
loose: true,
|
||||
redressOrientation: true,
|
||||
success: function (result: any) {
|
||||
resolve(result);
|
||||
},
|
||||
};
|
||||
new ImageCompressor(options);
|
||||
});
|
||||
}
|
||||
|
||||
const getCutDownResult = () => {
|
||||
@@ -164,7 +187,7 @@ const props = withDefaults(defineProps<UploadProps>(), {
|
||||
cut: false,
|
||||
cutOptions: void 0,
|
||||
modelValue: null,
|
||||
auto: true,
|
||||
auto: true
|
||||
});
|
||||
|
||||
const slot = useSlots();
|
||||
@@ -219,7 +242,7 @@ interface localUploadOption {
|
||||
|
||||
const innerCutVisible = ref<boolean>(false);
|
||||
|
||||
const localUploadTransaction = (option: localUploadTransaction) => {
|
||||
const localUploadTransaction = async (option: localUploadTransaction) => {
|
||||
const { url, files } = option;
|
||||
let formData = new FormData();
|
||||
if (url.length <= 5) {
|
||||
@@ -229,7 +252,13 @@ const localUploadTransaction = (option: localUploadTransaction) => {
|
||||
if (Array.isArray(files) && files.length > 0) {
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
let _file = files[i];
|
||||
formData.append(props.field + "[" + i + "]", _file);
|
||||
let f: File | Blob;
|
||||
if (props.quality) {
|
||||
f = await imgcomp(_file);
|
||||
} else {
|
||||
f = _file;
|
||||
}
|
||||
formData.append(props.field + "[" + i + "]", f);
|
||||
}
|
||||
}
|
||||
if (props.data && props.data instanceof Object) {
|
||||
@@ -263,9 +292,9 @@ const dataURLtoFile = (dataurl: string) => {
|
||||
const errorF = (errorText: string) => {
|
||||
let currentTimeStamp = new Date().valueOf();
|
||||
let errorMsg = errorText ? errorText : defaultErrorMsg;
|
||||
errorMsg = `layui-vue:${errorMsg}`;
|
||||
errorMsg = `${errorMsg}`;
|
||||
console.warn(errorMsg);
|
||||
layer.msg(errorMsg, { icon: 2, time: 1000 }, function (res: unknown) {});
|
||||
layer.msg(errorMsg, { icon: 2, time: 1000 }, function (res: unknown) { });
|
||||
emit("error", Object.assign({ currentTimeStamp, msg: errorMsg }));
|
||||
};
|
||||
|
||||
@@ -337,7 +366,7 @@ const uploadChange = (e: any) => {
|
||||
let _file = _files[i];
|
||||
let _size = _file.size;
|
||||
if (_size > props.size * 1024) {
|
||||
errorF(occurFileSizeErrorMsg.value);
|
||||
errorF(props.sizeOutMsg || occurFileSizeErrorMsg.value);
|
||||
return;
|
||||
}
|
||||
}
|
||||
@@ -442,22 +471,9 @@ onUnmounted(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="layui-upload layui-upload-wrap"
|
||||
:class="disabledPreview ? 'layui-upload-file-disabled' : ''"
|
||||
>
|
||||
<input
|
||||
type="file"
|
||||
class="layui-upload-file"
|
||||
ref="orgFileInput"
|
||||
:name="field"
|
||||
:field="field"
|
||||
:multiple="multiple"
|
||||
:accept="acceptMime"
|
||||
:disabled="disabled"
|
||||
@click="clickOrgInput"
|
||||
@change="uploadChange"
|
||||
/>
|
||||
<div class="layui-upload layui-upload-wrap" :class="disabledPreview ? 'layui-upload-file-disabled' : ''">
|
||||
<input type="file" class="layui-upload-file" ref="orgFileInput" :name="field" :field="field" :multiple="multiple"
|
||||
:accept="acceptMime" :disabled="disabled" @click="clickOrgInput" @change="uploadChange" />
|
||||
<div v-if="!drag">
|
||||
<div class="layui-upload-btn-box" @click.stop="chooseFile">
|
||||
<template v-if="slot.default">
|
||||
@@ -470,19 +486,12 @@ onUnmounted(() => {
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
ref="dragRef"
|
||||
class="layui-upload-drag"
|
||||
:class="
|
||||
disabled
|
||||
? 'layui-upload-drag-disable'
|
||||
: isDragEnter
|
||||
? 'layui-upload-drag-draging'
|
||||
: ''
|
||||
"
|
||||
@click.stop="chooseFile"
|
||||
>
|
||||
<div v-else ref="dragRef" class="layui-upload-drag" :class="disabled
|
||||
? 'layui-upload-drag-disable'
|
||||
: isDragEnter
|
||||
? 'layui-upload-drag-draging'
|
||||
: ''
|
||||
" @click.stop="chooseFile">
|
||||
<i class="layui-icon"></i>
|
||||
<p>{{ dragText }}</p>
|
||||
<div class="layui-hide" id="uploadDemoView">
|
||||
@@ -490,38 +499,17 @@ onUnmounted(() => {
|
||||
<img src="" alt="上传成功后渲染" style="max-width: 196px" />
|
||||
</div>
|
||||
</div>
|
||||
<lay-layer
|
||||
v-model="innerCutVisible"
|
||||
:title="computedCutLayerOption.title"
|
||||
:move="computedCutLayerOption.move"
|
||||
:resize="computedCutLayerOption.resize"
|
||||
:shade="computedCutLayerOption.shade"
|
||||
:shadeClose="computedCutLayerOption.shadeClose"
|
||||
:shadeOpacity="computedCutLayerOption.shadeOpacity"
|
||||
:zIndex="computedCutLayerOption.zIndex"
|
||||
:btnAlign="computedCutLayerOption.btnAlign"
|
||||
:area="computedCutLayerOption.area"
|
||||
:anim="computedCutLayerOption.anim"
|
||||
:isOutAnim="computedCutLayerOption.isOutAnim"
|
||||
:btn="computedCutLayerOption.btn"
|
||||
@close="clearAllCutEffect"
|
||||
>
|
||||
<div
|
||||
class="copper-container"
|
||||
v-for="(base64str, index) in activeUploadFilesImgs"
|
||||
:key="`file${index}`"
|
||||
>
|
||||
<img
|
||||
:src="base64str"
|
||||
:id="`_lay_upload_img${index}`"
|
||||
class="_lay_upload_img"
|
||||
/>
|
||||
<lay-layer v-model="innerCutVisible" :title="computedCutLayerOption.title" :move="computedCutLayerOption.move"
|
||||
:resize="computedCutLayerOption.resize" :shade="computedCutLayerOption.shade"
|
||||
:shadeClose="computedCutLayerOption.shadeClose" :shadeOpacity="computedCutLayerOption.shadeOpacity"
|
||||
:zIndex="computedCutLayerOption.zIndex" :btnAlign="computedCutLayerOption.btnAlign"
|
||||
:area="computedCutLayerOption.area" :anim="computedCutLayerOption.anim"
|
||||
:isOutAnim="computedCutLayerOption.isOutAnim" :btn="computedCutLayerOption.btn" @close="clearAllCutEffect">
|
||||
<div class="copper-container" v-for="(base64str, index) in activeUploadFilesImgs" :key="`file${index}`">
|
||||
<img :src="base64str" :id="`_lay_upload_img${index}`" class="_lay_upload_img" />
|
||||
</div>
|
||||
</lay-layer>
|
||||
<div
|
||||
class="layui-upload-list"
|
||||
:class="disabledPreview ? 'layui-upload-list-disabled' : ''"
|
||||
>
|
||||
<div class="layui-upload-list" :class="disabledPreview ? 'layui-upload-list-disabled' : ''">
|
||||
<slot name="preview"></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user