file-info.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350
  1. <template>
  2. <div class="main">
  3. <div class="main-body">
  4. <div class="xl_main mt15 mar-B20" v-loading="loading">
  5. <div class="n-tit">
  6. <h3>{{info.title}}</h3>
  7. <h4>
  8. 来源:{{info.department }} &nbsp;&nbsp;
  9. 类型:{{categorys[info.category] }} &nbsp;&nbsp;
  10. 时间:{{info.publishTime|toDate}} &nbsp;&nbsp;
  11. <span class="ml10"><i class="el-icon-view"></i> {{info.viewCount}}</span>
  12. <span class="ml10"><i class="el-icon-download"></i> {{info.downloadCount}}</span>
  13. </h4>
  14. </div>
  15. <div>
  16. <div class="fr">
  17. <el-button type="text" size="small" v-if="isLeader==2 && info.status==1 &&info.isOpen<2"
  18. @click="dialogConfirm=true">审核</el-button>
  19. <el-button type="text" size="small" v-if="isLeader==3 && info.status==2 &&info.isOpen<2"
  20. @click="dialogPublish=true">发布</el-button>
  21. <el-button v-if="!isLike" icon="el-icon-star-off" @click="likeArtical" size="small"> 收藏</el-button>
  22. <el-button v-else icon="el-icon-star-on" type="info" @click="unLikeArtical" size="small">取消</el-button>
  23. <el-button icon="el-icon-download" v-if="isLeader>0 || info.isOpen==1" @click="download" size="small"> 下载</el-button>
  24. </div>
  25. <div v-html="info.brief" />
  26. </div>
  27. <div>
  28. <h4 class="p20"> 操作记录 </h4>
  29. <el-table :data="logs" border stripe v-loading="loading">
  30. <el-table-column label="时间" prop="createAt" align="center">
  31. <template slot-scope="{ row }">
  32. <span >{{row.createAt|toDatetime}}</span>
  33. </template>
  34. </el-table-column>
  35. <el-table-column label="操作人" prop="nickname" align="center">
  36. <template slot-scope="{ row }">
  37. {{row.nickname}} - {{actions[row.action]}}
  38. </template>
  39. </el-table-column>
  40. <el-table-column label="备注" prop="content" align="center">
  41. </el-table-column>
  42. <el-table-column label="操作前" prop="status" align="center">
  43. <template slot-scope="{ row }">
  44. {{statusMap[row.oldStatus] }}
  45. </template>
  46. </el-table-column>
  47. <el-table-column label="操作后" prop="status" align="center" >
  48. <template slot-scope="{ row }">
  49. {{statusMap[row.newStatus] }}
  50. </template>
  51. </el-table-column>
  52. </el-table>
  53. </div>
  54. </div>
  55. </div>
  56. <el-dialog title="科长审核文件" center :visible.sync="dialogConfirm" >
  57. <el-form class="p20" label-width="100px" label-position="left"
  58. ref="elForm" :model="info" :rules="rules" >
  59. <el-form-item label="文件标题" class="mt20" prop="category">
  60. <el-input v-model="info.title" type="textarea" autosize></el-input>
  61. </el-form-item>
  62. <el-form-item label="所属分类" class="mt20" prop="category">
  63. <el-select v-model="info.category" collapse-tags placeholder="请选择" clearable>
  64. <el-option v-for="(item,index) in categorys"
  65. :value="index" :key="index" :label="item"></el-option>
  66. </el-select>
  67. </el-form-item>
  68. <el-form-item label="是否公开" class="mt20" prop="category">
  69. <el-switch :active-value="1" :inactive-value="0" v-model="info.isOpen"></el-switch>
  70. </el-form-item>
  71. <el-form-item label="是否通过" class="mt20" prop="category">
  72. <el-switch :active-value="1" :inactive-value="0" v-model="form.action"></el-switch>
  73. </el-form-item>
  74. <el-form-item label="审核意见" class="mt20" prop="category">
  75. <el-input v-model="form.content" type="textarea" autosize></el-input>
  76. </el-form-item>
  77. <el-form-item >
  78. <el-button type="warning" @click="dialogConfirm=false" class="btn-md">
  79. 审核取消
  80. </el-button>
  81. <el-button type="primary" @click="onConfirm" class="btn-md">
  82. 确认审核
  83. </el-button>
  84. </el-form-item>
  85. </el-form>
  86. </el-dialog>
  87. <el-dialog title="分管审核文件" center :visible.sync="dialogPublish" >
  88. <el-form class="p20" label-width="100px" label-position="left"
  89. ref="elForm" :model="info" :rules="rules" >
  90. <el-form-item label="文件标题" class="mt20" prop="category">
  91. <el-input v-model="info.title" type="textarea" autosize></el-input>
  92. </el-form-item>
  93. <el-form-item label="所属分类" class="mt20" prop="category">
  94. <el-select v-model="info.category" collapse-tags placeholder="请选择" clearable>
  95. <el-option v-for="(item,index) in categorys"
  96. :value="index" :key="index" :label="item"></el-option>
  97. </el-select>
  98. </el-form-item>
  99. <el-form-item label="是否公开" class="mt20" prop="category">
  100. <el-switch :active-value="1" :inactive-value="0" v-model="info.isOpen"></el-switch>
  101. </el-form-item>
  102. <el-form-item label="是否通过" class="mt20" prop="action">
  103. <el-switch :active-value="1" :inactive-value="0" v-model="form.action"></el-switch>
  104. </el-form-item>
  105. <el-form-item label="审核意见" class="mt20" prop="content">
  106. <el-input v-model="form.content" type="textarea" autosize></el-input>
  107. </el-form-item>
  108. <el-form-item >
  109. <el-button type="warning" @click="dialogPublish=false" class="btn-md">
  110. 审核取消
  111. </el-button>
  112. <el-button type="primary" @click="onPublish" class="btn-md">
  113. 确认审核
  114. </el-button>
  115. </el-form-item>
  116. </el-form>
  117. </el-dialog>
  118. <div style="height: 60px;"></div>
  119. </div>
  120. </template>
  121. <script>
  122. import IHeader from "./components/IHeader";
  123. import IFooter from "./components/IFooter";
  124. import { authDB } from '@/db'
  125. import {toDate,toDatetime} from '@/utils/date.js'
  126. import data from '../data/data.js'
  127. import {
  128. getArticalInfo,
  129. likeArtical,
  130. unLikeArtical,
  131. confirmArtical,
  132. publishArtical
  133. } from '@/api/article.js'
  134. import {
  135. downloadFile,
  136. downloadArtical,
  137. applyArtical
  138. } from '@/api/article.js'
  139. import {
  140. download
  141. } from '@/utils/download.js'
  142. import {
  143. mapGetters
  144. } from "vuex";
  145. export default {
  146. name: 'application',
  147. components: {
  148. IHeader,
  149. IFooter
  150. },
  151. filters: {
  152. toDatetime,
  153. toDate
  154. },
  155. data() {
  156. return {
  157. loading: false,
  158. articalId: 0,
  159. isLeader: 0,
  160. recommend: [],
  161. apply_list: [],
  162. logs:[],
  163. isLike: 0,
  164. actions: data.actions,
  165. openMap: data.openMap,
  166. statusMap: data.statusMap,
  167. owners: data.owners,
  168. categorys: data.categorys,
  169. dialogConfirm: false,
  170. dialogPublish: false,
  171. info: {},
  172. form:{ action:1,content:'' },
  173. rules:{}
  174. }
  175. },
  176. computed: {
  177. ...mapGetters("user", ["userDepartments"])
  178. },
  179. created() {
  180. this.articalId = +this.$route.query.articalId || 0;
  181. if (this.articalId) {
  182. this.getArticalInfo()
  183. }
  184. },
  185. methods: {
  186. download() {
  187. let articalId = this.articalId
  188. if (this.isLeader > 0 || this.info.isOpen == 1) {
  189. downloadFile( {articalId}).then( res=>{
  190. if( res.code == 200){
  191. this.$message.successMsg("初始化成功", 1)
  192. window.open( res.data, "_blank");
  193. }
  194. })
  195. } else {
  196. this.$message.errorMsg("无权限下载", 1)
  197. }
  198. },
  199. onConfirm(){
  200. let {departmentId,category, articalId } = this.info;
  201. let param = {departmentId,category, articalId }
  202. param.action = +this.form.action
  203. param.content = this.form.content
  204. confirmArtical( param ).then( res=>{
  205. if( res.code == 200){
  206. this.$message.successMsg("确认成功", 1)
  207. this.dialogConfirm = false
  208. this.info.status = 2
  209. }
  210. })
  211. },
  212. onPublish(){
  213. let {departmentId,category, articalId } = this.info;
  214. let param = {departmentId,category, articalId }
  215. param.action = +this.form.action
  216. param.content = this.form.content
  217. publishArtical( param ).then( res=>{
  218. if( res.code == 200){
  219. this.$message.successMsg("确认成功", 1)
  220. this.dialogPublish = false
  221. this.info.status = 3
  222. }
  223. })
  224. },
  225. applyDownload() {
  226. let param = {
  227. articalId: this.articalId
  228. }
  229. this.loading = true;
  230. applyArtical(param).then(res => {
  231. if (res.code == 200) {
  232. this.$message.successMsg("申请成功", 1)
  233. }
  234. this.loading = false;
  235. }).catch(() => {
  236. this.loading = false
  237. })
  238. },
  239. likeArtical() {
  240. let param = {
  241. articalId: this.articalId
  242. }
  243. this.loading = true;
  244. likeArtical(param).then(res => {
  245. if (res.code == 200) {
  246. this.$message.successMsg("收藏成功", 1)
  247. this.isLike = 1
  248. }
  249. this.loading = false;
  250. }).catch(() => {
  251. this.loading = false
  252. })
  253. },
  254. unLikeArtical() {
  255. let param = {
  256. articalId: this.articalId
  257. }
  258. this.loading = true;
  259. unLikeArtical(param).then(res => {
  260. console.log("res", res)
  261. if (res.code == 200) {
  262. this.$message.successMsg("取消成功", 1)
  263. this.isLike = 0
  264. }
  265. this.loading = false;
  266. }).catch(() => {
  267. this.loading = false
  268. })
  269. },
  270. getArticalInfo() {
  271. let param = {
  272. articalId: this.articalId
  273. }
  274. getArticalInfo(param).then(res => {
  275. if (res.code == 200) {
  276. this.info = res.data.info;
  277. for (let i in this.userDepartments) {
  278. if (this.userDepartments[i].departmentId == this.info.departmentId) {
  279. this.isLeader = this.userDepartments[i].isLeader;
  280. }
  281. }
  282. this.logs = res.data.logs||[];
  283. this.recommend = res.data.recommend || [];
  284. this.apply_list = res.data.apply_list || [];
  285. this.isLike = res.data.isLike || 0;
  286. }
  287. })
  288. }
  289. }
  290. }
  291. </script>
  292. <style lang="scss" scoped>
  293. @import "../../styles/main.css";
  294. .nopad{
  295. border-top: 1px dashed #ccc;
  296. padding: 0px !important;
  297. // border: none;
  298. height: 100px;
  299. }
  300. </style>