From 2e50cedafd87bdb3ce80ebc8fecdd80c34dfa56a Mon Sep 17 00:00:00 2001
From: whycq <913841844@qq.com>
Date: 星期二, 15 八月 2023 22:26:36 +0800
Subject: [PATCH] #
---
uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue | 271 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 271 insertions(+), 0 deletions(-)
diff --git a/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue b/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue
new file mode 100644
index 0000000..a5d0f2a
--- /dev/null
+++ b/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue
@@ -0,0 +1,271 @@
+<template>
+ <view class="uni-popup-dialog">
+ <view class="uni-dialog-title">
+ <text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{titleText}}</text>
+ </view>
+ <view v-if="mode === 'base'" class="uni-dialog-content">
+ <slot>
+ <text class="uni-dialog-content-text">{{content}}</text>
+ </slot>
+ </view>
+ <view v-else class="uni-dialog-content">
+ <slot>
+ <input class="uni-dialog-input" v-model="val" type="text" :placeholder="placeholderText" :focus="focus" >
+ </slot>
+ </view>
+ <view class="uni-dialog-button-group">
+ <view class="uni-dialog-button" @click="closeDialog">
+ <text class="uni-dialog-button-text">{{closeText}}</text>
+ </view>
+ <view class="uni-dialog-button uni-border-left" @click="onOk">
+ <text class="uni-dialog-button-text uni-button-color">{{okText}}</text>
+ </view>
+ </view>
+
+ </view>
+</template>
+
+<script>
+ import popup from '../uni-popup/popup.js'
+ import {
+ initVueI18n
+ } from '@dcloudio/uni-i18n'
+ import messages from '../uni-popup/i18n/index.js'
+ const { t } = initVueI18n(messages)
+ /**
+ * PopUp 寮瑰嚭灞�-瀵硅瘽妗嗘牱寮�
+ * @description 寮瑰嚭灞�-瀵硅瘽妗嗘牱寮�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+ * @property {String} value input 妯″紡涓嬬殑榛樿鍊�
+ * @property {String} placeholder input 妯″紡涓嬭緭鍏ユ彁绀�
+ * @property {String} type = [success|warning|info|error] 涓婚鏍峰紡
+ * @value success 鎴愬姛
+ * @value warning 鎻愮ず
+ * @value info 娑堟伅
+ * @value error 閿欒
+ * @property {String} mode = [base|input] 妯″紡銆�
+ * @value base 鍩虹瀵硅瘽妗�
+ * @value input 鍙緭鍏ュ璇濇
+ * @property {String} content 瀵硅瘽妗嗗唴瀹�
+ * @property {Boolean} beforeClose 鏄惁鎷︽埅鍙栨秷浜嬩欢
+ * @event {Function} confirm 鐐瑰嚮纭鎸夐挳瑙﹀彂
+ * @event {Function} close 鐐瑰嚮鍙栨秷鎸夐挳瑙﹀彂
+ */
+
+ export default {
+ name: "uniPopupDialog",
+ mixins: [popup],
+ emits:['confirm','close'],
+ props: {
+ value: {
+ type: [String, Number],
+ default: ''
+ },
+ placeholder: {
+ type: [String, Number],
+ default: ''
+ },
+ type: {
+ type: String,
+ default: 'error'
+ },
+ mode: {
+ type: String,
+ default: 'base'
+ },
+ title: {
+ type: String,
+ default: ''
+ },
+ content: {
+ type: String,
+ default: ''
+ },
+ beforeClose: {
+ type: Boolean,
+ default: false
+ },
+ cancelText:{
+ type: String,
+ default: ''
+ },
+ confirmText:{
+ type: String,
+ default: ''
+ }
+ },
+ data() {
+ return {
+ dialogType: 'error',
+ focus: false,
+ val: ""
+ }
+ },
+ computed: {
+ okText() {
+ return this.confirmText || t("uni-popup.ok")
+ },
+ closeText() {
+ return this.cancelText || t("uni-popup.cancel")
+ },
+ placeholderText() {
+ return this.placeholder || t("uni-popup.placeholder")
+ },
+ titleText() {
+ return this.title || t("uni-popup.title")
+ }
+ },
+ watch: {
+ type(val) {
+ this.dialogType = val
+ },
+ mode(val) {
+ if (val === 'input') {
+ this.dialogType = 'info'
+ }
+ },
+ value(val) {
+ this.val = val
+ }
+ },
+ created() {
+ // 瀵硅瘽妗嗛伄缃╀笉鍙偣鍑�
+ this.popup.disableMask()
+ // this.popup.closeMask()
+ if (this.mode === 'input') {
+ this.dialogType = 'info'
+ this.val = this.value
+ } else {
+ this.dialogType = this.type
+ }
+ },
+ mounted() {
+ this.focus = true
+ },
+ methods: {
+ /**
+ * 鐐瑰嚮纭鎸夐挳
+ */
+ onOk() {
+ if (this.mode === 'input'){
+ this.$emit('confirm', this.val)
+ }else{
+ this.$emit('confirm')
+ }
+ if(this.beforeClose) return
+ this.popup.close()
+ },
+ /**
+ * 鐐瑰嚮鍙栨秷鎸夐挳
+ */
+ closeDialog() {
+ this.$emit('close')
+ if(this.beforeClose) return
+ this.popup.close()
+ },
+ close(){
+ this.popup.close()
+ }
+ }
+ }
+</script>
+
+<style lang="scss" >
+ .uni-popup-dialog {
+ width: 300px;
+ border-radius: 11px;
+ background-color: #fff;
+ }
+
+ .uni-dialog-title {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ justify-content: center;
+ padding-top: 25px;
+ }
+
+ .uni-dialog-title-text {
+ font-size: 16px;
+ font-weight: 500;
+ }
+
+ .uni-dialog-content {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ padding: 20px;
+ }
+
+ .uni-dialog-content-text {
+ font-size: 14px;
+ color: #6C6C6C;
+ }
+
+ .uni-dialog-button-group {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ border-top-color: #f5f5f5;
+ border-top-style: solid;
+ border-top-width: 1px;
+ }
+
+ .uni-dialog-button {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+
+ flex: 1;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ height: 45px;
+ }
+
+ .uni-border-left {
+ border-left-color: #f0f0f0;
+ border-left-style: solid;
+ border-left-width: 1px;
+ }
+
+ .uni-dialog-button-text {
+ font-size: 16px;
+ color: #333;
+ }
+
+ .uni-button-color {
+ color: #007aff;
+ }
+
+ .uni-dialog-input {
+ flex: 1;
+ font-size: 14px;
+ border: 1px #eee solid;
+ height: 40px;
+ padding: 0 10px;
+ border-radius: 5px;
+ color: #555;
+ }
+
+ .uni-popup__success {
+ color: #4cd964;
+ }
+
+ .uni-popup__warn {
+ color: #f0ad4e;
+ }
+
+ .uni-popup__error {
+ color: #dd524d;
+ }
+
+ .uni-popup__info {
+ color: #909399;
+ }
+</style>
--
Gitblit v1.9.1