| | |
| | | |
| | | <template> |
| | | <a-button :type="edit=='edit' ? 'text' : 'primary'" @click="handleClick"> |
| | | <template #icon v-if="edit=='add'"> |
| | | <a-button type="primary" @click="handleClick"> |
| | | <template #icon> |
| | | <icon-plus /> |
| | | </template> |
| | | {{edit=='edit' ? '编辑' : '新建账号'}} |
| | | 新增文件 |
| | | </a-button> |
| | | <a-modal v-model:visible="visible" :title="edit=='edit' ? '编辑' : '新建账号'" @before-open="handleOpened" @cancel="handleCancel" @before-ok="handleBeforeOk"> |
| | | <a-form ref="formRef" :rules="rules" :model="form" @submit="handleSubmit" > |
| | | <a-form-item field="name" label="用户名"> |
| | | <a-input v-model="form.name" /> |
| | | </a-form-item> |
| | | <a-form-item field="nameJoin" label="昵称"> |
| | | <a-input v-model="form.nameJoin" /> |
| | | </a-form-item> |
| | | <!-- <a-form-item field="post" label="Post">--> |
| | | <!-- <a-select v-model="form.post">--> |
| | | <!-- <a-option value="post1">Post1</a-option>--> |
| | | <!-- <a-option value="post2">Post2</a-option>--> |
| | | <!-- <a-option value="post3">Post3</a-option>--> |
| | | <!-- <a-option value="post4">Post4</a-option>--> |
| | | <!-- </a-select>--> |
| | | <!-- </a-form-item>--> |
| | | <a-form-item label="备注"> |
| | | <a-textarea v-model="form.txt" placeholder="请输入" allow-clear/> |
| | | </a-form-item> |
| | | <!-- <a-form-item>--> |
| | | <!-- <div style="width: 100%;text-align: right">--> |
| | | <!-- <a-button @click="visible = false">取消</a-button>--> |
| | | <!-- <a-button style="margin-left: 10px" type="primary" html-type="submit">确定</a-button>--> |
| | | <!-- </div>--> |
| | | <!-- </a-form-item>--> |
| | | </a-form> |
| | | <a-modal v-model:visible="visible" title="上传文件" @before-open="handleOpened" @cancel="handleCancel" @before-ok="handleBeforeOk" title-align="start"> |
| | | <a-tabs :default-active-key="activeKey" @change="activeKeyChange"> |
| | | <a-tab-pane key="1" title="文件"> |
| | | </a-tab-pane> |
| | | <a-tab-pane key="2" title="文件夹"> |
| | | </a-tab-pane> |
| | | </a-tabs> |
| | | <div class="aUpload"> |
| | | <!-- <a-upload :file-list="uploadList" draggable accept=".word, .pdf, .ppt, .excel, .txt, .zip, .rar, .7z, .doc, .docx, .xls, .xlsx, .pptx, .ppt, .pdf, .mp4, .avi, .mp3,.wav, .wma, .wmv, .rm," :custom-request="customRequest" />--> |
| | | <a-upload |
| | | action="/" |
| | | :auto-upload="false" |
| | | ref="uploadRef" |
| | | :file-list="uploadList" |
| | | draggable |
| | | :directory="directory" |
| | | @change="onChange" |
| | | multiple |
| | | /> |
| | | </div> |
| | | </a-modal> |
| | | </template> |
| | | |
| | | <script lang="ts" setup> |
| | | import { onMounted ,onBeforeMount, reactive, ref } from "vue"; |
| | | |
| | | const props = defineProps({ |
| | | edit: { |
| | | type: String, |
| | | default: 'add' |
| | | }, |
| | | record: { |
| | | type: Object, |
| | | default: () => { |
| | | return {} |
| | | } |
| | | } |
| | | }) |
| | | import { onMounted, onBeforeMount, reactive, ref, computed } from "vue"; |
| | | import axios from 'axios'; |
| | | import { kbdocumentupload } from "@/api/kbList"; |
| | | import { Message } from '@arco-design/web-vue'; |
| | | let CancelToken = axios.CancelToken |
| | | let source = null |
| | | const visible = ref(false); |
| | | const loading = ref(false); |
| | | const directory = ref(false); |
| | | const activeKey = ref('1'); |
| | | const formRef = ref(null); |
| | | const uploadList = ref([]); |
| | | const form = reactive({ |
| | | name: '',// 用户名 |
| | | nameJoin: '',// 昵称 |
| | | post: '',// 岗位 |
| | | txt: '',// 备注 |
| | | }); |
| | | const formRef = ref(null); |
| | | |
| | | const rules = { |
| | | name: [ |
| | | { |
| | | required: true, |
| | | message:'用户名不允许为空', |
| | | }, |
| | | ], |
| | | nameJoin: [ |
| | | { |
| | | required: true, |
| | | message:'昵称不允许为空', |
| | | }, |
| | | ], |
| | | password: [ |
| | | { |
| | | required: true, |
| | | message:'password is required', |
| | | }, |
| | | ], |
| | | password2: [ |
| | | { |
| | | required: true, |
| | | message:'password is required', |
| | | }, |
| | | { |
| | | validator: (value, cb) => { |
| | | if (value !== form.password) { |
| | | cb('two passwords do not match') |
| | | } else { |
| | | cb() |
| | | const props = defineProps(['kbobj']) |
| | | const emit = defineEmits(['changeFetchData']) |
| | | const uploadRef = ref(); |
| | | const files = ref([]); |
| | | console.log(props.kbobj); |
| | | const acceptNameList = computed( |
| | | ()=>{ |
| | | return '.word, .pdf, .ppt, .excel, .txt, .zip, .rar, .7z, .doc, .docx, .xls, .xlsx, .pptx, .ppt, .pdf, .mp4, .avi, .mp3,.wav, .wma, .wmv, .rm,' |
| | | } |
| | | ) |
| | | // 上传文件 |
| | | const submitForm = async()=>{ |
| | | if (files.value && files.value.length > 0) { |
| | | files.value.map((item) => { |
| | | const formData = new FormData() |
| | | formData.append(name || 'file', item.file); |
| | | formData.append('kb_id', props.kbobj.id); |
| | | kbdocumentupload(formData).then((res) => { |
| | | if(res.code == 0){ |
| | | emit('changeFetchData') |
| | | Message.success('上传成功'); |
| | | visible.value = false; |
| | | } |
| | | } |
| | | } |
| | | ], |
| | | email: [ |
| | | { |
| | | type: 'email', |
| | | required: true, |
| | | } |
| | | ], |
| | | ip: [ |
| | | { |
| | | type: 'ip', |
| | | required: true, |
| | | } |
| | | ], |
| | | url: [ |
| | | { |
| | | type: 'url', |
| | | required: true, |
| | | } |
| | | ], |
| | | match: [ |
| | | { |
| | | required: true, |
| | | validator: (value, cb) => { |
| | | return new Promise((resolve) => { |
| | | if (!value) { |
| | | cb('Please enter match') |
| | | } |
| | | if (value !== 'match') { |
| | | cb('match must be match!') |
| | | } |
| | | resolve() |
| | | }) |
| | | } |
| | | } |
| | | ], |
| | | }) |
| | | }) |
| | | } |
| | | } |
| | | |
| | | |
| | | const handleSubmit = ({values, errors}) => { |
| | | console.log('values:', values, '\nerrors:', errors) |
| | | |
| | | } |
| | | |
| | | |
| | | const onChange = (fileList) => { |
| | | files.value = fileList; |
| | | }; |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | const handleClick = () => { |
| | | visible.value = true; |
| | | }; |
| | | const handleBeforeOk = (done) => { |
| | | formRef.value.validate().then(res => { |
| | | console.log('form:', form) |
| | | if (!form.name) { |
| | | done(false) |
| | | }else { |
| | | console.log('请求数据'); |
| | | |
| | | } |
| | | }) |
| | | submitForm(); |
| | | }; |
| | | const handleCancel = () => { |
| | | visible.value = false; |
| | | } |
| | | |
| | | const handleOpened =(el) => { |
| | | Object.assign(form,{ |
| | | name: '',// 用户名 |
| | | nameJoin: '',// 昵称 |
| | | post: '',// 岗位 |
| | | txt: '',// 备注 |
| | | }); |
| | | formRef.value.resetFields(); |
| | | console.log(props.edit, 'edit'); |
| | | console.log(props.record, 'record'); |
| | | if(props.edit == 'edit'){ |
| | | Object.assign(form,props.record); |
| | | } |
| | | console.log(props.kbobj); |
| | | uploadList.value = []; |
| | | } |
| | | |
| | | const activeKeyChange = (value)=>{ |
| | | activeKey.value = value; |
| | | directory.value = value == '2' ? true : false; |
| | | } |
| | | onBeforeMount(()=>{ |
| | | |
| | | }) |
| | |
| | | </script> |
| | | |
| | | <script lang="ts"> |
| | | import { deleteAccount } from "@/api/account"; |
| | | export default { |
| | | name: 'add', |
| | | methods: { |
| | | |
| | | } |
| | | }; |
| | | </script> |
| | | </script> |
| | | |
| | | <style scoped lang="less"> |
| | | .aUpload { |
| | | width: 100%; |
| | | max-height: 500px; |
| | | overflow: hidden; |
| | | overflow-y: auto; |
| | | } |
| | | </style> |