From 0103a44df43cfef6d01151be9470bdc5497a5d9c Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Wed, 02 Mar 2022 18:23:26 +0800
Subject: [PATCH] 用户签名组件，初步
---
forms/userSignature/cUserSignature.scss | 49 ++++++++++++++++
forms/userSignature/CUserSignature.vue | 65 +++++++++++++++++++++
forms/userSignature/index.js | 10 +++
3 files changed, 124 insertions(+), 0 deletions(-)
diff --git a/forms/userSignature/CUserSignature.vue b/forms/userSignature/CUserSignature.vue
new file mode 100644
index 0000000..09dbbc2
--- /dev/null
+++ b/forms/userSignature/CUserSignature.vue
@@ -0,0 +1,65 @@
+/**
+ * CUserSignature
+ * @author Tevin
+ */
+
+<template>
+ <view class="c-user-signature">
+ <!-- <AtSwitch
+ :title="itemRes.label"
+ :checked="itemRes.formData[itemRes.name]"
+ :onChange="evt=>itemRes.onChange(evt)"
+ /> -->
+ <AtInput
+ ref="input"
+ :name="itemRes.name"
+ :title="itemRes.label"
+ :required="itemRes.required"
+ :error="itemRes.error"
+ />
+ <view
+ ref="drawing"
+ class="c-user-signature-drawing"
+ >
+ <view class="button">
+ <AtIcon value="edit" />
+ </view>
+ <text class="tips">（点击修改）</text>
+ </view>
+ </view>
+</template>
+
+<script>
+import { AtInput, AtIcon } from 'taro-ui-vue';
+import { $ } from '@tarojs/extend';
+import './cUserSignature.scss';
+
+export default {
+ name: 'CUserSignature',
+ components: {
+ AtInput,
+ AtIcon,
+ },
+ props: {
+ // 表单数据资源（表单组件内部机制专用）
+ itemRes: Object,
+ },
+ data() {
+ return {};
+ },
+ computed: {
+ className() {},
+ },
+ mounted() {
+ if (process.env.TARO_ENV === 'h5') {
+ $(this.$refs.input.$el)
+ .find('.at-input__input')
+ .prepend(this.$refs.drawing.$el);
+ } else if (process.env.TARO_ENV === 'weapp') {
+ $(this.$refs.input.$el)
+ .find('.at-input__container')
+ .append(this.$refs.drawing.$el);
+ }
+ },
+};
+</script>
\ No newline at end of file
diff --git a/forms/userSignature/cUserSignature.scss b/forms/userSignature/cUserSignature.scss
new file mode 100644
index 0000000..110deac
--- /dev/null
+++ b/forms/userSignature/cUserSignature.scss
@@ -0,0 +1,49 @@
+/**
+ * cUserSignature
+ * @author Tevin
+ */
+
+@import "../../common/sassMixin";
+
+.c-user-signature {
+ .at-input {
+ padding: 0;
+ }
+ .at-input__container {
+ .weui-input {
+ display: none;
+ }
+ }
+ .c-user-signature-drawing {
+ padding: 18px 18px 18px 0;
+ .button {
+ display: inline-block;
+ width: 150px;
+ height: 150px;
+ margin-left: 10px;
+ text-align: center;
+ line-height: 140px;
+ vertical-align: middle;
+ border: 1PX #d6e4ef solid;
+ border-radius: 8px;
+ .at-icon {
+ display: inline-block;
+ width: 76px;
+ height: 76px;
+ text-transform: none;
+ text-rendering: auto;
+ line-height: 1;
+ font-size: 76px;
+ color: #cfe0ed;
+ -webkit-font-smoothing: antialiased;
+ vertical-align: middle;
+ background: none;
+ }
+ }
+ .tips {
+ line-height: 160px;
+ vertical-align: middle;
+ color: $colorIgnore;
+ }
+ }
+}
\ No newline at end of file
diff --git a/forms/userSignature/index.js b/forms/userSignature/index.js
new file mode 100644
index 0000000..f73134f
--- /dev/null
+++ b/forms/userSignature/index.js
@@ -0,0 +1,10 @@
+/**
+ * CUserSignature
+ * @author Tevin
+ */
+
+import CUserSignature from '@components/forms/userSignature/CUserSignature.vue';
+
+export {
+ CUserSignature,
+}
\ No newline at end of file
--
Gitblit v1.9.1