|
@@ -1,13 +1,12 @@
|
|
|
import { IconHeight, IconWidth } from "@/assets/icons";
|
|
|
+import { useEditor } from "@/modules/editor";
|
|
|
import { CompSizeOpts } from "@/modules/editor/objects/DesignTemp/creates/CompSize";
|
|
|
import { Layout } from "@/modules/editor/typings";
|
|
|
import { css } from "@linaria/core";
|
|
|
import { InputNumber, Select } from "ant-design-vue";
|
|
|
-import { AnyFun } from "queenjs/typing";
|
|
|
import { defineComponent, reactive } from "vue";
|
|
|
-import { any } from "vue-types";
|
|
|
+import { any, string } from "vue-types";
|
|
|
import { TipIcons } from "../../TipIcons";
|
|
|
-import { useEditor } from "@/modules/editor";
|
|
|
|
|
|
const selectOptions = [
|
|
|
{ value: "px", label: "PX", options: { step: 1 } },
|
|
@@ -123,27 +122,36 @@ export const Size = defineComponent({
|
|
|
},
|
|
|
});
|
|
|
|
|
|
-const SizeInput = (props: {
|
|
|
- label: string;
|
|
|
- icon: any;
|
|
|
- value: string;
|
|
|
- onChange: AnyFun;
|
|
|
- onIconClick: AnyFun;
|
|
|
-}) => {
|
|
|
- const { label, icon, ...inputProps } = props;
|
|
|
- return (
|
|
|
- <div class={numberInputCls}>
|
|
|
- <span class="pl-14px pr-1px text-14px">{label}</span>
|
|
|
- <InputNumber class="flex-1" bordered={false} {...inputProps} />
|
|
|
- <icon
|
|
|
- class="tipIcon"
|
|
|
- onClick={() => {
|
|
|
- props.onIconClick();
|
|
|
- }}
|
|
|
- />
|
|
|
- </div>
|
|
|
- );
|
|
|
-};
|
|
|
+const SizeInput = defineComponent({
|
|
|
+ props: {
|
|
|
+ label: string(),
|
|
|
+ icon: any(),
|
|
|
+ value: string(),
|
|
|
+ },
|
|
|
+ emits: ["change", "iconClick"],
|
|
|
+ setup(props, { emit }) {
|
|
|
+ return () => {
|
|
|
+ const { label, icon, value } = props;
|
|
|
+ return (
|
|
|
+ <div class={numberInputCls}>
|
|
|
+ <span class="pl-14px pr-1px text-14px">{label}</span>
|
|
|
+ <InputNumber
|
|
|
+ class="flex-1"
|
|
|
+ bordered={false}
|
|
|
+ value={value}
|
|
|
+ onChange={(v) => emit("change", v)}
|
|
|
+ />
|
|
|
+ <icon
|
|
|
+ class="tipIcon"
|
|
|
+ onClick={() => {
|
|
|
+ emit("iconClick");
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+ };
|
|
|
+ },
|
|
|
+});
|
|
|
|
|
|
const numberInputCls = css`
|
|
|
@apply inline-flex items-center flex-1 w-0 mr-12px;
|