|
|
@@ -4,13 +4,13 @@
|
|
|
<van-form class="bigbox" ref="form">
|
|
|
<div class="mainItem">
|
|
|
<div class="label">标题</div>
|
|
|
- <div >{{ trainingData.title }}</div>
|
|
|
+ <div>{{ trainingData.title }}</div>
|
|
|
</div>
|
|
|
<div class="mainItem">
|
|
|
<div class="label">单位名称</div>
|
|
|
- <div >{{ trainingData.orgName }}</div>
|
|
|
+ <div>{{ trainingData.orgName }}</div>
|
|
|
</div>
|
|
|
- <van-field
|
|
|
+ <!-- <van-field
|
|
|
readonly
|
|
|
clickable
|
|
|
required
|
|
|
@@ -23,7 +23,7 @@
|
|
|
/>
|
|
|
<van-popup v-model="showPicker" position="bottom">
|
|
|
<van-picker show-toolbar :columns="columns" @confirm="onConfirm" @cancel="showPicker = false" />
|
|
|
- </van-popup>
|
|
|
+ </van-popup> -->
|
|
|
<!-- 培训开始时间 -->
|
|
|
<van-field
|
|
|
readonly
|
|
|
@@ -64,17 +64,23 @@
|
|
|
@cancel="showEndDate = false"
|
|
|
/>
|
|
|
</van-popup>
|
|
|
- <div class="mainItem">
|
|
|
- <div class="label labelPeople">培训资料</div>
|
|
|
- <!-- <PDFAndImgLook ref="PDFAndImgLook" :studyList="studyList"></PDFAndImgLook> -->
|
|
|
-
|
|
|
- <template v-for="item in studyList">
|
|
|
- <div :key="item.url" class="imglIST" style="{width:'100px',height: '100px';}" @click="clikHadner">
|
|
|
- <imgCom :width="'100'" v-if="item.url&&item.type==0" :height="'100'" :src="item.url"></imgCom>
|
|
|
- <VuePdf v-else :src="item.url"></VuePdf>
|
|
|
+
|
|
|
+ <!-- <van-button type="info">从学习资料选取</van-button> -->
|
|
|
+ <div class="mainItem mainItemData">
|
|
|
+ <p class="label labelPeople">培训资料</p>
|
|
|
+ <div>
|
|
|
+ <template v-for="item in studyList">
|
|
|
+ <van-tag type="primary" :key="item.name" class="tagCls" plain @click="tagHandler(item)">{{
|
|
|
+ item.name
|
|
|
+ }}</van-tag>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <van-field label="">
|
|
|
+ <template #input>
|
|
|
+ <van-button type="info" size="small" @click="selectData">从学习资料选取</van-button>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
<!-- 培训内容 -->
|
|
|
<van-field
|
|
|
required
|
|
|
@@ -106,7 +112,6 @@
|
|
|
|
|
|
<!-- 必填 -->
|
|
|
<CheckPeople
|
|
|
- ref="checkPeople"
|
|
|
:userList="userPeopleList"
|
|
|
:organizationId="trainingData.orgId"
|
|
|
:isRequired="true"
|
|
|
@@ -114,7 +119,6 @@
|
|
|
></CheckPeople>
|
|
|
<!-- 缺席人员 -->
|
|
|
<CheckPeople
|
|
|
- ref="checkPeople"
|
|
|
:userList="lackPeopleList"
|
|
|
:inpitLabel="'缺席人员'"
|
|
|
:organizationId="trainingData.orgId"
|
|
|
@@ -131,15 +135,18 @@
|
|
|
<van-button type="info" @click="submitHandler(1)">保存</van-button>
|
|
|
<van-button type="info" @click="submitHandler(2)">提交</van-button>
|
|
|
</div>
|
|
|
+ <!-- 选择资料 -->
|
|
|
+ <SelectData ref="SelectData" :organizationId="trainingData.orgId" @dataList="dataList"></SelectData>
|
|
|
</van-form>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import NavBar from '@/components/NavBar'
|
|
|
import CheckPeople from '@/components/peopleList/index.vue'
|
|
|
+import SelectData from './selectData.vue'
|
|
|
import Upload from '@/components/upload/index.vue'
|
|
|
-import imgCom from '@/components/imgCom/index.vue'
|
|
|
-import VuePdf from "@/components/pdfCom/index.vue"
|
|
|
+// import imgCom from '@/components/imgCom/index.vue'
|
|
|
+// import VuePdf from '@/components/pdfCom/index.vue'
|
|
|
import { gettrainingInfo, edittrainingInfo } from '@/api/training.js'
|
|
|
import { newDateTime } from '@/utils/date.js'
|
|
|
import { Dialog, Toast } from 'vant'
|
|
|
@@ -147,18 +154,18 @@ import PDFAndImgLook from '@/components/imgAndPDF/index.vue'
|
|
|
export default {
|
|
|
name: 'SocAppAddTraining',
|
|
|
components: {
|
|
|
- VuePdf,
|
|
|
+ SelectData,
|
|
|
+
|
|
|
NavBar,
|
|
|
PDFAndImgLook,
|
|
|
- imgCom,
|
|
|
+ // imgCom,
|
|
|
Upload,
|
|
|
CheckPeople
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
- current:0,
|
|
|
- this_window:window,
|
|
|
+ current: 0,
|
|
|
+ this_window: window,
|
|
|
studyList: [], //学习资料数组
|
|
|
startDateTime: new Date(),
|
|
|
endDateTime: new Date(),
|
|
|
@@ -196,13 +203,14 @@ export default {
|
|
|
let newlist = data.fileList || []
|
|
|
if (newlist.length > 0) {
|
|
|
newlist.forEach(item => {
|
|
|
- let i=JSON.parse(item)
|
|
|
- console.log(i);
|
|
|
- if(i.url.split('.')[1]=='pdf'){
|
|
|
- i.type=1
|
|
|
- }else{
|
|
|
- i.type=0
|
|
|
+ let i = JSON.parse(item)
|
|
|
+
|
|
|
+ if (i.url.split('.')[1] == 'pdf') {
|
|
|
+ i.type = 1
|
|
|
+ } else {
|
|
|
+ i.type = 0
|
|
|
}
|
|
|
+ i.path = i.url
|
|
|
this.studyList.push(i)
|
|
|
})
|
|
|
}
|
|
|
@@ -246,14 +254,18 @@ export default {
|
|
|
mounted() {},
|
|
|
|
|
|
methods: {
|
|
|
- clikHadner(){
|
|
|
- this.$refs.PDFAndImgLook.show=true
|
|
|
+ //从资料里选取
|
|
|
+ selectData() {
|
|
|
+ this.$refs.SelectData.show = true
|
|
|
+ },
|
|
|
+ clikHadner() {
|
|
|
+ this.$refs.PDFAndImgLook.show = true
|
|
|
},
|
|
|
onChange(index) {
|
|
|
this.current = index
|
|
|
},
|
|
|
// 查看pdf
|
|
|
-
|
|
|
+
|
|
|
onSubmit(values) {
|
|
|
console.log('submit', values)
|
|
|
Dialog.confirm({
|
|
|
@@ -314,7 +326,7 @@ export default {
|
|
|
},
|
|
|
//上传附件成功
|
|
|
listHandler(list) {
|
|
|
- console.log(list,'mmmm');
|
|
|
+ console.log(list, 'mmmm')
|
|
|
this.form.imageList = list || []
|
|
|
},
|
|
|
//表单提交前校验
|
|
|
@@ -398,9 +410,9 @@ export default {
|
|
|
let obj = JSON.parse(JSON.stringify(this.form))
|
|
|
|
|
|
obj.imageList = obj.imageList.map(item => item.path).join(',')
|
|
|
- console.log(obj.imageList);
|
|
|
+ console.log(obj.imageList)
|
|
|
obj.taskUserList = []
|
|
|
-
|
|
|
+
|
|
|
obj.taskUserList.push(...this.userPeopleList, ...this.lackPeopleList)
|
|
|
|
|
|
edittrainingInfo({
|
|
|
@@ -418,6 +430,76 @@ export default {
|
|
|
Toast(msg)
|
|
|
}
|
|
|
})
|
|
|
+ },
|
|
|
+ dataList(list) {
|
|
|
+ console.log(list)
|
|
|
+ let copyList = JSON.parse(JSON.stringify(this.studyList)).map(item=>item.name)
|
|
|
+ let ArrItem=[]
|
|
|
+ for (let index = 0; index < copyList.length; index++) {
|
|
|
+ const element = copyList[index];
|
|
|
+
|
|
|
+ ArrItem.push(...list.filter(item => item.name !== element));
|
|
|
+ }
|
|
|
+ this.studyList=ArrItem
|
|
|
+ console.log(this.studyList);
|
|
|
+
|
|
|
+ },
|
|
|
+ tagHandler(i) {
|
|
|
+ let str = i.name.split('.')[1]
|
|
|
+ if (str == 'png' || str == 'jpg' || str == 'jpeg' || str == 'pdf') {
|
|
|
+ //当前是图片||PDF
|
|
|
+ this.openFilePreview(i)
|
|
|
+ } else {
|
|
|
+ const filePath = `${process.env.NODE_ENV === 'development' ? '/dev' : window.origin}${i.url}`
|
|
|
+ const tempLink = document.createElement('a')
|
|
|
+ tempLink.style.display = 'none'
|
|
|
+ tempLink.href = filePath
|
|
|
+ tempLink.setAttribute('download', i.name)
|
|
|
+ tempLink.setAttribute('target', '_blank')
|
|
|
+ document.body.appendChild(tempLink)
|
|
|
+ tempLink.click()
|
|
|
+ document.body.removeChild(tempLink)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ openFilePreview(item) {
|
|
|
+
|
|
|
+ let system = this.isAndroidOrIos
|
|
|
+ const parms = {
|
|
|
+ url: item.url,
|
|
|
+ name: item.name
|
|
|
+ }
|
|
|
+ if (system === 1) {
|
|
|
+ //android
|
|
|
+ // 判断当前环境是是否存在 js桥 'sap'
|
|
|
+ const hasSap = window.hasOwnProperty('sap')
|
|
|
+ if (hasSap) {
|
|
|
+ // 判断是否存在方法 ?preview
|
|
|
+ const fun = sap.hasOwnProperty('preview')
|
|
|
+ if (fun) {
|
|
|
+ sap.preview(JSON.stringify(parms))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if (system === 2) {
|
|
|
+ //ios
|
|
|
+ // 判断 ios是否存在方法 preview
|
|
|
+ const fun = window.webkit.messageHandlers.hasOwnProperty('preview')
|
|
|
+ if (fun) {
|
|
|
+ window.webkit.messageHandlers.preview.postMessage(JSON.stringify(parms))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ isAndroidOrIos() {
|
|
|
+ const urls = navigator.userAgent
|
|
|
+ let isAndroid = urls.indexOf('Android') > -1 || urls.indexOf('Linux') > -1
|
|
|
+ let isIos = !!urls.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
|
|
|
+ if (isAndroid) {
|
|
|
+ return 1
|
|
|
+ }
|
|
|
+ if (isIos) {
|
|
|
+ return 2
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -426,19 +508,28 @@ export default {
|
|
|
.mainItem {
|
|
|
display: flex;
|
|
|
font-size: 28px;
|
|
|
+ align-items: center;
|
|
|
padding: 34px;
|
|
|
justify-content: space-between;
|
|
|
background-color: #fff;
|
|
|
+ flex-wrap: wrap;
|
|
|
div {
|
|
|
flex: 1;
|
|
|
text-align: left;
|
|
|
}
|
|
|
+ p {
|
|
|
+ }
|
|
|
.label {
|
|
|
width: 200px;
|
|
|
flex: none;
|
|
|
- text-align: left;
|
|
|
+ }
|
|
|
+ .labelPeople {
|
|
|
+ margin-bottom: 20px;
|
|
|
}
|
|
|
}
|
|
|
+.mainItemData {
|
|
|
+ justify-content: end;
|
|
|
+}
|
|
|
.bigbox {
|
|
|
height: calc(100vh - 200px);
|
|
|
overflow: scroll;
|
|
|
@@ -461,4 +552,8 @@ export default {
|
|
|
margin-left: 50px;
|
|
|
}
|
|
|
}
|
|
|
+.tagCls {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
</style>
|